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

import React from 'react';
import {
  Collapsible,
  CollapsibleContent,
  CollapsibleTrigger,
} from '../components/molecules/navigation/Collapsible';
import {
  BaseCompoundWC,
  camelToKebab,
  installPropAccessors,
  type PropDefs,
  registerWC,
  portalNode,
  dispatchEvent,
} from './_shared';

const PROP_DEFS: PropDefs = {
  open: 'boolean',
  defaultOpen: 'boolean',
  disabled: 'boolean',
};

class CollapsibleWC 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');

    return React.createElement(
      Collapsible,
      {
        open: props.open as boolean | undefined,
        defaultOpen: (props.defaultOpen as boolean) || false,
        disabled: (props.disabled as boolean) || false,
        onOpenChange: (open: boolean) => dispatchEvent(this, 'open-change', open),
      },
      triggerSlot
        ? React.createElement(CollapsibleTrigger, {
            render: React.createElement('span', { style: { display: 'contents' } }, portalNode(triggerSlot)),
          })
        : null,
      contentSlot ? React.createElement(CollapsibleContent, null, portalNode(contentSlot)) : null,
    );
  }
}

installPropAccessors(CollapsibleWC, PROP_DEFS);
registerWC('hf-collapsible', CollapsibleWC);

export { CollapsibleWC };
export default CollapsibleWC;