bromcom-ui-next 0.1.30 → 0.1.31

package/dist/components/bcm-modal.js.map

@@ -1 +1 @@
-{"file":"bcm-modal.js","mappings":"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","names":["BcmModal","__stencil_proxyCustomElement","HTMLElement"],"sources":["src/components/modal/modal.css?tag=bcm-modal&encapsulation=shadow","src/components/modal/modal.component.tsx"],"sourcesContent":[":host {\n  display: contents;\n}\n","import { Component, Prop, h, Element, Event, EventEmitter, Method, Watch, Listen, State } from '@stencil/core';\nimport { tv } from '@utils/tv';\n\nexport type ModalSize = 'small' | 'medium' | 'large' | 'xlarge' | 'xxlarge' | 'full';\nexport type ModalPlacement = 'center' | 'top';\n\n/**\n * @component BcmModal\n * @description A flexible modal dialog component built on the native HTML Dialog API.\n * Provides a powerful way to display content in a layer above the page with full keyboard and focus management.\n *\n * @slot - Main content area of the modal\n * @slot header - Custom header content (overrides header-text prop)\n * @slot helper - Custom helper text content (overrides helper-text prop)\n * @slot footer - Footer content for action buttons\n *\n * @part dialog - The native dialog element\n * @part container - The container wrapper for centering and scrolling\n * @part modal - The main modal box\n * @part header - The header section\n * @part header-content - The content wrapper inside header\n * @part title - The title heading element\n * @part helper-text - The helper text paragraph\n * @part close-button - The close button in header\n * @part content - The main content area\n * @part footer - The footer section\n *\n * @example\n * ```html\n * <!-- Basic usage -->\n * <bcm-modal open header-text=\"Welcome\" helper-text=\"Please read carefully\">\n *   <p>Modal content goes here</p>\n *   <div slot=\"footer\">\n *     <button data-dismiss>Close</button>\n *   </div>\n * </bcm-modal>\n *\n * <!-- Custom size and placement -->\n * <bcm-modal size=\"large\" placement=\"top\">\n *   <div slot=\"header\">Custom Header</div>\n *   <p>Content here</p>\n *   <div slot=\"footer\">\n *     <button>Cancel</button>\n *     <button>Confirm</button>\n *   </div>\n * </bcm-modal>\n *\n * <!-- Full screen modal -->\n * <bcm-modal full-screen no-footer>\n *   <p>Full screen content</p>\n * </bcm-modal>\n *\n * <!-- Programmatic usage -->\n * <bcm-modal id=\"myModal\">Content</bcm-modal>\n * <script>\n *   document.getElementById('myModal').show();\n * </script>\n * ```\n */\n@Component({\n  tag: 'bcm-modal',\n  styleUrl: 'modal.css',\n  shadow: true,\n})\nexport class BcmModal {\n  @Element() host: HTMLBcmModalElement;\n\n  private dialogRef?: HTMLDialogElement;\n\n  /**\n   * Controls whether the modal is open or closed\n   */\n  @Prop({ mutable: true, reflect: true }) open: boolean = false;\n\n  /**\n   * The size of the modal\n   * - 'small': 400px\n   * - 'medium': 600px\n   * - 'large': 800px\n   * - 'xlarge': 1024px\n   * - 'xxlarge': 1200px\n   * - 'full': 100% width\n   */\n  @Prop() size: ModalSize = 'medium';\n\n  /**\n   * The placement of the modal on the screen\n   * - 'center': Centered vertically and horizontally\n   * - 'top': Aligned to the top with 80px padding\n   */\n  @Prop() placement: ModalPlacement = 'center';\n\n  /**\n   * Controls backdrop behavior\n   * - true: Shows backdrop, modal can be closed by clicking outside\n   * - false: No backdrop\n   * - 'static': Shows backdrop but prevents closing by clicking outside (triggers shake animation)\n   */\n  @Prop() backdrop: boolean | 'static' = true;\n\n  /**\n   * Makes the modal take full width of the viewport (max-width: 100%)\n   */\n  @Prop({ attribute: 'full-width' }) fullWidth: boolean = false;\n\n  /**\n   * Makes the modal take the full screen (100vw x 100vh, no border radius)\n   */\n  @Prop({ attribute: 'full-screen' }) fullScreen: boolean = false;\n\n  /**\n   * Text to display in the modal header\n   */\n  @Prop({ attribute: 'header-text' }) headerText?: string;\n\n  /**\n   * Helper text to display below the header title\n   */\n  @Prop({ attribute: 'helper-text' }) helperText?: string;\n\n  /**\n   * Hides the header section completely\n   */\n  @Prop({ attribute: 'no-header' }) noHeader: boolean = false;\n\n  /**\n   * Hides the footer section completely\n   */\n  @Prop({ attribute: 'no-footer' }) noFooter: boolean = false;\n\n  /**\n   * Allows closing the modal by clicking on the backdrop\n   */\n  @Prop({ attribute: 'close-on-backdrop' }) closeOnBackdrop: boolean = true;\n\n  /**\n   * Allows closing the modal by pressing the Escape key\n   */\n  @Prop({ attribute: 'close-on-escape' }) closeOnEscape: boolean = true;\n\n  @State() isAnimating: boolean = false;\n  @State() shake: boolean = false;\n\n  /**\n   * Emitted after the modal has opened\n   */\n  @Event() bcmOpen: EventEmitter<void>;\n\n  /**\n   * Emitted after the modal has closed\n   */\n  @Event() bcmClose: EventEmitter<void>;\n\n  /**\n   * Emitted before the modal opens. Can be cancelled by calling event.preventDefault()\n   */\n  @Event({ cancelable: true }) bcmBeforeOpen: EventEmitter<void>;\n\n  /**\n   * Emitted before the modal closes. Can be cancelled by calling event.preventDefault()\n   */\n  @Event({ cancelable: true }) bcmBeforeClose: EventEmitter<void>;\n\n  private modalClass = tv({\n    slots: {\n      dialog:\n        'bcm-ui-element fixed inset-0 m-0 p-0 w-full max-w-full h-full max-h-full border-none bg-transparent backdrop:bg-color-default-dark backdrop:opacity-50 backdrop:transition-opacity backdrop:duration-300',\n      container: 'fixed inset-0 flex items-start justify-center p-4 overflow-y-auto overscroll-contain',\n      modal: 'relative bg-color-basic-base text-color-default rounded-lg shadow-2xl transform transition-all duration-300 ease-in-out flex flex-col',\n      header: 'flex justify-between items-start bg-color-base text-color-default border-color-default border-solid border-0 border-b rounded-t-lg',\n      headerContent: 'flex-1 min-w-0 flex items-center gap-2',\n      title: 'font-semibold m-0 text-size-6 text-color-header',\n      helperText: 'text-size-5 text-color-placeholder m-0',\n      closeButton:\n        'text-size-5 font-medium text-color-default bg-transparent border-none p-0 h-6 w-6 rounded hover:bg-color-default-hover cursor-pointer active:bg-color-active transition-colors flex-shrink-0 outline-none focus-visible:ring ',\n      content: 'flex-grow overflow-y-auto',\n      footer: 'flex items-center justify-end gap-2',\n    },\n    variants: {\n      open: {\n        true: {\n          modal: 'opacity-100 translate-y-0 scale-100',\n        },\n        false: {\n          modal: 'opacity-0 -translate-y-4 scale-95',\n        },\n      },\n      placement: {\n        center: {\n          container: 'items-center',\n        },\n        top: {\n          container: 'items-start pt-20',\n        },\n      },\n      size: {\n        small: {\n          header: 'py-3 px-4',\n          content: 'p-4',\n          footer: 'py-3 px-4',\n        },\n        medium: {\n          header: 'py-4 px-5',\n          content: 'p-5',\n          footer: 'py-4 px-5',\n        },\n        large: {\n          header: 'py-4 px-6',\n          content: 'p-6',\n          footer: 'py-4 px-6',\n        },\n        xlarge: {\n          header: 'py-5 px-6',\n          content: 'p-6',\n          footer: 'py-5 px-6',\n        },\n        xxlarge: {\n          header: 'py-5 px-8',\n          content: 'p-8',\n          footer: 'py-5 px-8',\n        },\n        full: {\n          header: 'py-5 px-8',\n          content: 'p-8',\n          footer: 'py-5 px-8',\n        },\n      },\n      fullScreen: {\n        true: {\n          modal: 'rounded-none w-screen h-screen max-w-none max-h-none',\n          container: 'p-0',\n        },\n      },\n      shake: {\n        true: {\n          modal: 'animate-shake',\n        },\n      },\n      noHeader: {\n        true: {\n          header: 'hidden',\n        },\n      },\n      noFooter: {\n        true: {\n          footer: 'hidden',\n        },\n      },\n    },\n  });\n\n  @Watch('open')\n  async handleOpenChange(isOpen: boolean) {\n    if (isOpen) {\n      this.isAnimating = true;\n      const event = this.bcmBeforeOpen.emit();\n      if (event.defaultPrevented) {\n        this.open = false;\n        return;\n      }\n\n      // Use native dialog API with top-layer\n      if (this.dialogRef) {\n        this.dialogRef.showModal();\n        // Small delay for animation\n        await new Promise(resolve => setTimeout(resolve, 50));\n        this.isAnimating = false;\n        this.bcmOpen.emit();\n      }\n    } else {\n      this.isAnimating = true;\n      const event = this.bcmBeforeClose.emit();\n      if (event.defaultPrevented) {\n        this.open = true;\n        return;\n      }\n\n      // Wait for animation before closing\n      await new Promise(resolve => setTimeout(resolve, 300));\n      if (this.dialogRef) {\n        this.dialogRef.close();\n      }\n      this.isAnimating = false;\n      this.bcmClose.emit();\n    }\n  }\n\n  @Listen('click', { capture: true })\n  handleClick(event: MouseEvent) {\n    // Use composedPath to work with shadow DOM and slots\n    const path = event.composedPath() as HTMLElement[];\n    const dismissElement = path.find(el => el.hasAttribute?.('data-dismiss'));\n    const closeModalElement = path.find(el => el.hasAttribute?.('data-close-modal'));\n\n    if (dismissElement) {\n      this.hide();\n      event.preventDefault();\n      event.stopPropagation();\n    } else if (closeModalElement) {\n      const modalId = closeModalElement.getAttribute('data-close-modal');\n      // If modalId matches this modal's id, close it\n      if (!modalId || modalId === this.host.id) {\n        this.hide();\n        event.preventDefault();\n        event.stopPropagation();\n      }\n    }\n  }\n\n  @Listen('keydown')\n  handleKeyDown(event: KeyboardEvent) {\n    if (event.key === 'Escape' && this.open) {\n      // Only handle ESC if this is the topmost modal\n      const openModals = Array.from(document.querySelectorAll('bcm-modal[open]'));\n      const topModal = openModals[openModals.length - 1];\n\n      if (topModal !== this.host) {\n        return;\n      }\n\n      event.preventDefault();\n      if (this.closeOnEscape) {\n        if (this.backdrop === 'static') {\n          this.shakeModal();\n        } else {\n          this.hide();\n        }\n      } else if (this.backdrop === 'static') {\n        this.shakeModal();\n      }\n    }\n  }\n\n  /**\n   * Programmatically opens the modal\n   */\n  @Method()\n  async show(): Promise<void> {\n    this.open = true;\n  }\n\n  /**\n   * Programmatically closes the modal\n   */\n  @Method()\n  async hide(): Promise<void> {\n    this.open = false;\n  }\n\n  /**\n   * Toggles the modal open/closed state\n   */\n  @Method()\n  async toggle(): Promise<void> {\n    this.open = !this.open;\n  }\n\n  private shakeModal() {\n    this.shake = true;\n    setTimeout(() => {\n      this.shake = false;\n    }, 300);\n  }\n\n  private handleBackdropClick = (event: MouseEvent) => {\n    const target = event.target as HTMLElement;\n    // Check if click is on the container (backdrop area), not on modal content\n    if (target.getAttribute('part') === 'container') {\n      if (this.backdrop === 'static') {\n        this.shakeModal();\n      } else if (this.closeOnBackdrop) {\n        this.hide();\n      }\n    }\n  };\n\n  private handleDialogCancel = (event: Event) => {\n    event.preventDefault();\n    if (this.closeOnEscape) {\n      if (this.backdrop === 'static') {\n        this.shakeModal();\n      } else {\n        this.hide();\n      }\n    }\n  };\n\n  private getModalStyle() {\n    if (this.fullScreen) {\n      return {\n        width: '100vw',\n        height: '100vh',\n        maxWidth: 'none',\n        maxHeight: 'none',\n      };\n    }\n\n    if (this.fullWidth) {\n      return {\n        width: '100%',\n        maxWidth: '100%',\n      };\n    }\n\n    const widths = {\n      small: '400px',\n      medium: '600px',\n      large: '800px',\n      xlarge: '1024px',\n      xxlarge: '1200px',\n      full: '100%',\n    };\n\n    return {\n      width: widths[this.size],\n      maxWidth: this.fullScreen ? 'none' : '90vw',\n      maxHeight: this.fullScreen ? 'none' : '90vh',\n    };\n  }\n\n  componentDidLoad() {\n    if (this.open && this.dialogRef) {\n      this.dialogRef.showModal();\n    }\n  }\n\n  disconnectedCallback() {\n    if (this.dialogRef && this.open) {\n      this.dialogRef.close();\n    }\n  }\n\n  render() {\n    const { dialog, container, modal, header, headerContent, title, helperText, closeButton, content, footer } = this.modalClass({\n      open: this.open,\n      placement: this.placement,\n      size: this.size,\n      fullScreen: this.fullScreen,\n      shake: this.shake,\n      noHeader: this.noHeader,\n      noFooter: this.noFooter,\n    });\n\n    return (\n      <dialog\n        ref={el => (this.dialogRef = el)}\n        part=\"dialog\"\n        class={dialog()}\n        onClick={this.handleBackdropClick}\n        onCancel={this.handleDialogCancel}\n        aria-labelledby=\"modal-title\"\n        aria-describedby={this.helperText ? 'modal-helper' : undefined}\n        aria-modal=\"true\"\n      >\n        <div part=\"container\" class={container()}>\n          <div part=\"modal\" class={modal()} style={this.getModalStyle()} role=\"document\" onClick={e => e.stopPropagation()}>\n            {!this.noHeader && (\n              <div part=\"header\" class={header()}>\n                <div part=\"header-content\" class={headerContent()}>\n                  <h2 id=\"modal-title\" part=\"title\" class={title()}>\n                    <slot name=\"header\">{this.headerText}</slot>\n                  </h2>\n                  {this.helperText && (\n                    <p id=\"modal-helper\" part=\"helper-text\" class={helperText()}>\n                      <slot name=\"helper\">{this.helperText}</slot>\n                    </p>\n                  )}\n                </div>\n                <button part=\"close-button\" class={closeButton()} onClick={() => this.hide()} aria-label=\"Close modal\" type=\"button\">\n                  <bcm-icon name=\"fa-solid fa-xmark\"></bcm-icon>\n                </button>\n              </div>\n            )}\n\n            <div part=\"content\" class={content()}>\n              <slot />\n            </div>\n\n            {!this.noFooter && (\n              <div part=\"footer\" class={footer()}>\n                <slot name=\"footer\" />\n              </div>\n            )}\n          </div>\n        </div>\n      </dialog>\n    );\n  }\n}\n"],"version":3}
+{"file":"bcm-modal.js","mappings":";;;AAAA,MAAM,QAAQ,GAAG,+0KAA+0K;;MCgEn1KA,UAAQ,iBAAAC,kBAAA,CAAA,MAAA,QAAA,SAAAC,CAAA,CAAA;;;;;;;;;;;;;AAGX,IAAA,SAAS;AAEjB;;AAEG;IACqC,IAAI,GAAY,KAAK;AAE7D;;;;;;;;AAQG;IACK,IAAI,GAAc,QAAQ;AAElC;;;;AAIG;IACK,SAAS,GAAmB,QAAQ;AAE5C;;;;;AAKG;IACK,QAAQ,GAAuB,IAAI;AAE3C;;AAEG;IACgC,SAAS,GAAY,KAAK;AAE7D;;AAEG;IACiC,UAAU,GAAY,KAAK;AAE/D;;AAEG;AACiC,IAAA,UAAU;AAE9C;;AAEG;AACiC,IAAA,UAAU;AAE9C;;AAEG;IAC+B,QAAQ,GAAY,KAAK;AAE3D;;AAEG;IAC+B,QAAQ,GAAY,KAAK;AAE3D;;AAEG;IACuC,eAAe,GAAY,IAAI;AAEzE;;AAEG;IACqC,aAAa,GAAY,IAAI;IAE5D,WAAW,GAAY,KAAK;IAC5B,KAAK,GAAY,KAAK;AAE/B;;AAEG;AACM,IAAA,OAAO;AAEhB;;AAEG;AACM,IAAA,QAAQ;AAEjB;;AAEG;AAC0B,IAAA,aAAa;AAE1C;;AAEG;AAC0B,IAAA,cAAc;IAEnC,UAAU,GAAG,EAAE,CAAC;AACtB,QAAA,KAAK,EAAE;AACL,YAAA,MAAM,EACJ,0MAA0M;AAC5M,YAAA,SAAS,EAAE,sFAAsF;AACjG,YAAA,KAAK,EAAE,uIAAuI;AAC9I,YAAA,MAAM,EAAE,oIAAoI;AAC5I,YAAA,aAAa,EAAE,wCAAwC;AACvD,YAAA,KAAK,EAAE,iDAAiD;AACxD,YAAA,UAAU,EAAE,wCAAwC;AACpD,YAAA,WAAW,EACT,+NAA+N;AACjO,YAAA,OAAO,EAAE,2BAA2B;AACpC,YAAA,MAAM,EAAE,qCAAqC;AAC9C,SAAA;AACD,QAAA,QAAQ,EAAE;AACR,YAAA,IAAI,EAAE;AACJ,gBAAA,IAAI,EAAE;AACJ,oBAAA,KAAK,EAAE,qCAAqC;AAC7C,iBAAA;AACD,gBAAA,KAAK,EAAE;AACL,oBAAA,KAAK,EAAE,mCAAmC;AAC3C,iBAAA;AACF,aAAA;AACD,YAAA,SAAS,EAAE;AACT,gBAAA,MAAM,EAAE;AACN,oBAAA,SAAS,EAAE,cAAc;AAC1B,iBAAA;AACD,gBAAA,GAAG,EAAE;AACH,oBAAA,SAAS,EAAE,mBAAmB;AAC/B,iBAAA;AACF,aAAA;AACD,YAAA,IAAI,EAAE;AACJ,gBAAA,KAAK,EAAE;AACL,oBAAA,MAAM,EAAE,WAAW;AACnB,oBAAA,OAAO,EAAE,KAAK;AACd,oBAAA,MAAM,EAAE,WAAW;AACpB,iBAAA;AACD,gBAAA,MAAM,EAAE;AACN,oBAAA,MAAM,EAAE,WAAW;AACnB,oBAAA,OAAO,EAAE,KAAK;AACd,oBAAA,MAAM,EAAE,WAAW;AACpB,iBAAA;AACD,gBAAA,KAAK,EAAE;AACL,oBAAA,MAAM,EAAE,WAAW;AACnB,oBAAA,OAAO,EAAE,KAAK;AACd,oBAAA,MAAM,EAAE,WAAW;AACpB,iBAAA;AACD,gBAAA,MAAM,EAAE;AACN,oBAAA,MAAM,EAAE,WAAW;AACnB,oBAAA,OAAO,EAAE,KAAK;AACd,oBAAA,MAAM,EAAE,WAAW;AACpB,iBAAA;AACD,gBAAA,OAAO,EAAE;AACP,oBAAA,MAAM,EAAE,WAAW;AACnB,oBAAA,OAAO,EAAE,KAAK;AACd,oBAAA,MAAM,EAAE,WAAW;AACpB,iBAAA;AACD,gBAAA,IAAI,EAAE;AACJ,oBAAA,MAAM,EAAE,WAAW;AACnB,oBAAA,OAAO,EAAE,KAAK;AACd,oBAAA,MAAM,EAAE,WAAW;AACpB,iBAAA;AACF,aAAA;AACD,YAAA,UAAU,EAAE;AACV,gBAAA,IAAI,EAAE;AACJ,oBAAA,KAAK,EAAE,sDAAsD;AAC7D,oBAAA,SAAS,EAAE,KAAK;AACjB,iBAAA;AACF,aAAA;AACD,YAAA,KAAK,EAAE;AACL,gBAAA,IAAI,EAAE;AACJ,oBAAA,KAAK,EAAE,eAAe;AACvB,iBAAA;AACF,aAAA;AACD,YAAA,QAAQ,EAAE;AACR,gBAAA,IAAI,EAAE;AACJ,oBAAA,MAAM,EAAE,QAAQ;AACjB,iBAAA;AACF,aAAA;AACD,YAAA,QAAQ,EAAE;AACR,gBAAA,IAAI,EAAE;AACJ,oBAAA,MAAM,EAAE,QAAQ;AACjB,iBAAA;AACF,aAAA;AACF,SAAA;AACF,KAAA,CAAC;IAGF,MAAM,gBAAgB,CAAC,MAAe,EAAA;QACpC,IAAI,MAAM,EAAE;AACV,YAAA,IAAI,CAAC,WAAW,GAAG,IAAI;YACvB,MAAM,KAAK,GAAG,IAAI,CAAC,aAAa,CAAC,IAAI,EAAE;AACvC,YAAA,IAAI,KAAK,CAAC,gBAAgB,EAAE;AAC1B,gBAAA,IAAI,CAAC,IAAI,GAAG,KAAK;gBACjB;;;AAIF,YAAA,IAAI,IAAI,CAAC,SAAS,EAAE;AAClB,gBAAA,IAAI,CAAC,SAAS,CAAC,SAAS,EAAE;;AAE1B,gBAAA,MAAM,IAAI,OAAO,CAAC,OAAO,IAAI,UAAU,CAAC,OAAO,EAAE,EAAE,CAAC,CAAC;AACrD,gBAAA,IAAI,CAAC,WAAW,GAAG,KAAK;AACxB,gBAAA,IAAI,CAAC,OAAO,CAAC,IAAI,EAAE;;;aAEhB;AACL,YAAA,IAAI,CAAC,WAAW,GAAG,IAAI;YACvB,MAAM,KAAK,GAAG,IAAI,CAAC,cAAc,CAAC,IAAI,EAAE;AACxC,YAAA,IAAI,KAAK,CAAC,gBAAgB,EAAE;AAC1B,gBAAA,IAAI,CAAC,IAAI,GAAG,IAAI;gBAChB;;;AAIF,YAAA,MAAM,IAAI,OAAO,CAAC,OAAO,IAAI,UAAU,CAAC,OAAO,EAAE,GAAG,CAAC,CAAC;AACtD,YAAA,IAAI,IAAI,CAAC,SAAS,EAAE;AAClB,gBAAA,IAAI,CAAC,SAAS,CAAC,KAAK,EAAE;;AAExB,YAAA,IAAI,CAAC,WAAW,GAAG,KAAK;AACxB,YAAA,IAAI,CAAC,QAAQ,CAAC,IAAI,EAAE;;;AAKxB,IAAA,WAAW,CAAC,KAAiB,EAAA;;AAE3B,QAAA,MAAM,IAAI,GAAG,KAAK,CAAC,YAAY,EAAmB;AAClD,QAAA,MAAM,cAAc,GAAG,IAAI,CAAC,IAAI,CAAC,EAAE,IAAI,EAAE,CAAC,YAAY,GAAG,cAAc,CAAC,CAAC;AACzE,QAAA,MAAM,iBAAiB,GAAG,IAAI,CAAC,IAAI,CAAC,EAAE,IAAI,EAAE,CAAC,YAAY,GAAG,kBAAkB,CAAC,CAAC;QAEhF,IAAI,cAAc,EAAE;YAClB,IAAI,CAAC,IAAI,EAAE;YACX,KAAK,CAAC,cAAc,EAAE;YACtB,KAAK,CAAC,eAAe,EAAE;;aAClB,IAAI,iBAAiB,EAAE;YAC5B,MAAM,OAAO,GAAG,iBAAiB,CAAC,YAAY,CAAC,kBAAkB,CAAC;;YAElE,IAAI,CAAC,OAAO,IAAI,OAAO,KAAK,IAAI,CAAC,IAAI,CAAC,EAAE,EAAE;gBACxC,IAAI,CAAC,IAAI,EAAE;gBACX,KAAK,CAAC,cAAc,EAAE;gBACtB,KAAK,CAAC,eAAe,EAAE;;;;AAM7B,IAAA,aAAa,CAAC,KAAoB,EAAA;QAChC,IAAI,KAAK,CAAC,GAAG,KAAK,QAAQ,IAAI,IAAI,CAAC,IAAI,EAAE;;AAEvC,YAAA,MAAM,UAAU,GAAG,KAAK,CAAC,IAAI,CAAC,QAAQ,CAAC,gBAAgB,CAAC,iBAAiB,CAAC,CAAC;YAC3E,MAAM,QAAQ,GAAG,UAAU,CAAC,UAAU,CAAC,MAAM,GAAG,CAAC,CAAC;AAElD,YAAA,IAAI,QAAQ,KAAK,IAAI,CAAC,IAAI,EAAE;gBAC1B;;YAGF,KAAK,CAAC,cAAc,EAAE;AACtB,YAAA,IAAI,IAAI,CAAC,aAAa,EAAE;AACtB,gBAAA,IAAI,IAAI,CAAC,QAAQ,KAAK,QAAQ,EAAE;oBAC9B,IAAI,CAAC,UAAU,EAAE;;qBACZ;oBACL,IAAI,CAAC,IAAI,EAAE;;;AAER,iBAAA,IAAI,IAAI,CAAC,QAAQ,KAAK,QAAQ,EAAE;gBACrC,IAAI,CAAC,UAAU,EAAE;;;;AAKvB;;AAEG;AAEH,IAAA,MAAM,IAAI,GAAA;AACR,QAAA,IAAI,CAAC,IAAI,GAAG,IAAI;;AAGlB;;AAEG;AAEH,IAAA,MAAM,IAAI,GAAA;AACR,QAAA,IAAI,CAAC,IAAI,GAAG,KAAK;;AAGnB;;AAEG;AAEH,IAAA,MAAM,MAAM,GAAA;AACV,QAAA,IAAI,CAAC,IAAI,GAAG,CAAC,IAAI,CAAC,IAAI;;IAGhB,UAAU,GAAA;AAChB,QAAA,IAAI,CAAC,KAAK,GAAG,IAAI;QACjB,UAAU,CAAC,MAAK;AACd,YAAA,IAAI,CAAC,KAAK,GAAG,KAAK;SACnB,EAAE,GAAG,CAAC;;AAGD,IAAA,mBAAmB,GAAG,CAAC,KAAiB,KAAI;AAClD,QAAA,MAAM,MAAM,GAAG,KAAK,CAAC,MAAqB;;QAE1C,IAAI,MAAM,CAAC,YAAY,CAAC,MAAM,CAAC,KAAK,WAAW,EAAE;AAC/C,YAAA,IAAI,IAAI,CAAC,QAAQ,KAAK,QAAQ,EAAE;gBAC9B,IAAI,CAAC,UAAU,EAAE;;AACZ,iBAAA,IAAI,IAAI,CAAC,eAAe,EAAE;gBAC/B,IAAI,CAAC,IAAI,EAAE;;;AAGjB,KAAC;AAEO,IAAA,kBAAkB,GAAG,CAAC,KAAY,KAAI;QAC5C,KAAK,CAAC,cAAc,EAAE;AACtB,QAAA,IAAI,IAAI,CAAC,aAAa,EAAE;AACtB,YAAA,IAAI,IAAI,CAAC,QAAQ,KAAK,QAAQ,EAAE;gBAC9B,IAAI,CAAC,UAAU,EAAE;;iBACZ;gBACL,IAAI,CAAC,IAAI,EAAE;;;AAGjB,KAAC;IAEO,aAAa,GAAA;AACnB,QAAA,IAAI,IAAI,CAAC,UAAU,EAAE;YACnB,OAAO;AACL,gBAAA,KAAK,EAAE,OAAO;AACd,gBAAA,MAAM,EAAE,OAAO;AACf,gBAAA,QAAQ,EAAE,MAAM;AAChB,gBAAA,SAAS,EAAE,MAAM;aAClB;;AAGH,QAAA,IAAI,IAAI,CAAC,SAAS,EAAE;YAClB,OAAO;AACL,gBAAA,KAAK,EAAE,MAAM;AACb,gBAAA,QAAQ,EAAE,MAAM;aACjB;;AAGH,QAAA,MAAM,MAAM,GAAG;AACb,YAAA,KAAK,EAAE,OAAO;AACd,YAAA,MAAM,EAAE,OAAO;AACf,YAAA,KAAK,EAAE,OAAO;AACd,YAAA,MAAM,EAAE,QAAQ;AAChB,YAAA,OAAO,EAAE,QAAQ;AACjB,YAAA,IAAI,EAAE,MAAM;SACb;QAED,OAAO;AACL,YAAA,KAAK,EAAE,MAAM,CAAC,IAAI,CAAC,IAAI,CAAC;YACxB,QAAQ,EAAE,IAAI,CAAC,UAAU,GAAG,MAAM,GAAG,MAAM;YAC3C,SAAS,EAAE,IAAI,CAAC,UAAU,GAAG,MAAM,GAAG,MAAM;SAC7C;;IAGH,gBAAgB,GAAA;QACd,IAAI,IAAI,CAAC,IAAI,IAAI,IAAI,CAAC,SAAS,EAAE;AAC/B,YAAA,IAAI,CAAC,SAAS,CAAC,SAAS,EAAE;;;IAI9B,oBAAoB,GAAA;QAClB,IAAI,IAAI,CAAC,SAAS,IAAI,IAAI,CAAC,IAAI,EAAE;AAC/B,YAAA,IAAI,CAAC,SAAS,CAAC,KAAK,EAAE;;;IAI1B,MAAM,GAAA;QACJ,MAAM,EAAE,MAAM,EAAE,SAAS,EAAE,KAAK,EAAE,MAAM,EAAE,aAAa,EAAE,KAAK,EAAE,UAAU,EAAE,WAAW,EAAE,OAAO,EAAE,MAAM,EAAE,GAAG,IAAI,CAAC,UAAU,CAAC;YAC3H,IAAI,EAAE,IAAI,CAAC,IAAI;YACf,SAAS,EAAE,IAAI,CAAC,SAAS;YACzB,IAAI,EAAE,IAAI,CAAC,IAAI;YACf,UAAU,EAAE,IAAI,CAAC,UAAU;YAC3B,KAAK,EAAE,IAAI,CAAC,KAAK;YACjB,QAAQ,EAAE,IAAI,CAAC,QAAQ;YACvB,QAAQ,EAAE,IAAI,CAAC,QAAQ;AACxB,SAAA,CAAC;QAEF,QACE,+DACE,GAAG,EAAE,EAAE,KAAK,IAAI,CAAC,SAAS,GAAG,EAAE,CAAC,EAChC,IAAI,EAAC,QAAQ,EACb,KAAK,EAAE,MAAM,EAAE,EACf,OAAO,EAAE,IAAI,CAAC,mBAAmB,EACjC,QAAQ,EAAE,IAAI,CAAC,kBAAkB,EAAA,iBAAA,EACjB,aAAa,EAAA,kBAAA,EACX,IAAI,CAAC,UAAU,GAAG,cAAc,GAAG,SAAS,EAAA,YAAA,EACnD,MAAM,EAAA,EAEjB,CAAA,CAAA,KAAA,EAAA,EAAA,GAAA,EAAA,0CAAA,EAAK,IAAI,EAAC,WAAW,EAAC,KAAK,EAAE,SAAS,EAAE,EAAA,EACtC,CAAA,CAAA,KAAA,EAAA,EAAA,GAAA,EAAA,0CAAA,EAAK,IAAI,EAAC,OAAO,EAAC,KAAK,EAAE,KAAK,EAAE,EAAE,KAAK,EAAE,IAAI,CAAC,aAAa,EAAE,EAAE,IAAI,EAAC,UAAU,EAAC,OAAO,EAAE,CAAC,IAAI,CAAC,CAAC,eAAe,EAAE,EAAA,EAC7G,CAAC,IAAI,CAAC,QAAQ,KACb,CAAA,CAAA,KAAA,EAAA,EAAA,GAAA,EAAA,0CAAA,EAAK,IAAI,EAAC,QAAQ,EAAC,KAAK,EAAE,MAAM,EAAE,EAAA,EAChC,CAAA,CAAA,KAAA,EAAA,EAAA,GAAA,EAAA,0CAAA,EAAK,IAAI,EAAC,gBAAgB,EAAC,KAAK,EAAE,aAAa,EAAE,EAAA,EAC/C,CAAI,CAAA,IAAA,EAAA,EAAA,GAAA,EAAA,0CAAA,EAAA,EAAE,EAAC,aAAa,EAAC,IAAI,EAAC,OAAO,EAAC,KAAK,EAAE,KAAK,EAAE,EAAA,EAC9C,CAAM,CAAA,MAAA,EAAA,EAAA,GAAA,EAAA,0CAAA,EAAA,IAAI,EAAC,QAAQ,EAAA,EAAE,IAAI,CAAC,UAAU,CAAQ,CACzC,EACJ,IAAI,CAAC,UAAU,KACd,CAAA,CAAA,GAAA,EAAA,EAAA,GAAA,EAAA,0CAAA,EAAG,EAAE,EAAC,cAAc,EAAC,IAAI,EAAC,aAAa,EAAC,KAAK,EAAE,UAAU,EAAE,EAAA,EACzD,CAAM,CAAA,MAAA,EAAA,EAAA,GAAA,EAAA,0CAAA,EAAA,IAAI,EAAC,QAAQ,EAAE,EAAA,IAAI,CAAC,UAAU,CAAQ,CAC1C,CACL,CACG,EACN,CAAQ,CAAA,QAAA,EAAA,EAAA,GAAA,EAAA,0CAAA,EAAA,IAAI,EAAC,cAAc,EAAC,KAAK,EAAE,WAAW,EAAE,EAAE,OAAO,EAAE,MAAM,IAAI,CAAC,IAAI,EAAE,gBAAa,aAAa,EAAC,IAAI,EAAC,QAAQ,EAAA,EAClH,CAAA,CAAA,UAAA,EAAA,EAAA,GAAA,EAAA,0CAAA,EAAU,IAAI,EAAC,mBAAmB,EAAY,CAAA,CACvC,CACL,CACP,EAED,CAAA,CAAA,KAAA,EAAA,EAAA,GAAA,EAAA,0CAAA,EAAK,IAAI,EAAC,SAAS,EAAC,KAAK,EAAE,OAAO,EAAE,EAAA,EAClC,CAAA,CAAA,MAAA,EAAA,EAAA,GAAA,EAAA,0CAAA,EAAA,CAAQ,CACJ,EAEL,CAAC,IAAI,CAAC,QAAQ,KACb,CAAA,CAAA,KAAA,EAAA,EAAA,GAAA,EAAA,0CAAA,EAAK,IAAI,EAAC,QAAQ,EAAC,KAAK,EAAE,MAAM,EAAE,EAAA,EAChC,CAAM,CAAA,MAAA,EAAA,EAAA,GAAA,EAAA,0CAAA,EAAA,IAAI,EAAC,QAAQ,EAAG,CAAA,CAClB,CACP,CACG,CACF,CACC;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;","names":["BcmModal","__stencil_proxyCustomElement","HTMLElement"],"sources":["src/components/modal/modal.css?tag=bcm-modal&encapsulation=shadow","src/components/modal/modal.component.tsx"],"sourcesContent":[":host {\n  display: contents;\n}\n","import { Component, Prop, h, Element, Event, EventEmitter, Method, Watch, Listen, State } from '@stencil/core';\nimport { tv } from '@utils/tv';\n\nexport type ModalSize = 'small' | 'medium' | 'large' | 'xlarge' | 'xxlarge' | 'full';\nexport type ModalPlacement = 'center' | 'top';\n\n/**\n * @component BcmModal\n * @description A flexible modal dialog component built on the native HTML Dialog API.\n * Provides a powerful way to display content in a layer above the page with full keyboard and focus management.\n *\n * @slot - Main content area of the modal\n * @slot header - Custom header content (overrides header-text prop)\n * @slot helper - Custom helper text content (overrides helper-text prop)\n * @slot footer - Footer content for action buttons\n *\n * @part dialog - The native dialog element\n * @part container - The container wrapper for centering and scrolling\n * @part modal - The main modal box\n * @part header - The header section\n * @part header-content - The content wrapper inside header\n * @part title - The title heading element\n * @part helper-text - The helper text paragraph\n * @part close-button - The close button in header\n * @part content - The main content area\n * @part footer - The footer section\n *\n * @example\n * ```html\n * <!-- Basic usage -->\n * <bcm-modal open header-text=\"Welcome\" helper-text=\"Please read carefully\">\n *   <p>Modal content goes here</p>\n *   <div slot=\"footer\">\n *     <button data-dismiss>Close</button>\n *   </div>\n * </bcm-modal>\n *\n * <!-- Custom size and placement -->\n * <bcm-modal size=\"large\" placement=\"top\">\n *   <div slot=\"header\">Custom Header</div>\n *   <p>Content here</p>\n *   <div slot=\"footer\">\n *     <button>Cancel</button>\n *     <button>Confirm</button>\n *   </div>\n * </bcm-modal>\n *\n * <!-- Full screen modal -->\n * <bcm-modal full-screen no-footer>\n *   <p>Full screen content</p>\n * </bcm-modal>\n *\n * <!-- Programmatic usage -->\n * <bcm-modal id=\"myModal\">Content</bcm-modal>\n * <script>\n *   document.getElementById('myModal').show();\n * </script>\n * ```\n */\n@Component({\n  tag: 'bcm-modal',\n  styleUrl: 'modal.css',\n  shadow: true,\n})\nexport class BcmModal {\n  @Element() host: HTMLBcmModalElement;\n\n  private dialogRef?: HTMLDialogElement;\n\n  /**\n   * Controls whether the modal is open or closed\n   */\n  @Prop({ mutable: true, reflect: true }) open: boolean = false;\n\n  /**\n   * The size of the modal\n   * - 'small': 400px\n   * - 'medium': 600px\n   * - 'large': 800px\n   * - 'xlarge': 1024px\n   * - 'xxlarge': 1200px\n   * - 'full': 100% width\n   */\n  @Prop() size: ModalSize = 'medium';\n\n  /**\n   * The placement of the modal on the screen\n   * - 'center': Centered vertically and horizontally\n   * - 'top': Aligned to the top with 80px padding\n   */\n  @Prop() placement: ModalPlacement = 'center';\n\n  /**\n   * Controls backdrop behavior\n   * - true: Shows backdrop, modal can be closed by clicking outside\n   * - false: No backdrop\n   * - 'static': Shows backdrop but prevents closing by clicking outside (triggers shake animation)\n   */\n  @Prop() backdrop: boolean | 'static' = true;\n\n  /**\n   * Makes the modal take full width of the viewport (max-width: 100%)\n   */\n  @Prop({ attribute: 'full-width' }) fullWidth: boolean = false;\n\n  /**\n   * Makes the modal take the full screen (100vw x 100vh, no border radius)\n   */\n  @Prop({ attribute: 'full-screen' }) fullScreen: boolean = false;\n\n  /**\n   * Text to display in the modal header\n   */\n  @Prop({ attribute: 'header-text' }) headerText?: string;\n\n  /**\n   * Helper text to display below the header title\n   */\n  @Prop({ attribute: 'helper-text' }) helperText?: string;\n\n  /**\n   * Hides the header section completely\n   */\n  @Prop({ attribute: 'no-header' }) noHeader: boolean = false;\n\n  /**\n   * Hides the footer section completely\n   */\n  @Prop({ attribute: 'no-footer' }) noFooter: boolean = false;\n\n  /**\n   * Allows closing the modal by clicking on the backdrop\n   */\n  @Prop({ attribute: 'close-on-backdrop' }) closeOnBackdrop: boolean = true;\n\n  /**\n   * Allows closing the modal by pressing the Escape key\n   */\n  @Prop({ attribute: 'close-on-escape' }) closeOnEscape: boolean = true;\n\n  @State() isAnimating: boolean = false;\n  @State() shake: boolean = false;\n\n  /**\n   * Emitted after the modal has opened\n   */\n  @Event() bcmOpen: EventEmitter<void>;\n\n  /**\n   * Emitted after the modal has closed\n   */\n  @Event() bcmClose: EventEmitter<void>;\n\n  /**\n   * Emitted before the modal opens. Can be cancelled by calling event.preventDefault()\n   */\n  @Event({ cancelable: true }) bcmBeforeOpen: EventEmitter<void>;\n\n  /**\n   * Emitted before the modal closes. Can be cancelled by calling event.preventDefault()\n   */\n  @Event({ cancelable: true }) bcmBeforeClose: EventEmitter<void>;\n\n  private modalClass = tv({\n    slots: {\n      dialog:\n        'bcm-ui-element fixed inset-0 m-0 p-0 w-full max-w-full h-full max-h-full border-none bg-transparent backdrop:bg-color-default-dark backdrop:opacity-50 backdrop:transition-opacity backdrop:duration-300',\n      container: 'fixed inset-0 flex items-start justify-center p-4 overflow-y-auto overscroll-contain',\n      modal: 'relative bg-color-basic-base text-color-default rounded-lg shadow-2xl transform transition-all duration-300 ease-in-out flex flex-col',\n      header: 'flex justify-between items-start bg-color-base text-color-default border-color-default border-solid border-0 border-b rounded-t-lg',\n      headerContent: 'flex-1 min-w-0 flex items-center gap-2',\n      title: 'font-semibold m-0 text-size-6 text-color-header',\n      helperText: 'text-size-5 text-color-placeholder m-0',\n      closeButton:\n        'text-size-5 font-medium text-color-default bg-transparent border-none p-0 h-6 w-6 rounded hover:bg-color-default-hover cursor-pointer active:bg-color-active transition-colors flex-shrink-0 outline-none focus-visible:ring ',\n      content: 'flex-grow overflow-y-auto',\n      footer: 'flex items-center justify-end gap-2',\n    },\n    variants: {\n      open: {\n        true: {\n          modal: 'opacity-100 translate-y-0 scale-100',\n        },\n        false: {\n          modal: 'opacity-0 -translate-y-4 scale-95',\n        },\n      },\n      placement: {\n        center: {\n          container: 'items-center',\n        },\n        top: {\n          container: 'items-start pt-20',\n        },\n      },\n      size: {\n        small: {\n          header: 'py-3 px-4',\n          content: 'p-4',\n          footer: 'py-3 px-4',\n        },\n        medium: {\n          header: 'py-4 px-5',\n          content: 'p-5',\n          footer: 'py-4 px-5',\n        },\n        large: {\n          header: 'py-4 px-6',\n          content: 'p-6',\n          footer: 'py-4 px-6',\n        },\n        xlarge: {\n          header: 'py-5 px-6',\n          content: 'p-6',\n          footer: 'py-5 px-6',\n        },\n        xxlarge: {\n          header: 'py-5 px-8',\n          content: 'p-8',\n          footer: 'py-5 px-8',\n        },\n        full: {\n          header: 'py-5 px-8',\n          content: 'p-8',\n          footer: 'py-5 px-8',\n        },\n      },\n      fullScreen: {\n        true: {\n          modal: 'rounded-none w-screen h-screen max-w-none max-h-none',\n          container: 'p-0',\n        },\n      },\n      shake: {\n        true: {\n          modal: 'animate-shake',\n        },\n      },\n      noHeader: {\n        true: {\n          header: 'hidden',\n        },\n      },\n      noFooter: {\n        true: {\n          footer: 'hidden',\n        },\n      },\n    },\n  });\n\n  @Watch('open')\n  async handleOpenChange(isOpen: boolean) {\n    if (isOpen) {\n      this.isAnimating = true;\n      const event = this.bcmBeforeOpen.emit();\n      if (event.defaultPrevented) {\n        this.open = false;\n        return;\n      }\n\n      // Use native dialog API with top-layer\n      if (this.dialogRef) {\n        this.dialogRef.showModal();\n        // Small delay for animation\n        await new Promise(resolve => setTimeout(resolve, 50));\n        this.isAnimating = false;\n        this.bcmOpen.emit();\n      }\n    } else {\n      this.isAnimating = true;\n      const event = this.bcmBeforeClose.emit();\n      if (event.defaultPrevented) {\n        this.open = true;\n        return;\n      }\n\n      // Wait for animation before closing\n      await new Promise(resolve => setTimeout(resolve, 300));\n      if (this.dialogRef) {\n        this.dialogRef.close();\n      }\n      this.isAnimating = false;\n      this.bcmClose.emit();\n    }\n  }\n\n  @Listen('click', { capture: true })\n  handleClick(event: MouseEvent) {\n    // Use composedPath to work with shadow DOM and slots\n    const path = event.composedPath() as HTMLElement[];\n    const dismissElement = path.find(el => el.hasAttribute?.('data-dismiss'));\n    const closeModalElement = path.find(el => el.hasAttribute?.('data-close-modal'));\n\n    if (dismissElement) {\n      this.hide();\n      event.preventDefault();\n      event.stopPropagation();\n    } else if (closeModalElement) {\n      const modalId = closeModalElement.getAttribute('data-close-modal');\n      // If modalId matches this modal's id, close it\n      if (!modalId || modalId === this.host.id) {\n        this.hide();\n        event.preventDefault();\n        event.stopPropagation();\n      }\n    }\n  }\n\n  @Listen('keydown')\n  handleKeyDown(event: KeyboardEvent) {\n    if (event.key === 'Escape' && this.open) {\n      // Only handle ESC if this is the topmost modal\n      const openModals = Array.from(document.querySelectorAll('bcm-modal[open]'));\n      const topModal = openModals[openModals.length - 1];\n\n      if (topModal !== this.host) {\n        return;\n      }\n\n      event.preventDefault();\n      if (this.closeOnEscape) {\n        if (this.backdrop === 'static') {\n          this.shakeModal();\n        } else {\n          this.hide();\n        }\n      } else if (this.backdrop === 'static') {\n        this.shakeModal();\n      }\n    }\n  }\n\n  /**\n   * Programmatically opens the modal\n   */\n  @Method()\n  async show(): Promise<void> {\n    this.open = true;\n  }\n\n  /**\n   * Programmatically closes the modal\n   */\n  @Method()\n  async hide(): Promise<void> {\n    this.open = false;\n  }\n\n  /**\n   * Toggles the modal open/closed state\n   */\n  @Method()\n  async toggle(): Promise<void> {\n    this.open = !this.open;\n  }\n\n  private shakeModal() {\n    this.shake = true;\n    setTimeout(() => {\n      this.shake = false;\n    }, 300);\n  }\n\n  private handleBackdropClick = (event: MouseEvent) => {\n    const target = event.target as HTMLElement;\n    // Check if click is on the container (backdrop area), not on modal content\n    if (target.getAttribute('part') === 'container') {\n      if (this.backdrop === 'static') {\n        this.shakeModal();\n      } else if (this.closeOnBackdrop) {\n        this.hide();\n      }\n    }\n  };\n\n  private handleDialogCancel = (event: Event) => {\n    event.preventDefault();\n    if (this.closeOnEscape) {\n      if (this.backdrop === 'static') {\n        this.shakeModal();\n      } else {\n        this.hide();\n      }\n    }\n  };\n\n  private getModalStyle() {\n    if (this.fullScreen) {\n      return {\n        width: '100vw',\n        height: '100vh',\n        maxWidth: 'none',\n        maxHeight: 'none',\n      };\n    }\n\n    if (this.fullWidth) {\n      return {\n        width: '100%',\n        maxWidth: '100%',\n      };\n    }\n\n    const widths = {\n      small: '400px',\n      medium: '600px',\n      large: '800px',\n      xlarge: '1024px',\n      xxlarge: '1200px',\n      full: '100%',\n    };\n\n    return {\n      width: widths[this.size],\n      maxWidth: this.fullScreen ? 'none' : '90vw',\n      maxHeight: this.fullScreen ? 'none' : '90vh',\n    };\n  }\n\n  componentDidLoad() {\n    if (this.open && this.dialogRef) {\n      this.dialogRef.showModal();\n    }\n  }\n\n  disconnectedCallback() {\n    if (this.dialogRef && this.open) {\n      this.dialogRef.close();\n    }\n  }\n\n  render() {\n    const { dialog, container, modal, header, headerContent, title, helperText, closeButton, content, footer } = this.modalClass({\n      open: this.open,\n      placement: this.placement,\n      size: this.size,\n      fullScreen: this.fullScreen,\n      shake: this.shake,\n      noHeader: this.noHeader,\n      noFooter: this.noFooter,\n    });\n\n    return (\n      <dialog\n        ref={el => (this.dialogRef = el)}\n        part=\"dialog\"\n        class={dialog()}\n        onClick={this.handleBackdropClick}\n        onCancel={this.handleDialogCancel}\n        aria-labelledby=\"modal-title\"\n        aria-describedby={this.helperText ? 'modal-helper' : undefined}\n        aria-modal=\"true\"\n      >\n        <div part=\"container\" class={container()}>\n          <div part=\"modal\" class={modal()} style={this.getModalStyle()} role=\"document\" onClick={e => e.stopPropagation()}>\n            {!this.noHeader && (\n              <div part=\"header\" class={header()}>\n                <div part=\"header-content\" class={headerContent()}>\n                  <h2 id=\"modal-title\" part=\"title\" class={title()}>\n                    <slot name=\"header\">{this.headerText}</slot>\n                  </h2>\n                  {this.helperText && (\n                    <p id=\"modal-helper\" part=\"helper-text\" class={helperText()}>\n                      <slot name=\"helper\">{this.helperText}</slot>\n                    </p>\n                  )}\n                </div>\n                <button part=\"close-button\" class={closeButton()} onClick={() => this.hide()} aria-label=\"Close modal\" type=\"button\">\n                  <bcm-icon name=\"fa-solid fa-xmark\"></bcm-icon>\n                </button>\n              </div>\n            )}\n\n            <div part=\"content\" class={content()}>\n              <slot />\n            </div>\n\n            {!this.noFooter && (\n              <div part=\"footer\" class={footer()}>\n                <slot name=\"footer\" />\n              </div>\n            )}\n          </div>\n        </div>\n      </dialog>\n    );\n  }\n}\n"],"version":3}

package/dist/components/bcm-pop-confirm.js

@@ -1,9 +1,9 @@
 import { p as proxyCustomElement, H, c as createEvent, h } from './index.js';
 import { a as autoUpdate, c as computePosition, o as offset, f as flip, s as shift, b as arrow } from './p-DBDSgIvP.js';
 import { t as tv } from './p-CEcVC0yX.js';
-import { d as defineCustomElement$2 } from './p-CsIBm0J5.js';
+import { d as defineCustomElement$2 } from './p-xQIzBLsS.js';
 
-const popConfirmCss = ".visible{visibility:visible}.transform{transform:translate(var(--tw-translate-x),var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y))}.text-wrap{text-wrap:wrap}.border{border-width:1px}.transition{transition-duration:.15s;transition-property:color,background-color,border-color,text-decoration-color,fill,stroke,opacity,box-shadow,transform,filter,backdrop-filter;transition-timing-function:cubic-bezier(.4,0,.2,1)}:host{--popover-bg:var(--bcm-ui-color-background-basic-panel);display:inline-block}[popover]{border:none;overflow:visible;padding:0}[popover]:not(:popover-open){display:none}[popover]:popover-open{opacity:1;transform:scale(1);transition:opacity .15s ease-out,transform .15s ease-out}@starting-style{[popover]:popover-open{opacity:0;transform:scale(.95)}}::slotted([slot=body]){text-wrap:pretty;font-family:Inter,sans-serif}.container{width:100%}@media (min-width:640px){.container{max-width:640px}}@media (min-width:768px){.container{max-width:768px}}@media (min-width:1024px){.container{max-width:1024px}}@media (min-width:1280px){.container{max-width:1280px}}@media (min-width:1536px){.container{max-width:1536px}}.bcm-ui-element{-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;font-family:Inter,sans-serif}.static{position:static}.fixed{position:fixed}.absolute{position:absolute}.relative{position:relative}.right-3{right:.75rem}.right-4{right:1rem}.right-6{right:1.5rem}.top-3{top:.75rem}.top-4{top:1rem}.top-6{top:1.5rem}.z-\\[9999\\]{z-index:9999}.m-0{margin:0}.inline-block{display:inline-block}.flex{display:flex}.size-6{height:1.5rem;width:1.5rem}.h-3{height:.75rem}.w-3{width:.75rem}.max-w-64{max-width:16rem}.max-w-80{max-width:20rem}.max-w-96{max-width:24rem}.flex-1{flex:1 1 0%}.rotate-45{--tw-rotate:45deg;transform:translate(var(--tw-translate-x),var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y))}.cursor-pointer{cursor:pointer}.flex-row{flex-direction:row}.flex-col{flex-direction:column}.items-center{align-items:center}.justify-end{justify-content:flex-end}.justify-center{justify-content:center}.gap-2{gap:.5rem}.gap-4{gap:1rem}.gap-6{gap:1.5rem}.gap-8{gap:2rem}.text-pretty{text-wrap:pretty}.rounded-full{border-radius:var(--bcm-ui-border-radius-full,9999px)}.rounded-lg{border-radius:var(--bcm-ui-border-radius-lg,8px)}.bg-\\[--popover-bg\\]{background-color:var(--popover-bg)}.p-4{padding:1rem}.p-6{padding:1.5rem}.p-8{padding:2rem}.pr-8{padding-right:2rem}.font-sans{font-family:Inter,sans-serif}.text-size-4{font-size:var(--bcm-ui-font-size-4,14px);line-height:var(--bcm-ui-line-height-4,20px)}.text-size-5{font-size:var(--bcm-ui-font-size-5,16px);line-height:var(--bcm-ui-line-height-5,24px)}.text-size-6{font-size:var(--bcm-ui-font-size-6,18px);line-height:var(--bcm-ui-line-height-6,24px)}.text-size-7{font-size:var(--bcm-ui-font-size-7,20px);line-height:var(--bcm-ui-line-height-7,28px)}.font-semibold{font-weight:600}.\\!text-color-header{color:var(--bcm-ui-color-text-header)!important}.text-\\[var\\(--bcm-ui-color-text-error\\)\\]{color:var(--bcm-ui-color-text-error)}.text-\\[var\\(--bcm-ui-color-text-info\\)\\]{color:var(--bcm-ui-color-text-info)}.text-\\[var\\(--bcm-ui-color-text-success\\)\\]{color:var(--bcm-ui-color-text-success)}.text-\\[var\\(--bcm-ui-color-text-warning\\)\\]{color:var(--bcm-ui-color-text-warning)}.shadow{--tw-shadow:var(--bcm-ui-box-shadow-default);--tw-shadow-colored:var(--bcm-ui-box-shadow-default)}.shadow,.shadow-3{box-shadow:var(--tw-ring-offset-shadow,0 0 #0000),var(--tw-ring-shadow,0 0 #0000),var(--tw-shadow)}.shadow-3{--tw-shadow:var(--bcm-ui-box-shadow-3);--tw-shadow-colored:var(--bcm-ui-box-shadow-3)}.outline{outline-style:solid}.filter{filter:var(--tw-blur) var(--tw-brightness) var(--tw-contrast) var(--tw-grayscale) var(--tw-hue-rotate) var(--tw-invert) var(--tw-saturate) var(--tw-sepia) var(--tw-drop-shadow)}.hover\\:bg-gray-100:hover{background-color:oklch(.967 .003 264.542)}";
+const popConfirmCss = ".visible{visibility:visible}.transform{transform:translate(var(--tw-translate-x),var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y))}.text-wrap{text-wrap:wrap}.border{border-width:1px}.transition{transition-duration:.15s;transition-property:color,background-color,border-color,text-decoration-color,fill,stroke,opacity,box-shadow,transform,filter,backdrop-filter;transition-timing-function:cubic-bezier(.4,0,.2,1)}:host{--popover-bg:var(--bcm-ui-color-background-basic-panel);display:inline-block}[popover]{border:none;overflow:visible;padding:0}[popover]:not(:popover-open){display:none}[popover]:popover-open{opacity:1;transform:scale(1);transition:opacity .15s ease-out,transform .15s ease-out}@starting-style{[popover]:popover-open{opacity:0;transform:scale(.95)}}::slotted([slot=body]){text-wrap:pretty;font-family:Inter,sans-serif}.container{width:100%}@media (min-width:640px){.container{max-width:640px}}@media (min-width:768px){.container{max-width:768px}}@media (min-width:1024px){.container{max-width:1024px}}@media (min-width:1280px){.container{max-width:1280px}}@media (min-width:1536px){.container{max-width:1536px}}.bcm-ui-element{-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;font-family:Inter,sans-serif}.static{position:static}.fixed{position:fixed}.absolute{position:absolute}.relative{position:relative}.right-3{right:.75rem}.right-4{right:1rem}.right-6{right:1.5rem}.top-3{top:.75rem}.top-4{top:1rem}.top-6{top:1.5rem}.z-\\[9999\\]{z-index:9999}.m-0{margin:0}.inline-block{display:inline-block}.flex{display:flex}.hidden{display:none}.size-6{height:1.5rem;width:1.5rem}.h-3{height:.75rem}.w-3{width:.75rem}.max-w-64{max-width:16rem}.max-w-80{max-width:20rem}.max-w-96{max-width:24rem}.flex-1{flex:1 1 0%}.rotate-45{--tw-rotate:45deg;transform:translate(var(--tw-translate-x),var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y))}.cursor-pointer{cursor:pointer}.flex-row{flex-direction:row}.flex-col{flex-direction:column}.items-center{align-items:center}.justify-end{justify-content:flex-end}.justify-center{justify-content:center}.gap-2{gap:.5rem}.gap-4{gap:1rem}.gap-6{gap:1.5rem}.gap-8{gap:2rem}.text-pretty{text-wrap:pretty}.rounded-full{border-radius:var(--bcm-ui-border-radius-full,9999px)}.rounded-lg{border-radius:var(--bcm-ui-border-radius-lg,8px)}.bg-\\[--popover-bg\\]{background-color:var(--popover-bg)}.p-4{padding:1rem}.p-6{padding:1.5rem}.p-8{padding:2rem}.pr-8{padding-right:2rem}.font-sans{font-family:Inter,sans-serif}.text-size-4{font-size:var(--bcm-ui-font-size-4,14px);line-height:var(--bcm-ui-line-height-4,20px)}.text-size-5{font-size:var(--bcm-ui-font-size-5,16px);line-height:var(--bcm-ui-line-height-5,24px)}.text-size-6{font-size:var(--bcm-ui-font-size-6,18px);line-height:var(--bcm-ui-line-height-6,24px)}.text-size-7{font-size:var(--bcm-ui-font-size-7,20px);line-height:var(--bcm-ui-line-height-7,28px)}.font-semibold{font-weight:600}.\\!text-color-header{color:var(--bcm-ui-color-text-header)!important}.text-\\[var\\(--bcm-ui-color-text-error\\)\\]{color:var(--bcm-ui-color-text-error)}.text-\\[var\\(--bcm-ui-color-text-info\\)\\]{color:var(--bcm-ui-color-text-info)}.text-\\[var\\(--bcm-ui-color-text-success\\)\\]{color:var(--bcm-ui-color-text-success)}.text-\\[var\\(--bcm-ui-color-text-warning\\)\\]{color:var(--bcm-ui-color-text-warning)}.shadow{--tw-shadow:var(--bcm-ui-box-shadow-default);--tw-shadow-colored:var(--bcm-ui-box-shadow-default)}.shadow,.shadow-3{box-shadow:var(--tw-ring-offset-shadow,0 0 #0000),var(--tw-ring-shadow,0 0 #0000),var(--tw-shadow)}.shadow-3{--tw-shadow:var(--bcm-ui-box-shadow-3);--tw-shadow-colored:var(--bcm-ui-box-shadow-3)}.outline{outline-style:solid}.filter{filter:var(--tw-blur) var(--tw-brightness) var(--tw-contrast) var(--tw-grayscale) var(--tw-hue-rotate) var(--tw-invert) var(--tw-saturate) var(--tw-sepia) var(--tw-drop-shadow)}.hover\\:bg-gray-100:hover{background-color:oklch(.967 .003 264.542)}";
 
 const statusIcons = {
     info: 'fa-solid fa-circle-info',
@@ -24,161 +24,115 @@ const BcmPopConfirm$1 = /*@__PURE__*/ proxyCustomElement(class BcmPopConfirm ext
         this.bcmClose = createEvent(this, "bcmClose", 1);
         this.bcmConfirm = createEvent(this, "bcmConfirm", 1);
         this.bcmCancel = createEvent(this, "bcmCancel", 1);
-        /**
-         * @prop {PopConfirmPlacement} placement - Position of the popover relative to the trigger element.
-         * Automatically flips if there's not enough space.
-         * Default: 'top'
-         */
-        this.placement = 'top';
-        /**
-         * @prop {PopConfirmSize} size - Size variant that controls padding and text size.
-         * - 'small': Compact size with minimal padding
-         * - 'medium': Standard size
-         * - 'large': Spacious size with more padding
-         * Default: 'medium'
-         */
-        this.size = 'medium';
-        /**
-         * @prop {PopConfirmStatus} status - Status type that determines the color scheme and icon.
-         * - 'info': Informational (blue)
-         * - 'success': Success/positive action (green)
-         * - 'warning': Warning/caution (yellow)
-         * - 'error': Error/destructive action (red)
-         * Default: 'info'
-         */
-        this.status = 'info';
-        /**
-         * @prop {string} headerText - Text displayed in the header section.
-         * Can be overridden by using the 'header' slot.
-         * Default: ''
-         */
-        this.headerText = '';
-        /**
-         * @prop {string} description - Description text displayed in the body section.
-         * Can be overridden by using the 'body' slot.
-         * Default: ''
-         */
-        this.description = '';
-        /**
-         * @prop {string} confirmText - Text for the confirm button.
-         * Default: 'Yes'
-         */
-        this.confirmText = 'Yes';
-        /**
-         * @prop {string} cancelText - Text for the cancel button.
-         * Default: 'Cancel'
-         */
-        this.cancelText = 'Cancel';
-        /**
-         * @prop {boolean} showArrow - Whether to show the arrow pointing to the trigger.
-         * Default: true
-         */
-        this.showArrow = true;
-        /**
-         * @prop {boolean} statusIcon - Whether to show the status icon in the header.
-         * Icon only shows if headerText is also provided.
-         * Default: true
-         */
-        this.statusIcon = true;
-        /**
-         * @prop {number} offsetDistance - Distance in pixels between the popover and trigger element.
-         * Default: 12
-         */
-        this.offsetDistance = 12;
-        /**
-         * @prop {boolean} closeOnOutsideClick - Whether to close when clicking outside the popover.
-         * Default: true
-         */
-        this.closeOnOutsideClick = true;
-        /**
-         * @prop {boolean} closeOnEscape - Whether to close when pressing the Escape key.
-         * Default: true
-         */
-        this.closeOnEscape = true;
-        this.isOpen = false;
-        this.handleSlotChange = () => {
-            var _a;
-            const slot = (_a = this.host.shadowRoot) === null || _a === void 0 ? void 0 : _a.querySelector('slot:not([name])');
-            if (!slot)
-                return;
-            const elements = slot.assignedElements();
-            const assignedElement = elements[0];
-            this.triggerRef = (assignedElement || this.host);
-            if (!this.triggerRef)
-                return;
-            if (this.popconfirmRef && this.popconfirmId) {
-                this.triggerRef.setAttribute('aria-describedby', this.popconfirmId);
-            }
-            this.removeTriggerListeners();
-            this.setupTriggerListeners();
-        };
-        this.handleTriggerClick = () => {
-            this.toggle();
-        };
-        this.handleOutsideClick = (e) => {
-            var _a;
-            if (!this.closeOnOutsideClick || !this.isOpen)
-                return;
-            const target = e.target;
-            if (!this.host.contains(target) && !((_a = this.popconfirmRef) === null || _a === void 0 ? void 0 : _a.contains(target))) {
-                this.handleCancel();
-            }
-        };
-        this.handleToggle = (e) => {
-            const toggleEvent = e;
-            if (toggleEvent.newState === 'open' && !this.isOpen) {
-                this.isOpen = true;
-            }
-            else if (toggleEvent.newState === 'closed' && this.isOpen) {
-                this.isOpen = false;
-            }
-        };
-        this.handleConfirm = () => {
-            this.bcmConfirm.emit();
-            this.hide();
-        };
-        this.handleCancel = () => {
-            this.bcmCancel.emit();
-            this.hide();
-        };
-        this.popconfirmClass = tv({
-            slots: {
-                container: 'bcm-ui-element fixed m-0 flex flex-col bg-[--popover-bg] rounded-lg shadow-3 z-[9999]',
-                arrow: 'absolute w-3 h-3 bg-[--popover-bg] rotate-45',
-                closeBtn: 'absolute flex size-6 items-center justify-center hover:bg-gray-100 rounded-full cursor-pointer text-color-muted',
-                header: 'flex items-center pr-8',
-                headerLeft: 'flex items-center gap-2',
-                title: '!text-color-header font-semibold',
-                body: 'flex-1 font-sans text-pretty',
-                footer: 'flex flex-row justify-end gap-2',
-            },
-            variants: {
-                size: {
-                    small: {
-                        container: 'text-size-4 max-w-64 p-4 gap-4',
-                        title: 'text-size-5',
-                        closeBtn: 'top-3 right-3',
-                    },
-                    medium: {
-                        container: 'text-size-5 max-w-80 p-6 gap-6',
-                        title: 'text-size-6',
-                        closeBtn: 'top-4 right-4',
-                    },
-                    large: {
-                        container: 'text-size-6 max-w-96 p-8 gap-8',
-                        title: 'text-size-7',
-                        closeBtn: 'top-6 right-6',
-                    },
-                },
-                status: {
-                    info: { headerLeft: 'text-[var(--bcm-ui-color-text-info)]' },
-                    success: { headerLeft: 'text-[var(--bcm-ui-color-text-success)]' },
-                    warning: { headerLeft: 'text-[var(--bcm-ui-color-text-warning)]' },
-                    error: { headerLeft: 'text-[var(--bcm-ui-color-text-error)]' },
-                },
-            },
-        });
     }
+    get host() { return this; }
+    popconfirmRef;
+    arrowRef;
+    triggerRef;
+    cleanupAutoUpdate;
+    popconfirmId;
+    /**
+     * @prop {PopConfirmPlacement} placement - Position of the popover relative to the trigger element.
+     * Automatically flips if there's not enough space.
+     * Default: 'top'
+     */
+    placement = 'top';
+    /**
+     * @prop {PopConfirmSize} size - Size variant that controls padding and text size.
+     * - 'small': Compact size with minimal padding
+     * - 'medium': Standard size
+     * - 'large': Spacious size with more padding
+     * Default: 'medium'
+     */
+    size = 'medium';
+    /**
+     * @prop {PopConfirmStatus} status - Status type that determines the color scheme and icon.
+     * - 'info': Informational (blue)
+     * - 'success': Success/positive action (green)
+     * - 'warning': Warning/caution (yellow)
+     * - 'error': Error/destructive action (red)
+     * Default: 'info'
+     */
+    status = 'info';
+    /**
+     * @prop {string} headerText - Text displayed in the header section.
+     * Can be overridden by using the 'header' slot.
+     * Default: ''
+     */
+    headerText = '';
+    /**
+     * @prop {string} description - Description text displayed in the body section.
+     * Can be overridden by using the 'body' slot.
+     * Default: ''
+     */
+    description = '';
+    /**
+     * @prop {string} confirmText - Text for the confirm button.
+     * Default: 'Yes'
+     */
+    confirmText = 'Yes';
+    /**
+     * @prop {string} cancelText - Text for the cancel button.
+     * Default: 'Cancel'
+     */
+    cancelText = 'Cancel';
+    /**
+     * @prop {boolean} showArrow - Whether to show the arrow pointing to the trigger.
+     * Default: true
+     */
+    showArrow = true;
+    /**
+     * @prop {boolean} statusIcon - Whether to show the status icon in the header.
+     * Icon only shows if headerText is also provided.
+     * Default: true
+     */
+    statusIcon = true;
+    /**
+     * @prop {number} offsetDistance - Distance in pixels between the popover and trigger element.
+     * Default: 12
+     */
+    offsetDistance = 12;
+    /**
+     * @prop {boolean} closeOnOutsideClick - Whether to close when clicking outside the popover.
+     * Default: true
+     */
+    closeOnOutsideClick = true;
+    /**
+     * @prop {boolean} closeOnEscape - Whether to close when pressing the Escape key.
+     * Default: true
+     */
+    closeOnEscape = true;
+    isOpen = false;
+    /**
+     * @event bcmBeforeOpen - Emitted before the popover opens.
+     * Useful for performing actions before the popover becomes visible.
+     */
+    bcmBeforeOpen;
+    /**
+     * @event bcmOpen - Emitted when the popover is opened.
+     * Useful for tracking when the popover becomes visible.
+     */
+    bcmOpen;
+    /**
+     * @event bcmBeforeClose - Emitted before the popover closes.
+     * Useful for performing cleanup actions before hiding.
+     */
+    bcmBeforeClose;
+    /**
+     * @event bcmClose - Emitted when the popover is closed.
+     * Useful for tracking when the popover is hidden.
+     */
+    bcmClose;
+    /**
+     * @event bcmConfirm - Emitted when the user clicks the confirm button.
+     * This is where you should handle the confirmed action.
+     */
+    bcmConfirm;
+    /**
+     * @event bcmCancel - Emitted when the user clicks cancel, presses Escape, or clicks outside.
+     * Useful for tracking when the user dismisses the confirmation.
+     */
+    bcmCancel;
     async handleOpenChange(open) {
         if (!this.popconfirmRef)
             return;
@@ -286,6 +240,21 @@ const BcmPopConfirm$1 = /*@__PURE__*/ proxyCustomElement(class BcmPopConfirm ext
             });
         }
     }
+    handleSlotChange = () => {
+        const slot = this.host.shadowRoot?.querySelector('slot:not([name])');
+        if (!slot)
+            return;
+        const elements = slot.assignedElements();
+        const assignedElement = elements[0];
+        this.triggerRef = (assignedElement || this.host);
+        if (!this.triggerRef)
+            return;
+        if (this.popconfirmRef && this.popconfirmId) {
+            this.triggerRef.setAttribute('aria-describedby', this.popconfirmId);
+        }
+        this.removeTriggerListeners();
+        this.setupTriggerListeners();
+    };
     setupTriggerListeners() {
         if (!this.triggerRef)
             return;
@@ -296,15 +265,25 @@ const BcmPopConfirm$1 = /*@__PURE__*/ proxyCustomElement(class BcmPopConfirm ext
             return;
         this.triggerRef.removeEventListener('click', this.handleTriggerClick);
     }
+    handleTriggerClick = () => {
+        this.toggle();
+    };
+    handleOutsideClick = (e) => {
+        if (!this.closeOnOutsideClick || !this.isOpen)
+            return;
+        const target = e.target;
+        if (!this.host.contains(target) && !this.popconfirmRef?.contains(target)) {
+            this.handleCancel();
+        }
+    };
     handleKeyDown(e) {
         if (!this.closeOnEscape || !this.isOpen)
             return;
         if (e.key === 'Escape') {
             // Check if this is the topmost open popconfirm
             const openPopconfirms = Array.from(document.querySelectorAll('bcm-pop-confirm')).filter(el => {
-                var _a;
-                const popconfirmEl = (_a = el.shadowRoot) === null || _a === void 0 ? void 0 : _a.querySelector('[popover]');
-                return popconfirmEl === null || popconfirmEl === void 0 ? void 0 : popconfirmEl.matches(':popover-open');
+                const popconfirmEl = el.shadowRoot?.querySelector('[popover]');
+                return popconfirmEl?.matches(':popover-open');
             });
             const topPopconfirm = openPopconfirms[openPopconfirms.length - 1];
             if (topPopconfirm === this.host) {
@@ -314,6 +293,23 @@ const BcmPopConfirm$1 = /*@__PURE__*/ proxyCustomElement(class BcmPopConfirm ext
             }
         }
     }
+    handleToggle = (e) => {
+        const toggleEvent = e;
+        if (toggleEvent.newState === 'open' && !this.isOpen) {
+            this.isOpen = true;
+        }
+        else if (toggleEvent.newState === 'closed' && this.isOpen) {
+            this.isOpen = false;
+        }
+    };
+    handleConfirm = () => {
+        this.bcmConfirm.emit();
+        this.hide();
+    };
+    handleCancel = () => {
+        this.bcmCancel.emit();
+        this.hide();
+    };
     componentWillLoad() {
         this.popconfirmId = `popconfirm-${Math.random().toString(36).substring(2, 11)}`;
     }
@@ -330,6 +326,43 @@ const BcmPopConfirm$1 = /*@__PURE__*/ proxyCustomElement(class BcmPopConfirm ext
             this.popconfirmRef.removeEventListener('toggle', this.handleToggle);
         }
     }
+    popconfirmClass = tv({
+        slots: {
+            container: 'bcm-ui-element fixed m-0 flex flex-col bg-[--popover-bg] rounded-lg shadow-3 z-[9999]',
+            arrow: 'absolute w-3 h-3 bg-[--popover-bg] rotate-45',
+            closeBtn: 'absolute flex size-6 items-center justify-center hover:bg-gray-100 rounded-full cursor-pointer text-color-muted',
+            header: 'flex items-center pr-8',
+            headerLeft: 'flex items-center gap-2',
+            title: '!text-color-header font-semibold',
+            body: 'flex-1 font-sans text-pretty',
+            footer: 'flex flex-row justify-end gap-2',
+        },
+        variants: {
+            size: {
+                small: {
+                    container: 'text-size-4 max-w-64 p-4 gap-4',
+                    title: 'text-size-5',
+                    closeBtn: 'top-3 right-3',
+                },
+                medium: {
+                    container: 'text-size-5 max-w-80 p-6 gap-6',
+                    title: 'text-size-6',
+                    closeBtn: 'top-4 right-4',
+                },
+                large: {
+                    container: 'text-size-6 max-w-96 p-8 gap-8',
+                    title: 'text-size-7',
+                    closeBtn: 'top-6 right-6',
+                },
+            },
+            status: {
+                info: { headerLeft: 'text-[var(--bcm-ui-color-text-info)]' },
+                success: { headerLeft: 'text-[var(--bcm-ui-color-text-success)]' },
+                warning: { headerLeft: 'text-[var(--bcm-ui-color-text-warning)]' },
+                error: { headerLeft: 'text-[var(--bcm-ui-color-text-error)]' },
+            },
+        },
+    });
     render() {
         const { container, arrow: arrowClass, header, headerLeft, title, closeBtn, body, footer } = this.popconfirmClass({
             size: this.size,
@@ -341,7 +374,6 @@ const BcmPopConfirm$1 = /*@__PURE__*/ proxyCustomElement(class BcmPopConfirm ext
         const hasHeaderText = Boolean(this.headerText);
         return (h("div", { key: '7329eb6db100b57368ca73b36a2a2ad66b218b8e', class: "inline-block" }, h("slot", { key: '0d775cf4a00b4ef97e8e75e2620ddf420caf43c6', onSlotchange: this.handleSlotChange }), h("div", { key: '19c4c001fbf51b895a45b271365b3a7cb22590bb', ref: el => (this.popconfirmRef = el), id: this.popconfirmId, part: "container", class: container(), popover: "manual", role: "alertdialog", "aria-labelledby": hasHeaderText ? `${this.popconfirmId}-header` : undefined, "aria-describedby": `${this.popconfirmId}-body` }, this.showArrow && h("div", { key: '91aaa976265c10537cea1d0d57d08df27c838645', ref: el => (this.arrowRef = el), part: "arrow", class: arrowClass() }), h("div", { key: '91a049dd52d47d267d11c8e8c628aa417fb40663', class: closeBtn(), onClick: this.handleCancel, role: "button", tabIndex: 0, "aria-label": "Close" }, h("bcm-icon", { key: 'd15fb5922185f246c15e9480c3a4652ef9e96ffa', "icon-name": "far fa-times" })), h("header", { key: 'b62f81fd72a05aa116ecad7614f20645aa85f060', class: header() }, h("div", { key: '226cbb6ac92d294b67eb0c33ed0faea52d56689a', class: headerLeft() }, showStatusIcon && h("bcm-icon", { key: '0e5cd64e8369876b9016af3c9607cdb406828651', "icon-name": statusIcons[this.status] }), hasHeaderText && (h("span", { key: '4a1cf44acf56bc46ad52fda1d1d29da0c838fded', id: `${this.popconfirmId}-header`, class: title() }, this.headerText)), h("slot", { key: '5e159545f0b12d97c9b632653955f636866c2a14', name: "header" }))), h("main", { key: '6e082c73048583a1447dc4fb7c9940a677e7d587', id: `${this.popconfirmId}-body`, part: "body", class: body() }, h("slot", { key: '6d0546a06ca77118d82074fffb9164c4b4f86a5c', name: "body" }, this.description)), h("footer", { key: '4f36400e44847e31d6ceed5fd7f47d35f68af458', part: "footer", class: footer() }, h("slot", { key: '97b85bb7dd3d39790b91e6bffef01f7eb077c2c3', name: "footer" }, h("bcm-button", { key: '8e8b7175a1dd9e069e9cbca7b430fdc1e9a7beab', kind: "outline", size: this.size, onClick: this.handleCancel }, this.cancelText), h("bcm-button", { key: 'ae9daeacaf77c8abfe92951eefe2e885d23eab79', size: this.size, status: this.status, kind: "primary", onClick: this.handleConfirm }, this.confirmText))))));
     }
-    get host() { return this; }
     static get watchers() { return {
         "isOpen": ["handleOpenChange"]
     }; }