/**
 * Web Component wrapper for Popover (auto-generated).
 * Custom element: <hf-popover>
 *
 * @generated by scripts/generate-wc-components.ts
 * DO NOT EDIT MANUALLY
 */

import React from 'react';
import {
  Popover,
  PopoverPopup,
  PopoverDescription,
  PopoverHeader,
  PopoverTitle,
} from '../components/organisms/overlays/Popover';
import {
  BaseCompoundWC,
  camelToKebab,
  installPropAccessors,
  type PropDefs,
  registerWC,
  portalNode,
  dispatchEvent,
} from './_shared';

const PROP_DEFS: PropDefs = {
  open: 'boolean',
  defaultOpen: 'boolean',
  side: 'string',
  align: 'string',
  sideOffset: 'number',
  alignOffset: 'number',
};

class PopoverWC extends BaseCompoundWC {
  get propDefs() {
    return PROP_DEFS;
  }

  static get observedAttributes() {
    return Object.keys(PROP_DEFS).map(camelToKebab);
  }

  protected _renderReact(): React.ReactElement {
    const props = this._readAllProps();

    const triggerSlot = this._getSlot('trigger');
    const contentSlot = this._getSlot('content');
    const titleSlot = this._getSlot('title');
    const descriptionSlot = this._getSlot('description');

    let contentChildren: React.ReactNode = null;

    if (titleSlot || descriptionSlot) {
      const headerChildren: React.ReactElement[] = [];
      if (titleSlot) {
        headerChildren.push(
          React.createElement(PopoverTitle, { key: 'title' }, portalNode(titleSlot)),
        );
      }
      if (descriptionSlot) {
        headerChildren.push(
          React.createElement(
            PopoverDescription,
            { key: 'description' },
            portalNode(descriptionSlot),
          ),
        );
      }
      contentChildren = React.createElement(PopoverHeader, { key: 'header' }, ...headerChildren);
    }

    if (contentSlot) {
      contentChildren = portalNode(contentSlot);
    }

    const defaultSlot = this._getDefaultSlot();
    if (defaultSlot && !contentSlot) {
      contentChildren = portalNode(defaultSlot);
    }

    return React.createElement(
      Popover,
      {
        open: props.open as boolean | undefined,
        defaultOpen: (props.defaultOpen as boolean) || false,
        onOpenChange: (open: boolean) => dispatchEvent(this, 'open-change', open),
        trigger: triggerSlot
          ? React.createElement('span', { style: { display: 'contents' } }, portalNode(triggerSlot))
          : null,
      },
      React.createElement(
        PopoverPopup,
        {
          side: (props.side as 'top' | 'right' | 'bottom' | 'left') || 'bottom',
          align: (props.align as 'start' | 'center' | 'end') || 'center',
          sideOffset: (props.sideOffset as number) ?? 4,
          alignOffset: (props.alignOffset as number) ?? 0,
        },
        contentChildren,
      ),
    );
  }
}

installPropAccessors(PopoverWC, PROP_DEFS);
registerWC('hf-popover', PopoverWC);

export { PopoverWC };
export default PopoverWC;