bromcom-ui-next 0.1.21 → 0.1.23

package/dist/bromcom-ui/p-881ccea1.entry.js

@@ -1,2 +0,0 @@
-import{r as t,c as i,h as s,H as e,g as a}from"./p-9d0aeb92.js";import{t as n}from"./p-2c58fcb7.js";const o=".relative{position:relative}.block{display:block}:host{display:block;position:relative;width:100%}.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}.flex{display:flex}.contents{display:contents}.w-full{width:100%}.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))}.resize{resize:both}.flex-col{flex-direction:column}.shadow{--tw-shadow:var(--bcm-ui-box-shadow-default);--tw-shadow-colored:var(--bcm-ui-box-shadow-default);box-shadow:var(--tw-ring-offset-shadow,0 0 #0000),var(--tw-ring-shadow,0 0 #0000),var(--tw-shadow)}";const h=o;const r=class{constructor(s){t(this,s);this.bcmTabChange=i(this,"bcmTabChange",1);this.size="medium";this.triggers=[];this.contents=[];this.tabClass=n({base:"tabs-container bcm-ui-element flex flex-col w-full"})}componentWillLoad(){this.activeTab=this.defaultValue}componentDidLoad(){this.refreshElementReferences();this.updateTriggerProperties();this.setupRelations();this.updateInkbar();this.updateContentVisibility()}refreshElementReferences(){this.triggers=Array.from(this.el.querySelectorAll("bcm-tabs-trigger"));this.contents=Array.from(this.el.querySelectorAll("bcm-tabs-content"));this.tabsList=this.el.querySelector("bcm-tabs-list")}setupRelations(){this.triggers.forEach((t=>{t.active=t.value===this.activeTab;const i=this.contents.find((i=>i.value===t.value));if(i){const s=`panel-${t.value}`;i.id=s;t.setAttribute("aria-controls",s);i.setAttribute("aria-labelledby",`trigger-${t.value}`);t.id=`trigger-${t.value}`}}))}updateTriggerProperties(){var t;if(((t=this.triggers)===null||t===void 0?void 0:t.length)>0){this.triggers.forEach((t=>{t.size=this.size}))}}handleSizeChange(){this.updateTriggerProperties()}async disableTab(t){const i=this.triggers.find((i=>i.value===t));if(i){i.disabled=true}}async enableTab(t){const i=this.triggers.find((i=>i.value===t));if(i){i.disabled=false}}async disableAllTabs(){this.triggers.forEach((t=>{t.disabled=true}))}async enableAllTabs(){this.triggers.forEach((t=>{t.disabled=false}))}async getActiveTab(){return this.activeTab}async setActiveTab(t){const i=this.triggers.find((i=>i.value===t));if(i&&!i.disabled){this.previousTab=this.activeTab;this.activeTab=t;this.updateInkbar();this.updateContentVisibility();this.updateTabStatus();this.bcmTabChange.emit({activeTab:this.activeTab,element:i,previousTab:this.previousTab})}}updateTabStatus(){this.triggers.forEach((t=>{const i=t.value===this.activeTab;t.active=i}))}handleResize(){this.updateInkbar()}handleTabSelected(t){this.previousTab=this.activeTab;this.activeTab=t.detail;this.updateTabStatus();this.updateInkbar();this.updateContentVisibility();const i=this.triggers.find((t=>t.value===this.activeTab));if(i){this.bcmTabChange.emit({activeTab:this.activeTab,element:i,previousTab:this.previousTab})}}updateContentVisibility(){this.contents.forEach((t=>{const i=t.value===this.activeTab;t.style.display=i?"block":"none";t.setAttribute("aria-hidden",(!i).toString())}))}updateInkbar(){var t,i,s,e,a;if(!this.tabsList){console.warn("bcm-tabs-list not found");return}const n=this.triggers.length;if(n===0)return;const o=(i=(t=this.tabsList)===null||t===void 0?void 0:t.shadowRoot)===null||i===void 0?void 0:i.querySelector(".inkbar");const h=this.triggers.find((t=>t.value===this.activeTab));if(h&&o){const t=h.getBoundingClientRect();const i=(a=(e=(s=this.tabsList)===null||s===void 0?void 0:s.shadowRoot)===null||e===void 0?void 0:e.querySelector(".tabs-list"))===null||a===void 0?void 0:a.getBoundingClientRect();if(t&&i){const s=t.left-i.left;const e=t.width;o.style.width=`${e}px`;o.style.transform=`translateX(${s}px)`;o.style.opacity="1"}else{console.warn("Group or trigger rect calculation failed");o.style.opacity="0"}}else{if(o)o.style.opacity="0"}}render(){return s(e,{key:"2bc33f644ca746b98c5be1b630471f2d2812a4e3"},s("div",{key:"29c8e9bb573d2944cf2ece084036c6a5582fe6ca",class:this.tabClass()},s("slot",{key:"2c302a219cadc0141dbd00cd489676796a684125",name:"tabs-list"}),s("slot",{key:"66f0612d4294eea35f19eee59742db7c9e973a58"})))}get el(){return a(this)}static get watchers(){return{size:["handleSizeChange"]}}};r.style=h;export{r as bcm_tabs};
-//# sourceMappingURL=p-881ccea1.entry.js.map

package/dist/bromcom-ui/p-881ccea1.entry.js.map

@@ -1 +0,0 @@
-{"version":3,"names":["bcmTabsCss","BcmTabsStyle0","BcmTabs","constructor","hostRef","this","size","triggers","contents","tabClass","tv","base","componentWillLoad","activeTab","defaultValue","componentDidLoad","refreshElementReferences","updateTriggerProperties","setupRelations","updateInkbar","updateContentVisibility","Array","from","el","querySelectorAll","tabsList","querySelector","forEach","trigger","active","value","panel","find","content","panelId","id","setAttribute","_a","length","handleSizeChange","disableTab","t","disabled","enableTab","disableAllTabs","enableAllTabs","getActiveTab","setActiveTab","previousTab","updateTabStatus","bcmTabChange","emit","element","isActive","handleResize","handleTabSelected","event","detail","activeElement","isVisible","style","display","toString","console","warn","totalTriggers","inkbar","_b","shadowRoot","activeTrigger","triggerRect","getBoundingClientRect","groupRect","_e","_d","_c","left","width","transform","opacity","render","h","Host","key","class","name"],"sources":["src/components/tabs/bcm-tabs.css?tag=bcm-tabs&encapsulation=shadow","src/components/tabs/tabs.component.tsx"],"sourcesContent":[":host {\n  display: block;\n  position: relative;\n  width: 100%;\n}\n","import { Component, State, Prop, Element, h, Host, Listen, ComponentInterface, Event, EventEmitter, Watch, Method } from '@stencil/core';\nimport { tv } from '@utils/tv';\n\n/**\n * @description Tab interface component\n * @slot - Default slot for content area\n * @slot tabs-list - Special slot for tab list\n */\n@Component({\n  tag: 'bcm-tabs',\n  styleUrl: 'bcm-tabs.css',\n  shadow: true,\n})\nexport class BcmTabs implements ComponentInterface {\n  @Element() el: HTMLElement;\n\n  /**\n   * Default active tab value\n   */\n  @Prop({ reflect: true })\n  defaultValue: string;\n\n  /**\n   * Tab size\n   */\n  @Prop({ reflect: true })\n  size: 'small' | 'medium' | 'large' = 'medium';\n\n  /**\n   * Triggers when tab changes\n   */\n  @Event({\n    composed: false,\n    bubbles: false,\n    cancelable: true,\n    eventName: 'bcmTabChange',\n  })\n  bcmTabChange: EventEmitter<{\n    activeTab: string;\n    element: HTMLBcmTabsTriggerElement;\n    previousTab?: string;\n  }>;\n\n  /**\n   * Active tab value\n   */\n  @State() activeTab: string;\n\n  /**\n   * Previous active tab value\n   */\n  @State() previousTab: string;\n\n  private triggers: HTMLBcmTabsTriggerElement[] = [];\n  private contents: HTMLBcmTabsContentElement[] = [];\n  private tabsList: HTMLBcmTabsListElement;\n\n  componentWillLoad() {\n    this.activeTab = this.defaultValue;\n  }\n\n  componentDidLoad() {\n    this.refreshElementReferences();\n    this.updateTriggerProperties();\n    this.setupRelations();\n    this.updateInkbar();\n    this.updateContentVisibility();\n  }\n\n  /**\n   * Refreshes DOM element references\n   */\n  private refreshElementReferences() {\n    this.triggers = Array.from(this.el.querySelectorAll('bcm-tabs-trigger'));\n    this.contents = Array.from(this.el.querySelectorAll('bcm-tabs-content'));\n    this.tabsList = this.el.querySelector('bcm-tabs-list');\n  }\n\n  /**\n   * Establishes relationships between tabs and content\n   */\n  private setupRelations() {\n    this.triggers.forEach(trigger => {\n      trigger.active = trigger.value === this.activeTab;\n      const panel = this.contents.find(content => content.value === trigger.value);\n      if (panel) {\n        const panelId = `panel-${trigger.value}`;\n        panel.id = panelId;\n        trigger.setAttribute('aria-controls', panelId);\n        panel.setAttribute('aria-labelledby', `trigger-${trigger.value}`);\n        trigger.id = `trigger-${trigger.value}`;\n      }\n    });\n  }\n\n  private updateTriggerProperties() {\n    if (this.triggers?.length > 0) {\n      this.triggers.forEach(trigger => {\n        trigger.size = this.size;\n      });\n    }\n  }\n\n  @Watch('size')\n  handleSizeChange() {\n    this.updateTriggerProperties();\n  }\n\n  @Method()\n  async disableTab(value: string): Promise<void> {\n    const trigger = this.triggers.find(t => t.value === value);\n    if (trigger) {\n      trigger.disabled = true;\n    }\n  }\n\n  @Method()\n  async enableTab(value: string): Promise<void> {\n    const trigger = this.triggers.find(t => t.value === value);\n    if (trigger) {\n      trigger.disabled = false;\n    }\n  }\n\n  /**\n   * Disables all tabs\n   */\n  @Method()\n  async disableAllTabs() {\n    this.triggers.forEach(trigger => {\n      trigger.disabled = true;\n    });\n  }\n\n  /**\n   * Enables all tabs\n   */\n  @Method()\n  async enableAllTabs() {\n    this.triggers.forEach(trigger => {\n      trigger.disabled = false;\n    });\n  }\n\n  /**\n   * Returns the active tab value\n   */\n  @Method()\n  async getActiveTab(): Promise<string> {\n    return this.activeTab;\n  }\n\n  /**\n   * Sets the active tab\n   */\n  @Method()\n  async setActiveTab(value: string): Promise<void> {\n    const trigger = this.triggers.find(t => t.value === value);\n    if (trigger && !trigger.disabled) {\n      this.previousTab = this.activeTab;\n      this.activeTab = value;\n      this.updateInkbar();\n      this.updateContentVisibility();\n      this.updateTabStatus();\n\n      this.bcmTabChange.emit({\n        activeTab: this.activeTab,\n        element: trigger,\n        previousTab: this.previousTab,\n      });\n    }\n  }\n\n  /**\n   * Updates tab status\n   */\n  private updateTabStatus() {\n    this.triggers.forEach(trigger => {\n      const isActive = trigger.value === this.activeTab;\n      trigger.active = isActive;\n    });\n  }\n\n  @Listen('resize', { target: 'window' })\n  handleResize() {\n    this.updateInkbar();\n  }\n\n  /**\n   * Triggered when a tab is selected\n   */\n  @Listen('bcmTabSelected', { capture: true })\n  handleTabSelected(event: CustomEvent<string>) {\n    this.previousTab = this.activeTab;\n    this.activeTab = event.detail;\n\n    this.updateTabStatus();\n    this.updateInkbar();\n    this.updateContentVisibility();\n\n    const activeElement = this.triggers.find(trigger => trigger.value === this.activeTab);\n    if (activeElement) {\n      this.bcmTabChange.emit({\n        activeTab: this.activeTab,\n        element: activeElement,\n        previousTab: this.previousTab,\n      });\n    }\n  }\n\n  /**\n   * Updates content visibility\n   */\n  private updateContentVisibility() {\n    this.contents.forEach(content => {\n      const isVisible = content.value === this.activeTab;\n      content.style.display = isVisible ? 'block' : 'none';\n      content.setAttribute('aria-hidden', (!isVisible).toString());\n    });\n  }\n\n  /**\n   * Updates inkbar position\n   */\n  private updateInkbar() {\n    if (!this.tabsList) {\n      console.warn('bcm-tabs-list not found');\n      return;\n    }\n\n    const totalTriggers = this.triggers.length;\n    if (totalTriggers === 0) return;\n\n    const inkbar = this.tabsList?.shadowRoot?.querySelector('.inkbar') as HTMLElement;\n    const activeTrigger = this.triggers.find(trigger => trigger.value === this.activeTab);\n\n    if (activeTrigger && inkbar) {\n      const triggerRect = activeTrigger.getBoundingClientRect();\n      const groupRect = this.tabsList?.shadowRoot?.querySelector('.tabs-list')?.getBoundingClientRect();\n\n      if (triggerRect && groupRect) {\n        const left = triggerRect.left - groupRect.left;\n        const width = triggerRect.width;\n\n        inkbar.style.width = `${width}px`;\n        inkbar.style.transform = `translateX(${left}px)`;\n        inkbar.style.opacity = '1';\n      } else {\n        console.warn('Group or trigger rect calculation failed');\n        inkbar.style.opacity = '0';\n      }\n    } else {\n      if (inkbar) inkbar.style.opacity = '0';\n    }\n  }\n\n  /**\n   * Tab container class\n   */\n  private tabClass = tv({\n    base: 'tabs-container bcm-ui-element flex flex-col w-full',\n  });\n\n  render() {\n    return (\n      <Host>\n        <div class={this.tabClass()}>\n          <slot name=\"tabs-list\" />\n          <slot></slot>\n        </div>\n      </Host>\n    );\n  }\n}\n"],"mappings":"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","ignoreList":[]}

package/dist/bromcom-ui/p-8ae92b62.entry.js

@@ -1,2 +0,0 @@
-import{r as e,c as t,h as i,g as r}from"./p-9d0aeb92.js";import{g as o}from"./p-ba2410ef.js";import{t as s}from"./p-2c58fcb7.js";const a=":host{display:inline-block}.bcm-ui-element{-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;font-family:Inter,sans-serif}.static{position:static}.absolute{position:absolute}.relative{position:relative}.left-0\\.5{left:.125rem}.left-\\[18px\\]{left:18px}.left-\\[20px\\]{left:20px}.left-\\[22px\\]{left:22px}.order-2{order:2}.flex{display:flex}.hidden{display:none}.size-3{height:.75rem;width:.75rem}.size-3\\.5{height:.875rem;width:.875rem}.size-4{width:1rem}.h-4,.size-4{height:1rem}.h-5{height:1.25rem}.h-\\[18px\\]{height:18px}.w-10{width:2.5rem}.w-8{width:2rem}.w-9{width:2.25rem}.cursor-default{cursor:default}.cursor-pointer{cursor:pointer}.flex-col{flex-direction:column}.items-center{align-items:center}.gap-0\\.5{gap:.125rem}.gap-1{gap:.25rem}.gap-2{gap:.5rem}.gap-2\\.5{gap:.625rem}.gap-3{gap:.75rem}.rounded-full{border-radius:var(--bcm-ui-border-radius-full,9999px)}.bg-\\[--switch-bg\\]{background-color:var(--switch-bg)}.bg-\\[--switch-dot-bg\\]{background-color:var(--switch-dot-bg)}.text-size-3{font-size:var(--bcm-ui-font-size-3,12px);line-height:var(--bcm-ui-line-height-3,16px)}.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)}.font-medium{font-weight:500}.font-normal{font-weight:400}.\\!text-color-error{color:var(--bcm-ui-color-text-error)!important}.shadow{--tw-shadow:var(--bcm-ui-box-shadow-default);--tw-shadow-colored:var(--bcm-ui-box-shadow-default)}.shadow,.shadow-sm{box-shadow:var(--tw-ring-offset-shadow,0 0 #0000),var(--tw-ring-shadow,0 0 #0000),var(--tw-shadow)}.shadow-sm{--tw-shadow:var(--bcm-ui-box-shadow-sm);--tw-shadow-colored:var(--bcm-ui-box-shadow-sm)}.transition-all{transition-duration:.15s;transition-property:all;transition-timing-function:cubic-bezier(.4,0,.2,1)}.transition-colors{transition-duration:.15s;transition-property:color,background-color,border-color,text-decoration-color,fill,stroke;transition-timing-function:cubic-bezier(.4,0,.2,1)}.duration-300{transition-duration:.3s}.ease-in-out{transition-timing-function:cubic-bezier(.4,0,.2,1)}.group:hover .group-hover\\:bg-\\[--switch-bg-hover\\],.hover\\:bg-\\[--switch-bg-hover\\]:hover{background-color:var(--switch-bg-hover)}.peer:focus-visible~.peer-focus-visible\\:ring-2{--tw-ring-offset-shadow:var(--tw-ring-inset) 0 0 0 var(--tw-ring-offset-width) var(--tw-ring-offset-color);--tw-ring-shadow:var(--tw-ring-inset) 0 0 0 calc(2px + var(--tw-ring-offset-width)) var(--tw-ring-color);box-shadow:var(--tw-ring-offset-shadow),var(--tw-ring-shadow),var(--tw-shadow,0 0 #0000)}.peer:focus-visible~.peer-focus-visible\\:ring-blue-300{--tw-ring-color:oklch(0.809 0.105 251.813)}.peer:focus-visible~.peer-focus-visible\\:ring-offset-2{--tw-ring-offset-width:2px}.peer:disabled~.peer-disabled\\:cursor-not-allowed{cursor:not-allowed}.peer:disabled~.peer-disabled\\:\\!text-color-disabled{color:var(--bcm-ui-color-text-disabled)!important}";const c=a;const d=class{constructor(i){e(this,i);this.bcmSwitchChange=t(this,"bcmSwitchChange",1);this.checked=false;this.disabled=false;this.labelPosition="right";this.error=false;this.size="medium";this.readonly=false;this.required=false;this.switchId=o("switch");this.switchStyle=()=>{const e={"--switch-bg":"var(--bcm-ui-color-background-default-dark-default)","--switch-bg-hover":"var(--bcm-ui-color-background-default-dark-hover)","--switch-dot-bg":"var(--bcm-ui-color-background-base-default)"};const t={"--switch-bg":"var(--bcm-ui-color-background-info-default)","--switch-bg-hover":"var(--bcm-ui-color-background-info-hover)"};const i={"--switch-bg":"var(--bcm-ui-color-background-error-default)","--switch-bg-hover":"var(--bcm-ui-color-background-error-hover)"};const r={"--switch-bg":"var(--bcm-ui-color-background-default-dark-default)","--switch-bg-hover":"var(--bcm-ui-color-background-default-dark-default)","--switch-dot-bg":"var(--bcm-ui-color-background-disabled-default)"};const o={"--switch-bg":"var(--bcm-ui-color-background-disabled-default)","--switch-bg-hover":"var(--bcm-ui-color-background-disabled-default)","--switch-dot-bg":"var(--bcm-ui-color-background-default-default)"};return Object.assign(Object.assign(Object.assign(Object.assign(Object.assign({},e),this.checked&&t),this.error&&i),this.readonly&&r),this.disabled&&o)};this.switchClass=s({slots:{base:"bcm-ui-element flex flex-col",switchWrapper:"flex items-center group",dotContainer:"relative flex items-center rounded-full cursor-pointer bg-[--switch-bg] group-hover:bg-[--switch-bg-hover] peer-disabled:cursor-not-allowed transition-colors duration-300",dot:"absolute bg-[--switch-dot-bg] rounded-full shadow-sm transition-all duration-300 ease-in-out peer-disabled:cursor-not-allowed",caption:"!text-color-error font-normal",label:"!text-color font-medium peer-disabled:!text-color-disabled peer-disabled:cursor-not-allowed"},variants:{size:{small:{dotContainer:"w-8 h-4",dot:"size-3",label:"text-size-4",caption:"text-size-3",switchWrapper:"gap-2",base:"gap-0.5"},medium:{dotContainer:"w-9 h-[18px]",dot:"size-3.5",label:"text-size-5",caption:"text-size-4",switchWrapper:"gap-2.5",base:"gap-1"},large:{dotContainer:"w-10 h-5",dot:"size-4",label:"text-size-6",caption:"text-size-5",switchWrapper:"gap-3",base:"gap-2"}},labelPosition:{left:{label:""},right:{label:"order-2"}},checked:{true:{dot:""},false:{dot:"left-0.5"}},disabled:{true:"",false:{switchWrapper:""}},readonly:{true:{switchWrapper:"cursor-default",dotContainer:"cursor-default",dot:"cursor-default"},false:{switchWrapper:"cursor-pointer",dotContainer:"cursor-pointer hover:bg-[--switch-bg-hover]"}}},compoundVariants:[{size:"small",checked:true,class:{dot:"left-[18px]"}},{size:"medium",checked:true,class:{dot:"left-[20px]"}},{size:"large",checked:true,class:{dot:"left-[22px]"}},{readonly:false,disabled:false,class:{dotContainer:"peer-focus-visible:ring-2 peer-focus-visible:ring-offset-2 peer-focus-visible:ring-blue-300"}}]})}toggleSwitch(){if(this.disabled||this.readonly)return;this.checked=!this.checked;this.bcmSwitchChange.emit(this.checked)}render(){const{base:e,switchWrapper:t,label:r,dot:o,dotContainer:s,caption:a}=this.switchClass({size:this.size,checked:this.checked,disabled:this.disabled,labelPosition:this.labelPosition,readonly:this.readonly});const c=Object.assign({role:"switch","aria-checked":this.checked.toString(),"aria-disabled":this.disabled.toString(),"aria-readonly":this.readonly.toString()},this.required&&{"aria-required":"true"});const d=!this.readonly&&!this.disabled?{tabindex:"0"}:{};return i("div",{key:"6073bf409136e2470b9dbb4086b275bbae37e0cf",class:e()},i("label",{key:"2f4aabe9e2faa9e6427722923b7b671fdde63d0d",class:t(),style:this.switchStyle()},i("input",{key:"790195d6a1e03f81d2c3c0582e35053fdcbf88de",id:this.switchId,type:"checkbox",class:"hidden peer",checked:this.checked,name:this.name,value:this.value,disabled:this.disabled,readOnly:this.readonly,required:this.required,onChange:()=>this.toggleSwitch()}),this.label&&i("span",{key:"696ed4067822d9cb2c6c259ddc7e89add1e84550",class:r()},i("slot",{key:"9ee1058077e3e26e90fc662756964504f6f8449c"},this.label)),i("label",Object.assign({key:"7fbc66b8357a5af8200279fd9b2c705f0d73530b",htmlFor:this.switchId,class:s()},d,c,{onKeyDown:e=>{if((e.key==="Enter"||e.key===" ")&&!this.readonly&&!this.disabled){e.preventDefault();this.toggleSwitch()}}}),i("div",{key:"0ee2aca9dddfcd1c4cd52dd60d6f1964e6dcdd28",class:o()}))),this.error&&this.caption&&i("span",{key:"80000e73d4f695d5620ed3347350ed049a247bf9",class:a()},this.caption),i("slot",{key:"6bfa76d6062426e21c6c41474fb102177d304a1f",name:"caption"}))}get el(){return r(this)}};d.style=c;export{d as bcm_switch};
-//# sourceMappingURL=p-8ae92b62.entry.js.map

package/dist/bromcom-ui/p-8ae92b62.entry.js.map

@@ -1 +0,0 @@
-{"version":3,"names":["switchCss","BcmSwitchStyle0","BcmSwitch","constructor","hostRef","this","checked","disabled","labelPosition","error","size","readonly","required","switchId","generateId","switchStyle","defaultStyle","checkedStyle","errorStyle","readonlyStyle","disabledStyle","Object","assign","switchClass","tv","slots","base","switchWrapper","dotContainer","dot","caption","label","variants","small","medium","large","left","right","true","false","compoundVariants","class","toggleSwitch","bcmSwitchChange","emit","render","ariaAttributes","role","toString","tabIndexAttr","tabindex","h","key","style","id","type","name","value","readOnly","onChange","htmlFor","onKeyDown","event","preventDefault"],"sources":["src/components/switch/switch.css?tag=bcm-switch&encapsulation=shadow","src/components/switch/switch.component.tsx"],"sourcesContent":[":host {\n  display: inline-block;\n}\n","import { Component, Prop, h, Event, EventEmitter, Element, ComponentInterface } from '@stencil/core';\nimport { generateId } from '../../utils/id/generate-id';\nimport { tv } from '@utils/tv';\n\n/**\n * @component BcmSwitch\n * @description A customizable toggle switch component that provides an intuitive way to enable or disable options.\n * Supports different sizes, label positions, error states, and accessibility features.\n *\n * @example Basic usage\n * <bcm-switch label=\"Enable notifications\"></bcm-switch>\n *\n * @example With error state\n * <bcm-switch\n *   label=\"Accept terms\"\n *   error={true}\n *   caption=\"You must accept the terms to continue\">\n * </bcm-switch>\n *\n * @example Disabled state\n * <bcm-switch\n *   label=\"Advanced features\"\n *   disabled={true}>\n * </bcm-switch>\n *\n * @example With custom size and label position\n * <bcm-switch\n *   label=\"Dark mode\"\n *   size=\"large\"\n *   labelPosition=\"left\">\n * </bcm-switch>\n */\n@Component({\n  tag: 'bcm-switch',\n  styleUrl: 'switch.css',\n  shadow: true,\n})\nexport class BcmSwitch implements ComponentInterface {\n  /** Reference to the host element */\n  @Element()\n  el: HTMLElement;\n\n  /** Whether the switch is checked or not */\n  @Prop({ reflect: true, mutable: true })\n  checked: boolean = false;\n\n  /** Whether the switch is disabled */\n  @Prop()\n  disabled: boolean = false;\n\n  /** The name attribute for the hidden input element */\n  @Prop()\n  name: string;\n\n  /** The value attribute for the hidden input element */\n  @Prop()\n  value: string;\n\n  /** Text label for the switch */\n  @Prop()\n  label: string;\n\n  /** Position of the label relative to the switch */\n  @Prop()\n  labelPosition: 'left' | 'right' = 'right';\n\n  /** Whether to display the switch in an error state */\n  @Prop()\n  error: boolean = false;\n\n  /** Text to display as an error message when error is true */\n  @Prop()\n  caption?: string;\n\n  /** Size variant of the switch */\n  @Prop()\n  size: 'small' | 'medium' | 'large' = 'medium';\n\n  /** Whether the switch is in readonly mode */\n  @Prop()\n  readonly: boolean = false;\n\n  /** Whether the switch is required in a form */\n  @Prop()\n  required: boolean = false;\n\n  /** Emitted when the switch state changes */\n  @Event({\n    composed: false,\n    bubbles: false,\n    cancelable: true,\n  })\n  bcmSwitchChange: EventEmitter<boolean>;\n\n  private switchId = generateId('switch');\n\n  private toggleSwitch(): void {\n    if (this.disabled || this.readonly) return;\n    this.checked = !this.checked;\n    this.bcmSwitchChange.emit(this.checked);\n  }\n\n  private switchStyle = () => {\n    const defaultStyle = {\n      '--switch-bg': 'var(--bcm-ui-color-background-default-dark-default)',\n      '--switch-bg-hover': 'var(--bcm-ui-color-background-default-dark-hover)',\n      '--switch-dot-bg': 'var(--bcm-ui-color-background-base-default)',\n    };\n\n    const checkedStyle = {\n      '--switch-bg': 'var(--bcm-ui-color-background-info-default)',\n      '--switch-bg-hover': 'var(--bcm-ui-color-background-info-hover)',\n    };\n\n    const errorStyle = {\n      '--switch-bg': 'var(--bcm-ui-color-background-error-default)',\n      '--switch-bg-hover': 'var(--bcm-ui-color-background-error-hover)',\n    };\n\n    const readonlyStyle = {\n      '--switch-bg': 'var(--bcm-ui-color-background-default-dark-default)',\n      '--switch-bg-hover': 'var(--bcm-ui-color-background-default-dark-default)',\n      '--switch-dot-bg': 'var(--bcm-ui-color-background-disabled-default)',\n    };\n\n    const disabledStyle = {\n      '--switch-bg': 'var(--bcm-ui-color-background-disabled-default)',\n      '--switch-bg-hover': 'var(--bcm-ui-color-background-disabled-default)',\n      '--switch-dot-bg': 'var(--bcm-ui-color-background-default-default)',\n    };\n\n    return {\n      ...defaultStyle,\n      ...(this.checked && checkedStyle),\n      ...(this.error && errorStyle),\n      ...(this.readonly && readonlyStyle),\n      ...(this.disabled && disabledStyle),\n    };\n  };\n\n  private switchClass = tv({\n    slots: {\n      base: 'bcm-ui-element flex flex-col',\n      switchWrapper: 'flex items-center group',\n      dotContainer:\n        'relative flex items-center rounded-full cursor-pointer bg-[--switch-bg] group-hover:bg-[--switch-bg-hover] peer-disabled:cursor-not-allowed transition-colors duration-300',\n      dot: 'absolute bg-[--switch-dot-bg] rounded-full shadow-sm transition-all duration-300 ease-in-out peer-disabled:cursor-not-allowed',\n      caption: '!text-color-error font-normal',\n      label: '!text-color font-medium peer-disabled:!text-color-disabled peer-disabled:cursor-not-allowed',\n    },\n    variants: {\n      size: {\n        small: {\n          dotContainer: 'w-8 h-4',\n          dot: 'size-3',\n          label: 'text-size-4',\n          caption: 'text-size-3',\n          switchWrapper: 'gap-2',\n          base: 'gap-0.5',\n        },\n        medium: {\n          dotContainer: 'w-9 h-[18px]',\n          dot: 'size-3.5',\n          label: 'text-size-5',\n          caption: 'text-size-4',\n          switchWrapper: 'gap-2.5',\n          base: 'gap-1',\n        },\n        large: {\n          dotContainer: 'w-10 h-5',\n          dot: 'size-4',\n          label: 'text-size-6',\n          caption: 'text-size-5',\n          switchWrapper: 'gap-3',\n          base: 'gap-2',\n        },\n      },\n      labelPosition: {\n        left: {\n          label: '',\n        },\n        right: {\n          label: 'order-2',\n        },\n      },\n      checked: {\n        true: {\n          dot: '',\n        },\n        false: {\n          dot: 'left-0.5',\n        },\n      },\n      disabled: {\n        true: '',\n        false: {\n          switchWrapper: '',\n        },\n      },\n      readonly: {\n        true: {\n          switchWrapper: 'cursor-default',\n          dotContainer: 'cursor-default',\n          dot: 'cursor-default',\n        },\n        false: {\n          switchWrapper: 'cursor-pointer',\n          dotContainer: 'cursor-pointer hover:bg-[--switch-bg-hover]',\n        },\n      },\n    },\n    compoundVariants: [\n      {\n        size: 'small',\n        checked: true,\n        class: {\n          dot: 'left-[18px]',\n        },\n      },\n      {\n        size: 'medium',\n        checked: true,\n        class: {\n          dot: 'left-[20px]',\n        },\n      },\n      {\n        size: 'large',\n        checked: true,\n        class: {\n          dot: 'left-[22px]',\n        },\n      },\n      {\n        readonly: false,\n        disabled: false,\n        class: {\n          dotContainer: 'peer-focus-visible:ring-2 peer-focus-visible:ring-offset-2 peer-focus-visible:ring-blue-300',\n        },\n      },\n    ],\n  });\n\n  render() {\n    const { base, switchWrapper, label, dot, dotContainer, caption } = this.switchClass({\n      size: this.size,\n      checked: this.checked,\n      disabled: this.disabled,\n      labelPosition: this.labelPosition,\n      readonly: this.readonly,\n    });\n\n    const ariaAttributes = {\n      'role': 'switch',\n      'aria-checked': this.checked.toString(),\n      'aria-disabled': this.disabled.toString(),\n      'aria-readonly': this.readonly.toString(),\n      ...(this.required && { 'aria-required': 'true' }),\n    };\n\n    const tabIndexAttr = !this.readonly && !this.disabled ? { tabindex: '0' } : {};\n\n    return (\n      <div class={base()}>\n        <label class={switchWrapper()} style={this.switchStyle()}>\n          <input\n            id={this.switchId}\n            type=\"checkbox\"\n            class=\"hidden peer\"\n            checked={this.checked}\n            name={this.name}\n            value={this.value}\n            disabled={this.disabled}\n            readOnly={this.readonly}\n            required={this.required}\n            onChange={() => this.toggleSwitch()}\n          />\n\n          {this.label && (\n            <span class={label()}>\n              <slot>{this.label}</slot>\n            </span>\n          )}\n          <label\n            htmlFor={this.switchId}\n            class={dotContainer()}\n            {...tabIndexAttr}\n            {...ariaAttributes}\n            onKeyDown={event => {\n              if ((event.key === 'Enter' || event.key === ' ') && !this.readonly && !this.disabled) {\n                event.preventDefault();\n                this.toggleSwitch();\n              }\n            }}\n          >\n            <div class={dot()}></div>\n          </label>\n        </label>\n\n        {this.error && this.caption && <span class={caption()}>{this.caption}</span>}\n        <slot name=\"caption\"></slot>\n      </div>\n    );\n  }\n}\n"],"mappings":"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","ignoreList":[]}

package/dist/bromcom-ui/p-9a6cec21.entry.js

@@ -1,2 +0,0 @@
-import{r as e,c as t,h as i,F as a,g as o}from"./p-9d0aeb92.js";import{c as r,o as s,f as n,s as c,b as d}from"./p-50133556.js";import{t as l}from"./p-2c58fcb7.js";const h=".absolute{position:absolute}.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}:host{--popover-bg:var(--bcm-ui-color-background-basic-panel);--popover-radius:6px;--popover-text-color:var(--bcm-ui-color-text-basic);display:inline-block}.arrow{background:var(--arrow-color);clip-path:polygon(50% 0,100% 100%,0 100%);position:absolute;z-index:1}.arrow.top{transform:rotate(180deg)}.arrow.bottom{transform:rotate(0deg)}.arrow.right{transform:rotate(-90deg)}.arrow.left{transform:rotate(90deg)}::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}.relative{position:relative}.z-\\[9999\\]{z-index:9999}.mx-auto{margin-left:auto;margin-right:auto}.flex{display:flex}.hidden{display:none}.size-6{height:1.5rem;width:1.5rem}.h-2{height:.5rem}.w-4{width:1rem}.w-full{width:100%}.max-w-64{max-width:16rem}.max-w-80{max-width:20rem}.max-w-96{max-width:24rem}.flex-1{flex:1 1 0%}.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}.justify-between{justify-content:space-between}.gap-2{gap:.5rem}.gap-2\\.5{gap:.625rem}.gap-3{gap:.75rem}.gap-4{gap:1rem}.gap-6{gap:1.5rem}.gap-8{gap:2rem}.text-pretty{text-wrap:pretty}.rounded-\\[--popover-radius\\]{border-radius:var(--popover-radius)}.rounded-full{border-radius:var(--bcm-ui-border-radius-full,9999px)}.bg-\\[--popover-bg\\]{background-color:var(--popover-bg)}.p-4{padding:1rem}.p-6{padding:1.5rem}.p-8{padding: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)}.text-size-inherit{font-size:inherit;line-height:inherit}.font-semibold{font-weight:600}.\\!text-color-header{color:var(--bcm-ui-color-text-header)!important}.text-\\[--text-color\\]{color:var(--text-color)}.shadow{--tw-shadow:var(--bcm-ui-box-shadow-default);--tw-shadow-colored:var(--bcm-ui-box-shadow-default)}.shadow,.shadow-2{box-shadow:var(--tw-ring-offset-shadow,0 0 #0000),var(--tw-ring-shadow,0 0 #0000),var(--tw-shadow)}.shadow-2{--tw-shadow:var(--bcm-ui-box-shadow-2);--tw-shadow-colored:var(--bcm-ui-box-shadow-2)}.outline{outline-style:solid}.hover\\:bg-gray-100:hover{background-color:oklch(.967 .003 264.542)}";const f=h;const m={info:"fa-solid fa-circle-info",success:"fa-solid fa-circle-check",warning:"fa-solid fa-triangle-exclamation",error:"fa-solid fa-circle-x"};const b=class{constructor(i){e(this,i);this.bcmConfirm=t(this,"bcmConfirm",1);this.bcmCancel=t(this,"bcmCancel",1);this.arrowColor="var(--bcm-ui-color-background-basic-panel)";this.cancelText="Cancel";this.confirmText="Yes";this.description="";this.headerText="";this.placement="bottom";this.size="medium";this.status="info";this.statusIcon=true;this.isOpen=false;this.handleTriggerClick=e=>{e.preventDefault();e.stopPropagation();if(!this.isOpen){this.isOpen=true;requestAnimationFrame((()=>{this.updatePosition()}))}};this.handleConfirm=e=>{e.preventDefault();e.stopPropagation();this.isOpen=false;this.bcmConfirm.emit()};this.handleCancel=e=>{e.preventDefault();e.stopPropagation();this.isOpen=false;this.bcmCancel.emit()};this.updatePosition=async()=>{if(!this.triggerElement||!this.popoverElement||!this.arrowElement)return;const{x:e,y:t,placement:i,middlewareData:a}=await r(this.triggerElement,this.popoverElement,{placement:this.placement,middleware:[s(12),n({fallbackPlacements:["top","left","bottom","right"]}),c({padding:8}),d({element:this.arrowElement})]});this.currentPlacement=i;Object.assign(this.popoverElement.style,{left:`${e}px`,top:`${t}px`});const{x:o,y:l}=a.arrow||{x:0,y:0};const h=i.split("-")[0];const f={top:"bottom",right:"left",bottom:"top",left:"right"}[h];Object.assign(this.arrowElement.style,{left:o!=null?`${o}px`:"",top:l!=null?`${l}px`:"",[f]:["top","bottom"].includes(h)?"-8px":"-12px"})};this.classes=l({slots:{container:"absolute bcm-ui-element flex flex-col shadow-2 rounded-[--popover-radius] bg-[--popover-bg] z-[9999] w-full",header:"flex justify-between items-center",headerLeftContent:"flex items-center gap-2 text-size-inherit text-[--text-color]",closeIconArea:"flex flex-row gap-2 size-6 items-center justify-center hover:bg-gray-100 rounded-full cursor-pointer text-size-inherit",titleContainer:"!text-color-header font-semibold",footer:"flex flex-row justify-end gap-2"},variants:{size:{small:{container:"text-size-4 max-w-64 p-4 gap-4",header:"text-size-4",footer:"text-size-4",titleContainer:"text-size-5",headerLeftContent:"gap-2"},medium:{container:"text-size-5 max-w-80 gap-6 p-6",header:"text-size-5",footer:"text-size-5",titleContainer:"text-size-6",headerLeftContent:"gap-2.5"},large:{container:"text-size-6 max-w-96 p-8 gap-8",header:"text-size-6",footer:"text-size-6",titleContainer:"text-size-7",headerLeftContent:"gap-3"}}},defaultVariants:{size:"medium"}})}componentDidLoad(){this.triggerElement=document.getElementById(this.targetId);if(!this.triggerElement){console.warn(`Target element with ID '${this.targetId}' not found.`);return}this.triggerElement.addEventListener("click",this.handleTriggerClick)}async show(){this.isOpen=true;requestAnimationFrame((()=>{this.updatePosition()}))}async hide(){this.isOpen=false}get popoverStyle(){return{"--text-color":`var(--bcm-ui-color-text-${this.status})`,"--arrow-color":this.arrowColor}}disconnectedCallback(){if(this.triggerElement){this.triggerElement.removeEventListener("click",this.handleTriggerClick)}}render(){var e;const{container:t,header:o,footer:r,headerLeftContent:s,closeIconArea:n,titleContainer:c}=this.classes({size:this.size});return i(a,{key:"256bba18a7185df003cf435e9c50bb3faf655bd3"},this.isOpen&&i("div",{key:"8557109b4b7bcd9242cad12e20ffbe2b9abc7cb1",role:"dialog","aria-labelledby":"pop-confirm-title",style:this.popoverStyle,class:t(),ref:e=>this.popoverElement=e},i("div",{key:"5233f27cec248cf1e6f0ee50d0cd7b9302b68de7",ref:e=>this.arrowElement=e,class:`arrow w-4 h-2 ${(e=this.currentPlacement)!==null&&e!==void 0?e:"top"}`}),i("header",{key:"78fc2b3ccada895c52fef483ab8263eedb29cef4",class:o()},i("div",{key:"104d8cc9c1e2256f8be5ea127e22a3114f1c0608",class:s()},this.statusIcon&&i("bcm-icon",{key:"348e431869d73de73d243fe9432fca9f7d5bbe8a","icon-name":m[this.status]}),i("span",{key:"6b197fb03736b8b838e845f3cd9c13db64d2cb30",class:c()},this.headerText),i("slot",{key:"b7a08113f60b290b78223b95de1c897d839b9f2c",name:"header"})),i("div",{key:"c10afd851fcdffbf090f11b53ebccffeb582a1a3",class:n(),onClick:this.handleCancel},i("bcm-icon",{key:"77ec3e916624528f21314dab55f6fdc9cfed6b54","icon-name":"far fa-times"}))),i("main",{key:"714b0c73e0d71f45341fc9e9d2822cf6f6820c1d",class:"flex-1 mx-auto font-sans text-pretty"},i("slot",{key:"43a7c9fe77aec8273bdb9dbd45bdd34f66731d71",name:"body"},this.description)),i("footer",{key:"91020f742b01472c171451bda4d2ce97a30b5b1c",class:r()},i("bcm-button",{key:"f5395add9ad6aa471e0a7285f810892e6d1b04ad",kind:"outline",size:this.size,onClick:this.handleCancel},this.cancelText),i("bcm-button",{key:"0b8c99beb293cf560cf3c47446447194c288773a",size:this.size,status:this.status,kind:"primary",onClick:this.handleConfirm},this.confirmText),i("slot",{key:"f89db0835be4030896da14ab344f77c660061332",name:"footer"}))))}get el(){return o(this)}};b.style=f;export{b as bcm_pop_confirm};
-//# sourceMappingURL=p-9a6cec21.entry.js.map

package/dist/bromcom-ui/p-9a6cec21.entry.js.map

@@ -1 +0,0 @@
-{"version":3,"names":["popConfirmCss","BcmPopConfirmStyle0","statusIcons","info","success","warning","error","PopConfirm","constructor","hostRef","this","arrowColor","cancelText","confirmText","description","headerText","placement","size","status","statusIcon","isOpen","handleTriggerClick","event","preventDefault","stopPropagation","requestAnimationFrame","updatePosition","handleConfirm","bcmConfirm","emit","handleCancel","bcmCancel","async","triggerElement","popoverElement","arrowElement","x","y","middlewareData","computePosition","middleware","offset","flip","fallbackPlacements","shift","padding","arrow","element","currentPlacement","Object","assign","style","left","top","arrowX","arrowY","basePlacement","split","staticSide","right","bottom","includes","classes","tv","slots","container","header","headerLeftContent","closeIconArea","titleContainer","footer","variants","small","medium","large","defaultVariants","componentDidLoad","document","getElementById","targetId","console","warn","addEventListener","show","hide","popoverStyle","disconnectedCallback","removeEventListener","render","h","Fragment","key","role","class","ref","el","_a","name","onClick","kind"],"sources":["src/components/pop-confirm/pop-confirm.css?tag=bcm-pop-confirm&encapsulation=shadow","src/components/pop-confirm/pop-confirm.component.tsx"],"sourcesContent":[":host {\n  display: inline-block;\n  --popover-bg: var(--bcm-ui-color-background-basic-panel);\n  --popover-radius: 6px;\n  --popover-text-color: var(--bcm-ui-color-text-basic);\n}\n\n.arrow {\n  position: absolute;\n  background: var(--arrow-color);\n  clip-path: polygon(50% 0%, 100% 100%, 0% 100%);\n  z-index: 1;\n}\n\n.arrow.top {\n  transform: rotate(180deg);\n}\n\n.arrow.bottom {\n  transform: rotate(0deg);\n}\n\n.arrow.right {\n  transform: rotate(-90deg);\n}\n\n.arrow.left {\n  transform: rotate(90deg);\n}\n\n::slotted([slot='body']) {\n  font-family: 'Inter', sans-serif;\n  text-wrap: pretty;\n}\n","import { Component, Prop, State, h, Event, EventEmitter, Element, ComponentInterface, Fragment, Method } from '@stencil/core';\nimport { computePosition, flip, shift, offset, arrow, type Placement } from '@floating-ui/dom';\nimport { tv } from '@utils/tv';\n\n// Status icons for different states\nconst statusIcons = {\n  info: 'fa-solid fa-circle-info',\n  success: 'fa-solid fa-circle-check',\n  warning: 'fa-solid fa-triangle-exclamation',\n  error: 'fa-solid fa-circle-x',\n};\n\n/**\n * @component BcmPopConfirm\n * @description A floating confirmation pop-up component that prompts users for action confirmation, triggered by click or hover events.\n * Offers customizable header, body content, and footer areas through slots, with accessibility and positioning features.\n *\n * @example Basic usage\n * <bcm-pop-confirm target-id=\"trigger-btn\" placement=\"right\" header-text=\"Confirm Action\" description=\"Are you sure?\" confirm-text=\"Yes\" cancel-text=\"No\" status=\"warning\"></bcm-pop-confirm>\n *\n * @example With all slots and custom styling\n * <bcm-pop-confirm target-id=\"trigger-btn\" placement=\"left\" header-text=\"Delete Item\" description=\"Are you sure you want to delete this item?\" confirm-text=\"Delete\" cancel-text=\"Cancel\" status=\"error\" arrow-color=\"#ffffff\">\n *   <span slot=\"header\">Custom Header Text</span>\n *   <span slot=\"body\">Additional details here</span>\n *   <span slot=\"footer\">Custom Footer Action</span>\n * </bcm-pop-confirm>\n *\n * @example Event handling\n * // Listen to confirmation events\n * const popConfirm = document.querySelector('bcm-pop-confirm');\n * popConfirm.addEventListener('bcmConfirm', () => {\n *   console.log('User confirmed the action!');\n * });\n * popConfirm.addEventListener('bcmCancel', () => {\n *   console.log('User canceled the action!');\n * });\n *\n * // Programmatically control pop-up\n * await popConfirm.show(); // Show the pop-up\n * await popConfirm.hide(); // Hide the pop-up\n *\n * @prop {string} arrowColor - The color of the arrow pointing to the trigger element (default: 'var(--bcm-ui-color-background-basic-panel)')\n * @prop {string} cancelText - Text displayed on the cancel button (default: 'Cancel')\n * @prop {string} confirmText - Text displayed on the confirm button (default: 'Yes')\n * @prop {string} description - The description or body content of the pop-up (default: '')\n * @prop {string} headerText - The header text displayed at the top of the pop-up (default: '')\n * @prop {Placement} placement - The placement position of the pop-up relative to the trigger (default: 'right')\n * @prop {('small' | 'medium' | 'large')} size - The size of the pop-up, determining its dimensions (default: 'medium')\n * @prop {('info' | 'error' | 'warning' | 'success' | 'default')} status - The status of the pop-up, affecting its icon and color (default: 'info')\n * @prop {boolean} statusIcon - Whether to display a status icon based on the `status` prop (default: true)\n * @prop {string} targetId - The ID of the trigger element (e.g., a button) that opens the pop-up\n *\n * @slot header - Custom content for the header area (optional)\n * @slot body - Custom content for the main body area (optional, falls back to `description`)\n * @slot footer - Custom content for the footer area (optional)\n *\n * @event {EventEmitter<void>} bcmConfirm - Emitted when the user confirms the action in the pop-up\n * @event {EventEmitter<void>} bcmCancel - Emitted when the user cancels the action in the pop-up\n *\n * @csspart container - The root container element of the pop-up\n * @csspart header - The header section with title and close icon\n * @csspart content - The main content section of the pop-up\n * @csspart footer - The footer section with confirm/cancel buttons\n * @csspart arrow - The positioning arrow pointing to the trigger\n *\n * @css {string} --popover-radius - Border radius of the pop-up (default: defined in CSS)\n * @css {string} --popover-bg - Background color of the pop-up\n * @css {string} --text-color - Text color of the pop-up based on status\n *\n * @methods\n * show() - Programmatically shows the pop-up\n * hide() - Programmatically hides the pop-up\n */\n@Component({\n  tag: 'bcm-pop-confirm',\n  styleUrl: 'pop-confirm.css',\n  shadow: true,\n})\nexport class PopConfirm implements ComponentInterface {\n  // DOM element reference\n  @Element() el: HTMLElement;\n\n  /**\n   * The color of the arrow pointing to the trigger element.\n   * Can be a CSS custom property or a specific color value.\n   * @default 'var(--bcm-ui-color-background-basic-panel)'\n   */\n  @Prop()\n  arrowColor: string = 'var(--bcm-ui-color-background-basic-panel)'; // Default color\n\n  /**\n   * The text displayed on the cancel button.\n   * @default 'Cancel'\n   */\n  @Prop()\n  cancelText: string = 'Cancel';\n\n  /**\n   * The text displayed on the confirm button.\n   * @default 'Yes'\n   */\n  @Prop()\n  confirmText: string = 'Yes';\n\n  /**\n   * The description or body content of the pop-up.\n   * @default ''\n   */\n  @Prop()\n  description: string = '';\n\n  /**\n   * The header text displayed at the top of the pop-up.\n   * @default ''\n   */\n  @Prop()\n  headerText: string = '';\n\n  /**\n   * The placement position of the pop-up relative to the trigger element.\n   * @default 'bottom'\n   */\n  @Prop()\n  placement: Placement = 'bottom';\n\n  /**\n   * The size of the pop-up, determining its dimensions and padding.\n   * @default 'medium'\n   */\n  @Prop()\n  size: 'small' | 'medium' | 'large' = 'medium';\n\n  /**\n   * The status of the pop-up, affecting its icon and color scheme.\n   * @default 'info'\n   */\n  @Prop()\n  status: 'info' | 'error' | 'warning' | 'success' = 'info';\n\n  /**\n   * Whether to display a status icon based on the `status` prop.\n   * @default true\n   */\n  @Prop()\n  statusIcon: boolean = true;\n\n  /**\n   * The ID of the trigger element (e.g., a button) that opens the pop-up.\n   */\n  @Prop()\n  targetId: string;\n\n  // State variables\n  /**\n   * Indicates whether the pop-up is currently open or closed.\n   * @default false\n   */\n  @State()\n  isOpen: boolean = false;\n\n  /**\n   * The current placement position of the pop-up after computation.\n   */\n  @State()\n  currentPlacement: 'top' | 'bottom' | 'left' | 'right';\n\n  // Event Emitters\n  /**\n   * Emits an event when the user confirms the action in the pop-up.\n   */\n  @Event({\n    composed: false,\n    bubbles: false,\n    cancelable: true,\n  })\n  bcmConfirm: EventEmitter<void>;\n\n  /**\n   * Emits an event when the user cancels the action in the pop-up.\n   */\n  @Event({\n    composed: false,\n    bubbles: false,\n    cancelable: true,\n  })\n  bcmCancel: EventEmitter<void>;\n\n  // Element references\n  private triggerElement: HTMLElement;\n  private popoverElement: HTMLElement;\n  private arrowElement: HTMLElement;\n\n  /**\n   * Lifecycle method called when the component is loaded.\n   * Initializes the trigger element and attaches a click event listener.\n   */\n  componentDidLoad() {\n    this.triggerElement = document.getElementById(this.targetId);\n    if (!this.triggerElement) {\n      console.warn(`Target element with ID '${this.targetId}' not found.`);\n      return;\n    }\n    this.triggerElement.addEventListener('click', this.handleTriggerClick);\n  }\n\n  /**\n   * Handles the click event on the trigger element to open the pop-up.\n   * Prevents default behavior and propagation, then opens the pop-up if it's closed.\n   * @param event The mouse event triggering the action.\n   */\n  private handleTriggerClick = (event: Event) => {\n    event.preventDefault();\n    event.stopPropagation();\n\n    if (!this.isOpen) {\n      this.isOpen = true;\n      requestAnimationFrame(() => {\n        this.updatePosition();\n      });\n    }\n  };\n\n  /**\n   * Handles the confirm button click, closing the pop-up and emitting the confirm event.\n   * Prevents default behavior and propagation.\n   * @param event The mouse event triggering the action.\n   */\n  private handleConfirm = (event: Event) => {\n    event.preventDefault();\n    event.stopPropagation();\n    this.isOpen = false;\n    this.bcmConfirm.emit();\n  };\n\n  /**\n   * Handles the cancel button click, closing the pop-up and emitting the cancel event.\n   * Prevents default behavior and propagation.\n   * @param event The mouse event triggering the action.\n   */\n  private handleCancel = (event: Event) => {\n    event.preventDefault();\n    event.stopPropagation();\n    this.isOpen = false;\n    this.bcmCancel.emit();\n  };\n\n  /**\n   * Programmatically shows the pop-up by setting `isOpen` to true and updating its position.\n   * @returns A promise that resolves when the pop-up is shown.\n   */\n  @Method()\n  async show() {\n    this.isOpen = true;\n    requestAnimationFrame(() => {\n      this.updatePosition();\n    });\n  }\n\n  /**\n   * Programmatically hides the pop-up by setting `isOpen` to false.\n   * @returns A promise that resolves when the pop-up is hidden.\n   */\n  @Method()\n  async hide() {\n    this.isOpen = false;\n  }\n\n  /**\n   * Updates the position of the pop-up relative to the trigger element using Floating UI.\n   * Ensures the pop-up stays within viewport bounds and positions the arrow correctly.\n   */\n  private updatePosition = async () => {\n    if (!this.triggerElement || !this.popoverElement || !this.arrowElement) return;\n\n    const { x, y, placement, middlewareData } = await computePosition(this.triggerElement, this.popoverElement, {\n      placement: this.placement,\n      middleware: [offset(12), flip({ fallbackPlacements: ['top', 'left', 'bottom', 'right'] }), shift({ padding: 8 }), arrow({ element: this.arrowElement })],\n    });\n\n    this.currentPlacement = placement as any;\n\n    Object.assign(this.popoverElement.style, {\n      left: `${x}px`,\n      top: `${y}px`,\n    });\n\n    const { x: arrowX, y: arrowY } = middlewareData.arrow || { x: 0, y: 0 };\n    const basePlacement = placement.split('-')[0] as 'top' | 'right' | 'bottom' | 'left';\n\n    const staticSide = {\n      top: 'bottom',\n      right: 'left',\n      bottom: 'top',\n      left: 'right',\n    }[basePlacement];\n\n    Object.assign(this.arrowElement.style, {\n      left: arrowX != null ? `${arrowX}px` : '',\n      top: arrowY != null ? `${arrowY}px` : '',\n      [staticSide]: ['top', 'bottom'].includes(basePlacement) ? '-8px' : '-12px',\n    });\n  };\n\n  /**\n   * Returns the dynamic styles for the pop-up, including text and arrow colors.\n   * @returns An object containing CSS custom properties.\n   */\n  private get popoverStyle() {\n    return {\n      '--text-color': `var(--bcm-ui-color-text-${this.status})`,\n      '--arrow-color': this.arrowColor,\n    };\n  }\n\n  /**\n   * Lifecycle method called when the component is removed from the DOM.\n   * Cleans up the event listener to prevent memory leaks.\n   */\n  disconnectedCallback() {\n    if (this.triggerElement) {\n      this.triggerElement.removeEventListener('click', this.handleTriggerClick);\n    }\n  }\n\n  /**\n   * Defines Tailwind Variants classes for the pop-up's structure and styling.\n   * Supports different sizes and generates dynamic class names.\n   */\n  private classes = tv({\n    slots: {\n      container: 'absolute bcm-ui-element flex flex-col shadow-2 rounded-[--popover-radius] bg-[--popover-bg] z-[9999] w-full',\n      header: 'flex justify-between items-center',\n      headerLeftContent: 'flex items-center gap-2 text-size-inherit text-[--text-color]',\n      closeIconArea: 'flex flex-row gap-2 size-6 items-center justify-center hover:bg-gray-100 rounded-full cursor-pointer text-size-inherit',\n      titleContainer: '!text-color-header font-semibold',\n      footer: 'flex flex-row justify-end gap-2',\n    },\n    variants: {\n      size: {\n        small: {\n          container: 'text-size-4 max-w-64 p-4 gap-4',\n          header: 'text-size-4',\n          footer: 'text-size-4',\n          titleContainer: 'text-size-5',\n          headerLeftContent: 'gap-2',\n        },\n        medium: {\n          container: 'text-size-5 max-w-80 gap-6 p-6',\n          header: 'text-size-5',\n          footer: 'text-size-5',\n          titleContainer: 'text-size-6',\n          headerLeftContent: 'gap-2.5',\n        },\n        large: {\n          container: 'text-size-6 max-w-96 p-8 gap-8',\n          header: 'text-size-6',\n          footer: 'text-size-6',\n          titleContainer: 'text-size-7',\n          headerLeftContent: 'gap-3',\n        },\n      },\n    },\n    defaultVariants: {\n      size: 'medium',\n    },\n  });\n\n  /**\n   * Renders the pop-up component, showing it only when `isOpen` is true.\n   * Includes header, main content, and footer sections with dynamic styling and slots for customization.\n   * @returns JSX.Element representing the pop-up or an empty fragment if closed.\n   */\n  render() {\n    const { container, header, footer, headerLeftContent, closeIconArea, titleContainer } = this.classes({\n      size: this.size,\n    });\n    return (\n      <Fragment>\n        {this.isOpen && (\n          <div role=\"dialog\" aria-labelledby=\"pop-confirm-title\" style={this.popoverStyle} class={container()} ref={el => (this.popoverElement = el)}>\n            {/* Arrow */}\n            <div ref={el => (this.arrowElement = el)} class={`arrow w-4 h-2 ${this.currentPlacement ?? 'top'}`}></div>\n\n            {/* Header Content */}\n            <header class={header()}>\n              <div class={headerLeftContent()}>\n                {this.statusIcon && <bcm-icon icon-name={statusIcons[this.status]}></bcm-icon>}\n                <span class={titleContainer()}>{this.headerText}</span>\n                <slot name=\"header\"></slot>\n              </div>\n              <div class={closeIconArea()} onClick={this.handleCancel}>\n                <bcm-icon icon-name=\"far fa-times\"></bcm-icon>\n              </div>\n            </header>\n\n            {/* Main Content */}\n            <main class=\"flex-1 mx-auto font-sans text-pretty\">\n              <slot name=\"body\">{this.description}</slot>\n            </main>\n\n            {/* Footer Content */}\n            <footer class={footer()}>\n              <bcm-button kind=\"outline\" size={this.size} onClick={this.handleCancel}>\n                {this.cancelText}\n              </bcm-button>\n              <bcm-button size={this.size} status={this.status} kind=\"primary\" onClick={this.handleConfirm}>\n                {this.confirmText}\n              </bcm-button>\n              <slot name=\"footer\"></slot>\n            </footer>\n          </div>\n        )}\n      </Fragment>\n    );\n  }\n}\n"],"mappings":"oKAAA,MAAMA,EAAgB,snGACtB,MAAAC,EAAeD,ECIf,MAAME,EAAc,CAClBC,KAAM,0BACNC,QAAS,2BACTC,QAAS,mCACTC,MAAO,wB,MAqEIC,EAAU,MALvB,WAAAC,CAAAC,G,sFAeEC,KAAAC,WAAqB,6CAOrBD,KAAAE,WAAqB,SAOrBF,KAAAG,YAAsB,MAOtBH,KAAAI,YAAsB,GAOtBJ,KAAAK,WAAqB,GAOrBL,KAAAM,UAAuB,SAOvBN,KAAAO,KAAqC,SAOrCP,KAAAQ,OAAmD,OAOnDR,KAAAS,WAAsB,KActBT,KAAAU,OAAkB,MAoDVV,KAAAW,mBAAsBC,IAC5BA,EAAMC,iBACND,EAAME,kBAEN,IAAKd,KAAKU,OAAQ,CAChBV,KAAKU,OAAS,KACdK,uBAAsB,KACpBf,KAAKgB,gBAAgB,G,GAUnBhB,KAAAiB,cAAiBL,IACvBA,EAAMC,iBACND,EAAME,kBACNd,KAAKU,OAAS,MACdV,KAAKkB,WAAWC,MAAM,EAQhBnB,KAAAoB,aAAgBR,IACtBA,EAAMC,iBACND,EAAME,kBACNd,KAAKU,OAAS,MACdV,KAAKqB,UAAUF,MAAM,EA4BfnB,KAAAgB,eAAiBM,UACvB,IAAKtB,KAAKuB,iBAAmBvB,KAAKwB,iBAAmBxB,KAAKyB,aAAc,OAExE,MAAMC,EAAEA,EAACC,EAAEA,EAACrB,UAAEA,EAASsB,eAAEA,SAAyBC,EAAgB7B,KAAKuB,eAAgBvB,KAAKwB,eAAgB,CAC1GlB,UAAWN,KAAKM,UAChBwB,WAAY,CAACC,EAAO,IAAKC,EAAK,CAAEC,mBAAoB,CAAC,MAAO,OAAQ,SAAU,WAAaC,EAAM,CAAEC,QAAS,IAAMC,EAAM,CAAEC,QAASrC,KAAKyB,kBAG1IzB,KAAKsC,iBAAmBhC,EAExBiC,OAAOC,OAAOxC,KAAKwB,eAAeiB,MAAO,CACvCC,KAAM,GAAGhB,MACTiB,IAAK,GAAGhB,QAGV,MAAQD,EAAGkB,EAAQjB,EAAGkB,GAAWjB,EAAeQ,OAAS,CAAEV,EAAG,EAAGC,EAAG,GACpE,MAAMmB,EAAgBxC,EAAUyC,MAAM,KAAK,GAE3C,MAAMC,EAAa,CACjBL,IAAK,SACLM,MAAO,OACPC,OAAQ,MACRR,KAAM,SACNI,GAEFP,OAAOC,OAAOxC,KAAKyB,aAAagB,MAAO,CACrCC,KAAME,GAAU,KAAO,GAAGA,MAAa,GACvCD,IAAKE,GAAU,KAAO,GAAGA,MAAa,GACtCG,CAACA,GAAa,CAAC,MAAO,UAAUG,SAASL,GAAiB,OAAS,SACnE,EA4BI9C,KAAAoD,QAAUC,EAAG,CACnBC,MAAO,CACLC,UAAW,8GACXC,OAAQ,oCACRC,kBAAmB,gEACnBC,cAAe,yHACfC,eAAgB,mCAChBC,OAAQ,mCAEVC,SAAU,CACRtD,KAAM,CACJuD,MAAO,CACLP,UAAW,iCACXC,OAAQ,cACRI,OAAQ,cACRD,eAAgB,cAChBF,kBAAmB,SAErBM,OAAQ,CACNR,UAAW,iCACXC,OAAQ,cACRI,OAAQ,cACRD,eAAgB,cAChBF,kBAAmB,WAErBO,MAAO,CACLT,UAAW,iCACXC,OAAQ,cACRI,OAAQ,cACRD,eAAgB,cAChBF,kBAAmB,WAIzBQ,gBAAiB,CACf1D,KAAM,W,CAvKV,gBAAA2D,GACElE,KAAKuB,eAAiB4C,SAASC,eAAepE,KAAKqE,UACnD,IAAKrE,KAAKuB,eAAgB,CACxB+C,QAAQC,KAAK,2BAA2BvE,KAAKqE,wBAC7C,M,CAEFrE,KAAKuB,eAAeiD,iBAAiB,QAASxE,KAAKW,mB,CAiDrD,UAAM8D,GACJzE,KAAKU,OAAS,KACdK,uBAAsB,KACpBf,KAAKgB,gBAAgB,G,CASzB,UAAM0D,GACJ1E,KAAKU,OAAS,K,CA2ChB,gBAAYiE,GACV,MAAO,CACL,eAAgB,2BAA2B3E,KAAKQ,UAChD,gBAAiBR,KAAKC,W,CAQ1B,oBAAA2E,GACE,GAAI5E,KAAKuB,eAAgB,CACvBvB,KAAKuB,eAAesD,oBAAoB,QAAS7E,KAAKW,mB,EAoD1D,MAAAmE,G,MACE,MAAMvB,UAAEA,EAASC,OAAEA,EAAMI,OAAEA,EAAMH,kBAAEA,EAAiBC,cAAEA,EAAaC,eAAEA,GAAmB3D,KAAKoD,QAAQ,CACnG7C,KAAMP,KAAKO,OAEb,OACEwE,EAACC,EAAQ,CAAAC,IAAA,4CACNjF,KAAKU,QACJqE,EAAA,OAAAE,IAAA,2CAAKC,KAAK,SAAQ,kBAAiB,oBAAoBzC,MAAOzC,KAAK2E,aAAcQ,MAAO5B,IAAa6B,IAAKC,GAAOrF,KAAKwB,eAAiB6D,GAErIN,EAAA,OAAAE,IAAA,2CAAKG,IAAKC,GAAOrF,KAAKyB,aAAe4D,EAAKF,MAAO,kBAAiBG,EAAAtF,KAAKsC,oBAAgB,MAAAgD,SAAA,EAAAA,EAAI,UAG3FP,EAAA,UAAAE,IAAA,2CAAQE,MAAO3B,KACbuB,EAAA,OAAAE,IAAA,2CAAKE,MAAO1B,KACTzD,KAAKS,YAAcsE,EAAA,YAAAE,IAAA,uDAAqBzF,EAAYQ,KAAKQ,UAC1DuE,EAAA,QAAAE,IAAA,2CAAME,MAAOxB,KAAmB3D,KAAKK,YACrC0E,EAAA,QAAAE,IAAA,2CAAMM,KAAK,YAEbR,EAAA,OAAAE,IAAA,2CAAKE,MAAOzB,IAAiB8B,QAASxF,KAAKoB,cACzC2D,EAAA,YAAAE,IAAA,uDAAoB,mBAKxBF,EAAA,QAAAE,IAAA,2CAAME,MAAM,wCACVJ,EAAA,QAAAE,IAAA,2CAAMM,KAAK,QAAQvF,KAAKI,cAI1B2E,EAAA,UAAAE,IAAA,2CAAQE,MAAOvB,KACbmB,EAAA,cAAAE,IAAA,2CAAYQ,KAAK,UAAUlF,KAAMP,KAAKO,KAAMiF,QAASxF,KAAKoB,cACvDpB,KAAKE,YAER6E,EAAA,cAAAE,IAAA,2CAAY1E,KAAMP,KAAKO,KAAMC,OAAQR,KAAKQ,OAAQiF,KAAK,UAAUD,QAASxF,KAAKiB,eAC5EjB,KAAKG,aAER4E,EAAA,QAAAE,IAAA,2CAAMM,KAAK,a","ignoreList":[]}

package/dist/bromcom-ui/p-9d0aeb92.js

@@ -1,3 +0,0 @@
-const e="bromcom-ui";const t={allRenderFn:true,appendChildSlotFix:false,asyncLoading:true,asyncQueue:false,attachStyles:true,cloneNodeFix:false,cmpDidLoad:true,cmpDidRender:false,cmpDidUnload:false,cmpDidUpdate:true,cmpShouldUpdate:false,cmpWillLoad:true,cmpWillRender:false,cmpWillUpdate:false,connectedCallback:true,constructableCSS:true,cssAnnotations:true,devTools:false,disconnectedCallback:true,element:false,event:true,experimentalScopedSlotChanges:false,experimentalSlotFixes:false,formAssociated:false,hasRenderFn:true,hostListener:true,hostListenerTarget:true,hostListenerTargetBody:false,hostListenerTargetDocument:false,hostListenerTargetParent:false,hostListenerTargetWindow:true,hotModuleReplacement:false,hydrateClientSide:false,hydrateServerSide:false,hydratedAttribute:false,hydratedClass:true,hydratedSelectorName:"hydrated",initializeNextTick:false,invisiblePrehydration:true,isDebug:false,isDev:false,isTesting:false,lazyLoad:true,lifecycle:true,lifecycleDOMEvents:false,member:true,method:true,mode:false,modernPropertyDecls:false,observeAttribute:true,profile:false,prop:true,propBoolean:true,propMutable:true,propNumber:true,propString:true,reflect:true,scoped:false,scopedSlotTextContentFix:false,scriptDataOpts:false,shadowDelegatesFocus:false,shadowDom:true,slot:true,slotChildNodesFix:false,slotRelocation:true,state:true,style:true,svg:false,taskQueue:true,transformTagName:false,updatable:true,vdomAttribute:true,vdomClass:true,vdomFunctional:true,vdomKey:true,vdomListener:true,vdomPropOrAttr:true,vdomRef:true,vdomRender:true,vdomStyle:true,vdomText:true,vdomXlink:true,watchCallback:true};var n=Object.defineProperty;var r=(e,t)=>{for(var r in t)n(e,r,{get:t[r],enumerable:true})};var l=new WeakMap;var s=e=>l.get(e);var i=(e,t)=>{l.set(t.t=e,t)};var o=(e,t)=>{const n={l:0,$hostElement$:e,i:t,o:new Map};{n.u=new Promise((e=>n.v=e))}{n.h=new Promise((e=>n.p=e));e["s-p"]=[];e["s-rc"]=[]}const r=l.set(e,n);return r};var a=(e,t)=>t in e;var f=(e,t)=>(0,console.error)(e,t);var c=new Map;var u=(e,t,n)=>{const r=e.m.replace(/-/g,"_");const l=e.S;if(!l){return void 0}const s=c.get(l);if(s){return s[r]}
-/*!__STENCIL_STATIC_IMPORT_SWITCH__*/return import(`./${l}.entry.js${""}`).then((e=>{{c.set(l,e)}return e[r]}),(e=>{f(e,t.$hostElement$)}))};var v=new Map;var d="sty-id";var h="{visibility:hidden}.hydrated{visibility:inherit}";var p="slot-fb{display:contents}slot-fb[hidden]{display:none}";var m="http://www.w3.org/1999/xlink";var y=typeof window!=="undefined"?window:{};var b=y.document||{head:{}};var w={l:0,$:"",jmp:e=>e(),raf:e=>requestAnimationFrame(e),ael:(e,t,n,r)=>e.addEventListener(t,n,r),rel:(e,t,n,r)=>e.removeEventListener(t,n,r),ce:(e,t)=>new CustomEvent(e,t)};var S=(()=>{let e=false;try{b.addEventListener("e",null,Object.defineProperty({},"passive",{get(){e=true}}))}catch(e){}return e})();var $=e=>Promise.resolve(e);var g=(()=>{try{new CSSStyleSheet;return typeof(new CSSStyleSheet).replaceSync==="function"}catch(e){}return false})();var k=false;var C=[];var O=[];var j=(e,t)=>n=>{e.push(n);if(!k){k=true;if(t&&w.l&4){L(T)}else{w.raf(T)}}};var x=e=>{for(let t=0;t<e.length;t++){try{e[t](performance.now())}catch(e){f(e)}}e.length=0};var T=()=>{x(C);{x(O);if(k=C.length>0){w.raf(T)}}};var L=e=>$().then(e);var D=j(O,true);var F=e=>{e=typeof e;return e==="object"||e==="function"};function E(e){var t,n,r;return(r=(n=(t=e.head)==null?void 0:t.querySelector('meta[name="csp-nonce"]'))==null?void 0:n.getAttribute("content"))!=null?r:void 0}var R={};r(R,{err:()=>A,map:()=>P,ok:()=>M,unwrap:()=>N,unwrapErr:()=>U});var M=e=>({isOk:true,isErr:false,value:e});var A=e=>({isOk:false,isErr:true,value:e});function P(e,t){if(e.isOk){const n=t(e.value);if(n instanceof Promise){return n.then((e=>M(e)))}else{return M(n)}}if(e.isErr){const t=e.value;return A(t)}throw"should never get here"}var N=e=>{if(e.isOk){return e.value}else{throw e.value}};var U=e=>{if(e.isErr){return e.value}else{throw e.value}};var W=e=>{const t=e.__childNodes||e.childNodes;if(e.tagName&&e.tagName.includes("-")&&e["s-cr"]&&e.tagName!=="SLOT-FB"){B(t,e.tagName).forEach((e=>{var t;if(e.nodeType===1&&e.tagName==="SLOT-FB"){if((t=H(e,e["s-sn"],false))==null?void 0:t.length){e.hidden=true}else{e.hidden=false}}}))}for(const e of t){if(e.nodeType===1&&(e.__childNodes||e.childNodes).length){W(e)}}};function B(e,t,n){let r=0;let l=[];let s;for(;r<e.length;r++){s=e[r];if(s["s-sr"]&&s["s-hn"]===t&&(n===void 0||s["s-sn"]===n)){l.push(s);if(typeof n!=="undefined")return l}l=[...l,...B(s.childNodes,t,n)]}return l}var H=(e,t,n=true)=>{const r=[];if(n&&e["s-sr"]||!e["s-sr"])r.push(e);while((e=e.nextSibling)&&e["s-sn"]===t){r.push(e)}return r};var z=(e,t)=>{if(e.nodeType===1){if(e.getAttribute("slot")===null&&t===""){return true}if(e.getAttribute("slot")===t){return true}return false}if(e["s-sn"]===t){return true}return t===""};var Q=(e,t="")=>{{return()=>{}}};var V=(e,t)=>{{return()=>{}}};var q=(e,t,...n)=>{let r=null;let l=null;let s=null;let i=false;let o=false;const a=[];const f=t=>{for(let n=0;n<t.length;n++){r=t[n];if(Array.isArray(r)){f(r)}else if(r!=null&&typeof r!=="boolean"){if(i=typeof e!=="function"&&!F(r)){r=String(r)}if(i&&o){a[a.length-1].k+=r}else{a.push(i?G(null,r):r)}o=i}}};f(n);if(t){if(t.key){l=t.key}if(t.name){s=t.name}{const e=t.className||t.class;if(e){t.class=typeof e!=="object"?e:Object.keys(e).filter((t=>e[t])).join(" ")}}}if(typeof e==="function"){return e(t===null?{}:t,a,X)}const c=G(e,null);c.C=t;if(a.length>0){c.O=a}{c.j=l}{c.T=s}return c};var G=(e,t)=>{const n={l:0,L:e,k:t,D:null,O:null};{n.C=null}{n.j=null}{n.T=null}return n};var I={};var K=e=>e&&e.L===I;var X={forEach:(e,t)=>e.map(_).forEach(t),map:(e,t)=>e.map(_).map(t).map(J)};var _=e=>({vattrs:e.C,vchildren:e.O,vkey:e.j,vname:e.T,vtag:e.L,vtext:e.k});var J=e=>{if(typeof e.vtag==="function"){const t={...e.vattrs};if(e.vkey){t.key=e.vkey}if(e.vname){t.name=e.vname}return q(e.vtag,t,...e.vchildren||[])}const t=G(e.vtag,e.vtext);t.C=e.vattrs;t.O=e.vchildren;t.j=e.vkey;t.T=e.vname;return t};var Y=(e,t)=>{if(e!=null&&!F(e)){if(t&4){return e==="false"?false:e===""||!!e}if(t&2){return parseFloat(e)}if(t&1){return String(e)}return e}return e};var Z=e=>s(e).$hostElement$;var ee=(e,t,n)=>{const r=Z(e);return{emit:e=>te(r,t,{bubbles:!!(n&4),composed:!!(n&2),cancelable:!!(n&1),detail:e})}};var te=(e,t,n)=>{const r=w.ce(t,n);e.dispatchEvent(r);return r};var ne=new WeakMap;var re=(e,t,n)=>{let r=v.get(e);if(g&&n){r=r||new CSSStyleSheet;if(typeof r==="string"){r=t}else{r.replaceSync(t)}}else{r=t}v.set(e,r)};var le=(e,t,n)=>{var r;const l=ie(t);const s=v.get(l);e=e.nodeType===11?e:b;if(s){if(typeof s==="string"){e=e.head||e;let n=ne.get(e);let i;if(!n){ne.set(e,n=new Set)}if(!n.has(l)){{i=document.querySelector(`[${d}="${l}"]`)||b.createElement("style");i.innerHTML=s;const n=(r=w.F)!=null?r:E(b);if(n!=null){i.setAttribute("nonce",n)}if(!(t.l&1)){if(e.nodeName==="HEAD"){const t=e.querySelectorAll("link[rel=preconnect]");const n=t.length>0?t[t.length-1].nextSibling:e.querySelector("style");e.insertBefore(i,(n==null?void 0:n.parentNode)===e?n:null)}else if("host"in e){if(g){const t=new CSSStyleSheet;t.replaceSync(s);e.adoptedStyleSheets=[t,...e.adoptedStyleSheets]}else{const t=e.querySelector("style");if(t){t.innerHTML=s+t.innerHTML}else{e.prepend(i)}}}else{e.append(i)}}if(t.l&1&&e.nodeName!=="HEAD"){e.insertBefore(i,null)}}if(t.l&4){i.innerHTML+=p}if(n){n.add(l)}}}else if(!e.adoptedStyleSheets.includes(s)){e.adoptedStyleSheets=[...e.adoptedStyleSheets,s]}}return l};var se=e=>{const t=e.i;const n=e.$hostElement$;const r=t.l;const l=Q("attachStyles",t.m);const s=le(n.shadowRoot?n.shadowRoot:n.getRootNode(),t);if(r&10&&r&2){n["s-sc"]=s;n.classList.add(s+"-h")}l()};var ie=(e,t)=>"sc-"+e.m;var oe=(e,t,n,r,l,s,i)=>{if(n!==r){let i=a(e,t);let o=t.toLowerCase();if(t==="class"){const t=e.classList;const l=fe(n);let s=fe(r);{t.remove(...l.filter((e=>e&&!s.includes(e))));t.add(...s.filter((e=>e&&!l.includes(e))))}}else if(t==="style"){{for(const t in n){if(!r||r[t]==null){if(t.includes("-")){e.style.removeProperty(t)}else{e.style[t]=""}}}}for(const t in r){if(!n||r[t]!==n[t]){if(t.includes("-")){e.style.setProperty(t,r[t])}else{e.style[t]=r[t]}}}}else if(t==="key");else if(t==="ref"){if(r){r(e)}}else if(!i&&t[0]==="o"&&t[1]==="n"){if(t[2]==="-"){t=t.slice(3)}else if(a(y,o)){t=o.slice(2)}else{t=o[2]+t.slice(3)}if(n||r){const l=t.endsWith(ce);t=t.replace(ue,"");if(n){w.rel(e,t,n,l)}if(r){w.ael(e,t,r,l)}}}else{const a=F(r);if((i||a&&r!==null)&&!l){try{if(!e.tagName.includes("-")){const l=r==null?"":r;if(t==="list"){i=false}else if(n==null||e[t]!=l){if(typeof e.__lookupSetter__(t)==="function"){e[t]=l}else{e.setAttribute(t,l)}}}else if(e[t]!==r){e[t]=r}}catch(e){}}let f=false;{if(o!==(o=o.replace(/^xlink\:?/,""))){t=o;f=true}}if(r==null||r===false){if(r!==false||e.getAttribute(t)===""){if(f){e.removeAttributeNS(m,t)}else{e.removeAttribute(t)}}}else if((!i||s&4||l)&&!a){r=r===true?"":r;if(f){e.setAttributeNS(m,t,r)}else{e.setAttribute(t,r)}}}}};var ae=/\s/;var fe=e=>{if(typeof e==="object"&&e&&"baseVal"in e){e=e.baseVal}if(!e||typeof e!=="string"){return[]}return e.split(ae)};var ce="Capture";var ue=new RegExp(ce+"$");var ve=(e,t,n,r)=>{const l=t.D.nodeType===11&&t.D.host?t.D.host:t.D;const s=e&&e.C||{};const i=t.C||{};{for(const e of de(Object.keys(s))){if(!(e in i)){oe(l,e,s[e],void 0,n,t.l)}}}for(const e of de(Object.keys(i))){oe(l,e,s[e],i[e],n,t.l)}};function de(e){return e.includes("ref")?[...e.filter((e=>e!=="ref")),"ref"]:e}var he;var pe;var me=false;var ye=false;var be=false;var we=false;var Se=(e,n,r)=>{var l;const s=n.O[r];let i=0;let o;let a;let f;if(!me){be=true;if(s.L==="slot"){s.l|=s.O?2:1}}if(s.k!==null){o=s.D=b.createTextNode(s.k)}else if(s.l&1){o=s.D=b.createTextNode("")}else{o=s.D=b.createElement(!me&&t.slotRelocation&&s.l&2?"slot-fb":s.L);{ve(null,s,we)}if(s.O){for(i=0;i<s.O.length;++i){a=Se(e,s,i);if(a){o.appendChild(a)}}}}o["s-hn"]=pe;{if(s.l&(2|1)){o["s-sr"]=true;o["s-cr"]=he;o["s-sn"]=s.T||"";o["s-rf"]=(l=s.C)==null?void 0:l.ref;f=e&&e.O&&e.O[r];if(f&&f.L===s.L&&e.D){{$e(e.D,false)}}}}return o};var $e=(e,n)=>{w.l|=1;const r=Array.from(e.__childNodes||e.childNodes);if(e["s-sr"]&&t.experimentalSlotFixes){let t=e;while(t=t.nextSibling){if(t&&t["s-sn"]===e["s-sn"]&&t["s-sh"]===pe){r.push(t)}}}for(let e=r.length-1;e>=0;e--){const t=r[e];if(t["s-hn"]!==pe&&t["s-ol"]){Fe(je(t).parentNode,t,je(t));t["s-ol"].remove();t["s-ol"]=void 0;t["s-sh"]=void 0;be=true}if(n){$e(t,n)}}w.l&=~1};var ge=(e,t,n,r,l,s)=>{let i=e["s-cr"]&&e["s-cr"].parentNode||e;let o;if(i.shadowRoot&&i.tagName===pe){i=i.shadowRoot}for(;l<=s;++l){if(r[l]){o=Se(null,n,l);if(o){r[l].D=o;Fe(i,o,je(t))}}}};var ke=(e,t,n)=>{for(let r=t;r<=n;++r){const t=e[r];if(t){const e=t.D;De(t);if(e){{ye=true;if(e["s-ol"]){e["s-ol"].remove()}else{$e(e,true)}}e.remove()}}}};var Ce=(e,t,n,r,l=false)=>{let s=0;let i=0;let o=0;let a=0;let f=t.length-1;let c=t[0];let u=t[f];let v=r.length-1;let d=r[0];let h=r[v];let p;let m;while(s<=f&&i<=v){if(c==null){c=t[++s]}else if(u==null){u=t[--f]}else if(d==null){d=r[++i]}else if(h==null){h=r[--v]}else if(Oe(c,d,l)){xe(c,d,l);c=t[++s];d=r[++i]}else if(Oe(u,h,l)){xe(u,h,l);u=t[--f];h=r[--v]}else if(Oe(c,h,l)){if(c.L==="slot"||h.L==="slot"){$e(c.D.parentNode,false)}xe(c,h,l);Fe(e,c.D,u.D.nextSibling);c=t[++s];h=r[--v]}else if(Oe(u,d,l)){if(c.L==="slot"||h.L==="slot"){$e(u.D.parentNode,false)}xe(u,d,l);Fe(e,u.D,c.D);u=t[--f];d=r[++i]}else{o=-1;{for(a=s;a<=f;++a){if(t[a]&&t[a].j!==null&&t[a].j===d.j){o=a;break}}}if(o>=0){m=t[o];if(m.L!==d.L){p=Se(t&&t[i],n,o)}else{xe(m,d,l);t[o]=void 0;p=m.D}d=r[++i]}else{p=Se(t&&t[i],n,i);d=r[++i]}if(p){{Fe(je(c.D).parentNode,p,je(c.D))}}}}if(s>f){ge(e,r[v+1]==null?null:r[v+1].D,n,r,i,v)}else if(i>v){ke(t,s,f)}};var Oe=(e,t,n=false)=>{if(e.L===t.L){if(e.L==="slot"){return e.T===t.T}if(!n){return e.j===t.j}if(n&&!e.j&&t.j){e.j=t.j}return true}return false};var je=e=>e&&e["s-ol"]||e;var xe=(e,n,r=false)=>{const l=n.D=e.D;const s=e.O;const i=n.O;const o=n.L;const a=n.k;let f;if(a===null){{if(o==="slot"&&!me);else{ve(e,n,we)}}if(s!==null&&i!==null){Ce(l,s,n,i,r)}else if(i!==null){if(e.k!==null){l.textContent=""}ge(l,null,n,i,0,i.length-1)}else if(!r&&t.updatable&&s!==null){ke(s,0,s.length-1)}}else if(f=l["s-cr"]){f.parentNode.textContent=a}else if(e.k!==a){l.data=a}};var Te=[];var Le=e=>{let n;let r;let l;const s=e.__childNodes||e.childNodes;for(const e of s){if(e["s-sr"]&&(n=e["s-cr"])&&n.parentNode){r=n.parentNode.__childNodes||n.parentNode.childNodes;const s=e["s-sn"];for(l=r.length-1;l>=0;l--){n=r[l];if(!n["s-cn"]&&!n["s-nr"]&&n["s-hn"]!==e["s-hn"]&&!t.experimentalSlotFixes){if(z(n,s)){let t=Te.find((e=>e.R===n));ye=true;n["s-sn"]=n["s-sn"]||s;if(t){t.R["s-sh"]=e["s-hn"];t.M=e}else{n["s-sh"]=e["s-hn"];Te.push({M:e,R:n})}if(n["s-sr"]){Te.map((e=>{if(z(e.R,n["s-sn"])){t=Te.find((e=>e.R===n));if(t&&!e.M){e.M=t.M}}}))}}else if(!Te.some((e=>e.R===n))){Te.push({R:n})}}}}if(e.nodeType===1){Le(e)}}};var De=e=>{{e.C&&e.C.ref&&e.C.ref(null);e.O&&e.O.map(De)}};var Fe=(e,t,n)=>{{return e==null?void 0:e.insertBefore(t,n)}};var Ee=(e,t,n=false)=>{var r,l,s,i;const o=e.$hostElement$;const a=e.i;const f=e.A||G(null,null);const c=K(t)?t:q(null,null,t);pe=o.tagName;if(a.P){c.C=c.C||{};a.P.map((([e,t])=>c.C[t]=o[e]))}if(n&&c.C){for(const e of Object.keys(c.C)){if(o.hasAttribute(e)&&!["key","ref","style","class"].includes(e)){c.C[e]=o[e]}}}c.L=null;c.l|=4;e.A=c;c.D=f.D=o.shadowRoot||o;me=(a.l&1)!==0;{he=o["s-cr"];ye=false}xe(f,c,n);{w.l|=1;if(be){Le(c.D);for(const e of Te){const t=e.R;if(!t["s-ol"]){const e=b.createTextNode("");e["s-nr"]=t;Fe(t.parentNode,t["s-ol"]=e,t)}}for(const e of Te){const t=e.R;const o=e.M;if(o){const e=o.parentNode;let n=o.nextSibling;{let s=(r=t["s-ol"])==null?void 0:r.previousSibling;while(s){let r=(l=s["s-nr"])!=null?l:null;if(r&&r["s-sn"]===t["s-sn"]&&e===(r.__parentNode||r.parentNode)){r=r.nextSibling;while(r===t||(r==null?void 0:r["s-sr"])){r=r==null?void 0:r.nextSibling}if(!r||!r["s-nr"]){n=r;break}}s=s.previousSibling}}const i=t.__parentNode||t.parentNode;const a=t.__nextSibling||t.nextSibling;if(!n&&e!==i||a!==n){if(t!==n){if(!t["s-hn"]&&t["s-ol"]){t["s-hn"]=t["s-ol"].parentNode.nodeName}Fe(e,t,n);if(t.nodeType===1&&t.tagName!=="SLOT-FB"){t.hidden=(s=t["s-ih"])!=null?s:false}}}t&&typeof o["s-rf"]==="function"&&o["s-rf"](t)}else{if(t.nodeType===1){if(n){t["s-ih"]=(i=t.hidden)!=null?i:false}t.hidden=true}}}}if(ye){W(c.D)}w.l&=~1;Te.length=0}he=void 0};var Re=(e,t)=>{if(t&&!e.N&&t["s-p"]){const n=t["s-p"].push(new Promise((r=>e.N=()=>{t["s-p"].splice(n-1,1);r()})))}};var Me=(e,t)=>{{e.l|=16}if(e.l&4){e.l|=512;return}Re(e,e.U);const n=()=>Ae(e,t);return D(n)};var Ae=(e,t)=>{const n=e.$hostElement$;const r=Q("scheduleUpdate",e.i.m);const l=e.t;if(!l){throw new Error(`Can't render component <${n.tagName.toLowerCase()} /> with invalid Stencil runtime! Make sure this imported component is compiled with a \`externalRuntime: true\` flag. For more information, please refer to https://stenciljs.com/docs/custom-elements#externalruntime`)}let s;if(t){{e.l|=256;if(e.W){e.W.map((([e,t])=>ze(l,e,t,n)));e.W=void 0}}{s=ze(l,"componentWillLoad",void 0,n)}}r();return Pe(s,(()=>Ue(e,l,t)))};var Pe=(e,t)=>Ne(e)?e.then(t).catch((e=>{console.error(e);t()})):t();var Ne=e=>e instanceof Promise||e&&e.then&&typeof e.then==="function";var Ue=async(e,t,n)=>{var r;const l=e.$hostElement$;const s=Q("update",e.i.m);const i=l["s-rc"];if(n){se(e)}const o=Q("render",e.i.m);{We(e,t,l,n)}if(i){i.map((e=>e()));l["s-rc"]=void 0}o();s();{const t=(r=l["s-p"])!=null?r:[];const n=()=>Be(e);if(t.length===0){n()}else{Promise.all(t).then(n);e.l|=4;t.length=0}}};var We=(e,t,n,r)=>{try{t=t.render();{e.l&=~16}{e.l|=2}{{{Ee(e,t,r)}}}}catch(t){f(t,e.$hostElement$)}return null};var Be=e=>{const t=e.i.m;const n=e.$hostElement$;const r=Q("postUpdate",t);const l=e.t;const s=e.U;if(!(e.l&64)){e.l|=64;{Qe(n)}{ze(l,"componentDidLoad",void 0,n)}r();{e.p(n);if(!s){He()}}}else{{ze(l,"componentDidUpdate",void 0,n)}r()}{e.v(n)}{if(e.N){e.N();e.N=void 0}if(e.l&512){L((()=>Me(e,false)))}e.l&=~(4|512)}};var He=t=>{{Qe(b.documentElement)}L((()=>te(y,"appload",{detail:{namespace:e}})))};var ze=(e,t,n,r)=>{if(e&&e[t]){try{return e[t](n)}catch(e){f(e,r)}}return void 0};var Qe=e=>{var n;return e.classList.add((n=t.hydratedSelectorName)!=null?n:"hydrated")};var Ve=(e,t)=>s(e).o.get(t);var qe=(e,t,n,r)=>{const l=s(e);if(!l){throw new Error(`Couldn't find host element for "${r.m}" as it is unknown to this Stencil runtime. This usually happens when integrating a 3rd party Stencil component with another Stencil component or application. Please reach out to the maintainers of the 3rd party Stencil component or report this on the Stencil Discord server (https://chat.stenciljs.com) or comment on this similar [GitHub issue](https://github.com/ionic-team/stencil/issues/5457).`)}const i=l.$hostElement$;const o=l.o.get(t);const a=l.l;const c=l.t;n=Y(n,r.B[t][0]);const u=Number.isNaN(o)&&Number.isNaN(n);const v=n!==o&&!u;if((!(a&8)||o===void 0)&&v){l.o.set(t,n);if(c){if(r.H&&a&128){const e=r.H[t];if(e){e.map((e=>{try{c[e](n,o,t)}catch(e){f(e,i)}}))}}if((a&(2|16))===2){Me(l,false)}}}};var Ge=(e,n,r)=>{var l,i;const o=e.prototype;if(n.B||(n.H||e.watchers)){if(e.watchers&&!n.H){n.H=e.watchers}const a=Object.entries((l=n.B)!=null?l:{});a.map((([e,[t]])=>{if(t&31||r&2&&t&32){const{get:l,set:i}=Object.getOwnPropertyDescriptor(o,e)||{};if(l)n.B[e][0]|=2048;if(i)n.B[e][0]|=4096;if(r&1||!l){Object.defineProperty(o,e,{get(){{if((n.B[e][0]&2048)===0){return Ve(this,e)}const t=s(this);const r=t?t.t:o;if(!r)return;return r[e]}},configurable:true,enumerable:true})}Object.defineProperty(o,e,{set(l){const o=s(this);if(i){const r=t&32?this[e]:o.$hostElement$[e];if(typeof r==="undefined"&&o.o.get(e)){l=o.o.get(e)}else if(!o.o.get(e)&&r){o.o.set(e,r)}i.apply(this,[Y(l,t)]);l=t&32?this[e]:o.$hostElement$[e];qe(this,e,l,n);return}{if((r&1)===0||(n.B[e][0]&4096)===0){qe(this,e,l,n);if(r&1&&!o.t){o.h.then((()=>{if(n.B[e][0]&4096&&o.t[e]!==o.o.get(e)){o.t[e]=l}}))}return}const s=()=>{const r=o.t[e];if(!o.o.get(e)&&r){o.o.set(e,r)}o.t[e]=Y(l,t);qe(this,e,o.t[e],n)};if(o.t){s()}else{o.h.then((()=>s()))}}}})}else if(r&1&&t&64){Object.defineProperty(o,e,{value(...t){var n;const r=s(this);return(n=r==null?void 0:r.u)==null?void 0:n.then((()=>{var n;return(n=r.t)==null?void 0:n[e](...t)}))}})}}));if(r&1){const r=new Map;o.attributeChangedCallback=function(e,l,i){w.jmp((()=>{var a;const f=r.get(e);if(this.hasOwnProperty(f)&&t.lazyLoad){i=this[f];delete this[f]}else if(o.hasOwnProperty(f)&&typeof this[f]==="number"&&this[f]==i){return}else if(f==null){const t=s(this);const r=t==null?void 0:t.l;if(r&&!(r&8)&&r&128&&i!==l){const r=t.t;const s=(a=n.H)==null?void 0:a[e];s==null?void 0:s.forEach((t=>{if(r[t]!=null){r[t].call(r,i,l,e)}}))}return}const c=Object.getOwnPropertyDescriptor(o,f);i=i===null&&typeof this[f]==="boolean"?false:i;if(i!==this[f]&&(!c.get||!!c.set)){this[f]=i}}))};e.observedAttributes=Array.from(new Set([...Object.keys((i=n.H)!=null?i:{}),...a.filter((([e,t])=>t[0]&15)).map((([e,t])=>{var l;const s=t[1]||e;r.set(s,e);if(t[0]&512){(l=n.P)==null?void 0:l.push([e,s])}return s}))]))}}return e};var Ie=async(e,t,n,r)=>{let l;if((t.l&32)===0){t.l|=32;{const r=u(n,t);if(r&&"then"in r){const e=V();l=await r;e()}else{l=r}if(!l){throw new Error(`Constructor for "${n.m}#${t.V}" was not found`)}if(!l.isProxied){{n.H=l.watchers}Ge(l,n,2);l.isProxied=true}const s=Q("createInstance",n.m);{t.l|=8}try{new l(t)}catch(t){f(t,e)}{t.l&=~8}{t.l|=128}s();Ke(t.t,e)}if(l&&l.style){let e;if(typeof l.style==="string"){e=l.style}const t=ie(n);if(!v.has(t)){const r=Q("registerStyles",n.m);re(t,e,!!(n.l&1));r()}}}const s=t.U;const i=()=>Me(t,true);if(s&&s["s-rc"]){s["s-rc"].push(i)}else{i()}};var Ke=(e,t)=>{{ze(e,"connectedCallback",void 0,t)}};var Xe=e=>{if((w.l&1)===0){const t=s(e);const n=t.i;const r=Q("connectedCallback",n.m);if(!(t.l&1)){t.l|=1;{if(n.l&(4|8)){_e(e)}}{let n=e;while(n=n.parentNode||n.host){if(n["s-p"]){Re(t,t.U=n);break}}}if(n.B){Object.entries(n.B).map((([t,[n]])=>{if(n&31&&e.hasOwnProperty(t)){const n=e[t];delete e[t];e[t]=n}}))}{Ie(e,t,n)}}else{tt(e,t,n.q);if(t==null?void 0:t.t){Ke(t.t,e)}else if(t==null?void 0:t.h){t.h.then((()=>Ke(t.t,e)))}}r()}};var _e=e=>{const t=e["s-cr"]=b.createComment("");t["s-cn"]=true;Fe(e,t,e.firstChild)};var Je=(e,t)=>{{ze(e,"disconnectedCallback",void 0,t||e)}};var Ye=async e=>{if((w.l&1)===0){const t=s(e);{if(t.G){t.G.map((e=>e()));t.G=void 0}}if(t==null?void 0:t.t){Je(t.t,e)}else if(t==null?void 0:t.h){t.h.then((()=>Je(t.t,e)))}}if(ne.has(e)){ne.delete(e)}if(e.shadowRoot&&ne.has(e.shadowRoot)){ne.delete(e.shadowRoot)}};var Ze=(e,t={})=>{var n;const r=Q();const l=[];const i=t.exclude||[];const a=y.customElements;const f=b.head;const c=f.querySelector("meta[charset]");const u=b.createElement("style");const v=[];let d;let m=true;Object.assign(w,t);w.$=new URL(t.resourcesUrl||"./",b.baseURI).href;let S=false;e.map((e=>{e[1].map((t=>{var n;const r={l:t[0],m:t[1],B:t[2],q:t[3]};if(r.l&4){S=true}{r.B=t[2]}{r.q=t[3]}{r.P=[]}{r.H=(n=t[4])!=null?n:{}}const f=r.m;const c=class extends HTMLElement{constructor(e){super(e);this.hasRegisteredEventListeners=false;e=this;o(e,r);if(r.l&1){{if(!e.shadowRoot){{e.attachShadow({mode:"open"})}}else{if(e.shadowRoot.mode!=="open"){throw new Error(`Unable to re-use existing shadow root for ${r.m}! Mode is set to ${e.shadowRoot.mode} but Stencil only supports open shadow roots.`)}}}}}connectedCallback(){const e=s(this);if(!this.hasRegisteredEventListeners){this.hasRegisteredEventListeners=true;tt(this,e,r.q)}if(d){clearTimeout(d);d=null}if(m){v.push(this)}else{w.jmp((()=>Xe(this)))}}disconnectedCallback(){w.jmp((()=>Ye(this)));w.raf((()=>{var e;const t=s(this);if(((e=t==null?void 0:t.A)==null?void 0:e.D)instanceof Node&&!t.A.D.isConnected){delete t.A.D}}))}componentOnReady(){return s(this).h}};r.S=e[0];if(!i.includes(f)&&!a.get(f)){l.push(f);a.define(f,Ge(c,r,1))}}))}));if(l.length>0){if(S){u.textContent+=p}{u.textContent+=l.sort()+h}if(u.innerHTML.length){u.setAttribute("data-styles","");const e=(n=w.F)!=null?n:E(b);if(e!=null){u.setAttribute("nonce",e)}f.insertBefore(u,c?c.nextSibling:f.firstChild)}}m=false;if(v.length){v.map((e=>e.connectedCallback()))}else{{w.jmp((()=>d=setTimeout(He,30)))}}r()};var et=(e,t)=>t;var tt=(e,t,n,r)=>{if(n){n.map((([n,r,l])=>{const s=rt(e,n);const i=nt(t,l);const o=lt(n);w.ael(s,r,i,o);(t.G=t.G||[]).push((()=>w.rel(s,r,i,o)))}))}};var nt=(e,t)=>n=>{var r;try{{if(e.l&256){(r=e.t)==null?void 0:r[t](n)}else{(e.W=e.W||[]).push([t,n])}}}catch(t){f(t,e.$hostElement$)}};var rt=(e,t)=>{if(t&8)return y;return e};var lt=e=>S?{passive:(e&1)!==0,capture:(e&2)!==0}:(e&2)!==0;var st=e=>w.F=e;export{et as F,I as H,Ze as b,ee as c,Z as g,q as h,$ as p,i as r,st as s};
-//# sourceMappingURL=p-9d0aeb92.js.map