@codeperate/cdp-ui-library/dist/esm/cdp-accordion.entry.js

Codeperate UI Library

import { r as registerInstance, h, H as Host, a as getElement } from './index-de893d6b.js';
import { d as deepAssign } from './deep-assign-b22cb0e3.js';

const CdpAccordion = class {
  constructor(hostRef) {
    registerInstance(this, hostRef);
    this.props = { display: false };
    this.defaultConfig = {
      classList: {
        content: 'transition-all duration-500 overflow-hidden',
        expanded: 'expanded',
      },
      maxHeight: '100vh',
      toggle: true,
    };
  }
  toggle() {
    this.props = Object.assign(Object.assign({}, this.props), { display: !this.props.display });
  }
  componentWillLoad() {
    this._config = deepAssign(this.config, this.defaultConfig);
  }
  render() {
    const { classList, maxHeight, toggle } = this._config;
    const { display } = this.props;
    const hostClass = display ? classList.expanded : '';
    return (h(Host, { class: hostClass }, h("div", { onClick: () => (toggle ? this.toggle() : null) }, h("slot", { name: "accordion" })), h("div", { ref: el => (this.contentEl = el), class: classList.content, style: { maxHeight: display ? maxHeight : '0' } }, h("slot", null))));
  }
  get rootEl() { return getElement(this); }
};

export { CdpAccordion as cdp_accordion };