bromcom-ui-next 0.1.5 → 0.1.6

package/dist/bromcom-ui/p-cd271b49.entry.js

@@ -0,0 +1,2 @@
+import{r as t,c as i,h as s,H as e,g as a}from"./p-c9b736d9.js";import{c as n}from"./p-5fcf77f9.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:"b5c18df30963fa3e2efcfb84a3b0d93cd2b4a940"},s("div",{key:"b62f25ebe6ba5e7c9bb04a725d047a64f1cb22bf",class:this.tabClass()},s("slot",{key:"c09c33175f8004c5a9d8a77fe234bdfbe4244214",name:"tabs-list"}),s("slot",{key:"9ae9022486322bdf34d0e2c7838760a50bc6e90e"})))}get el(){return a(this)}static get watchers(){return{size:["handleSizeChange"]}}};r.style=h;export{r as bcm_tabs};
+//# sourceMappingURL=p-cd271b49.entry.js.map

package/dist/bromcom-ui/p-cd271b49.entry.js.map

@@ -0,0 +1 @@
+{"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 'tailwind-variants';\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-cee68279.entry.js

@@ -0,0 +1,2 @@
+import{r as e,c,h as r}from"./p-c9b736d9.js";import{c as t}from"./p-5fcf77f9.js";const i={info:"blue",error:"red",warning:"amber",success:"green"};const o=":host{--bcm-chip-bg:var(--bcm-ui-color-background-default-default);--bcm-chip-text:var(--bcm-ui-color-text-default);--bcm-chip-border:var(--bcm-ui-color-border-default);--bcm-chip-hover-bg:var(--bcm-ui-color-background-default-hover);--bcm-chip-active-bg:var(--bcm-ui-color-background-default-active);--bcm-chip-radius:6px;display:inline-block}.bcm-ui-element{-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;font-family:Inter,sans-serif}.static{position:static}.flex{display:flex}.min-w-max{min-width:max-content}.cursor-not-allowed{cursor:not-allowed}.cursor-pointer{cursor:pointer}.items-center{align-items:center}.justify-center{justify-content:center}.gap-1{gap:.25rem}.rounded-\\[--bcm-chip-radius\\]{border-radius:var(--bcm-chip-radius)}.border{border-width:1px}.border-none{border-style:none}.border-\\[--bcm-chip-border\\]{border-color:var(--bcm-chip-border)}.border-transparent{border-color:transparent}.bg-\\[--bcm-chip-bg\\]{background-color:var(--bcm-chip-bg)}.px-2{padding-left:.5rem;padding-right:.5rem}.py-0\\.5{padding-bottom:.125rem;padding-top:.125rem}.py-1{padding-bottom:.25rem;padding-top:.25rem}.py-px{padding-bottom:1px;padding-top:1px}.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)}.font-normal{font-weight:400}.text-\\[--bcm-chip-text\\]{color:var(--bcm-chip-text)}.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)}.hover\\:bg-\\[--bcm-chip-hover-bg\\]:hover{background-color:var(--bcm-chip-hover-bg)}.active\\:bg-\\[--bcm-chip-active-bg\\]:active{background-color:var(--bcm-chip-active-bg)}";const a=o;const b=class{constructor(r){e(this,r);this.bcmDismiss=c(this,"bcmDismiss",1);this.size="medium";this.kind="filled";this.status="default";this.dismissible=false;this.disabled=false;this.chipClass=t({base:["chip bcm-ui-element font-normal flex items-center justify-center px-2 gap-1 min-w-max border","bg-[--bcm-chip-bg] text-[--bcm-chip-text] rounded-[--bcm-chip-radius] border-[--bcm-chip-border]","hover:bg-[--bcm-chip-hover-bg] active:bg-[--bcm-chip-active-bg]"],variants:{size:{small:"small py-px text-size-3",medium:"medium py-0.5 text-size-4",large:"large py-1 text-size-5"},kind:{filled:"filled border-transparent",outlined:"outlined",text:"text border-none"},disabled:{true:"cursor-not-allowed"}}},{twMerge:false})}get chipStyle(){let e=this.color;if(this.disabled){return{"--bcm-chip-bg":"var(--bcm-ui-color-background-disabled-default)","--bcm-chip-text":"var(--bcm-ui-color-text-disabled)","--bcm-chip-border":"var(--bcm-ui-color-border-disabled)","--bcm-chip-hover-bg":"var(--bcm-ui-color-background-disabled-default)","--bcm-chip-active-bg":"var(--bcm-ui-color-background-disabled-default)"}}if(this.status!=="default"){e=i[this.status]}const c={filled:{"--bcm-chip-bg":`var(--bcm-ui-color-background-palette-${e}-default)`,"--bcm-chip-text":`var(--bcm-ui-color-text-palette-${e})`,"--bcm-chip-border":`var(--bcm-ui-color-border-${e})`,"--bcm-chip-hover-bg":`var(--bcm-ui-color-background-palette-${e}-hover)`,"--bcm-chip-active-bg":`var(--bcm-ui-color-background-palette-${e}-active)`},outlined:{"--bcm-chip-bg":"transparent","--bcm-chip-text":`var(--bcm-ui-color-text-palette-${e})`,"--bcm-chip-border":`var(--bcm-ui-color-border-${e})`,"--bcm-chip-hover-bg":`var(--bcm-ui-color-background-palette-${e}-hover)`,"--bcm-chip-active-bg":`var(--bcm-ui-color-background-palette-${e}-active)`},text:{"--bcm-chip-bg":"transparent","--bcm-chip-text":`var(--bcm-ui-color-text-palette-${e})`,"--bcm-chip-border":"transparent","--bcm-chip-hover-bg":`var(--bcm-ui-color-background-palette-${e}-hover)`,"--bcm-chip-active-bg":`var(--bcm-ui-color-background-palette-${e}-active)`}};const r={filled:{"--bcm-chip-bg":"var(--bcm-ui-color-background-default-default)","--bcm-chip-text":"var(--bcm-ui-color-text-default)","--bcm-chip-border":"var(--bcm-ui-color-border-default)","--bcm-chip-hover-bg":"var(--bcm-ui-color-background-default-hover)","--bcm-chip-active-bg":"var(--bcm-ui-color-background-default-active)"},outlined:{"--bcm-chip-bg":"transparent","--bcm-chip-text":"var(--bcm-ui-color-text-default)","--bcm-chip-border":"var(--bcm-ui-color-border-default)","--bcm-chip-hover-bg":"var(--bcm-ui-color-background-default-hover)","--bcm-chip-active-bg":"var(--bcm-ui-color-background-default-active)"},text:{"--bcm-chip-bg":"transparent","--bcm-chip-text":"var(--bcm-ui-color-text-default)","--bcm-chip-border":"transparent","--bcm-chip-hover-bg":"var(--bcm-ui-color-background-default-hover)","--bcm-chip-active-bg":"var(--bcm-ui-color-background-default-active)"}};return e?c[this.kind]:r[this.kind]}handleDismiss(){if(!this.disabled){this.bcmDismiss.emit()}}render(){return r("div",{key:"77ad31933acb6e0f5574f3590b2274f61b20caed",style:this.chipStyle,class:this.chipClass({size:this.size,kind:this.kind,disabled:this.disabled}),role:"button","aria-disabled":this.disabled?"true":"false"},r("slot",{key:"781811b794a2d89c0ac609e934d6393094c541e8"}),this.dismissible&&r("bcm-icon",{key:"08e55b19802624566ae6323c1102257cba784420",onClick:()=>this.handleDismiss(),class:"cursor-pointer","icon-name":"fa-regular fa-xmark","aria-label":"Dismiss chip"}))}};b.style=a;export{b as bcm_chip};
+//# sourceMappingURL=p-cee68279.entry.js.map

package/dist/bromcom-ui/{p-2bbd3c52.entry.js.map → p-cee68279.entry.js.map}

@@ -1 +1 @@
-{"version":3,"names":["STATUS_COLORS","info","error","warning","success","chipCss","BcmChipStyle0","BcmChip","constructor","hostRef","this","size","kind","status","dismissible","disabled","chipClass","tv","base","variants","small","medium","large","filled","outlined","text","true","twMerge","chipStyle","_color","color","styles","defaultStyles","handleDismiss","bcmDismiss","emit","render","h","key","style","class","role","onClick"],"sources":["src/components/chip/types.ts","src/components/chip/chip.css?tag=bcm-chip&encapsulation=shadow","src/components/chip/chip.component.tsx"],"sourcesContent":["export type ChipSize = 'small' | 'medium' | 'large';\nexport type ChipKind = 'filled' | 'outlined' | 'text';\nexport type ChipStatus = 'info' | 'error' | 'warning' | 'success' | 'default';\n\nexport const STATUS_COLORS = {\n  info: 'blue',\n  error: 'red',\n  warning: 'amber',\n  success: 'green',\n} as const;\n",":host {\n  display: inline-block;\n  --bcm-chip-bg: var(--bcm-ui-color-background-default-default);\n  --bcm-chip-text: var(--bcm-ui-color-text-default);\n  --bcm-chip-border: var(--bcm-ui-color-border-default);\n  --bcm-chip-hover-bg: var(--bcm-ui-color-background-default-hover);\n  --bcm-chip-active-bg: var(--bcm-ui-color-background-default-active);\n  --bcm-chip-radius: 6px;\n}\n","import { Component, ComponentInterface, h, Prop, Event, EventEmitter } from '@stencil/core';\nimport { ChipKind, ChipSize, ChipStatus, STATUS_COLORS } from './types';\nimport { tv } from 'tailwind-variants';\n\n/**\n * @component BcmChip\n * @description A versatile chip component that can be used to display compact pieces of information, filters, or actions.\n * Supports different sizes, styles (filled, outlined, text), statuses, and can be dismissible.\n *\n * @example\n * <bcm-chip size=\"medium\" kind=\"filled\" status=\"success\">\n *   Success Chip\n * </bcm-chip>\n *\n * @example Dismissible chip\n * <bcm-chip dismissible={true} onDismiss={() => handleDismiss()}>\n *   Dismissible Chip\n * </bcm-chip>\n *\n * @prop {ChipSize} size - Defines the size of the chip: 'small' | 'medium' | 'large'\n * @prop {ChipKind} kind - Defines the visual style: 'filled' | 'outlined' | 'text'\n * @prop {ChipStatus} status - Defines the status color: 'info' | 'error' | 'warning' | 'success' | 'default'\n * @prop {boolean} dismissible - Whether the chip can be dismissed\n * @prop {boolean} disabled - Whether the chip is disabled\n * @prop {string} color - Custom color override for the chip\n *\n * @event {EventEmitter<void>} dismiss - Emitted when the dismiss button is clicked\n *\n * @csspart chip - The root chip element\n * @csspart dismiss-icon - The dismiss button icon\n */\n\n@Component({\n  tag: 'bcm-chip',\n  styleUrl: 'chip.css',\n  shadow: true,\n})\nexport class BcmChip implements ComponentInterface {\n  /** Chip size variant */\n  @Prop()\n  size?: ChipSize = 'medium';\n\n  /** Chip style variant */\n  @Prop()\n  kind?: ChipKind = 'filled';\n\n  /** Chip status */\n  @Prop()\n  status?: ChipStatus = 'default';\n\n  /** Whether chip can be dismissed */\n  @Prop()\n  dismissible?: boolean = false;\n\n  /** Whether chip is disabled */\n  @Prop()\n  disabled?: boolean = false;\n\n  /** Chip color variant */\n  @Prop()\n  color?: string;\n\n  @Event({\n    composed: false,\n    bubbles: false,\n    cancelable: true,\n  })\n  bcmDismiss: EventEmitter<void>;\n\n  private chipClass = tv(\n    {\n      base: [\n        'chip bcm-ui-element font-normal flex items-center justify-center px-2 gap-1 min-w-max border',\n        'bg-[--bcm-chip-bg] text-[--bcm-chip-text] rounded-[--bcm-chip-radius] border-[--bcm-chip-border]',\n        'hover:bg-[--bcm-chip-hover-bg] active:bg-[--bcm-chip-active-bg]',\n      ],\n      variants: {\n        size: {\n          small: 'small py-px text-size-3',\n          medium: 'medium py-0.5 text-size-4',\n          large: 'large py-1 text-size-5',\n        },\n        kind: {\n          filled: 'filled border-transparent',\n          outlined: 'outlined',\n          text: 'text border-none',\n        },\n        disabled: {\n          true: 'cursor-not-allowed',\n        },\n      },\n    },\n    { twMerge: false },\n  );\n\n  private get chipStyle() {\n    let _color = this.color;\n\n    if (this.disabled) {\n      return {\n        '--bcm-chip-bg': 'var(--bcm-ui-color-background-disabled-default)',\n        '--bcm-chip-text': 'var(--bcm-ui-color-text-disabled)',\n        '--bcm-chip-border': 'var(--bcm-ui-color-border-disabled)',\n        '--bcm-chip-hover-bg': 'var(--bcm-ui-color-background-disabled-default)',\n        '--bcm-chip-active-bg': 'var(--bcm-ui-color-background-disabled-default)',\n      };\n    }\n\n    if (this.status !== 'default') {\n      _color = STATUS_COLORS[this.status];\n    }\n\n    const styles = {\n      filled: {\n        '--bcm-chip-bg': `var(--bcm-ui-color-background-palette-${_color}-default)`,\n        '--bcm-chip-text': `var(--bcm-ui-color-text-palette-${_color})`,\n        '--bcm-chip-border': `var(--bcm-ui-color-border-${_color})`,\n        '--bcm-chip-hover-bg': `var(--bcm-ui-color-background-palette-${_color}-hover)`,\n        '--bcm-chip-active-bg': `var(--bcm-ui-color-background-palette-${_color}-active)`,\n      },\n      outlined: {\n        '--bcm-chip-bg': 'transparent',\n        '--bcm-chip-text': `var(--bcm-ui-color-text-palette-${_color})`,\n        '--bcm-chip-border': `var(--bcm-ui-color-border-${_color})`,\n        '--bcm-chip-hover-bg': `var(--bcm-ui-color-background-palette-${_color}-hover)`,\n        '--bcm-chip-active-bg': `var(--bcm-ui-color-background-palette-${_color}-active)`,\n      },\n      text: {\n        '--bcm-chip-bg': 'transparent',\n        '--bcm-chip-text': `var(--bcm-ui-color-text-palette-${_color})`,\n        '--bcm-chip-border': 'transparent',\n        '--bcm-chip-hover-bg': `var(--bcm-ui-color-background-palette-${_color}-hover)`,\n        '--bcm-chip-active-bg': `var(--bcm-ui-color-background-palette-${_color}-active)`,\n      },\n    };\n\n    const defaultStyles = {\n      filled: {\n        '--bcm-chip-bg': 'var(--bcm-ui-color-background-default-default)',\n        '--bcm-chip-text': 'var(--bcm-ui-color-text-default)',\n        '--bcm-chip-border': 'var(--bcm-ui-color-border-default)',\n        '--bcm-chip-hover-bg': 'var(--bcm-ui-color-background-default-hover)',\n        '--bcm-chip-active-bg': 'var(--bcm-ui-color-background-default-active)',\n      },\n      outlined: {\n        '--bcm-chip-bg': 'transparent',\n        '--bcm-chip-text': 'var(--bcm-ui-color-text-default)',\n        '--bcm-chip-border': 'var(--bcm-ui-color-border-default)',\n        '--bcm-chip-hover-bg': 'var(--bcm-ui-color-background-default-hover)',\n        '--bcm-chip-active-bg': 'var(--bcm-ui-color-background-default-active)',\n      },\n      text: {\n        '--bcm-chip-bg': 'transparent',\n        '--bcm-chip-text': 'var(--bcm-ui-color-text-default)',\n        '--bcm-chip-border': 'transparent',\n        '--bcm-chip-hover-bg': 'var(--bcm-ui-color-background-default-hover)',\n        '--bcm-chip-active-bg': 'var(--bcm-ui-color-background-default-active)',\n      },\n    };\n\n    return _color ? styles[this.kind] : defaultStyles[this.kind];\n  }\n\n  private handleDismiss() {\n    if (!this.disabled) {\n      this.bcmDismiss.emit();\n    }\n  }\n\n  render() {\n    return (\n      <div\n        style={this.chipStyle}\n        class={this.chipClass({ size: this.size, kind: this.kind, disabled: this.disabled })}\n        role=\"button\"\n        aria-disabled={this.disabled ? 'true' : 'false'}\n      ><slot></slot>\n        {this.dismissible && <bcm-icon onClick={() => this.handleDismiss()} class=\"cursor-pointer\" icon-name=\"fa-regular fa-xmark\" aria-label=\"Dismiss chip\"></bcm-icon>}\n      </div>\n    );\n  }\n}\n"],"mappings":"sFAIO,MAAMA,EAAgB,CAC3BC,KAAM,OACNC,MAAO,MACPC,QAAS,QACTC,QAAS,SCRX,MAAMC,EAAU,y5DAChB,MAAAC,EAAeD,E,MCoCFE,EAAO,MALpB,WAAAC,CAAAC,G,iDAQEC,KAAAC,KAAkB,SAIlBD,KAAAE,KAAkB,SAIlBF,KAAAG,OAAsB,UAItBH,KAAAI,YAAwB,MAIxBJ,KAAAK,SAAqB,MAabL,KAAAM,UAAYC,EAClB,CACEC,KAAM,CACJ,+FACA,mGACA,mEAEFC,SAAU,CACRR,KAAM,CACJS,MAAO,0BACPC,OAAQ,4BACRC,MAAO,0BAETV,KAAM,CACJW,OAAQ,4BACRC,SAAU,WACVC,KAAM,oBAERV,SAAU,CACRW,KAAM,wBAIZ,CAAEC,QAAS,O,CAGb,aAAYC,GACV,IAAIC,EAASnB,KAAKoB,MAElB,GAAIpB,KAAKK,SAAU,CACjB,MAAO,CACL,gBAAiB,kDACjB,kBAAmB,oCACnB,oBAAqB,sCACrB,sBAAuB,kDACvB,uBAAwB,kD,CAI5B,GAAIL,KAAKG,SAAW,UAAW,CAC7BgB,EAAS7B,EAAcU,KAAKG,O,CAG9B,MAAMkB,EAAS,CACbR,OAAQ,CACN,gBAAiB,yCAAyCM,aAC1D,kBAAmB,mCAAmCA,KACtD,oBAAqB,6BAA6BA,KAClD,sBAAuB,yCAAyCA,WAChE,uBAAwB,yCAAyCA,aAEnEL,SAAU,CACR,gBAAiB,cACjB,kBAAmB,mCAAmCK,KACtD,oBAAqB,6BAA6BA,KAClD,sBAAuB,yCAAyCA,WAChE,uBAAwB,yCAAyCA,aAEnEJ,KAAM,CACJ,gBAAiB,cACjB,kBAAmB,mCAAmCI,KACtD,oBAAqB,cACrB,sBAAuB,yCAAyCA,WAChE,uBAAwB,yCAAyCA,cAIrE,MAAMG,EAAgB,CACpBT,OAAQ,CACN,gBAAiB,iDACjB,kBAAmB,mCACnB,oBAAqB,qCACrB,sBAAuB,+CACvB,uBAAwB,iDAE1BC,SAAU,CACR,gBAAiB,cACjB,kBAAmB,mCACnB,oBAAqB,qCACrB,sBAAuB,+CACvB,uBAAwB,iDAE1BC,KAAM,CACJ,gBAAiB,cACjB,kBAAmB,mCACnB,oBAAqB,cACrB,sBAAuB,+CACvB,uBAAwB,kDAI5B,OAAOI,EAASE,EAAOrB,KAAKE,MAAQoB,EAActB,KAAKE,K,CAGjD,aAAAqB,GACN,IAAKvB,KAAKK,SAAU,CAClBL,KAAKwB,WAAWC,M,EAIpB,MAAAC,GACE,OACEC,EAAA,OAAAC,IAAA,2CACEC,MAAO7B,KAAKkB,UACZY,MAAO9B,KAAKM,UAAU,CAAEL,KAAMD,KAAKC,KAAMC,KAAMF,KAAKE,KAAMG,SAAUL,KAAKK,WACzE0B,KAAK,SAAQ,gBACE/B,KAAKK,SAAW,OAAS,SACzCsB,EAAA,QAAAC,IAAA,6CACE5B,KAAKI,aAAeuB,EAAA,YAAAC,IAAA,2CAAUI,QAAS,IAAMhC,KAAKuB,gBAAiBO,MAAM,iBAAgB,YAAW,sBAAqB,aAAY,iB","ignoreList":[]}
+{"version":3,"names":["STATUS_COLORS","info","error","warning","success","chipCss","BcmChipStyle0","BcmChip","constructor","hostRef","this","size","kind","status","dismissible","disabled","chipClass","tv","base","variants","small","medium","large","filled","outlined","text","true","twMerge","chipStyle","_color","color","styles","defaultStyles","handleDismiss","bcmDismiss","emit","render","h","key","style","class","role","onClick"],"sources":["src/components/chip/types.ts","src/components/chip/chip.css?tag=bcm-chip&encapsulation=shadow","src/components/chip/chip.component.tsx"],"sourcesContent":["export type ChipSize = 'small' | 'medium' | 'large';\nexport type ChipKind = 'filled' | 'outlined' | 'text';\nexport type ChipStatus = 'info' | 'error' | 'warning' | 'success' | 'default';\n\nexport const STATUS_COLORS = {\n  info: 'blue',\n  error: 'red',\n  warning: 'amber',\n  success: 'green',\n} as const;\n",":host {\n  display: inline-block;\n  --bcm-chip-bg: var(--bcm-ui-color-background-default-default);\n  --bcm-chip-text: var(--bcm-ui-color-text-default);\n  --bcm-chip-border: var(--bcm-ui-color-border-default);\n  --bcm-chip-hover-bg: var(--bcm-ui-color-background-default-hover);\n  --bcm-chip-active-bg: var(--bcm-ui-color-background-default-active);\n  --bcm-chip-radius: 6px;\n}\n","import { Component, ComponentInterface, h, Prop, Event, EventEmitter } from '@stencil/core';\nimport { ChipKind, ChipSize, ChipStatus, STATUS_COLORS } from './types';\nimport { tv } from 'tailwind-variants';\n\n/**\n * @component BcmChip\n * @description A versatile chip component that can be used to display compact pieces of information, filters, or actions.\n * Supports different sizes, styles (filled, outlined, text), statuses, and can be dismissible.\n *\n * @example\n * <bcm-chip size=\"medium\" kind=\"filled\" status=\"success\">\n *   Success Chip\n * </bcm-chip>\n *\n * @example Dismissible chip\n * <bcm-chip dismissible={true} onDismiss={() => handleDismiss()}>\n *   Dismissible Chip\n * </bcm-chip>\n *\n * @prop {ChipSize} size - Defines the size of the chip: 'small' | 'medium' | 'large'\n * @prop {ChipKind} kind - Defines the visual style: 'filled' | 'outlined' | 'text'\n * @prop {ChipStatus} status - Defines the status color: 'info' | 'error' | 'warning' | 'success' | 'default'\n * @prop {boolean} dismissible - Whether the chip can be dismissed\n * @prop {boolean} disabled - Whether the chip is disabled\n * @prop {string} color - Custom color override for the chip\n *\n * @event {EventEmitter<void>} dismiss - Emitted when the dismiss button is clicked\n *\n * @csspart chip - The root chip element\n * @csspart dismiss-icon - The dismiss button icon\n */\n\n@Component({\n  tag: 'bcm-chip',\n  styleUrl: 'chip.css',\n  shadow: true,\n})\nexport class BcmChip implements ComponentInterface {\n  /** Chip size variant */\n  @Prop()\n  size?: ChipSize = 'medium';\n\n  /** Chip style variant */\n  @Prop()\n  kind?: ChipKind = 'filled';\n\n  /** Chip status */\n  @Prop()\n  status?: ChipStatus = 'default';\n\n  /** Whether chip can be dismissed */\n  @Prop()\n  dismissible?: boolean = false;\n\n  /** Whether chip is disabled */\n  @Prop()\n  disabled?: boolean = false;\n\n  /** Chip color variant */\n  @Prop()\n  color?: string;\n\n  @Event({\n    composed: false,\n    bubbles: false,\n    cancelable: true,\n  })\n  bcmDismiss: EventEmitter<void>;\n\n  private chipClass = tv(\n    {\n      base: [\n        'chip bcm-ui-element font-normal flex items-center justify-center px-2 gap-1 min-w-max border',\n        'bg-[--bcm-chip-bg] text-[--bcm-chip-text] rounded-[--bcm-chip-radius] border-[--bcm-chip-border]',\n        'hover:bg-[--bcm-chip-hover-bg] active:bg-[--bcm-chip-active-bg]',\n      ],\n      variants: {\n        size: {\n          small: 'small py-px text-size-3',\n          medium: 'medium py-0.5 text-size-4',\n          large: 'large py-1 text-size-5',\n        },\n        kind: {\n          filled: 'filled border-transparent',\n          outlined: 'outlined',\n          text: 'text border-none',\n        },\n        disabled: {\n          true: 'cursor-not-allowed',\n        },\n      },\n    },\n    { twMerge: false },\n  );\n\n  private get chipStyle() {\n    let _color = this.color;\n\n    if (this.disabled) {\n      return {\n        '--bcm-chip-bg': 'var(--bcm-ui-color-background-disabled-default)',\n        '--bcm-chip-text': 'var(--bcm-ui-color-text-disabled)',\n        '--bcm-chip-border': 'var(--bcm-ui-color-border-disabled)',\n        '--bcm-chip-hover-bg': 'var(--bcm-ui-color-background-disabled-default)',\n        '--bcm-chip-active-bg': 'var(--bcm-ui-color-background-disabled-default)',\n      };\n    }\n\n    if (this.status !== 'default') {\n      _color = STATUS_COLORS[this.status];\n    }\n\n    const styles = {\n      filled: {\n        '--bcm-chip-bg': `var(--bcm-ui-color-background-palette-${_color}-default)`,\n        '--bcm-chip-text': `var(--bcm-ui-color-text-palette-${_color})`,\n        '--bcm-chip-border': `var(--bcm-ui-color-border-${_color})`,\n        '--bcm-chip-hover-bg': `var(--bcm-ui-color-background-palette-${_color}-hover)`,\n        '--bcm-chip-active-bg': `var(--bcm-ui-color-background-palette-${_color}-active)`,\n      },\n      outlined: {\n        '--bcm-chip-bg': 'transparent',\n        '--bcm-chip-text': `var(--bcm-ui-color-text-palette-${_color})`,\n        '--bcm-chip-border': `var(--bcm-ui-color-border-${_color})`,\n        '--bcm-chip-hover-bg': `var(--bcm-ui-color-background-palette-${_color}-hover)`,\n        '--bcm-chip-active-bg': `var(--bcm-ui-color-background-palette-${_color}-active)`,\n      },\n      text: {\n        '--bcm-chip-bg': 'transparent',\n        '--bcm-chip-text': `var(--bcm-ui-color-text-palette-${_color})`,\n        '--bcm-chip-border': 'transparent',\n        '--bcm-chip-hover-bg': `var(--bcm-ui-color-background-palette-${_color}-hover)`,\n        '--bcm-chip-active-bg': `var(--bcm-ui-color-background-palette-${_color}-active)`,\n      },\n    };\n\n    const defaultStyles = {\n      filled: {\n        '--bcm-chip-bg': 'var(--bcm-ui-color-background-default-default)',\n        '--bcm-chip-text': 'var(--bcm-ui-color-text-default)',\n        '--bcm-chip-border': 'var(--bcm-ui-color-border-default)',\n        '--bcm-chip-hover-bg': 'var(--bcm-ui-color-background-default-hover)',\n        '--bcm-chip-active-bg': 'var(--bcm-ui-color-background-default-active)',\n      },\n      outlined: {\n        '--bcm-chip-bg': 'transparent',\n        '--bcm-chip-text': 'var(--bcm-ui-color-text-default)',\n        '--bcm-chip-border': 'var(--bcm-ui-color-border-default)',\n        '--bcm-chip-hover-bg': 'var(--bcm-ui-color-background-default-hover)',\n        '--bcm-chip-active-bg': 'var(--bcm-ui-color-background-default-active)',\n      },\n      text: {\n        '--bcm-chip-bg': 'transparent',\n        '--bcm-chip-text': 'var(--bcm-ui-color-text-default)',\n        '--bcm-chip-border': 'transparent',\n        '--bcm-chip-hover-bg': 'var(--bcm-ui-color-background-default-hover)',\n        '--bcm-chip-active-bg': 'var(--bcm-ui-color-background-default-active)',\n      },\n    };\n\n    return _color ? styles[this.kind] : defaultStyles[this.kind];\n  }\n\n  private handleDismiss() {\n    if (!this.disabled) {\n      this.bcmDismiss.emit();\n    }\n  }\n\n  render() {\n    return (\n      <div\n        style={this.chipStyle}\n        class={this.chipClass({ size: this.size, kind: this.kind, disabled: this.disabled })}\n        role=\"button\"\n        aria-disabled={this.disabled ? 'true' : 'false'}\n      ><slot></slot>\n        {this.dismissible && <bcm-icon onClick={() => this.handleDismiss()} class=\"cursor-pointer\" icon-name=\"fa-regular fa-xmark\" aria-label=\"Dismiss chip\"></bcm-icon>}\n      </div>\n    );\n  }\n}\n"],"mappings":"iFAIO,MAAMA,EAAgB,CAC3BC,KAAM,OACNC,MAAO,MACPC,QAAS,QACTC,QAAS,SCRX,MAAMC,EAAU,y5DAChB,MAAAC,EAAeD,E,MCoCFE,EAAO,MALpB,WAAAC,CAAAC,G,iDAQEC,KAAAC,KAAkB,SAIlBD,KAAAE,KAAkB,SAIlBF,KAAAG,OAAsB,UAItBH,KAAAI,YAAwB,MAIxBJ,KAAAK,SAAqB,MAabL,KAAAM,UAAYC,EAClB,CACEC,KAAM,CACJ,+FACA,mGACA,mEAEFC,SAAU,CACRR,KAAM,CACJS,MAAO,0BACPC,OAAQ,4BACRC,MAAO,0BAETV,KAAM,CACJW,OAAQ,4BACRC,SAAU,WACVC,KAAM,oBAERV,SAAU,CACRW,KAAM,wBAIZ,CAAEC,QAAS,O,CAGb,aAAYC,GACV,IAAIC,EAASnB,KAAKoB,MAElB,GAAIpB,KAAKK,SAAU,CACjB,MAAO,CACL,gBAAiB,kDACjB,kBAAmB,oCACnB,oBAAqB,sCACrB,sBAAuB,kDACvB,uBAAwB,kD,CAI5B,GAAIL,KAAKG,SAAW,UAAW,CAC7BgB,EAAS7B,EAAcU,KAAKG,O,CAG9B,MAAMkB,EAAS,CACbR,OAAQ,CACN,gBAAiB,yCAAyCM,aAC1D,kBAAmB,mCAAmCA,KACtD,oBAAqB,6BAA6BA,KAClD,sBAAuB,yCAAyCA,WAChE,uBAAwB,yCAAyCA,aAEnEL,SAAU,CACR,gBAAiB,cACjB,kBAAmB,mCAAmCK,KACtD,oBAAqB,6BAA6BA,KAClD,sBAAuB,yCAAyCA,WAChE,uBAAwB,yCAAyCA,aAEnEJ,KAAM,CACJ,gBAAiB,cACjB,kBAAmB,mCAAmCI,KACtD,oBAAqB,cACrB,sBAAuB,yCAAyCA,WAChE,uBAAwB,yCAAyCA,cAIrE,MAAMG,EAAgB,CACpBT,OAAQ,CACN,gBAAiB,iDACjB,kBAAmB,mCACnB,oBAAqB,qCACrB,sBAAuB,+CACvB,uBAAwB,iDAE1BC,SAAU,CACR,gBAAiB,cACjB,kBAAmB,mCACnB,oBAAqB,qCACrB,sBAAuB,+CACvB,uBAAwB,iDAE1BC,KAAM,CACJ,gBAAiB,cACjB,kBAAmB,mCACnB,oBAAqB,cACrB,sBAAuB,+CACvB,uBAAwB,kDAI5B,OAAOI,EAASE,EAAOrB,KAAKE,MAAQoB,EAActB,KAAKE,K,CAGjD,aAAAqB,GACN,IAAKvB,KAAKK,SAAU,CAClBL,KAAKwB,WAAWC,M,EAIpB,MAAAC,GACE,OACEC,EAAA,OAAAC,IAAA,2CACEC,MAAO7B,KAAKkB,UACZY,MAAO9B,KAAKM,UAAU,CAAEL,KAAMD,KAAKC,KAAMC,KAAMF,KAAKE,KAAMG,SAAUL,KAAKK,WACzE0B,KAAK,SAAQ,gBACE/B,KAAKK,SAAW,OAAS,SACzCsB,EAAA,QAAAC,IAAA,6CACE5B,KAAKI,aAAeuB,EAAA,YAAAC,IAAA,2CAAUI,QAAS,IAAMhC,KAAKuB,gBAAiBO,MAAM,iBAAgB,YAAW,sBAAqB,aAAY,iB","ignoreList":[]}

package/dist/bromcom-ui/{p-6abaf96f.entry.js → p-d57587e5.entry.js}

@@ -1,2 +1,2 @@
-import{r,h as d}from"./p-15fe392b.js";import{c as o}from"./p-5fcf77f9.js";const e=".block{display:block}:host{--bcm-divider-border:var(--bcm-ui-color-border-default);display:block}.static{position:static}.h-full{height:100%}.w-full{width:100%}.border{border-width:1px}.border-2{border-width:2px}.border-4{border-width:4px}.border-\\[1px\\]{border-width:1px}.border-l{border-left-width:1px}.border-t{border-top-width:1px}.border-solid{border-style:solid}.border-dashed{border-style:dashed}.border-dotted{border-style:dotted}.border-\\[--bcm-divider-border\\]{border-color:var(--bcm-divider-border)}.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 t=e;const i=class{constructor(d){r(this,d);this.direction="horizontal";this.variant="solid";this.size="medium";this.dividerClass=o({base:"border-[--bcm-divider-border]",variants:{direction:{horizontal:"w-full border-t",vertical:"h-full border-l"},variant:{solid:"border-solid",dashed:"border-dashed",dotted:"border-dotted"},size:{small:"border-[1px]",medium:"border-2",large:"border-4"}},defaultVariants:{direction:"horizontal",variant:"solid",size:"medium"}},{twMerge:false})}render(){return d("div",{key:"92fe4c3cf2ae2824759a643912fcbb9bc7e426f8",role:"separator","aria-orientation":this.direction,class:this.dividerClass({direction:this.direction,variant:this.variant,size:this.size})})}};i.style=t;export{i as bcm_divider};
-//# sourceMappingURL=p-6abaf96f.entry.js.map
+import{r,h as d}from"./p-c9b736d9.js";import{c as o}from"./p-5fcf77f9.js";const e=".block{display:block}:host{--bcm-divider-border:var(--bcm-ui-color-border-default);display:block}.static{position:static}.h-full{height:100%}.w-full{width:100%}.border{border-width:1px}.border-2{border-width:2px}.border-4{border-width:4px}.border-\\[1px\\]{border-width:1px}.border-l{border-left-width:1px}.border-t{border-top-width:1px}.border-solid{border-style:solid}.border-dashed{border-style:dashed}.border-dotted{border-style:dotted}.border-\\[--bcm-divider-border\\]{border-color:var(--bcm-divider-border)}.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 t=e;const i=class{constructor(d){r(this,d);this.direction="horizontal";this.variant="solid";this.size="medium";this.dividerClass=o({base:"border-[--bcm-divider-border]",variants:{direction:{horizontal:"w-full border-t",vertical:"h-full border-l"},variant:{solid:"border-solid",dashed:"border-dashed",dotted:"border-dotted"},size:{small:"border-[1px]",medium:"border-2",large:"border-4"}},defaultVariants:{direction:"horizontal",variant:"solid",size:"medium"}},{twMerge:false})}render(){return d("div",{key:"92749401a2890b85a848d9e1b2c77c12b5f8d410",role:"separator","aria-orientation":this.direction,class:this.dividerClass({direction:this.direction,variant:this.variant,size:this.size})})}};i.style=t;export{i as bcm_divider};
+//# sourceMappingURL=p-d57587e5.entry.js.map

package/dist/bromcom-ui/p-e89ab4a7.entry.js

@@ -0,0 +1,2 @@
+import{r as e,c as t,h as i,F as a,g as o}from"./p-c9b736d9.js";import{c as r,o as s,f as n,s as c,a as d}from"./p-9594cebb.js";import{c as l}from"./p-5fcf77f9.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 p=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:"9c275c728ff7cabce1a564cf1f062b65c732c2f7"},this.isOpen&&i("div",{key:"04b20e5773d7c2ce6a2bb4fbe2801bb0d775a425",role:"dialog","aria-labelledby":"pop-confirm-title",style:this.popoverStyle,class:t(),ref:e=>this.popoverElement=e},i("div",{key:"bff8a3617e2615efdfe24ff9e73bcad4b55e54ea",ref:e=>this.arrowElement=e,class:`arrow w-4 h-2 ${(e=this.currentPlacement)!==null&&e!==void 0?e:"top"}`}),i("header",{key:"fb7c440f138f4950dbfd0c6e473ab769d37e5e20",class:o()},i("div",{key:"ed166db8cf2ced87a0442af476037f0706ad5f67",class:s()},this.statusIcon&&i("bcm-icon",{key:"077dd2de165608062c49ad831c0d67488e5270de","icon-name":m[this.status]}),i("span",{key:"4be735274dad1742b9cd956da5520eb922a9a817",class:c()},this.headerText),i("slot",{key:"59cec868d0e73e3d8f0577fc7528a6332998b93a",name:"header"})),i("div",{key:"225623a00d44c07bfdd6611b7ee98a7fb49ba008",class:n(),onClick:this.handleCancel},i("bcm-icon",{key:"6b096f888794673d678d8edae338edc50485df57","icon-name":"far fa-times"}))),i("main",{key:"4ff8930d218641bb7f3a722ca5a065f7df73a40e",class:"flex-1 mx-auto font-sans text-pretty"},i("slot",{key:"0058d440b9e703ff30d2c41aee14d4122d82aeaa",name:"body"},this.description)),i("footer",{key:"6ffcd9df426bf280b77d2cfb39552647115253ec",class:r()},i("bcm-button",{key:"997610d1ca83cf3357d0a8d3f1102e25d2966240",kind:"outline",size:this.size,onClick:this.handleCancel},this.cancelText),i("bcm-button",{key:"c1f633f3e8837b724dd9e26580a3c7260543e8b4",size:this.size,status:this.status,kind:"primary",onClick:this.handleConfirm},this.confirmText),i("slot",{key:"2f9d5ab32c2e62bcdad247ab4ce93df53358f843",name:"footer"}))))}get el(){return o(this)}};p.style=f;export{p as bcm_pop_confirm};
+//# sourceMappingURL=p-e89ab4a7.entry.js.map

package/dist/bromcom-ui/p-e89ab4a7.entry.js.map

@@ -0,0 +1 @@
+{"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 'tailwind-variants';\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    /**\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,CAChBC,KAAM,0BACNC,QAAS,2BACTC,QAAS,mCACTC,MAAO,wB,MAqEEC,EAAU,MALvB,WAAAC,CAAAC,G,sFAeIC,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,MAqDVV,KAAAW,mBAAsBC,IAC1BA,EAAMC,iBACND,EAAME,kBAEN,IAAKd,KAAKU,OAAQ,CACdV,KAAKU,OAAS,KACdK,uBAAsB,KAClBf,KAAKgB,gBAAgB,G,GAUzBhB,KAAAiB,cAAiBL,IACrBA,EAAMC,iBACND,EAAME,kBACNd,KAAKU,OAAS,MACdV,KAAKkB,WAAWC,MAAM,EAQlBnB,KAAAoB,aAAgBR,IACpBA,EAAMC,iBACND,EAAME,kBACNd,KAAKU,OAAS,MACdV,KAAKqB,UAAUF,MAAM,EA4BjBnB,KAAAgB,eAAiBM,UACrB,IAAKtB,KAAKuB,iBAAmBvB,KAAKwB,iBAAmBxB,KAAKyB,aAAc,OAExE,MAAMC,EAAEA,EAACC,EAAEA,EAACrB,UAAEA,EAASsB,eAAEA,SAAyBC,EAAgB7B,KAAKuB,eAAgBvB,KAAKwB,eAAgB,CACxGlB,UAAWN,KAAKM,UAChBwB,WAAY,CAACC,EAAO,IAAKC,EAAK,CAAEC,mBAAoB,CAAC,MAAO,OAAQ,SAAU,WAAaC,EAAM,CAAEC,QAAS,IAAMC,EAAM,CAAEC,QAASrC,KAAKyB,kBAG5IzB,KAAKsC,iBAAmBhC,EAExBiC,OAAOC,OAAOxC,KAAKwB,eAAeiB,MAAO,CACrCC,KAAM,GAAGhB,MACTiB,IAAK,GAAGhB,QAGZ,MAAQD,EAAGkB,EAAQjB,EAAGkB,GAAWjB,EAAeQ,OAAS,CAAEV,EAAG,EAAGC,EAAG,GACpE,MAAMmB,EAAgBxC,EAAUyC,MAAM,KAAK,GAE3C,MAAMC,EAAa,CACfL,IAAK,SACLM,MAAO,OACPC,OAAQ,MACRR,KAAM,SACRI,GAEFP,OAAOC,OAAOxC,KAAKyB,aAAagB,MAAO,CACnCC,KAAME,GAAU,KAAO,GAAGA,MAAa,GACvCD,IAAKE,GAAU,KAAO,GAAGA,MAAa,GACtCG,CAACA,GAAa,CAAC,MAAO,UAAUG,SAASL,GAAiB,OAAS,SACrE,EA4BE9C,KAAAoD,QAAUC,EAAG,CACjBC,MAAO,CACHC,UAAW,8GACXC,OAAQ,oCACRC,kBAAmB,gEACnBC,cAAe,yHACfC,eAAgB,mCAChBC,OAAQ,mCAEZC,SAAU,CACNtD,KAAM,CACFuD,MAAO,CACHP,UAAW,iCACXC,OAAQ,cACRI,OAAQ,cACRD,eAAgB,cAChBF,kBAAmB,SAEvBM,OAAQ,CACJR,UAAW,iCACXC,OAAQ,cACRI,OAAQ,cACRD,eAAgB,cAChBF,kBAAmB,WAEvBO,MAAO,CACHT,UAAW,iCACXC,OAAQ,cACRI,OAAQ,cACRD,eAAgB,cAChBF,kBAAmB,WAI/BQ,gBAAiB,CACb1D,KAAM,W,CAxKd,gBAAA2D,GACIlE,KAAKuB,eAAiB4C,SAASC,eAAepE,KAAKqE,UACnD,IAAKrE,KAAKuB,eAAgB,CACtB+C,QAAQC,KAAK,2BAA2BvE,KAAKqE,wBAC7C,M,CAEJrE,KAAKuB,eAAeiD,iBAAiB,QAASxE,KAAKW,mB,CAkDvD,UAAM8D,GACFzE,KAAKU,OAAS,KACdK,uBAAsB,KAClBf,KAAKgB,gBAAgB,G,CAS7B,UAAM0D,GACF1E,KAAKU,OAAS,K,CA2ClB,gBAAYiE,GACR,MAAO,CACH,eAAgB,2BAA2B3E,KAAKQ,UAChD,gBAAiBR,KAAKC,W,CAQ9B,oBAAA2E,GACI,GAAI5E,KAAKuB,eAAgB,CACrBvB,KAAKuB,eAAesD,oBAAoB,QAAS7E,KAAKW,mB,EAoD9D,MAAAmE,G,MACI,MAAMvB,UAAEA,EAASC,OAAEA,EAAMI,OAAEA,EAAMH,kBAAEA,EAAiBC,cAAEA,EAAaC,eAAEA,GAAmB3D,KAAKoD,QAAQ,CACjG7C,KAAMP,KAAKO,OAEf,OACIwE,EAACC,EAAQ,CAAAC,IAAA,4CACJjF,KAAKU,QACFqE,EAAA,OAAAE,IAAA,2CAAKC,KAAK,SAAQ,kBAAiB,oBAAoBzC,MAAOzC,KAAK2E,aAAcQ,MAAO5B,IAAa6B,IAAKC,GAAOrF,KAAKwB,eAAiB6D,GAEnIN,EAAA,OAAAE,IAAA,2CAAKG,IAAKC,GAAOrF,KAAKyB,aAAe4D,EAAKF,MAAO,kBAAiBG,EAAAtF,KAAKsC,oBAAgB,MAAAgD,SAAA,EAAAA,EAAI,UAG3FP,EAAA,UAAAE,IAAA,2CAAQE,MAAO3B,KACXuB,EAAA,OAAAE,IAAA,2CAAKE,MAAO1B,KACPzD,KAAKS,YAAcsE,EAAA,YAAAE,IAAA,uDAAqBzF,EAAYQ,KAAKQ,UAC1DuE,EAAA,QAAAE,IAAA,2CAAME,MAAOxB,KAAmB3D,KAAKK,YACrC0E,EAAA,QAAAE,IAAA,2CAAMM,KAAK,YAEfR,EAAA,OAAAE,IAAA,2CAAKE,MAAOzB,IAAiB8B,QAASxF,KAAKoB,cACvC2D,EAAA,YAAAE,IAAA,uDAAoB,mBAK5BF,EAAA,QAAAE,IAAA,2CAAME,MAAM,wCACRJ,EAAA,QAAAE,IAAA,2CAAMM,KAAK,QAAQvF,KAAKI,cAI5B2E,EAAA,UAAAE,IAAA,2CAAQE,MAAOvB,KACXmB,EAAA,cAAAE,IAAA,2CAAYQ,KAAK,UAAUlF,KAAMP,KAAKO,KAAMiF,QAASxF,KAAKoB,cACrDpB,KAAKE,YAEV6E,EAAA,cAAAE,IAAA,2CAAY1E,KAAMP,KAAKO,KAAMC,OAAQR,KAAKQ,OAAQiF,KAAK,UAAUD,QAASxF,KAAKiB,eAC1EjB,KAAKG,aAEV4E,EAAA,QAAAE,IAAA,2CAAMM,KAAK,a","ignoreList":[]}

package/dist/bromcom-ui/{p-4f402148.entry.js → p-f2d8aa70.entry.js}

@@ -1,2 +1,2 @@
-import{r as o,c as r,h as a,g as e}from"./p-15fe392b.js";const t=".block{display:block}:host{--bcm-accordion-border:var(--bcm-ui-color-border-default);--bcm-accordion-radius:6px;display:block;width:100%}.bcm-ui-element{-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;font-family:Inter,sans-serif}.collapse{visibility:collapse}.static{position:static}.flex{display:flex}.w-full{width:100%}.flex-col{flex-direction:column}.rounded-\\[--bcm-accordion-radius\\]{border-radius:var(--bcm-accordion-radius)}.border{border-width:1px}.border-solid{border-style:solid}.border-\\[--bcm-accordion-border\\]{border-color:var(--bcm-accordion-border)}.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)}.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)}";const i=t;const s=class{constructor(a){o(this,a);this.bcmAccordionGroupChange=r(this,"bcmAccordionGroupChange",1);this.multi=false;this.accordionItems=[];this.handleSlotChange=()=>{this.accordionItems=Array.from(this.host.querySelectorAll("bcm-accordion"));this.setGroupBehavior();if(this.accordionItems.length===0){console.warn("No accordion items found in accordion group")}}}async expandAll(){if(!this.multi){console.warn("expandAll is only available when multi=true");return}await Promise.all(this.accordionItems.map((o=>o.expand())))}async collapseAll(){await Promise.all(this.accordionItems.map((o=>o.collapse())))}async getExpandedItems(){return this.accordionItems.filter((o=>o.expanded))}componentWillLoad(){this.handleSlotChange()}setGroupBehavior(){this.accordionItems.forEach((o=>{o.group=true}))}handleAccordionChange(o){this.handleSlotChange();const{expanded:r,source:a}=o===null||o===void 0?void 0:o.detail;if(!this.multi){this.accordionItems.forEach((o=>{if(o!==a){o.collapse()}o.expanded=o===a?r:false}))}const e=this.accordionItems.filter((o=>o.expanded));this.bcmAccordionGroupChange.emit({expanded:r,changed:a,expandedItems:e,expandedCount:e.length})}render(){return a("div",{key:"04ec31b987f1a191437682ce92bc794da6971128",class:"flex flex-col bcm-ui-element w-full border border-solid border-[--bcm-accordion-border] rounded-[--bcm-accordion-radius]",role:"group","aria-label":"Accordion group"},a("slot",{key:"ba5809b40e06bd66bed5041b90a864bd2eeeae43",onSlotchange:this.handleSlotChange}))}get host(){return e(this)}};s.style=i;export{s as bcm_accordion_group};
-//# sourceMappingURL=p-4f402148.entry.js.map
+import{r as o,c as r,h as a,g as e}from"./p-c9b736d9.js";const t=".block{display:block}:host{--bcm-accordion-border:var(--bcm-ui-color-border-default);--bcm-accordion-radius:6px;display:block;width:100%}.bcm-ui-element{-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;font-family:Inter,sans-serif}.collapse{visibility:collapse}.static{position:static}.flex{display:flex}.w-full{width:100%}.flex-col{flex-direction:column}.rounded-\\[--bcm-accordion-radius\\]{border-radius:var(--bcm-accordion-radius)}.border{border-width:1px}.border-solid{border-style:solid}.border-\\[--bcm-accordion-border\\]{border-color:var(--bcm-accordion-border)}.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)}.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)}";const i=t;const s=class{constructor(a){o(this,a);this.bcmAccordionGroupChange=r(this,"bcmAccordionGroupChange",1);this.multi=false;this.accordionItems=[];this.handleSlotChange=()=>{this.accordionItems=Array.from(this.host.querySelectorAll("bcm-accordion"));this.setGroupBehavior();if(this.accordionItems.length===0){console.warn("No accordion items found in accordion group")}}}async expandAll(){if(!this.multi){console.warn("expandAll is only available when multi=true");return}await Promise.all(this.accordionItems.map((o=>o.expand())))}async collapseAll(){await Promise.all(this.accordionItems.map((o=>o.collapse())))}async getExpandedItems(){return this.accordionItems.filter((o=>o.expanded))}componentWillLoad(){this.handleSlotChange()}setGroupBehavior(){this.accordionItems.forEach((o=>{o.group=true}))}handleAccordionChange(o){this.handleSlotChange();const{expanded:r,source:a}=o===null||o===void 0?void 0:o.detail;if(!this.multi){this.accordionItems.forEach((o=>{if(o!==a){o.collapse()}o.expanded=o===a?r:false}))}const e=this.accordionItems.filter((o=>o.expanded));this.bcmAccordionGroupChange.emit({expanded:r,changed:a,expandedItems:e,expandedCount:e.length})}render(){return a("div",{key:"04ec31b987f1a191437682ce92bc794da6971128",class:"flex flex-col bcm-ui-element w-full border border-solid border-[--bcm-accordion-border] rounded-[--bcm-accordion-radius]",role:"group","aria-label":"Accordion group"},a("slot",{key:"ba5809b40e06bd66bed5041b90a864bd2eeeae43",onSlotchange:this.handleSlotChange}))}get host(){return e(this)}};s.style=i;export{s as bcm_accordion_group};
+//# sourceMappingURL=p-f2d8aa70.entry.js.map

package/dist/bromcom-ui/p-f4e8a47d.entry.js

@@ -0,0 +1,2 @@
+import{r as t,h as o,g as i}from"./p-c9b736d9.js";import{c as s,o as a,f as e,s as d}from"./p-9594cebb.js";const n=".contents{display:contents}:host{display:contents;width:100%}.static{position:static}.flex{display:flex}.max-h-\\[--dropdown-box-max-height\\]{max-height:var(--dropdown-box-max-height)}.w-full{width:100%}.min-w-\\[--dropdown-box-min-weight\\]{min-width:var(--dropdown-box-min-weight)}.max-w-\\[--dropdown-box-max-weight\\]{max-width:var(--dropdown-box-max-weight)}.flex-col{flex-direction:column}.items-center{align-items:center}.rounded-lg{border-radius:var(--bcm-ui-border-radius-lg,8px)}.bg-\\[--dropdown-box-background-color\\]{background-color:var(--dropdown-box-background-color)}.py-1\\.5{padding-bottom:.375rem;padding-top:.375rem}.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}.absolute{position:absolute}.z-\\[1000\\]{z-index:1000}.block{display:block}.min-w-max{min-width:max-content}";const h=n;const c=class{constructor(o){t(this,o);this.isVisible=false}componentDidLoad(){requestAnimationFrame((()=>{this.targetEl=this.targetElement||(this.targetId?document.getElementById(this.targetId):null);this.floatingEl=this.host.shadowRoot.querySelector(".floating-content");if(this.targetEl){this.targetEl.addEventListener("click",(t=>{t.stopPropagation();this.toggle()}));const t=t=>{var o,i;const s=t.target;if(!((o=this.floatingEl)===null||o===void 0?void 0:o.contains(s))&&!((i=this.targetEl)===null||i===void 0?void 0:i.contains(s))&&!this.host.contains(s)){this.hide()}};document.addEventListener("click",t);this.host["_handleClickOutside"]=t}}))}async updatePosition(){if(!this.targetEl||!this.floatingEl)return;const{x:t,y:o}=await s(this.targetEl,this.floatingEl,{placement:"bottom-start",middleware:[a(2),e({fallbackPlacements:["top-start"]}),d({padding:8})]});Object.assign(this.floatingEl.style,{left:`${t}px`,top:`${o}px`})}show(){this.isVisible=true;this.updatePosition()}hide(){this.isVisible=false}toggle(){this.isVisible=!this.isVisible;if(this.isVisible){this.updatePosition()}}render(){return o("div",{key:"3f941aabcf3f17e8ee628c645ebb1316a305a43f",class:"floating-content z-[1000] flex min-w-max",style:{display:this.isVisible?"block":"none",position:"absolute",top:"0px",left:"0px"}},o("slot",{key:"d75ff826bc512230c7befcf51757797ffe52abc6"}))}disconnectedCallback(){if(this.targetEl){this.targetEl.removeEventListener("mouseenter",(()=>this.show()));this.targetEl.removeEventListener("mouseleave",(()=>this.hide()));this.targetEl.removeEventListener("click",(()=>this.toggle()))}}get host(){return i(this)}};c.style=h;export{c as bcm_linked};
+//# sourceMappingURL=p-f4e8a47d.entry.js.map

package/dist/bromcom-ui/p-f4e8a47d.entry.js.map

@@ -0,0 +1 @@
+{"version":3,"names":["linkedCss","BcmLinkedStyle0","BcmLinked","constructor","hostRef","this","isVisible","componentDidLoad","requestAnimationFrame","targetEl","targetElement","targetId","document","getElementById","floatingEl","host","shadowRoot","querySelector","addEventListener","e","stopPropagation","toggle","handleClickOutside","target","_a","contains","_b","hide","updatePosition","x","y","computePosition","placement","middleware","offset","flip","fallbackPlacements","shift","padding","Object","assign","style","left","top","show","render","h","key","class","display","position","disconnectedCallback","removeEventListener"],"sources":["src/components/linked/linked.css?tag=bcm-linked&encapsulation=shadow","src/components/linked/linked.component.tsx"],"sourcesContent":[":host {\n  display: contents;\n  width: 100%;\n}\n","import { Component, ComponentInterface, Prop, Element, State, h } from \"@stencil/core\";\nimport { computePosition, flip, shift, offset } from '@floating-ui/dom';\n\n@Component({\n    tag: 'bcm-linked',\n    styleUrl: 'linked.css',\n    shadow: true,\n})\nexport class BcmLinked implements ComponentInterface {\n    @Element() host: HTMLElement;\n\n    @Prop({ reflect: true, attribute: 'target-id' }) targetId: string;\n\n    @Prop() targetElement?: HTMLElement;\n\n    @State() isVisible: boolean = false;\n\n    private floatingEl?: HTMLElement;\n    private targetEl?: HTMLElement;\n\n\n    componentDidLoad() {\n        requestAnimationFrame(() => {\n            this.targetEl = this.targetElement || (this.targetId ? document.getElementById(this.targetId) : null);\n            this.floatingEl = this.host.shadowRoot.querySelector('.floating-content');\n\n            if (this.targetEl) {\n                this.targetEl.addEventListener('click', (e) => {\n                    e.stopPropagation();\n                    this.toggle();\n                });\n\n                const handleClickOutside = (e: MouseEvent) => {\n                    const target = e.target as Node;\n                    if (!this.floatingEl?.contains(target) &&\n                        !this.targetEl?.contains(target) &&\n                        !this.host.contains(target)) {\n                        this.hide();\n                    }\n                };\n\n                document.addEventListener('click', handleClickOutside);\n\n                this.host['_handleClickOutside'] = handleClickOutside;\n            }\n        });\n    }\n\n    private async updatePosition() {\n        if (!this.targetEl || !this.floatingEl) return;\n\n        const { x, y } = await computePosition(this.targetEl, this.floatingEl, {\n            placement: 'bottom-start',\n            middleware: [\n                offset(2),\n                flip({\n                    fallbackPlacements: ['top-start'],\n                }),\n                shift({ padding: 8 }),\n            ],\n        });\n\n        Object.assign(this.floatingEl.style, {\n            left: `${x}px`,\n            top: `${y}px`,\n        });\n    }\n\n    private show() {\n        this.isVisible = true;\n        this.updatePosition();\n    }\n\n    private hide() {\n        this.isVisible = false;\n    }\n\n    private toggle() {\n        this.isVisible = !this.isVisible;\n        if (this.isVisible) {\n            this.updatePosition();\n        }\n    }\n\n    render() {\n        return (\n            <div\n                class=\"floating-content z-[1000] flex min-w-max\"\n                style={{\n                    display: this.isVisible ? 'block' : 'none',\n                    position: 'absolute',\n                    top: \"0px\",\n                    left: \"0px\",\n                }}\n            >\n                <slot></slot>\n            </div>\n        );\n    }\n\n    disconnectedCallback() {\n        if (this.targetEl) {\n            this.targetEl.removeEventListener('mouseenter', () => this.show());\n            this.targetEl.removeEventListener('mouseleave', () => this.hide());\n            this.targetEl.removeEventListener('click', () => this.toggle());\n        }\n    }\n}"],"mappings":"2GAAA,MAAMA,EAAY,2kCAClB,MAAAC,EAAeD,E,MCOFE,EAAS,MALtB,WAAAC,CAAAC,G,UAYaC,KAAAC,UAAqB,K,CAM9B,gBAAAC,GACIC,uBAAsB,KAClBH,KAAKI,SAAWJ,KAAKK,gBAAkBL,KAAKM,SAAWC,SAASC,eAAeR,KAAKM,UAAY,MAChGN,KAAKS,WAAaT,KAAKU,KAAKC,WAAWC,cAAc,qBAErD,GAAIZ,KAAKI,SAAU,CACfJ,KAAKI,SAASS,iBAAiB,SAAUC,IACrCA,EAAEC,kBACFf,KAAKgB,QAAQ,IAGjB,MAAMC,EAAsBH,I,QACxB,MAAMI,EAASJ,EAAEI,OACjB,MAAKC,EAAAnB,KAAKS,cAAU,MAAAU,SAAA,SAAAA,EAAEC,SAASF,QAC1BG,EAAArB,KAAKI,YAAQ,MAAAiB,SAAA,SAAAA,EAAED,SAASF,MACxBlB,KAAKU,KAAKU,SAASF,GAAS,CAC7BlB,KAAKsB,M,GAIbf,SAASM,iBAAiB,QAASI,GAEnCjB,KAAKU,KAAK,uBAAyBO,C,KAKvC,oBAAMM,GACV,IAAKvB,KAAKI,WAAaJ,KAAKS,WAAY,OAExC,MAAMe,EAAEA,EAACC,EAAEA,SAAYC,EAAgB1B,KAAKI,SAAUJ,KAAKS,WAAY,CACnEkB,UAAW,eACXC,WAAY,CACRC,EAAO,GACPC,EAAK,CACDC,mBAAoB,CAAC,eAEzBC,EAAM,CAAEC,QAAS,OAIzBC,OAAOC,OAAOnC,KAAKS,WAAW2B,MAAO,CACjCC,KAAM,GAAGb,MACTc,IAAK,GAAGb,O,CAIR,IAAAc,GACJvC,KAAKC,UAAY,KACjBD,KAAKuB,gB,CAGD,IAAAD,GACJtB,KAAKC,UAAY,K,CAGb,MAAAe,GACJhB,KAAKC,WAAaD,KAAKC,UACvB,GAAID,KAAKC,UAAW,CAChBD,KAAKuB,gB,EAIb,MAAAiB,GACI,OACIC,EAAA,OAAAC,IAAA,2CACIC,MAAM,2CACNP,MAAO,CACHQ,QAAS5C,KAAKC,UAAY,QAAU,OACpC4C,SAAU,WACVP,IAAK,MACLD,KAAM,QAGVI,EAAA,QAAAC,IAAA,6C,CAKZ,oBAAAI,GACI,GAAI9C,KAAKI,SAAU,CACfJ,KAAKI,SAAS2C,oBAAoB,cAAc,IAAM/C,KAAKuC,SAC3DvC,KAAKI,SAAS2C,oBAAoB,cAAc,IAAM/C,KAAKsB,SAC3DtB,KAAKI,SAAS2C,oBAAoB,SAAS,IAAM/C,KAAKgB,U","ignoreList":[]}

package/dist/cjs/app-globals-29edfda4.js.map

@@ -1 +1 @@
-{"file":"app-globals-29edfda4.js","mappings":";;AAAA,SAAS,aAAa,CAAC,GAAG,EAAE;AAC5B,IAAI,MAAM,IAAI,GAAG,QAAQ,CAAC;AAC1B,IAAI,MAAM,MAAM,GAAG,QAAQ,CAAC,aAAa,CAAC;AAC1C,IAAI,MAAM,CAAC,IAAI,CAAC,GAAG,CAAC,CAAC,OAAO,CAAC,GAAG;AAChC,QAAQ,MAAM,CAAC,GAAG,CAAC,GAAG,GAAG,CAAC;AAC1B;AACA,IAAI,IAAI,CAAC,WAAW,CAAC;AACrB;;AAEA,MAAM,aAAa,GAAG,qEAAqE,CAAC;;AAE5F,IAAI,WAAW,GAAG;;AAElB,QAAQ,MAAM,MAAM;AACpB,QAAQ;AACR;AACA;AACA,MAAM,CAAC,CAAC;AACR,KAAK;AACL,IAAI,IAAI,IAAI,GAAG;AACf,QAAQ,OAAO,IAAI,CAAC,YAAY,CAAC,MAAM,CAAC,IAAI,IAAI,CAAC;AACjD,KAAK;AACL,IAAI;AACJ;;AAEA,IAAI;AACJ,QAAQ,IAAI,CAAC,KAAK,CAAC,OAAO,GAAG,cAAc,CAAC;AAC5C;;AAEA,CAAC,CAAC,CAAC;AACI,MAAM,QAAQ,GAAG,MAAM,GAAG;;AC7BrB,MAAC,aAAa,GAAGA;;;;","names":["appGlobalScript"],"sources":["src/global/global.js","@stencil/core/internal/app-globals"],"sourcesContent":["function addHeadScript(obj) {\n  const head = document.head;\n  const script = document.createElement('script');\n  Object.keys(obj).forEach(key => {\n    script[key] = obj[key];\n  });\n  head.appendChild(script);\n}\n\naddHeadScript({ src: 'https://kit.fontawesome.com/5e86bea963.js', crossOrigin: 'anonymous' });\n\nconst FA_GLOBAL_CSS = 'https://designsystem.bromcomcloud.com/fontawesome/6/css/all.min.css';\n\ncustomElements.define(\n  'bcm-icon',\n  class extends HTMLElement {\n    constructor() {\n      super();\n      const shadow = this.attachShadow({ mode: 'open' });\n      shadow.innerHTML = `\n        <link rel=\"stylesheet\" href=\"${FA_GLOBAL_CSS}\"/>\n        <i></i>\n      `;\n    }\n\n    get icon() {\n      return this.getAttribute('name') || this.getAttribute('icon-name');\n    }\n\n    set icon(icon) {\n      this.shadowRoot.querySelector('i').className = `${icon}`;\n    }\n\n    connectedCallback() {\n      this.style.display = 'inline-block';\n      this.icon = this.icon;\n    }\n  },\n);\n","import appGlobalScript from '/Users/muratpolatozkan/works/bromcom/bromcom-ui-next/src/global/global.js';\nexport const globalScripts = appGlobalScript;\n"],"version":3}
+{"file":"app-globals-29edfda4.js","mappings":";;AAAA,SAAS,aAAa,CAAC,GAAG,EAAE;AAC5B,IAAI,MAAM,IAAI,GAAG,QAAQ,CAAC;AAC1B,IAAI,MAAM,MAAM,GAAG,QAAQ,CAAC,aAAa,CAAC;AAC1C,IAAI,MAAM,CAAC,IAAI,CAAC,GAAG,CAAC,CAAC,OAAO,CAAC,GAAG;AAChC,QAAQ,MAAM,CAAC,GAAG,CAAC,GAAG,GAAG,CAAC;AAC1B;AACA,IAAI,IAAI,CAAC,WAAW,CAAC;AACrB;;AAEA,MAAM,aAAa,GAAG,qEAAqE,CAAC;;AAE5F,IAAI,WAAW,GAAG;;AAElB,QAAQ,MAAM,MAAM;AACpB,QAAQ;AACR;AACA;AACA,MAAM,CAAC,CAAC;AACR,KAAK;AACL,IAAI,IAAI,IAAI,GAAG;AACf,QAAQ,OAAO,IAAI,CAAC,YAAY,CAAC,MAAM,CAAC,IAAI,IAAI,CAAC;AACjD,KAAK;AACL,IAAI;AACJ;;AAEA,IAAI;AACJ,QAAQ,IAAI,CAAC,KAAK,CAAC,OAAO,GAAG,cAAc,CAAC;AAC5C;;AAEA,CAAC,CAAC,CAAC;AACI,MAAM,QAAQ,GAAG,MAAM,GAAG;;AC7BrB,MAAC,aAAa,GAAGA;;;;","names":["appGlobalScript"],"sources":["src/global/global.js","@stencil/core/internal/app-globals"],"sourcesContent":["function addHeadScript(obj) {\n  const head = document.head;\n  const script = document.createElement('script');\n  Object.keys(obj).forEach(key => {\n    script[key] = obj[key];\n  });\n  head.appendChild(script);\n}\n\naddHeadScript({ src: 'https://kit.fontawesome.com/5e86bea963.js', crossOrigin: 'anonymous' });\n\nconst FA_GLOBAL_CSS = 'https://designsystem.bromcomcloud.com/fontawesome/6/css/all.min.css';\n\ncustomElements.define(\n  'bcm-icon',\n  class extends HTMLElement {\n    constructor() {\n      super();\n      const shadow = this.attachShadow({ mode: 'open' });\n      shadow.innerHTML = `\n        <link rel=\"stylesheet\" href=\"${FA_GLOBAL_CSS}\"/>\n        <i></i>\n      `;\n    }\n\n    get icon() {\n      return this.getAttribute('name') || this.getAttribute('icon-name');\n    }\n\n    set icon(icon) {\n      this.shadowRoot.querySelector('i').className = `${icon}`;\n    }\n\n    connectedCallback() {\n      this.style.display = 'inline-block';\n      this.icon = this.icon;\n    }\n  },\n);\n","import appGlobalScript from '/Users/muratpolatozkan/works/bromcom/bromcom-ui-v2/src/global/global.js';\nexport const globalScripts = appGlobalScript;\n"],"version":3}

package/dist/cjs/bcm-accordion-group.cjs.entry.js

@@ -2,7 +2,7 @@
 
 Object.defineProperty(exports, '__esModule', { value: true });
 
-const index = require('./index-4795c073.js');
+const index = require('./index-9a2c5938.js');
 
 const accordionGroupCss = ".block{display:block}:host{--bcm-accordion-border:var(--bcm-ui-color-border-default);--bcm-accordion-radius:6px;display:block;width:100%}.bcm-ui-element{-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;font-family:Inter,sans-serif}.collapse{visibility:collapse}.static{position:static}.flex{display:flex}.w-full{width:100%}.flex-col{flex-direction:column}.rounded-\\[--bcm-accordion-radius\\]{border-radius:var(--bcm-accordion-radius)}.border{border-width:1px}.border-solid{border-style:solid}.border-\\[--bcm-accordion-border\\]{border-color:var(--bcm-accordion-border)}.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)}.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)}";
 const BcmAccordionGroupStyle0 = accordionGroupCss;

package/dist/cjs/bcm-accordion.cjs.entry.js

@@ -2,7 +2,7 @@
 
 Object.defineProperty(exports, '__esModule', { value: true });
 
-const index = require('./index-4795c073.js');
+const index = require('./index-9a2c5938.js');
 const index$1 = require('./index-310db2a6.js');
 
 const accordionCss = ".block{display:block}.flex{display:flex}.border{border-width:1px}:host{--bcm-accordion-bg:var(--bcm-ui-color-background-basic-panel);--bcm-accordion-content-bg:var(--bcm-ui-color-background-basic-base);--bcm-accordion-text:var(--bcm-ui-color-text-header);--bcm-accordion-border:var(--bcm-ui-color-border-default);--bcm-accordion-radius:6px;--bcm-accordion-footer-bg:var(--bcm-ui-color-background-default-default);display:block;width:100%}:host(:not([group])) .accordion-container{border:1px solid var(--bcm-accordion-border);border-radius:var(--bcm-accordion-radius)}:host([group]) .accordion-container{border-bottom:1px solid var(--bcm-accordion-border);border-radius:0}:host([group]:last-of-type) .accordion-container{border-bottom:none}:host([group]:first-of-type) .accordion-container{border-top-left-radius:var(--bcm-accordion-radius);border-top-right-radius:var(--bcm-accordion-radius)}:host([group]:last-of-type) .accordion-footer{border-bottom-left-radius:var(--bcm-accordion-radius);border-bottom-right-radius:var(--bcm-accordion-radius)}:host(:not([group])) .accordion-footer{border-bottom-left-radius:var(--bcm-accordion-radius);border-bottom-right-radius:var(--bcm-accordion-radius)}::slotted([slot=title]){align-items:center;display:flex;flex-direction:row;gap:10px}::slotted([slot=actions]){align-items:center;display:flex;flex-direction:row;gap:12px}.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}.collapse{visibility:collapse}.static{position:static}.hidden{display:none}.w-full{width:100%}.min-w-max{min-width:max-content}.rotate-0{--tw-rotate:0deg}.rotate-0,.rotate-180{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))}.rotate-180{--tw-rotate:180deg}.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))}.cursor-pointer{cursor:pointer}.flex-row{flex-direction:row}.flex-col{flex-direction:column}.flex-nowrap{flex-wrap:nowrap}.items-center{align-items:center}.justify-between{justify-content:space-between}.gap-2{gap:.5rem}.gap-2\\.5{gap:.625rem}.overflow-hidden{overflow:hidden}.text-wrap{text-wrap:wrap}.rounded-\\[--bcm-accordion-radius\\]{border-radius:var(--bcm-accordion-radius)}.bg-\\[--bcm-accordion-bg\\]{background-color:var(--bcm-accordion-bg)}.bg-\\[--bcm-accordion-footer-bg\\]{background-color:var(--bcm-accordion-footer-bg)}.p-4{padding:1rem}.px-4{padding-left:1rem;padding-right:1rem}.py-2{padding-bottom:.5rem;padding-top:.5rem}.text-size-4{font-size:var(--bcm-ui-font-size-4,14px);line-height:var(--bcm-ui-line-height-4,20px)}.text-size-6{font-size:var(--bcm-ui-font-size-6,18px);line-height:var(--bcm-ui-line-height-6,24px)}.font-normal{font-weight:400}.font-semibold{font-weight:600}.text-\\[--bcm-accordion-text\\]{color:var(--bcm-accordion-text)}.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)}.transition-all{transition-duration:.15s;transition-property:all;transition-timing-function:cubic-bezier(.4,0,.2,1)}.transition-transform{transition-duration:.15s;transition-property:transform;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)}";

package/dist/cjs/bcm-alert.cjs.entry.js

@@ -2,7 +2,7 @@
 
 Object.defineProperty(exports, '__esModule', { value: true });
 
-const index = require('./index-4795c073.js');
+const index = require('./index-9a2c5938.js');
 const index$1 = require('./index-310db2a6.js');
 
 const alertCss = ":host{--bcm-alert-bg:var(--bcm-ui-color-background-default-default);--bcm-alert-text:var(--bcm-ui-color-text-default);--bcm-alert-radius:6px;display:inline-block;width:100%}.bcm-ui-element{-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;font-family:Inter,sans-serif}.static{position:static}.flex{display:flex}.w-full{width:100%}.cursor-pointer{cursor:pointer}.items-center{align-items:center}.justify-between{justify-content:space-between}.gap-2{gap:.5rem}.gap-3{gap:.75rem}.rounded-\\[--bcm-alert-radius\\]{border-radius:var(--bcm-alert-radius)}.bg-\\[--bcm-alert-bg\\]{background-color:var(--bcm-alert-bg)}.px-3{padding-left:.75rem;padding-right:.75rem}.py-1\\.5{padding-bottom:.375rem;padding-top:.375rem}.py-2{padding-bottom:.5rem;padding-top:.5rem}.py-2\\.5{padding-bottom:.625rem;padding-top:.625rem}.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}.text-\\[--bcm-alert-text\\]{color:var(--bcm-alert-text)}.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)}";

package/dist/cjs/bcm-avatar_4.cjs.entry.js

@@ -2,11 +2,11 @@
 
 Object.defineProperty(exports, '__esModule', { value: true });
 
-const index = require('./index-4795c073.js');
+const index = require('./index-9a2c5938.js');
 const index$1 = require('./index-5a88e57b.js');
 const index$2 = require('./index-310db2a6.js');
 
-const avatarCss = ":host{--bcm-avatar-bg:var(--bcm-ui-color-background-default-default);--bcm-avatar-text:var(--bcm-ui-color-text-default);--bcm-avatar-radius:50%}.bcm-ui-element{-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;font-family:Inter,sans-serif}.static{position:static}.-right-0\\.5{right:-.125rem}.-top-0\\.5{top:-.125rem}.right-0{right:0}.top-0{top:0}.inline-flex{display:inline-flex}.h-10{height:2.5rem}.h-6{height:1.5rem}.h-8{height:2rem}.h-full{height:100%}.w-10{width:2.5rem}.w-6{width:1.5rem}.w-8{width:2rem}.w-full{width:100%}.items-center{align-items:center}.justify-center{justify-content:center}.rounded-\\[--bcm-ui-radius\\]{border-radius:var(--bcm-ui-radius)}.rounded-full{border-radius:9999px}.bg-\\[--bcm-avatar-bg\\]{background-color:var(--bcm-avatar-bg)}.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}.uppercase{text-transform:uppercase}.text-\\[--bcm-avatar-text\\]{color:var(--bcm-avatar-text)}.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 avatarCss = ":host{--bcm-avatar-bg:var(--bcm-ui-color-background-default-default);--bcm-avatar-text:var(--bcm-ui-color-text-default);--bcm-avatar-radius:50%}.bcm-ui-element{-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;font-family:Inter,sans-serif}.static{position:static}.-right-0\\.5{right:-.125rem}.-top-0\\.5{top:-.125rem}.right-0{right:0}.top-0{top:0}.inline-flex{display:inline-flex}.h-10{height:2.5rem}.h-6{height:1.5rem}.h-8{height:2rem}.h-full{height:100%}.w-10{width:2.5rem}.w-6{width:1.5rem}.w-8{width:2rem}.w-full{width:100%}.items-center{align-items:center}.justify-center{justify-content:center}.rounded-\\[--bcm-ui-radius\\]{border-radius:var(--bcm-ui-radius)}.rounded-full{border-radius:var(--bcm-ui-border-radius-full,9999px)}.bg-\\[--bcm-avatar-bg\\]{background-color:var(--bcm-avatar-bg)}.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}.uppercase{text-transform:uppercase}.text-\\[--bcm-avatar-text\\]{color:var(--bcm-avatar-text)}.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 BcmAvatarStyle0 = avatarCss;
 
 const BcmAvatar = class {
@@ -85,7 +85,7 @@ const BcmAvatar = class {
 };
 BcmAvatar.style = BcmAvatarStyle0;
 
-const badgeCss = ".relative{position:relative}:host{--bcm-badge-bg:var(--bcm-ui-color-background-default-default);--bcm-badge-text:var(--bcm-ui-color-text-default);--bcm-badge-radius:9999px;display:inline-block;position:relative}::slotted([slot=badge]){color:var(--bcm-badge-text);font-weight:500}.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}.absolute{position:absolute}.-bottom-1{bottom:-.25rem}.-left-1{left:-.25rem}.-right-1{right:-.25rem}.-top-1{top:-.25rem}.z-10{z-index:10}.inline-flex{display:inline-flex}.size-1{height:.25rem;width:.25rem}.size-1\\.5{height:.375rem;width:.375rem}.size-2{height:.5rem;width:.5rem}.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))}.items-center{align-items:center}.justify-center{justify-content:center}.gap-0{gap:0}.gap-1{gap:.25rem}.gap-2{gap:.5rem}.rounded-\\[--bcm-badge-radius\\]{border-radius:var(--bcm-badge-radius)}.bg-\\[--bcm-badge-bg\\]{background-color:var(--bcm-badge-bg)}.p-0{padding:0}.px-1{padding-left:.25rem;padding-right:.25rem}.px-1\\.5{padding-left:.375rem;padding-right:.375rem}.px-2{padding-left:.5rem;padding-right:.5rem}.py-0\\.5{padding-bottom:.125rem;padding-top:.125rem}.py-1{padding-bottom:.25rem;padding-top:.25rem}.text-\\[0px\\]{font-size:0}.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)}.font-medium{font-weight:500}.leading-none{line-height:1}.text-\\[--bcm-badge-text\\]{color:var(--bcm-badge-text)}.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)}.after\\:absolute:after{content:var(--tw-content);position:absolute}.after\\:h-full:after{content:var(--tw-content);height:100%}.after\\:w-full:after{content:var(--tw-content);width:100%}@keyframes ping{75%,to{content:var(--tw-content);opacity:0;transform:scale(2)}}.after\\:animate-blink:after{animation:ping 2s infinite;content:var(--tw-content)}.after\\:rounded-full:after{border-radius:9999px;content:var(--tw-content)}.after\\:bg-\\[--bcm-badge-bg\\]:after{background-color:var(--bcm-badge-bg);content:var(--tw-content)}.after\\:content-\\[\\\"\\\"\\]:after{--tw-content:\"\";content:var(--tw-content)}.-right-0\\.5{right:-.125rem}.-top-0\\.5{top:-.125rem}.right-0{right:0}.top-0{top:0}.h-10{height:2.5rem}.h-6{height:1.5rem}.h-8{height:2rem}.h-full{height:100%}.w-10{width:2.5rem}.w-6{width:1.5rem}.w-8{width:2rem}.w-full{width:100%}.rounded-\\[--bcm-ui-radius\\]{border-radius:var(--bcm-ui-radius)}.rounded-full{border-radius:9999px}.bg-\\[--bcm-avatar-bg\\]{background-color:var(--bcm-avatar-bg)}.text-size-6{font-size:var(--bcm-ui-font-size-6,18px);line-height:var(--bcm-ui-line-height-6,24px)}.uppercase{text-transform:uppercase}.text-\\[--bcm-avatar-text\\]{color:var(--bcm-avatar-text)}";
+const badgeCss = ".relative{position:relative}:host{--bcm-badge-bg:var(--bcm-ui-color-background-default-default);--bcm-badge-text:var(--bcm-ui-color-text-default);--bcm-badge-radius:9999px;display:inline-block;position:relative}::slotted([slot=badge]){color:var(--bcm-badge-text);font-weight:500}.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}.absolute{position:absolute}.-bottom-1{bottom:-.25rem}.-left-1{left:-.25rem}.-right-1{right:-.25rem}.-top-1{top:-.25rem}.z-10{z-index:10}.inline-flex{display:inline-flex}.size-1{height:.25rem;width:.25rem}.size-1\\.5{height:.375rem;width:.375rem}.size-2{height:.5rem;width:.5rem}.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))}.items-center{align-items:center}.justify-center{justify-content:center}.gap-0{gap:0}.gap-1{gap:.25rem}.gap-2{gap:.5rem}.rounded-\\[--bcm-badge-radius\\]{border-radius:var(--bcm-badge-radius)}.bg-\\[--bcm-badge-bg\\]{background-color:var(--bcm-badge-bg)}.p-0{padding:0}.px-1{padding-left:.25rem;padding-right:.25rem}.px-1\\.5{padding-left:.375rem;padding-right:.375rem}.px-2{padding-left:.5rem;padding-right:.5rem}.py-0\\.5{padding-bottom:.125rem;padding-top:.125rem}.py-1{padding-bottom:.25rem;padding-top:.25rem}.text-\\[0px\\]{font-size:0}.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)}.font-medium{font-weight:500}.leading-none{line-height:1}.text-\\[--bcm-badge-text\\]{color:var(--bcm-badge-text)}.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)}.after\\:absolute:after{content:var(--tw-content);position:absolute}.after\\:h-full:after{content:var(--tw-content);height:100%}.after\\:w-full:after{content:var(--tw-content);width:100%}@keyframes ping{75%,to{content:var(--tw-content);opacity:0;transform:scale(2)}}.after\\:animate-blink:after{animation:ping 2s infinite;content:var(--tw-content)}.after\\:rounded-full:after{border-radius:var(--bcm-ui-border-radius-full,9999px);content:var(--tw-content)}.after\\:bg-\\[--bcm-badge-bg\\]:after{background-color:var(--bcm-badge-bg);content:var(--tw-content)}.after\\:content-\\[\\\"\\\"\\]:after{--tw-content:\"\";content:var(--tw-content)}.-right-0\\.5{right:-.125rem}.-top-0\\.5{top:-.125rem}.right-0{right:0}.top-0{top:0}.h-10{height:2.5rem}.h-6{height:1.5rem}.h-8{height:2rem}.h-full{height:100%}.w-10{width:2.5rem}.w-6{width:1.5rem}.w-8{width:2rem}.w-full{width:100%}.rounded-\\[--bcm-ui-radius\\]{border-radius:var(--bcm-ui-radius)}.rounded-full{border-radius:var(--bcm-ui-border-radius-full,9999px)}.bg-\\[--bcm-avatar-bg\\]{background-color:var(--bcm-avatar-bg)}.text-size-6{font-size:var(--bcm-ui-font-size-6,18px);line-height:var(--bcm-ui-line-height-6,24px)}.uppercase{text-transform:uppercase}.text-\\[--bcm-avatar-text\\]{color:var(--bcm-avatar-text)}";
 const BcmBadgeStyle0 = badgeCss;
 
 const Badge = class {
@@ -422,7 +422,7 @@ const variantOptions = {
     },
 };
 
-const buttonCss = ".relative{position:relative}:host{display:inline-block;position:relative}:host([full-width]){width:100%}.static{position:static}.inline-flex{display:inline-flex}.min-h-10{min-height:2.5rem}.min-h-6{min-height:1.5rem}.min-h-8{min-height:2rem}.w-full{width:100%}.cursor-not-allowed{cursor:not-allowed}.cursor-pointer{cursor:pointer}.appearance-none{appearance:none}.items-center{align-items:center}.justify-center{justify-content:center}.rounded{border-radius:.25rem}.border{border-width:1px}.border-solid{border-style:solid}.border-\\[--bcm-button-border\\]{border-color:var(--bcm-button-border)}.bg-\\[--bcm-button-bg\\]{background-color:var(--bcm-button-bg)}.bg-\\[--bcm-ui-color-background-disabled-default\\]{background-color:var(--bcm-ui-color-background-disabled-default)}.px-2{padding-left:.5rem;padding-right:.5rem}.px-3{padding-left:.75rem;padding-right:.75rem}.py-0\\.5{padding-bottom:.125rem;padding-top:.125rem}.py-1{padding-bottom:.25rem;padding-top:.25rem}.py-px{padding-bottom:1px;padding-top:1px}.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)}.leading-none{line-height:1}.text-\\[--bcm-button-text\\]{color:var(--bcm-button-text)}.text-color-disabled{color:var(--bcm-ui-color-text-disabled)}.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)}.outline{outline-style:solid}.outline-0{outline-width:0}.hover\\:bg-\\[--bcm-button-bg-hover\\]:hover{background-color:var(--bcm-button-bg-hover)}.focus-visible\\:ring:focus-visible{--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)}.active\\:bg-\\[--bcm-button-bg-active\\]:active{background-color:var(--bcm-button-bg-active)}.flex{display:flex}.max-h-\\[--dropdown-box-max-height\\]{max-height:var(--dropdown-box-max-height)}.min-w-\\[--dropdown-box-min-weight\\]{min-width:var(--dropdown-box-min-weight)}.max-w-\\[--dropdown-box-max-weight\\]{max-width:var(--dropdown-box-max-weight)}.flex-col{flex-direction:column}.rounded-lg{border-radius:.5rem}.bg-\\[--dropdown-box-background-color\\]{background-color:var(--dropdown-box-background-color)}.py-1\\.5{padding-bottom:.375rem;padding-top:.375rem}.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)}";
+const buttonCss = ".relative{position:relative}:host{display:inline-block;position:relative}:host([full-width]){width:100%}:host([position=first]) .bcm-button{border-bottom-right-radius:0;border-top-right-radius:0}:host([position=middle]) .bcm-button{border-radius:0}:host([position=last]) .bcm-button{border-bottom-left-radius:0;border-top-left-radius:0}:host([position=first].orientation-vertical) .bcm-button{border-bottom-left-radius:0;border-bottom-right-radius:0;border-top-left-radius:var(--bcm-ui-border-radius,4px);border-top-right-radius:var(--bcm-ui-border-radius,4px)}:host([position=middle].orientation-vertical) .bcm-button{border-radius:0}:host([position=last].orientation-vertical) .bcm-button{border-bottom-left-radius:var(--bcm-ui-border-radius,4px);border-bottom-right-radius:var(--bcm-ui-border-radius,4px);border-top-left-radius:0;border-top-right-radius:0}.static{position:static}.inline-flex{display:inline-flex}.min-h-10{min-height:2.5rem}.min-h-6{min-height:1.5rem}.min-h-8{min-height:2rem}.w-full{width:100%}.cursor-not-allowed{cursor:not-allowed}.cursor-pointer{cursor:pointer}.appearance-none{appearance:none}.items-center{align-items:center}.justify-center{justify-content:center}.rounded{border-radius:var(--bcm-ui-border-radius-default,6px)}.border{border-width:1px}.border-solid{border-style:solid}.border-\\[--bcm-button-border\\]{border-color:var(--bcm-button-border)}.bg-\\[--bcm-button-bg\\]{background-color:var(--bcm-button-bg)}.bg-\\[--bcm-ui-color-background-disabled-default\\]{background-color:var(--bcm-ui-color-background-disabled-default)}.px-2{padding-left:.5rem;padding-right:.5rem}.px-3{padding-left:.75rem;padding-right:.75rem}.py-0\\.5{padding-bottom:.125rem;padding-top:.125rem}.py-1{padding-bottom:.25rem;padding-top:.25rem}.py-px{padding-bottom:1px;padding-top:1px}.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)}.leading-none{line-height:1}.text-\\[--bcm-button-text\\]{color:var(--bcm-button-text)}.text-color-disabled{color:var(--bcm-ui-color-text-disabled)}.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)}.outline{outline-style:solid}.outline-0{outline-width:0}.hover\\:bg-\\[--bcm-button-bg-hover\\]:hover{background-color:var(--bcm-button-bg-hover)}.focus-visible\\:ring:focus-visible{--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)}.active\\:bg-\\[--bcm-button-bg-active\\]:active{background-color:var(--bcm-button-bg-active)}.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}.absolute{position:absolute}.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}.max-w-64{max-width:16rem}.max-w-80{max-width:20rem}.max-w-96{max-width:24rem}.flex-1{flex:1 1 0%}.flex-row{flex-direction:row}.flex-col{flex-direction:column}.justify-end{justify-content:flex-end}.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-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,.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)}.hover\\:bg-gray-100:hover{background-color:oklch(.967 .003 264.542)}.max-h-\\[--dropdown-box-max-height\\]{max-height:var(--dropdown-box-max-height)}.min-w-\\[--dropdown-box-min-weight\\]{min-width:var(--dropdown-box-min-weight)}.max-w-\\[--dropdown-box-max-weight\\]{max-width:var(--dropdown-box-max-weight)}.rounded-lg{border-radius:var(--bcm-ui-border-radius-lg,8px)}.bg-\\[--dropdown-box-background-color\\]{background-color:var(--dropdown-box-background-color)}.py-1\\.5{padding-bottom:.375rem;padding-top:.375rem}.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)}";
 const BcmButtonStyle0 = buttonCss;
 
 const BcmButton = class {
@@ -492,6 +492,11 @@ const BcmButton = class {
                 loading: {
                     true: '',
                 },
+                position: {
+                    first: 'position-first',
+                    middle: 'position-middle',
+                    last: 'position-last',
+                },
             },
             defaultVariants: {
                 size: 'medium',
@@ -558,13 +563,14 @@ const BcmButton = class {
     }
     render() {
         const { icon, position } = this.buttonIcon;
-        return (index.h(index.Host, { key: 'b1188fbe4439c4878a3306020097d07913b2212d' }, index.h("button", { key: 'eae7a80a19ea54120102d93127f55b039833bc54', type: this.type, disabled: this.disabled || this.loading, "aria-label": this.label, "aria-expanded": this.expanded, "aria-controls": this.controls, "aria-disabled": this.disabled, onClick: this.handleClick, onFocus: this.handleFocus, onBlur: this.handleBlur, style: this.buttonStyles, class: this.buttonClass({
+        return (index.h(index.Host, { key: '3983c85df11a13f852af55310ba15a4099fe1f54' }, index.h("button", { key: 'a01a152f16e5a97197f17517d6cc225aacf1f7e0', type: this.type, disabled: this.disabled || this.loading, "aria-label": this.label, "aria-expanded": this.expanded, "aria-controls": this.controls, "aria-disabled": this.disabled, onClick: this.handleClick, onFocus: this.handleFocus, onBlur: this.handleBlur, style: this.buttonStyles, class: this.buttonClass({
                 size: this.size,
                 kind: this.kind,
                 fullWidth: this.fullWidth,
                 disabled: this.disabled,
                 loading: this.loading,
-            }) }, this.loading && index.h("slot", { key: 'c231e6995ec417011a833b86668be0226855df26', name: "loading" }), index.h("span", { key: '0398204b65ab60a2061b78cedd61c1fc934f9946' }, index.h("slot", { key: '664f13b119445486a1185bb009581cc64d1c0b3e', name: "prefix" }, position === 'prefix' && icon && index.h("i", { key: 'c06367c640065ef5255a89c3d3c9db08a88659d1', class: ' leading-none ' + icon }))), index.h("slot", { key: 'f8fc4f7eaae1ad869af95a6990a53def07678cd7' }, this.buttonText), index.h("span", { key: 'b1b7dc15d8090bb057b6b237d65c17ac328ee380' }, index.h("slot", { key: '43539884f514d7bb365e10e06bf1119b5c60a2b3', name: "suffix" }, position === 'suffix' && icon && index.h("i", { key: 'bf9ad3dc22fc11ca218c28e1a00e9e5a8cef80f2', class: ' leading-none ' + icon }))))));
+                position: this.position,
+            }) }, this.loading && index.h("slot", { key: '161b90eebdc8157163aaeda1ce542fe87c60db78', name: "loading" }), index.h("span", { key: '6c63908979e465eea1cc358bf4c87f0710891d41' }, index.h("slot", { key: 'c2931b0dfff2ff00730addc734cb0f24b24ea4ba', name: "prefix" }, position === 'prefix' && icon && index.h("i", { key: 'cab571f159ae0b6d87862acc4b187fd42189d574', class: ' leading-none ' + icon }))), index.h("slot", { key: '387a3f7452b7cfc5ad6484743ad3a02aa0d8427e' }, this.buttonText), index.h("span", { key: '19db4a9fe4b85df6fd85ebad6eac2d7c82313820' }, index.h("slot", { key: '4f1169aed2c8e446b267139ece8b5db01d9f1da3', name: "suffix" }, position === 'suffix' && icon && index.h("i", { key: '67355ba68078bc921d99ebb7d3b8d5bc7c0f2776', class: ' leading-none ' + icon }))))));
     }
 };
 BcmButton.style = BcmButtonStyle0;