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

import React from 'react';
import {
  Dialog,
  DialogBody,
  DialogPopup,
  DialogDescription,
  DialogFooter,
  DialogHeader,
  DialogHeaderContent,
  DialogIcon,
  DialogTitle,
} from '../components/organisms/overlays/Dialog';
import {
  BaseCompoundWC,
  camelToKebab,
  installPropAccessors,
  type PropDefs,
  registerWC,
  portalNode,
  dispatchEvent,
} from './_shared';

const PROP_DEFS: PropDefs = {
  open: 'boolean',
  defaultOpen: 'boolean',
  size: 'string',
  iconVariant: 'string',
  layout: 'string',
  showCloseButton: 'boolean',
  showPattern: 'boolean',
  disableAnimation: 'boolean',
  modal: 'boolean',
};

class DialogWC 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 titleSlot = this._getSlot('title');
    const descriptionSlot = this._getSlot('description');
    const bodySlot = this._getSlot('body');
    const footerSlot = this._getSlot('footer');
    const iconSlot = this._getSlot('icon');

    const contentChildren: React.ReactElement[] = [];

    const hasHeader = titleSlot || descriptionSlot || iconSlot || props.iconVariant;
    if (hasHeader) {
      const headerChildren: React.ReactElement[] = [];

      if (iconSlot || props.iconVariant) {
        headerChildren.push(
          React.createElement(
            DialogIcon,
            {
              key: 'icon',
              variant: (props.iconVariant as string) || 'default',
            },
            iconSlot ? portalNode(iconSlot) : null,
          ),
        );
      }

      const headerContentChildren: React.ReactElement[] = [];
      if (titleSlot) {
        headerContentChildren.push(
          React.createElement(DialogTitle, { key: 'title' }, portalNode(titleSlot)),
        );
      }
      if (descriptionSlot) {
        headerContentChildren.push(
          React.createElement(
            DialogDescription,
            { key: 'description' },
            portalNode(descriptionSlot),
          ),
        );
      }

      if (headerContentChildren.length > 0) {
        headerChildren.push(
          React.createElement(
            DialogHeaderContent,
            { key: 'header-content' },
            ...headerContentChildren,
          ),
        );
      }

      contentChildren.push(
        React.createElement(
          DialogHeader,
          {
            key: 'header',
            layout: (props.layout as 'stacked' | 'horizontal' | 'centered') || undefined,
          },
          ...headerChildren,
        ),
      );
    }

    if (bodySlot) {
      contentChildren.push(
        React.createElement(DialogBody, { key: 'body' }, portalNode(bodySlot)),
      );
    }

    const defaultSlot = this._getDefaultSlot();
    if (defaultSlot && !bodySlot) {
      contentChildren.push(
        React.createElement(DialogBody, { key: 'default-body' }, portalNode(defaultSlot)),
      );
    }

    if (footerSlot) {
      contentChildren.push(
        React.createElement(DialogFooter, { key: 'footer' }, portalNode(footerSlot)),
      );
    }

    return React.createElement(
      Dialog,
      {
        open: props.open as boolean | undefined,
        defaultOpen: (props.defaultOpen as boolean) || false,
        onOpenChange: (open: boolean) => dispatchEvent(this, 'open-change', open),
        modal: props.modal as boolean | undefined,
        trigger: triggerSlot
          ? React.createElement('span', { style: { display: 'contents' } }, portalNode(triggerSlot))
          : undefined,
      },
      React.createElement(
        DialogPopup,
        {
          size: (props.size as 'sm' | 'md' | 'lg' | 'xl' | 'full') || undefined,
          showCloseButton: props.showCloseButton !== false,
          showPattern: props.showPattern !== false,
          disableAnimation: (props.disableAnimation as boolean) || false,
        },
        ...contentChildren,
      ),
    );
  }
}

installPropAccessors(DialogWC, PROP_DEFS);
registerWC('hf-dialog', DialogWC);

export { DialogWC };
export default DialogWC;
