bromcom-ui-next 0.1.24 → 0.1.25

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (163) hide show
  1. package/dist/bromcom-ui/bcm-button.entry.esm.js.map +1 -0
  2. package/dist/bromcom-ui/bcm-drawer.entry.esm.js.map +1 -0
  3. package/dist/bromcom-ui/bcm-dropdown-item.entry.esm.js.map +1 -0
  4. package/dist/bromcom-ui/bcm-dropdown.entry.esm.js.map +1 -0
  5. package/dist/bromcom-ui/bcm-input.entry.esm.js.map +1 -0
  6. package/dist/bromcom-ui/bcm-linked.entry.esm.js.map +1 -0
  7. package/dist/bromcom-ui/bcm-shortcut.entry.esm.js.map +1 -0
  8. package/dist/bromcom-ui/bcm-switch.entry.esm.js.map +1 -1
  9. package/dist/bromcom-ui/bcm-tabs-list.entry.esm.js.map +1 -1
  10. package/dist/bromcom-ui/bcm-tabs-trigger.entry.esm.js.map +1 -1
  11. package/dist/bromcom-ui/bcm-tabs.entry.esm.js.map +1 -1
  12. package/dist/bromcom-ui/bcm-text.entry.esm.js.map +1 -0
  13. package/dist/bromcom-ui/bromcom-ui.esm.js +1 -1
  14. package/dist/bromcom-ui/p-00dc393e.entry.js +2 -0
  15. package/dist/bromcom-ui/p-00dc393e.entry.js.map +1 -0
  16. package/dist/bromcom-ui/p-0421d64a.entry.js +2 -0
  17. package/dist/bromcom-ui/p-0421d64a.entry.js.map +1 -0
  18. package/dist/bromcom-ui/p-06656239.entry.js +2 -0
  19. package/dist/bromcom-ui/p-06656239.entry.js.map +1 -0
  20. package/dist/bromcom-ui/p-10de6d9c.entry.js +2 -0
  21. package/dist/bromcom-ui/p-10de6d9c.entry.js.map +1 -0
  22. package/dist/bromcom-ui/p-48c554fc.entry.js +2 -0
  23. package/dist/bromcom-ui/p-48c554fc.entry.js.map +1 -0
  24. package/dist/bromcom-ui/{p-b02f5178.entry.js → p-7f117b72.entry.js} +2 -2
  25. package/dist/bromcom-ui/p-a07a257f.entry.js +2 -0
  26. package/dist/bromcom-ui/p-a07a257f.entry.js.map +1 -0
  27. package/dist/bromcom-ui/{p-5c1b22b5.entry.js → p-a18d34c7.entry.js} +2 -2
  28. package/dist/bromcom-ui/p-b37f2434.entry.js +2 -0
  29. package/dist/bromcom-ui/p-b37f2434.entry.js.map +1 -0
  30. package/dist/bromcom-ui/p-c709842a.entry.js +2 -0
  31. package/dist/bromcom-ui/p-c709842a.entry.js.map +1 -0
  32. package/dist/bromcom-ui/p-e989b918.entry.js +2 -0
  33. package/dist/bromcom-ui/p-e989b918.entry.js.map +1 -0
  34. package/dist/bromcom-ui/p-ed796a79.entry.js +2 -0
  35. package/dist/bromcom-ui/p-ed796a79.entry.js.map +1 -0
  36. package/dist/bromcom-ui/p-edd01d0d.entry.js +2 -0
  37. package/dist/bromcom-ui/p-edd01d0d.entry.js.map +1 -0
  38. package/dist/bromcom-ui/p-f34bfa88.entry.js +2 -0
  39. package/dist/bromcom-ui/p-f34bfa88.entry.js.map +1 -0
  40. package/dist/cjs/bcm-button.cjs.entry.js +316 -0
  41. package/dist/cjs/bcm-button.cjs.entry.js.map +1 -0
  42. package/dist/cjs/bcm-button.entry.cjs.js.map +1 -0
  43. package/dist/cjs/bcm-drawer.cjs.entry.js +206 -0
  44. package/dist/cjs/bcm-drawer.cjs.entry.js.map +1 -0
  45. package/dist/cjs/bcm-drawer.entry.cjs.js.map +1 -0
  46. package/dist/cjs/bcm-dropdown-item.cjs.entry.js +61 -0
  47. package/dist/cjs/bcm-dropdown-item.cjs.entry.js.map +1 -0
  48. package/dist/cjs/bcm-dropdown-item.entry.cjs.js.map +1 -0
  49. package/dist/cjs/bcm-dropdown.cjs.entry.js +54 -0
  50. package/dist/cjs/bcm-dropdown.cjs.entry.js.map +1 -0
  51. package/dist/cjs/bcm-dropdown.entry.cjs.js.map +1 -0
  52. package/dist/cjs/bcm-input.cjs.entry.js +315 -0
  53. package/dist/cjs/bcm-input.cjs.entry.js.map +1 -0
  54. package/dist/cjs/bcm-input.entry.cjs.js.map +1 -0
  55. package/dist/cjs/bcm-linked.cjs.entry.js +343 -0
  56. package/dist/cjs/bcm-linked.cjs.entry.js.map +1 -0
  57. package/dist/cjs/bcm-linked.entry.cjs.js.map +1 -0
  58. package/dist/cjs/bcm-shortcut.cjs.entry.js +50 -0
  59. package/dist/cjs/bcm-shortcut.cjs.entry.js.map +1 -0
  60. package/dist/cjs/bcm-shortcut.entry.cjs.js.map +1 -0
  61. package/dist/cjs/bcm-switch.cjs.entry.js +7 -7
  62. package/dist/cjs/bcm-switch.cjs.entry.js.map +1 -1
  63. package/dist/cjs/bcm-switch.entry.cjs.js.map +1 -1
  64. package/dist/cjs/bcm-tabs-list.cjs.entry.js +49 -6
  65. package/dist/cjs/bcm-tabs-list.cjs.entry.js.map +1 -1
  66. package/dist/cjs/bcm-tabs-list.entry.cjs.js.map +1 -1
  67. package/dist/cjs/bcm-tabs-trigger.cjs.entry.js +38 -6
  68. package/dist/cjs/bcm-tabs-trigger.cjs.entry.js.map +1 -1
  69. package/dist/cjs/bcm-tabs-trigger.entry.cjs.js.map +1 -1
  70. package/dist/cjs/bcm-tabs.cjs.entry.js +106 -17
  71. package/dist/cjs/bcm-tabs.cjs.entry.js.map +1 -1
  72. package/dist/cjs/bcm-tabs.entry.cjs.js.map +1 -1
  73. package/dist/cjs/bcm-text.cjs.entry.js +124 -0
  74. package/dist/cjs/bcm-text.cjs.entry.js.map +1 -0
  75. package/dist/cjs/bcm-text.entry.cjs.js.map +1 -0
  76. package/dist/cjs/bcm-textarea.cjs.entry.js +3 -3
  77. package/dist/cjs/bcm-tooltip.cjs.entry.js +1 -1
  78. package/dist/cjs/bromcom-ui.cjs.js +1 -1
  79. package/dist/cjs/loader.cjs.js +1 -1
  80. package/dist/collection/components/button/button.css +1 -1
  81. package/dist/collection/components/switch/switch.component.js +6 -6
  82. package/dist/collection/components/switch/switch.component.js.map +1 -1
  83. package/dist/collection/components/switch/switch.css +1 -1
  84. package/dist/collection/components/tabs/bcm-tabs.css +1 -1
  85. package/dist/collection/components/tabs/tabs-list.component.js +92 -5
  86. package/dist/collection/components/tabs/tabs-list.component.js.map +1 -1
  87. package/dist/collection/components/tabs/tabs-list.css +1 -1
  88. package/dist/collection/components/tabs/tabs-trigger.component.js +77 -5
  89. package/dist/collection/components/tabs/tabs-trigger.component.js.map +1 -1
  90. package/dist/collection/components/tabs/tabs-trigger.css +1 -1
  91. package/dist/collection/components/tabs/tabs.component.js +148 -15
  92. package/dist/collection/components/tabs/tabs.component.js.map +1 -1
  93. package/dist/collection/components/text/text.component.js +1 -1
  94. package/dist/collection/components/textarea/textarea.component.js +3 -3
  95. package/dist/collection/components/tooltip/tooltip.component.js +1 -1
  96. package/dist/components/bcm-button.js +1 -1
  97. package/dist/components/bcm-dropdown.js +1 -1
  98. package/dist/components/bcm-pop-confirm.js +1 -1
  99. package/dist/components/bcm-switch.js +7 -7
  100. package/dist/components/bcm-switch.js.map +1 -1
  101. package/dist/components/bcm-tabs-list.js +53 -7
  102. package/dist/components/bcm-tabs-list.js.map +1 -1
  103. package/dist/components/bcm-tabs-trigger.js +41 -7
  104. package/dist/components/bcm-tabs-trigger.js.map +1 -1
  105. package/dist/components/bcm-tabs.js +111 -18
  106. package/dist/components/bcm-tabs.js.map +1 -1
  107. package/dist/components/bcm-text.js +1 -1
  108. package/dist/components/bcm-textarea.js +3 -3
  109. package/dist/components/bcm-tooltip.js +1 -1
  110. package/dist/components/{p-BdGAZ8M0.js → p-e6quW4es.js} +3 -3
  111. package/dist/components/{p-BdGAZ8M0.js.map → p-e6quW4es.js.map} +1 -1
  112. package/dist/esm/bcm-button.entry.js +314 -0
  113. package/dist/esm/bcm-button.entry.js.map +1 -0
  114. package/dist/esm/bcm-drawer.entry.js +204 -0
  115. package/dist/esm/bcm-drawer.entry.js.map +1 -0
  116. package/dist/esm/bcm-dropdown-item.entry.js +59 -0
  117. package/dist/esm/bcm-dropdown-item.entry.js.map +1 -0
  118. package/dist/esm/bcm-dropdown.entry.js +52 -0
  119. package/dist/esm/bcm-dropdown.entry.js.map +1 -0
  120. package/dist/esm/bcm-input.entry.js +313 -0
  121. package/dist/esm/bcm-input.entry.js.map +1 -0
  122. package/dist/esm/bcm-linked.entry.js +341 -0
  123. package/dist/esm/bcm-linked.entry.js.map +1 -0
  124. package/dist/esm/bcm-shortcut.entry.js +48 -0
  125. package/dist/esm/bcm-shortcut.entry.js.map +1 -0
  126. package/dist/esm/bcm-switch.entry.js +7 -7
  127. package/dist/esm/bcm-switch.entry.js.map +1 -1
  128. package/dist/esm/bcm-tabs-list.entry.js +49 -6
  129. package/dist/esm/bcm-tabs-list.entry.js.map +1 -1
  130. package/dist/esm/bcm-tabs-trigger.entry.js +38 -6
  131. package/dist/esm/bcm-tabs-trigger.entry.js.map +1 -1
  132. package/dist/esm/bcm-tabs.entry.js +106 -17
  133. package/dist/esm/bcm-tabs.entry.js.map +1 -1
  134. package/dist/esm/bcm-text.entry.js +122 -0
  135. package/dist/esm/bcm-text.entry.js.map +1 -0
  136. package/dist/esm/bcm-textarea.entry.js +3 -3
  137. package/dist/esm/bcm-tooltip.entry.js +1 -1
  138. package/dist/esm/bromcom-ui.js +1 -1
  139. package/dist/esm/loader.js +1 -1
  140. package/dist/types/components/tabs/tabs-list.component.d.ts +8 -0
  141. package/dist/types/components/tabs/tabs-trigger.component.d.ts +8 -0
  142. package/dist/types/components/tabs/tabs.component.d.ts +15 -0
  143. package/dist/types/components.d.ts +60 -0
  144. package/package.json +1 -1
  145. package/dist/bromcom-ui/bcm-button.bcm-drawer.bcm-dropdown.bcm-dropdown-item.bcm-input.bcm-linked.bcm-shortcut.bcm-text.entry.esm.js.map +0 -1
  146. package/dist/bromcom-ui/p-1d79c9de.entry.js +0 -2
  147. package/dist/bromcom-ui/p-1d79c9de.entry.js.map +0 -1
  148. package/dist/bromcom-ui/p-4766474f.entry.js +0 -2
  149. package/dist/bromcom-ui/p-4766474f.entry.js.map +0 -1
  150. package/dist/bromcom-ui/p-4f0851e2.entry.js +0 -2
  151. package/dist/bromcom-ui/p-4f0851e2.entry.js.map +0 -1
  152. package/dist/bromcom-ui/p-88d35bcf.entry.js +0 -2
  153. package/dist/bromcom-ui/p-88d35bcf.entry.js.map +0 -1
  154. package/dist/bromcom-ui/p-d04246f0.entry.js +0 -2
  155. package/dist/bromcom-ui/p-d04246f0.entry.js.map +0 -1
  156. package/dist/cjs/bcm-button.bcm-drawer.bcm-dropdown.bcm-dropdown-item.bcm-input.bcm-linked.bcm-shortcut.bcm-text.entry.cjs.js.map +0 -1
  157. package/dist/cjs/bcm-button_8.cjs.entry.js +0 -1414
  158. package/dist/cjs/bcm-button_8.cjs.entry.js.map +0 -1
  159. package/dist/esm/bcm-button.bcm-drawer.bcm-dropdown.bcm-dropdown-item.bcm-input.bcm-linked.bcm-shortcut.bcm-text.entry.js.map +0 -1
  160. package/dist/esm/bcm-button_8.entry.js +0 -1405
  161. package/dist/esm/bcm-button_8.entry.js.map +0 -1
  162. /package/dist/bromcom-ui/{p-b02f5178.entry.js.map → p-7f117b72.entry.js.map} +0 -0
  163. /package/dist/bromcom-ui/{p-5c1b22b5.entry.js.map → p-a18d34c7.entry.js.map} +0 -0
@@ -0,0 +1 @@
1
+ {"version":3,"names":["linkedCss","BcmLinked","constructor","hostRef","this","trigger","placement","showDelay","hideDelay","offset","arrow","disabled","zIndex","appendToBody","destroyOnHide","isVisible","isReady","handleMouseEnter","clearTimeouts","showTimeout","setTimeout","show","handleMouseLeave","hideTimeout","hide","handleFloatingMouseEnter","handleFloatingMouseLeave","handleClick","e","stopPropagation","toggle","handleFocus","handleBlur","setupTarget","disconnectTarget","connectTarget","onVisibilityChange","newValue","updatePosition","bcmShown","emit","bcmHidden","componentDidLoad","Promise","resolve","requestAnimationFrame","floatingEl","host","querySelector","setupFloatingObserver","console","log","error","disconnectedCallback","_a","cleanup","call","_b","resizeObserver","disconnect","originalParent","appendChild","targetEl","targetElement","targetId","document","getElementById","previousElementSibling","parentElement","warn","setupEventListeners","autoUpdate","ResizeObserver","observe","removeEventListeners","addEventListener","setupClickOutside","removeEventListener","removeClickOutside","clickOutsideHandler","target","contains","undefined","clearTimeout","middleware","flip","fallbackPlacements","shift","padding","x","y","computePosition","strategy","Object","assign","style","left","top","toString","updateArrow","className","side","split","classList","add","bcmShow","parentNode","originalNextSibling","nextSibling","body","bcmHide","insertBefore","removeChild","updatePositioning","render","floatingClasses","h","Host","key","class","position","display","visibility","opacity","pointerEvents","name"],"sources":["src/components/linked/linked.css?tag=bcm-linked","src/components/linked/linked.component.tsx"],"sourcesContent":["bcm-linked {\n display: block;\n position: relative;\n}\nbcm-linked[append-to-body] {\n display: none;\n}\n\n.floating-content {\n min-width: max-content;\n transition: opacity 0.2s ease, visibility 0.2s ease, transform 0.2s ease;\n will-change: transform, opacity;\n}\n\n.floating-visible {\n animation: fadeInScale 0.2s ease-out;\n}\n\n.floating-hidden {\n display: none !important;\n pointer-events: none;\n}\n\n.floating-wrapper {\n position: relative;\n z-index: 1;\n}\n\n/* Animations */\n@keyframes fadeInScale {\n from {\n opacity: 0;\n transform: scale(0.95) translateY(-5px);\n }\n to {\n opacity: 1;\n transform: scale(1) translateY(0);\n }\n}\n\n/* Arrow Styles */\n.floating-arrow {\n position: absolute;\n width: 10px;\n height: 10px;\n z-index: -1;\n}\n\n.floating-arrow::before {\n content: '';\n position: absolute;\n width: 10px;\n height: 10px;\n background: white;\n border: 1px solid #e2e8f0;\n transform: rotate(45deg);\n}\n\n/* Arrow positioning based on placement */\n.arrow-top {\n bottom: -5px;\n left: 50%;\n transform: translateX(-50%);\n}\n\n.arrow-bottom {\n top: -5px;\n left: 50%;\n transform: translateX(-50%);\n}\n\n.arrow-left {\n right: -5px;\n top: 50%;\n transform: translateY(-50%);\n}\n\n.arrow-right {\n left: -5px;\n top: 50%;\n transform: translateY(-50%);\n}\n\n/* Arrow border fix for bordered popups */\n.arrow-top::before {\n border-bottom: 0;\n border-right: 0;\n}\n\n.arrow-bottom::before {\n border-top: 0;\n border-left: 0;\n}\n\n.arrow-left::before {\n border-top: 0;\n border-right: 0;\n}\n\n.arrow-right::before {\n border-bottom: 0;\n border-left: 0;\n}\n\n/* Responsive adjustments */\n@media (max-width: 768px) {\n .floating-content {\n max-width: calc(100vw - 32px);\n max-height: calc(100vh - 32px);\n }\n}\n","import { Component, ComponentInterface, Prop, Element, State, h, Event, EventEmitter, Watch, Method, Host } from '@stencil/core';\nimport { computePosition, shift, offset, autoUpdate, flip, type Placement } from '@floating-ui/dom';\n\nexport type TriggerType = 'hover' | 'click' | 'focus' | 'manual';\n\n@Component({\n tag: 'bcm-linked',\n styleUrl: 'linked.css',\n shadow: false,\n})\nexport class BcmLinked implements ComponentInterface {\n @Element() host: HTMLElement;\n\n // Target configuration\n @Prop({ reflect: true, attribute: 'target-id' }) targetId?: string;\n @Prop() targetElement?: HTMLElement;\n\n // Trigger configuration\n @Prop() trigger: TriggerType = 'click';\n @Prop() placement: Placement = 'bottom-start';\n\n // Timing configuration\n @Prop() showDelay: number = 0;\n @Prop() hideDelay: number = 0;\n\n // Positioning configuration\n @Prop() offset: number = 8;\n @Prop() arrow: boolean = false;\n @Prop() disabled: boolean = false;\n\n // Style configuration\n @Prop() zIndex: number = 1000;\n @Prop() appendToBody: boolean = false;\n @Prop() destroyOnHide: boolean = false;\n\n // State\n @State() isVisible: boolean = false;\n @State() isReady: boolean = false;\n\n // Events\n @Event() bcmShow: EventEmitter<void>;\n @Event() bcmHide: EventEmitter<void>;\n @Event() bcmShown: EventEmitter<void>;\n @Event() bcmHidden: EventEmitter<void>;\n\n // Private properties\n private floatingEl?: HTMLElement;\n private targetEl?: HTMLElement;\n private showTimeout?: NodeJS.Timeout;\n private hideTimeout?: NodeJS.Timeout;\n private cleanup?: () => void;\n private clickOutsideHandler?: (e: MouseEvent) => void;\n private resizeObserver?: ResizeObserver;\n private originalParent?: Node;\n private originalNextSibling?: Node;\n\n // Watch for changes\n @Watch('targetId')\n @Watch('targetElement')\n setupTarget() {\n this.disconnectTarget();\n this.connectTarget();\n }\n\n @Watch('isVisible')\n onVisibilityChange(newValue: boolean) {\n if (newValue) {\n this.updatePosition();\n this.bcmShown.emit();\n } else {\n this.bcmHidden.emit();\n }\n }\n\n async componentDidLoad() {\n // Wait for render\n await new Promise(resolve => requestAnimationFrame(resolve));\n\n this.floatingEl = this.host.querySelector('.floating-content') as HTMLElement;\n\n if (this.floatingEl) {\n this.isReady = true;\n this.connectTarget();\n this.setupFloatingObserver();\n console.log('✅ bcm-linked initialized successfully');\n } else {\n console.error('❌ Could not find .floating-content element');\n }\n }\n\n disconnectedCallback() {\n this.disconnectTarget();\n this.clearTimeouts();\n this.cleanup?.();\n this.resizeObserver?.disconnect();\n\n // Restore element to original position if component is destroyed while in portal\n if (this.appendToBody && this.floatingEl && this.originalParent) {\n this.originalParent.appendChild(this.floatingEl);\n }\n }\n\n private connectTarget() {\n if (!this.isReady) return;\n\n // Find target element\n this.targetEl =\n this.targetElement || (this.targetId ? document.getElementById(this.targetId) : null) || (this.host.previousElementSibling as HTMLElement) || this.host.parentElement;\n\n if (!this.targetEl) {\n console.warn('bcm-linked: No target element found');\n return;\n }\n\n // Setup event listeners based on trigger type\n this.setupEventListeners();\n\n // Setup auto-update for position\n if (this.targetEl && this.floatingEl) {\n this.cleanup = autoUpdate(this.targetEl, this.floatingEl, () => {\n if (this.isVisible) {\n this.updatePosition();\n }\n });\n }\n\n // Setup resize observer for responsive positioning\n this.resizeObserver = new ResizeObserver(() => {\n if (this.isVisible) {\n this.updatePosition();\n }\n });\n this.resizeObserver.observe(this.floatingEl);\n }\n\n private disconnectTarget() {\n if (this.targetEl) {\n this.removeEventListeners();\n }\n this.cleanup?.();\n this.resizeObserver?.disconnect();\n }\n\n private setupEventListeners() {\n if (!this.targetEl || this.disabled) return;\n\n switch (this.trigger) {\n case 'hover':\n this.targetEl.addEventListener('mouseenter', this.handleMouseEnter);\n this.targetEl.addEventListener('mouseleave', this.handleMouseLeave);\n this.floatingEl?.addEventListener('mouseenter', this.handleFloatingMouseEnter);\n this.floatingEl?.addEventListener('mouseleave', this.handleFloatingMouseLeave);\n break;\n\n case 'click':\n this.targetEl.addEventListener('click', this.handleClick);\n this.setupClickOutside();\n break;\n\n case 'focus':\n this.targetEl.addEventListener('focus', this.handleFocus);\n this.targetEl.addEventListener('blur', this.handleBlur);\n break;\n }\n }\n\n private removeEventListeners() {\n if (!this.targetEl) return;\n\n this.targetEl.removeEventListener('mouseenter', this.handleMouseEnter);\n this.targetEl.removeEventListener('mouseleave', this.handleMouseLeave);\n this.targetEl.removeEventListener('click', this.handleClick);\n this.targetEl.removeEventListener('focus', this.handleFocus);\n this.targetEl.removeEventListener('blur', this.handleBlur);\n\n this.floatingEl?.removeEventListener('mouseenter', this.handleFloatingMouseEnter);\n this.floatingEl?.removeEventListener('mouseleave', this.handleFloatingMouseLeave);\n\n this.removeClickOutside();\n }\n\n private setupClickOutside() {\n this.clickOutsideHandler = (e: MouseEvent) => {\n const target = e.target as Node;\n if (!this.floatingEl?.contains(target) && !this.targetEl?.contains(target) && !this.host.contains(target)) {\n this.hide();\n }\n };\n document.addEventListener('click', this.clickOutsideHandler, true);\n }\n\n private removeClickOutside() {\n if (this.clickOutsideHandler) {\n document.removeEventListener('click', this.clickOutsideHandler, true);\n this.clickOutsideHandler = undefined;\n }\n }\n\n private handleMouseEnter = () => {\n this.clearTimeouts();\n if (this.showDelay > 0) {\n this.showTimeout = setTimeout(() => this.show(), this.showDelay);\n } else {\n this.show();\n }\n };\n\n private handleMouseLeave = () => {\n this.clearTimeouts();\n if (this.hideDelay > 0) {\n this.hideTimeout = setTimeout(() => this.hide(), this.hideDelay);\n } else {\n this.hide();\n }\n };\n\n private handleFloatingMouseEnter = () => {\n this.clearTimeouts();\n };\n\n private handleFloatingMouseLeave = () => {\n this.clearTimeouts();\n if (this.hideDelay > 0) {\n this.hideTimeout = setTimeout(() => this.hide(), this.hideDelay);\n } else {\n this.hide();\n }\n };\n\n private handleClick = (e: Event) => {\n e.stopPropagation();\n this.toggle();\n };\n\n private handleFocus = () => {\n this.show();\n };\n\n private handleBlur = () => {\n this.hide();\n };\n\n private clearTimeouts() {\n if (this.showTimeout) {\n clearTimeout(this.showTimeout);\n this.showTimeout = undefined;\n }\n if (this.hideTimeout) {\n clearTimeout(this.hideTimeout);\n this.hideTimeout = undefined;\n }\n }\n\n private async updatePosition() {\n if (!this.targetEl || !this.floatingEl || !this.isVisible) return;\n\n // Use autoPlacement only for bottom-start (dropdown default)\n // For other placements, respect the manual placement with flip fallback\n // const useAutoPlacement = this.placement === 'bottom-start';\n\n const middleware = [\n offset(this.offset),\n // useAutoPlacement\n // ? autoPlacement({\n // allowedPlacements: ['bottom-start', 'bottom-end', 'bottom', 'top-start', 'top-end', 'top', 'right-start', 'right-end', 'right', 'left-start', 'left-end', 'left'],\n // boundary: document.body,\n // })\n // :\n flip({\n fallbackPlacements: ['top', 'bottom', 'left', 'right', 'top-start', 'top-end', 'bottom-start', 'bottom-end', 'left-start', 'left-end', 'right-start', 'right-end'],\n }),\n shift({\n padding: 8,\n }),\n ];\n\n const { x, y, placement } = await computePosition(this.targetEl, this.floatingEl, {\n placement: this.placement,\n middleware,\n strategy: 'fixed',\n });\n\n Object.assign(this.floatingEl.style, {\n left: `${x}px`,\n top: `${y}px`,\n zIndex: this.zIndex.toString(),\n });\n\n // Update arrow if enabled\n if (this.arrow) {\n this.updateArrow(placement);\n }\n }\n\n private updateArrow(placement: Placement) {\n const arrow = this.floatingEl?.querySelector('.floating-arrow') as HTMLElement;\n if (!arrow) return;\n\n // Remove all arrow classes\n arrow.className = 'floating-arrow';\n\n // Add placement-specific class\n const side = placement.split('-')[0];\n arrow.classList.add(`arrow-${side}`);\n }\n\n @Method()\n async show(): Promise<void> {\n if (this.disabled || this.isVisible) return;\n\n this.bcmShow.emit();\n\n // Portalling: Move the floating element to the body\n if (this.appendToBody && this.floatingEl) {\n this.originalParent = this.floatingEl.parentNode;\n this.originalNextSibling = this.floatingEl.nextSibling;\n document.body.appendChild(this.floatingEl);\n }\n\n this.isVisible = true;\n\n // Use requestAnimationFrame to ensure the element is visible before positioning\n await new Promise(resolve => requestAnimationFrame(resolve));\n await this.updatePosition();\n }\n\n @Method()\n async hide(): Promise<void> {\n if (!this.isVisible) return;\n\n this.bcmHide.emit();\n this.isVisible = false;\n\n // Portalling: Restore the floating element to its original position\n if (this.appendToBody && this.floatingEl && this.originalParent) {\n if (this.originalNextSibling) {\n this.originalParent.insertBefore(this.floatingEl, this.originalNextSibling);\n } else {\n this.originalParent.appendChild(this.floatingEl);\n }\n this.originalParent = undefined;\n this.originalNextSibling = undefined;\n }\n\n if (this.destroyOnHide && this.floatingEl && this.floatingEl.parentNode) {\n this.floatingEl.parentNode.removeChild(this.floatingEl);\n }\n }\n\n @Method()\n async toggle(): Promise<void> {\n if (this.isVisible) {\n await this.hide();\n } else {\n await this.show();\n }\n }\n\n @Method()\n async updatePositioning(): Promise<void> {\n await this.updatePosition();\n }\n\n private setupFloatingObserver() {\n if (!this.floatingEl) return;\n\n // Observe floating element size changes for position updates\n this.resizeObserver = new ResizeObserver(() => {\n if (this.isVisible) {\n this.updatePosition();\n }\n });\n\n this.resizeObserver.observe(this.floatingEl);\n }\n\n render() {\n const floatingClasses = {\n 'floating-content': true,\n 'floating-visible': this.isVisible,\n 'floating-hidden': !this.isVisible,\n 'floating-with-arrow': this.arrow,\n 'floating-destroy-on-hide': this.destroyOnHide,\n };\n\n return (\n <Host>\n <div\n class={floatingClasses}\n style={{\n position: 'fixed',\n top: '0px',\n left: '0px',\n zIndex: this.zIndex.toString(),\n display: this.isVisible ? 'block' : 'none',\n visibility: this.isVisible ? 'visible' : 'hidden',\n opacity: this.isVisible ? '1' : '0',\n pointerEvents: this.isVisible ? 'auto' : 'none',\n }}\n >\n {this.arrow && <div class=\"floating-arrow\" />}\n <div class=\"floating-wrapper\">\n <slot></slot>\n </div>\n </div>\n <div style={{ display: 'none' }}>\n <slot name=\"fallback\"></slot>\n </div>\n </Host>\n );\n }\n}\n"],"mappings":"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","ignoreList":[]}
@@ -0,0 +1,2 @@
1
+ import{r as t,c as o,h as i,H as e}from"./p-B84DzIAh.js";import{t as r}from"./p-CEcVC0yX.js";const a={save:{text:"Save",status:"success",icon:"far fa-save",iconPosition:"prefix",kind:"primary"},ok:{text:"Ok",status:"success",icon:"far fa-check",iconPosition:"prefix"},new:{text:"New",status:"success",icon:"far fa-plus",iconPosition:"prefix"},add:{text:"Add",status:"success",icon:"far fa-plus",iconPosition:"prefix"},create:{text:"Create",status:"success",icon:"far fa-plus",iconPosition:"prefix"},prev:{text:"Prev",status:"default",icon:"far fa-arrow-left",iconPosition:"prefix"},next:{text:"Next",status:"default",icon:"far fa-arrow-right",iconPosition:"suffix"},apply:{text:"Apply",status:"default",icon:"far fa-check-circle",iconPosition:"prefix"},submit:{text:"Submit",status:"default",icon:"far fa-save",iconPosition:"prefix"},send:{text:"Send",status:"success",icon:"far fa-paper-plane",iconPosition:"prefix"},delete:{text:"Delete",status:"error",icon:"far fa-trash",iconPosition:"prefix"},cancel:{text:"Cancel",status:"error",icon:"far fa-times",iconPosition:"prefix"},decline:{text:"Decline",status:"error",icon:"far fa-ban",iconPosition:"prefix"},close:{text:"Close",status:"error",icon:"far fa-times-circle",iconPosition:"prefix"},archive:{text:"Archive",status:"error",icon:"far fa-folder-open",iconPosition:"prefix"},remove:{text:"Remove",status:"error",icon:"far fa-minus-circle",iconPosition:"prefix"},edit:{text:"Edit",status:"default",icon:"far fa-edit",iconPosition:"prefix"},export:{text:"Export",status:"default",icon:"far fa-sign-out",iconPosition:"prefix"},import:{text:"Import",status:"default",icon:"far fa-sign-in",iconPosition:"prefix"},filter:{text:"Filter",status:"default",icon:"far fa-filter",iconPosition:"prefix"},update:{text:"Update",status:"default",icon:"far fa-sync",iconPosition:"prefix"},reset:{text:"Reset",status:"default",icon:"far fa-sync",iconPosition:"prefix"},download:{text:"Download",status:"default",icon:"far fa-download",iconPosition:"prefix"}};const s=".relative{position:relative}:host{display:inline-flex;height:-moz-fit-content;height:fit-content;position:relative;width:-moz-fit-content;width:fit-content}: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}.flex{display:flex}.max-h-64{max-height:16rem}.w-full{width:100%}.min-w-10{min-width:2.5rem}.max-w-64{max-width:16rem}.flex-col{flex-direction:column}.items-center{align-items:center}.overflow-y-auto{overflow-y:auto}.rounded-lg{border-radius:var(--bcm-ui-border-radius-lg,8px)}.bg-color-basic-panel{background-color:var(--bcm-ui-color-background-basic-panel)}.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}.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}.hidden{display:none}.size-6{height:1.5rem;width:1.5rem}.h-2{height:.5rem}.w-4{width:1rem}.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}.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,.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)}.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}.cursor-not-allowed{cursor:not-allowed}.appearance-none{appearance:none}.rounded{border-radius:var(--bcm-ui-border-radius-default,6px)}.border{border-width:1px}.border-solid{border-style:solid}.border-\\[--bcm-final-border-color\\]{border-color:var(--bcm-final-border-color)}.border-color-disabled{border-color:var(--bcm-ui-color-border-disabled)}.bg-\\[--bcm-final-bg-color\\]{background-color:var(--bcm-final-bg-color)}.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}.leading-none{line-height:1}.text-\\[--bcm-final-text-color\\]{color:var(--bcm-final-text-color)}.text-color-disabled{color:var(--bcm-ui-color-text-disabled)}.outline-0{outline-width:0}.hover\\:bg-\\[--bcm-final-hover-bg-color\\]:hover{background-color:var(--bcm-final-hover-bg-color)}.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-final-active-bg-color\\]:active{background-color:var(--bcm-final-active-bg-color)}";const n=class{constructor(i){t(this,i);this.bcmClick=o(this,"bcmClick",1);this.bcmFocus=o(this,"bcmFocus",1);this.bcmBlur=o(this,"bcmBlur",1);this.kind="primary";this.size="medium";this.status="default";this.iconPosition="prefix";this.iconOnly=false;this.fullWidth=false;this.type="button";this.loading=false;this.disabled=false;this.active=false;this.handleClick=t=>{if(!this.disabled&&!this.loading){this.bcmClick.emit(t)}};this.handleFocus=t=>{this.bcmFocus.emit(t)};this.handleBlur=t=>{this.bcmBlur.emit(t)};this.buttonClass=r({base:"bcm-button appearance-none inline-flex items-center justify-center border border-solid rounded outline-0",variants:{size:{small:"text-size-4 py-px px-2 min-h-6",medium:"text-size-5 py-0.5 px-3 min-h-8",large:"text-size-6 py-1 px-3 min-h-10"},kind:{primary:"kind-primary",ghost:"kind-ghost",text:"kind-text",outline:"kind-outline"},fullWidth:{true:"full-width w-full"},disabled:{true:"disabled cursor-not-allowed bg-[--bcm-ui-color-background-disabled-default] text-color-disabled border-color-disabled",false:["cursor-pointer","bg-[--bcm-final-bg-color] text-[--bcm-final-text-color] border-[--bcm-final-border-color]","hover:bg-[--bcm-final-hover-bg-color]","active:bg-[--bcm-final-active-bg-color]","focus-visible:ring"]},loading:{true:""},position:{first:"position-first",middle:"position-middle",last:"position-last"}},defaultVariants:{size:"medium",kind:"primary",fullWidth:false,disabled:false,loading:false}},{twMerge:false})}get buttonText(){return this.text||(this.variant?a[this.variant].text:"")}get buttonIcon(){if(this.variant&&a[this.variant].icon){return{icon:a[this.variant].icon,position:a[this.variant].iconPosition||"prefix"}}return{icon:this.icon,position:this.iconPosition}}get buttonStatus(){return this.variant?a[this.variant].status:this.status}get buttonStyles(){const t=this.buttonStatus==="default"?"primary":this.buttonStatus;const o={primary:{"--bcm-button-bg":`var(--bcm-ui-color-background-${t}-default)`,"--bcm-button-bg-hover":`var(--bcm-ui-color-background-${t}-hover)`,"--bcm-button-bg-active":`var(--bcm-ui-color-background-${t}-active)`,"--bcm-button-border":"transparent","--bcm-button-text":"var(--bcm-ui-color-text-base)"},outline:{"--bcm-button-bg":"var(--bcm-ui-color-background-default-default)","--bcm-button-bg-hover":"var(--bcm-ui-color-background-default-hover)","--bcm-button-bg-active":"var(--bcm-ui-color-background-default-active)","--bcm-button-border":`var(--bcm-ui-color-border-${this.buttonStatus})`,"--bcm-button-text":`var(--bcm-ui-color-text-${this.buttonStatus})`},ghost:{"--bcm-button-bg":"transparent","--bcm-button-bg-hover":"var(--bcm-ui-color-background-default-hover)","--bcm-button-bg-active":"var(--bcm-ui-color-background-default-active)","--bcm-button-border":"transparent","--bcm-button-text":`var(--bcm-ui-color-text-${this.buttonStatus})`},text:{"--bcm-button-bg":"transparent","--bcm-button-bg-hover":"var(--bcm-ui-color-background-default-hover)","--bcm-button-bg-active":"var(--bcm-ui-color-background-default-active)","--bcm-button-border":"transparent","--bcm-button-text":`var(--bcm-ui-color-text-${t})`}};const i=o[this.kind];const e={"--bcm-final-text-color":`var(--bcm-button-custom-text-color, ${i["--bcm-button-text"]})`,"--bcm-final-border-color":`var(--bcm-button-custom-border-color, ${i["--bcm-button-border"]})`,"--bcm-final-bg-color":`var(--bcm-button-custom-bg-color, ${i["--bcm-button-bg"]})`,"--bcm-final-hover-bg-color":`var(--bcm-button-custom-hover-bg-color, ${i["--bcm-button-bg-hover"]})`,"--bcm-final-active-bg-color":`var(--bcm-button-custom-active-bg-color, ${i["--bcm-button-bg-active"]})`};return Object.assign(Object.assign({},i),e)}render(){const{icon:t,position:o}=this.buttonIcon;return i(e,{key:"33e438220fdb261ff87289f8dcbaa7e0601d73c1"},i("button",{key:"4fb4d22a44bac12b3780f9570c734f60fdaba788",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,position:this.position})},this.loading&&i("slot",{key:"fa8dcbcba338f94700842fd0482d0261c9a1d3e3",name:"loading"}),i("span",{key:"345162b4ad0034d5081dee0438ceeefe4930ecfb"},i("slot",{key:"c65c9aa07fd2f159426192fc6239c394ee6ec58d",name:"prefix"},o==="prefix"&&t&&i("i",{key:"c94e32a5d308ba3ad98ac10239fc9a155f47e2ac",class:" leading-none "+t}))),i("slot",{key:"171402bb9251492c7e5b0cf572fb0e2ae62a6add"},this.buttonText),i("span",{key:"ae3c5a885029b3d4c54e5ca21ac22adffa26b013"},i("slot",{key:"f80819d122624bb279d19822278c8e651dec27c7",name:"suffix"},o==="suffix"&&t&&i("i",{key:"69631e99a8b7f47dd1d00984f582ec6e7b5433e8",class:" leading-none "+t})))))}};n.style=s;export{n as bcm_button};
2
+ //# sourceMappingURL=p-0421d64a.entry.js.map
@@ -0,0 +1 @@
1
+ {"version":3,"names":["variantOptions","save","text","status","icon","iconPosition","kind","ok","new","add","create","prev","next","apply","submit","send","delete","cancel","decline","close","archive","remove","edit","export","import","filter","update","reset","download","buttonCss","BcmButton","constructor","hostRef","this","size","iconOnly","fullWidth","type","loading","disabled","active","handleClick","event","bcmClick","emit","handleFocus","bcmFocus","handleBlur","bcmBlur","buttonClass","tv","base","variants","small","medium","large","primary","ghost","outline","true","false","position","first","middle","last","defaultVariants","twMerge","buttonText","variant","buttonIcon","buttonStatus","buttonStyles","kindStyleMap","internalDefaultStyles","finalEffectiveStyles","Object","assign","render","h","Host","key","label","expanded","controls","onClick","onFocus","onBlur","style","class","name"],"sources":["src/components/button/types.ts","src/components/button/button.css?tag=bcm-button&encapsulation=shadow","src/components/button/button.component.tsx"],"sourcesContent":["export type ButtonKind = 'primary' | 'ghost' | 'text' | 'outline';\nexport type ButtonSize = 'small' | 'medium' | 'large';\nexport type ButtonType = 'button' | 'reset' | 'submit';\nexport type ButtonStatus = 'default' | 'success' | 'error' | 'warning' | 'info';\nexport type IconPosition = 'prefix' | 'suffix';\n\n// Button group position\nexport type ButtonPosition = 'first' | 'middle' | 'last' | null;\n\nexport interface VariantOption {\n text: string;\n icon?: string;\n iconPosition?: IconPosition;\n status?: ButtonStatus;\n kind?: ButtonKind;\n}\n\nexport const variantOptions: Record<string, VariantOption> = {\n save: {\n text: 'Save',\n status: 'success',\n icon: 'far fa-save',\n iconPosition: 'prefix',\n kind: 'primary',\n },\n ok: {\n text: 'Ok',\n status: 'success',\n icon: 'far fa-check',\n iconPosition: 'prefix',\n },\n new: {\n text: 'New',\n status: 'success',\n icon: 'far fa-plus',\n iconPosition: 'prefix',\n },\n add: {\n text: 'Add',\n status: 'success',\n icon: 'far fa-plus',\n iconPosition: 'prefix',\n },\n create: {\n text: 'Create',\n status: 'success',\n icon: 'far fa-plus',\n iconPosition: 'prefix',\n },\n prev: {\n text: 'Prev',\n status: 'default',\n icon: 'far fa-arrow-left',\n iconPosition: 'prefix',\n },\n next: {\n text: 'Next',\n status: 'default',\n icon: 'far fa-arrow-right',\n iconPosition: 'suffix',\n },\n apply: {\n text: 'Apply',\n status: 'default',\n icon: 'far fa-check-circle',\n iconPosition: 'prefix',\n },\n submit: {\n text: 'Submit',\n status: 'default',\n icon: 'far fa-save',\n iconPosition: 'prefix',\n },\n send: {\n text: 'Send',\n status: 'success',\n icon: 'far fa-paper-plane',\n iconPosition: 'prefix',\n },\n delete: {\n text: 'Delete',\n status: 'error',\n icon: 'far fa-trash',\n iconPosition: 'prefix',\n },\n cancel: {\n text: 'Cancel',\n status: 'error',\n icon: 'far fa-times',\n iconPosition: 'prefix',\n },\n decline: {\n text: 'Decline',\n status: 'error',\n icon: 'far fa-ban',\n iconPosition: 'prefix',\n },\n close: {\n text: 'Close',\n status: 'error',\n icon: 'far fa-times-circle',\n iconPosition: 'prefix',\n },\n archive: {\n text: 'Archive',\n status: 'error',\n icon: 'far fa-folder-open',\n iconPosition: 'prefix',\n },\n remove: {\n text: 'Remove',\n status: 'error',\n icon: 'far fa-minus-circle',\n iconPosition: 'prefix',\n },\n edit: {\n text: 'Edit',\n status: 'default',\n icon: 'far fa-edit',\n iconPosition: 'prefix',\n },\n export: {\n text: 'Export',\n status: 'default',\n icon: 'far fa-sign-out',\n iconPosition: 'prefix',\n },\n import: {\n text: 'Import',\n status: 'default',\n icon: 'far fa-sign-in',\n iconPosition: 'prefix',\n },\n filter: {\n text: 'Filter',\n status: 'default',\n icon: 'far fa-filter',\n iconPosition: 'prefix',\n },\n update: {\n text: 'Update',\n status: 'default',\n icon: 'far fa-sync',\n iconPosition: 'prefix',\n },\n reset: {\n text: 'Reset',\n status: 'default',\n icon: 'far fa-sync',\n iconPosition: 'prefix',\n },\n download: {\n text: 'Download',\n status: 'default',\n icon: 'far fa-download',\n iconPosition: 'prefix',\n },\n};\n\nexport type ButtonVariant = keyof typeof variantOptions;\n",":host {\n display: inline-flex;\n position: relative;\n height: fit-content;\n width: fit-content;\n}\n\n:host([full-width]) {\n width: 100%;\n}\n\n:host([position='first']) .bcm-button {\n border-top-right-radius: 0;\n border-bottom-right-radius: 0;\n}\n\n:host([position='middle']) .bcm-button {\n border-radius: 0;\n}\n\n:host([position='last']) .bcm-button {\n border-top-left-radius: 0;\n border-bottom-left-radius: 0;\n}\n\n:host([position='first'].orientation-vertical) .bcm-button {\n border-bottom-left-radius: 0;\n border-bottom-right-radius: 0;\n border-top-right-radius: var(--bcm-ui-border-radius, 4px);\n border-top-left-radius: var(--bcm-ui-border-radius, 4px);\n}\n\n:host([position='middle'].orientation-vertical) .bcm-button {\n border-radius: 0;\n}\n\n:host([position='last'].orientation-vertical) .bcm-button {\n border-top-left-radius: 0;\n border-top-right-radius: 0;\n border-bottom-right-radius: var(--bcm-ui-border-radius, 4px);\n border-bottom-left-radius: var(--bcm-ui-border-radius, 4px);\n}\n","import { Component, Prop, h, Event, EventEmitter, Host } from '@stencil/core';\nimport { ButtonKind, ButtonSize, ButtonType, ButtonStatus, ButtonVariant, IconPosition, ButtonPosition, variantOptions } from './types';\nimport { tv } from '@utils/tv';\n\n@Component({\n tag: 'bcm-button',\n styleUrl: 'button.css',\n shadow: true,\n})\nexport class BcmButton {\n /** Defines the main visual style of the button */\n @Prop()\n kind: ButtonKind = 'primary';\n\n /** Controls the button size */\n @Prop()\n size: ButtonSize = 'medium';\n\n /** Defines the button's status/state color */\n @Prop()\n status: ButtonStatus = 'default';\n\n /** Predefined button variants */\n @Prop()\n variant?: ButtonVariant;\n\n /** Button position in button group (first, middle, last) */\n @Prop({ reflect: true })\n position?: ButtonPosition;\n\n /** Icon class name */\n @Prop()\n icon?: string;\n\n /** Icon placement (prefix/suffix) */\n @Prop()\n iconPosition: IconPosition = 'prefix';\n\n /** Icon-only button mode */\n @Prop()\n iconOnly = false;\n\n /** Full width button */\n @Prop({ attribute: 'full-width', reflect: true })\n fullWidth = false;\n\n /** HTML button type */\n @Prop()\n type: ButtonType = 'button';\n\n /** Loading state */\n @Prop()\n loading = false;\n\n /** Disabled state */\n @Prop()\n disabled = false;\n\n /** Button text content */\n @Prop()\n text?: string;\n\n /** Active state */\n @Prop()\n active = false;\n\n /** Form association */\n @Prop()\n form: string;\n\n @Prop()\n value: string;\n\n @Prop()\n name: string;\n\n /** Screen reader label */\n @Prop()\n label: string;\n\n /** Expanded state for expandable content */\n @Prop()\n expanded?: string;\n\n /** ID of controlled element */\n @Prop()\n controls: string;\n\n @Event({\n composed: false,\n bubbles: false,\n cancelable: true,\n })\n bcmClick: EventEmitter<MouseEvent>;\n\n @Event({\n composed: false,\n bubbles: false,\n cancelable: true,\n })\n bcmFocus: EventEmitter<FocusEvent>;\n\n @Event({\n composed: false,\n bubbles: false,\n cancelable: true,\n })\n bcmBlur: EventEmitter<FocusEvent>;\n\n private handleClick = (event: MouseEvent) => {\n if (!this.disabled && !this.loading) {\n this.bcmClick.emit(event);\n }\n };\n\n private handleFocus = (event: FocusEvent) => {\n this.bcmFocus.emit(event);\n };\n\n private handleBlur = (event: FocusEvent) => {\n this.bcmBlur.emit(event);\n };\n\n private get buttonText(): string {\n return this.text || (this.variant ? variantOptions[this.variant].text : '');\n }\n\n private get buttonIcon(): { icon?: string; position: IconPosition } {\n if (this.variant && variantOptions[this.variant].icon) {\n return {\n icon: variantOptions[this.variant].icon,\n position: variantOptions[this.variant].iconPosition || 'prefix',\n };\n }\n\n return {\n icon: this.icon,\n position: this.iconPosition,\n };\n }\n\n private get buttonStatus(): ButtonStatus {\n return this.variant ? variantOptions[this.variant].status : this.status;\n }\n\n private get buttonStyles() {\n const status = this.buttonStatus === 'default' ? 'primary' : this.buttonStatus;\n\n // These are the internal default styles based on component props (kind, status)\n const kindStyleMap = {\n primary: {\n '--bcm-button-bg': `var(--bcm-ui-color-background-${status}-default)`,\n '--bcm-button-bg-hover': `var(--bcm-ui-color-background-${status}-hover)`,\n '--bcm-button-bg-active': `var(--bcm-ui-color-background-${status}-active)`,\n '--bcm-button-border': 'transparent',\n '--bcm-button-text': 'var(--bcm-ui-color-text-base)',\n },\n outline: {\n '--bcm-button-bg': 'var(--bcm-ui-color-background-default-default)',\n '--bcm-button-bg-hover': 'var(--bcm-ui-color-background-default-hover)',\n '--bcm-button-bg-active': 'var(--bcm-ui-color-background-default-active)',\n '--bcm-button-border': `var(--bcm-ui-color-border-${this.buttonStatus})`,\n '--bcm-button-text': `var(--bcm-ui-color-text-${this.buttonStatus})`,\n },\n ghost: {\n '--bcm-button-bg': 'transparent',\n '--bcm-button-bg-hover': 'var(--bcm-ui-color-background-default-hover)',\n '--bcm-button-bg-active': 'var(--bcm-ui-color-background-default-active)',\n '--bcm-button-border': 'transparent',\n '--bcm-button-text': `var(--bcm-ui-color-text-${this.buttonStatus})`,\n },\n text: {\n '--bcm-button-bg': 'transparent',\n '--bcm-button-bg-hover': 'var(--bcm-ui-color-background-default-hover)',\n '--bcm-button-bg-active': 'var(--bcm-ui-color-background-default-active)',\n '--bcm-button-border': 'transparent',\n '--bcm-button-text': `var(--bcm-ui-color-text-${status})`,\n },\n };\n const internalDefaultStyles = kindStyleMap[this.kind];\n\n // These are the \"final\" CSS custom properties used by the component's styling.\n // They use the \"--bcm-button-custom-...\" token if provided by the user,\n // otherwise, they fall back to the internal \"--bcm-button-...\" style defined above.\n const finalEffectiveStyles = {\n '--bcm-final-text-color': `var(--bcm-button-custom-text-color, ${internalDefaultStyles['--bcm-button-text']})`,\n '--bcm-final-border-color': `var(--bcm-button-custom-border-color, ${internalDefaultStyles['--bcm-button-border']})`,\n '--bcm-final-bg-color': `var(--bcm-button-custom-bg-color, ${internalDefaultStyles['--bcm-button-bg']})`,\n '--bcm-final-hover-bg-color': `var(--bcm-button-custom-hover-bg-color, ${internalDefaultStyles['--bcm-button-bg-hover']})`,\n '--bcm-final-active-bg-color': `var(--bcm-button-custom-active-bg-color, ${internalDefaultStyles['--bcm-button-bg-active']})`,\n };\n\n // return kindStyleMap[this.kind];\n\n return {\n ...internalDefaultStyles, // Provides the fallback values like --bcm-button-text\n ...finalEffectiveStyles, // Defines the --bcm-final-xxx tokens that handle the override logic\n };\n }\n\n private buttonClass = tv(\n {\n base: 'bcm-button appearance-none inline-flex items-center justify-center border border-solid rounded outline-0',\n variants: {\n size: {\n small: 'text-size-4 py-px px-2 min-h-6',\n medium: 'text-size-5 py-0.5 px-3 min-h-8',\n large: 'text-size-6 py-1 px-3 min-h-10',\n },\n kind: {\n primary: 'kind-primary',\n ghost: 'kind-ghost',\n text: 'kind-text',\n outline: 'kind-outline',\n },\n fullWidth: {\n true: 'full-width w-full',\n },\n disabled: {\n true: 'disabled cursor-not-allowed bg-[--bcm-ui-color-background-disabled-default] text-color-disabled border-color-disabled',\n false: [\n 'cursor-pointer',\n 'bg-[--bcm-final-bg-color] text-[--bcm-final-text-color] border-[--bcm-final-border-color]',\n 'hover:bg-[--bcm-final-hover-bg-color]',\n 'active:bg-[--bcm-final-active-bg-color]',\n 'focus-visible:ring',\n ],\n },\n loading: {\n true: '',\n },\n position: {\n first: 'position-first',\n middle: 'position-middle',\n last: 'position-last',\n },\n },\n defaultVariants: {\n size: 'medium',\n kind: 'primary',\n fullWidth: false,\n disabled: false,\n loading: false,\n },\n },\n {\n twMerge: false,\n },\n );\n\n render() {\n const { icon, position } = this.buttonIcon;\n\n return (\n <Host>\n <button\n type={this.type}\n disabled={this.disabled || this.loading}\n aria-label={this.label}\n aria-expanded={this.expanded}\n aria-controls={this.controls}\n aria-disabled={this.disabled}\n onClick={this.handleClick}\n onFocus={this.handleFocus}\n onBlur={this.handleBlur}\n style={this.buttonStyles}\n class={this.buttonClass({\n size: this.size,\n kind: this.kind,\n fullWidth: this.fullWidth,\n disabled: this.disabled,\n loading: this.loading,\n position: this.position,\n })}\n >\n {this.loading && <slot name=\"loading\"></slot>}\n <span>\n <slot name=\"prefix\">{position === 'prefix' && icon && <i class={' leading-none ' + icon}></i>}</slot>\n </span>\n <slot>{this.buttonText}</slot>\n <span>\n <slot name=\"suffix\">{position === 'suffix' && icon && <i class={' leading-none ' + icon}></i>}</slot>\n </span>\n </button>\n </Host>\n );\n }\n}\n"],"mappings":"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","ignoreList":[]}
@@ -0,0 +1,2 @@
1
+ import{r as e,h as t}from"./p-B84DzIAh.js";import{c as o}from"./p-BfTCfPZ1.js";const l={display:"h1",heading1:"h2",heading2:"h3",title1:"h4",title2:"h5",title3:"h6",body:"p",bodyAccent:"p",helper:"p",caption:"p",label:"label",placeholder:"p",link:"a",info:"p",infoAccent:"p"};const i=".static{position:static}.m-0{margin:0}.appearance-none{appearance:none}.truncate{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.p-0{padding:0}.text-size-12{font-size:var(--bcm-ui-font-size-12,60px);line-height:var(--bcm-ui-line-height-12,72px)}.text-size-3{font-size:var(--bcm-ui-font-size-3,12px);line-height:var(--bcm-ui-line-height-3,16px)}.text-size-4{font-size:var(--bcm-ui-font-size-4,14px);line-height:var(--bcm-ui-line-height-4,20px)}.text-size-5{font-size:var(--bcm-ui-font-size-5,16px);line-height:var(--bcm-ui-line-height-5,24px)}.text-size-6{font-size:var(--bcm-ui-font-size-6,18px);line-height:var(--bcm-ui-line-height-6,24px)}.text-size-7{font-size:var(--bcm-ui-font-size-7,20px);line-height:var(--bcm-ui-line-height-7,28px)}.font-medium{font-weight:500}.font-semibold{font-weight:600}.text-color-caption{color:var(--bcm-ui-color-text-caption)}.text-color-default{color:var(--bcm-ui-color-text-default)}.text-color-disabled{color:var(--bcm-ui-color-text-disabled)}.text-color-header{color:var(--bcm-ui-color-text-header)}.text-color-helper{color:var(--bcm-ui-color-text-helper)}.text-color-label{color:var(--bcm-ui-color-text-label)}.text-color-placeholder{color:var(--bcm-ui-color-text-placeholder)}.text-color-primary{color:var(--bcm-ui-color-text-primary)}.underline{text-decoration-line:underline}.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 r=class{constructor(t){e(this,t);this.variant="body";this.size="medium";this.overflow=false;this.variantClassMap={display:"font-semibold text-size-12 text-color-header",heading1:"font-semibold text-size-7 text-color-header",heading2:"font-semibold text-size-6 text-color-header",title1:{small:"font-semibold text-size-5 text-color-header",medium:"font-semibold text-size-6 text-color-header",large:"font-semibold text-size-7 text-color-header"},title2:{small:"font-semibold text-size-4 text-color-default",medium:"font-semibold text-size-5 text-color-default",large:"font-semibold text-size-6 text-color-default"},title3:{small:"font-semibold text-size-3 text-color-disabled",medium:"font-semibold text-size-4 text-color-disabled",large:"font-semibold text-size-5 text-color-disabled"},body:{small:"font-regular text-size-4 text-color-default",medium:"font-regular text-size-5 text-color-default",large:"font-regular text-size-6 text-color-default"},bodyAccent:{small:"font-medium text-size-4 text-color-default",medium:"font-medium text-size-5 text-color-default",large:"font-medium text-size-6 text-color-default"},helper:{small:"font-regular text-size-4 text-color-helper",medium:"font-regular text-size-5 text-color-helper",large:"font-regular text-size-6 text-color-helper"},caption:{small:"font-regular text-size-3 text-color-caption",medium:"font-regular text-size-4 text-color-caption",large:"font-regular text-size-5 text-color-caption"},link:{small:"font-medium text-size-4 underline text-color-primary",medium:"font-medium text-size-5 underline text-color-primary",large:"font-medium text-size-6 underline text-color-primary"},label:{small:"font-medium text-size-3 text-color-label",medium:"font-medium text-size-4 text-color-label",large:"font-medium text-size-5 text-color-label"},placeholder:{small:"font-regular text-size-4 text-color-placeholder",medium:"font-regular text-size-5 text-color-placeholder",large:"font-regular text-size-6 text-color-placeholder"},info:{small:"font-regular text-size-3 text-color-default",medium:"font-regular text-size-4 text-color-default",large:"font-regular text-size-5 text-color-default"},infoAccent:{small:"font-medium text-size-3 text-color-header",medium:"font-medium text-size-4 text-color-header",large:"font-medium text-size-5 text-color-header"}};this.getTextClass=(e,t)=>{const o=this.variantClassMap[e];if(typeof o==="string"){return o}return o[t]};this.getOverflowClass=e=>e?"truncate":""}render(){var e;const i=l[this.variant];const r=this.getTextClass(this.variant,this.size);const a=this.getOverflowClass((e=this.overflow)!==null&&e!==void 0?e:false);return t(i,{key:"cb3c78143a1f52fdadd9458219ef5f12eace04e6",class:o("bcm-text appearance-none m-0 p-0",r,a),part:"text"},t("slot",{key:"7ab30bbf72b0fe1be98089b6c452662a382363e1"},this.text))}};r.style=i;export{r as bcm_text};
2
+ //# sourceMappingURL=p-06656239.entry.js.map
@@ -0,0 +1 @@
1
+ {"version":3,"names":["variantTagMap","display","heading1","heading2","title1","title2","title3","body","bodyAccent","helper","caption","label","placeholder","link","info","infoAccent","textCss","BcmText","constructor","hostRef","this","variant","size","overflow","variantClassMap","small","medium","large","getTextClass","variantClasses","getOverflowClass","render","Tag","variantClass","overflowClass","_a","h","key","class","cs","part","text"],"sources":["src/components/text/text.utils.ts","src/components/text/text.scss?tag=bcm-text&encapsulation=shadow","src/components/text/text.component.tsx"],"sourcesContent":["import { TextVariant, TextTag } from './text.types';\n\nexport const variantTagMap: Record<TextVariant, TextTag> = {\n display: 'h1',\n heading1: 'h2',\n heading2: 'h3',\n title1: 'h4',\n title2: 'h5',\n title3: 'h6',\n body: 'p',\n bodyAccent: 'p',\n helper: 'p',\n caption: 'p',\n label: 'label',\n placeholder: 'p',\n link: 'a',\n info: 'p',\n infoAccent: 'p',\n};\n",null,"import { Component, h, Prop } from '@stencil/core';\nimport cs from 'classnames';\nimport { TextVariant, TextSize } from './text.types';\nimport { variantTagMap } from './text.utils';\n\n@Component({\n tag: 'bcm-text',\n styleUrl: 'text.scss',\n shadow: true,\n})\nexport class BcmText {\n /** Text content */\n @Prop()\n text: string;\n\n /** Text variant */\n @Prop()\n variant: TextVariant = 'body';\n\n /** Text size */\n @Prop()\n size: TextSize = 'medium';\n\n /** Text overflow behavior */\n @Prop()\n overflow: boolean = false;\n\n private readonly variantClassMap = {\n display: 'font-semibold text-size-12 text-color-header',\n heading1: 'font-semibold text-size-7 text-color-header',\n heading2: 'font-semibold text-size-6 text-color-header',\n title1: {\n small: 'font-semibold text-size-5 text-color-header',\n medium: 'font-semibold text-size-6 text-color-header',\n large: 'font-semibold text-size-7 text-color-header',\n },\n title2: {\n small: 'font-semibold text-size-4 text-color-default',\n medium: 'font-semibold text-size-5 text-color-default',\n large: 'font-semibold text-size-6 text-color-default',\n },\n title3: {\n small: 'font-semibold text-size-3 text-color-disabled',\n medium: 'font-semibold text-size-4 text-color-disabled',\n large: 'font-semibold text-size-5 text-color-disabled',\n },\n body: {\n small: 'font-regular text-size-4 text-color-default',\n medium: 'font-regular text-size-5 text-color-default',\n large: 'font-regular text-size-6 text-color-default',\n },\n bodyAccent: {\n small: 'font-medium text-size-4 text-color-default',\n medium: 'font-medium text-size-5 text-color-default',\n large: 'font-medium text-size-6 text-color-default',\n },\n helper: {\n small: 'font-regular text-size-4 text-color-helper',\n medium: 'font-regular text-size-5 text-color-helper',\n large: 'font-regular text-size-6 text-color-helper',\n },\n caption: {\n small: 'font-regular text-size-3 text-color-caption',\n medium: 'font-regular text-size-4 text-color-caption',\n large: 'font-regular text-size-5 text-color-caption',\n },\n link: {\n small: 'font-medium text-size-4 underline text-color-primary',\n medium: 'font-medium text-size-5 underline text-color-primary',\n large: 'font-medium text-size-6 underline text-color-primary',\n },\n label: {\n small: 'font-medium text-size-3 text-color-label',\n medium: 'font-medium text-size-4 text-color-label',\n large: 'font-medium text-size-5 text-color-label',\n },\n placeholder: {\n small: 'font-regular text-size-4 text-color-placeholder',\n medium: 'font-regular text-size-5 text-color-placeholder',\n large: 'font-regular text-size-6 text-color-placeholder',\n },\n info: {\n small: 'font-regular text-size-3 text-color-default',\n medium: 'font-regular text-size-4 text-color-default',\n large: 'font-regular text-size-5 text-color-default',\n },\n infoAccent: {\n small: 'font-medium text-size-3 text-color-header',\n medium: 'font-medium text-size-4 text-color-header',\n large: 'font-medium text-size-5 text-color-header',\n },\n } as const;\n\n private getTextClass = (variant: TextVariant, size: TextSize): string => {\n const variantClasses = this.variantClassMap[variant];\n\n if (typeof variantClasses === 'string') {\n return variantClasses;\n }\n\n return variantClasses[size];\n };\n\n private getOverflowClass = (overflow: boolean): string => {\n return overflow ? 'truncate' : '';\n };\n\n render() {\n const Tag = variantTagMap[this.variant];\n const variantClass = this.getTextClass(this.variant, this.size);\n const overflowClass = this.getOverflowClass(this.overflow ?? false);\n\n return (\n <Tag class={cs('bcm-text appearance-none m-0 p-0', variantClass, overflowClass)} part=\"text\">\n <slot>{this.text}</slot>\n </Tag>\n );\n }\n}\n"],"mappings":"+EAEO,MAAMA,EAA8C,CACzDC,QAAS,KACTC,SAAU,KACVC,SAAU,KACVC,OAAQ,KACRC,OAAQ,KACRC,OAAQ,KACRC,KAAM,IACNC,WAAY,IACZC,OAAQ,IACRC,QAAS,IACTC,MAAO,QACPC,YAAa,IACbC,KAAM,IACNC,KAAM,IACNC,WAAY,KCjBd,MAAMC,EAAU,+/C,MCUHC,EAAO,MALpB,WAAAC,CAAAC,G,UAYEC,KAAOC,QAAgB,OAIvBD,KAAIE,KAAa,SAIjBF,KAAQG,SAAY,MAEHH,KAAAI,gBAAkB,CACjCvB,QAAS,+CACTC,SAAU,8CACVC,SAAU,8CACVC,OAAQ,CACNqB,MAAO,8CACPC,OAAQ,8CACRC,MAAO,+CAETtB,OAAQ,CACNoB,MAAO,+CACPC,OAAQ,+CACRC,MAAO,gDAETrB,OAAQ,CACNmB,MAAO,gDACPC,OAAQ,gDACRC,MAAO,iDAETpB,KAAM,CACJkB,MAAO,8CACPC,OAAQ,8CACRC,MAAO,+CAETnB,WAAY,CACViB,MAAO,6CACPC,OAAQ,6CACRC,MAAO,8CAETlB,OAAQ,CACNgB,MAAO,6CACPC,OAAQ,6CACRC,MAAO,8CAETjB,QAAS,CACPe,MAAO,8CACPC,OAAQ,8CACRC,MAAO,+CAETd,KAAM,CACJY,MAAO,uDACPC,OAAQ,uDACRC,MAAO,wDAEThB,MAAO,CACLc,MAAO,2CACPC,OAAQ,2CACRC,MAAO,4CAETf,YAAa,CACXa,MAAO,kDACPC,OAAQ,kDACRC,MAAO,mDAETb,KAAM,CACJW,MAAO,8CACPC,OAAQ,8CACRC,MAAO,+CAETZ,WAAY,CACVU,MAAO,4CACPC,OAAQ,4CACRC,MAAO,8CAIHP,KAAAQ,aAAe,CAACP,EAAsBC,KAC5C,MAAMO,EAAiBT,KAAKI,gBAAgBH,GAE5C,UAAWQ,IAAmB,SAAU,CACtC,OAAOA,C,CAGT,OAAOA,EAAeP,EAAK,EAGrBF,KAAAU,iBAAoBP,GACnBA,EAAW,WAAa,EAclC,CAXC,MAAAQ,G,MACE,MAAMC,EAAMhC,EAAcoB,KAAKC,SAC/B,MAAMY,EAAeb,KAAKQ,aAAaR,KAAKC,QAASD,KAAKE,MAC1D,MAAMY,EAAgBd,KAAKU,kBAAiBK,EAAAf,KAAKG,YAAY,MAAAY,SAAA,EAAAA,EAAA,OAE7D,OACEC,EAACJ,EAAI,CAAAK,IAAA,2CAAAC,MAAOC,EAAG,mCAAoCN,EAAcC,GAAgBM,KAAK,QACpFJ,EAAA,QAAAC,IAAA,4CAAOjB,KAAKqB,M","ignoreList":[]}
@@ -0,0 +1,2 @@
1
+ import{r as t,h as i}from"./p-B84DzIAh.js";import{t as a}from"./p-CEcVC0yX.js";const o=".relative{position:relative}.block{display:block}:host{display:block;position:relative}:host([variant=full-width]){width:100%}:host([variant=auto-width]){width:auto}.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}}.static{position:static}.absolute{position:absolute}.bottom-0{bottom:0}.left-0{left:0}.right-0{right:0}.z-10{z-index:10}.flex{display:flex}.hidden{display:none}.h-0\\.5{height:.125rem}.w-auto{width:auto}.w-full{width:100%}.flex-row{flex-direction:row}.items-center{align-items:center}.bg-\\[--bcm-ui-color-text-placeholder\\]{background-color:var(--bcm-ui-color-text-placeholder)}.bg-\\[--bcm-ui-color-text-primary\\]{background-color:var(--bcm-ui-color-text-primary)}.opacity-0{opacity:0}.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)}.duration-200{transition-duration:.2s}.ease-in-out{transition-timing-function:cubic-bezier(.4,0,.2,1)}";const e=class{constructor(i){t(this,i);this.variant="full-width";this.smooth=true;this.class=a({slots:{container:"flex flex-row items-center relative",inkbar:"inkbar absolute bottom-0 left-0 h-0.5 bg-[--bcm-ui-color-text-primary] z-10 opacity-0",tabList:"tabs-list flex flex-row items-center relative",backgroundLine:"absolute bottom-0 left-0 right-0 h-0.5 bg-[--bcm-ui-color-text-placeholder]"},variants:{variant:{"full-width":{container:"w-full",tabList:"w-full",inkbar:"right-0",backgroundLine:"hidden"},"auto-width":{container:"w-auto",tabList:"w-auto",inkbar:"right-0",backgroundLine:"block"}},smooth:{true:{inkbar:"transition-all duration-200 ease-in-out"},false:{inkbar:""}}},defaultVariants:{variant:"full-width",smooth:true}})}render(){const{container:t,inkbar:a,tabList:o,backgroundLine:e}=this.class({variant:this.variant,smooth:this.smooth});return i("div",{key:"024191da887d16461269660cb7c97d896848bef0",class:t(),slot:"tabs-list"},i("div",{key:"5be00109388015401723b94881bed240594cd722",class:e()}),i("div",{key:"83c291950deaa88f32950fa84ced38f22a971dc7",class:a()}),i("div",{key:"f160a54fa4b3c82b63114e169d0ff36bf4c6d014",class:o(),role:"tablist"},i("slot",{key:"fbedd8dae37e259778d44294237616abfc1ea2dd"})))}};e.style=o;export{e as bcm_tabs_list};
2
+ //# sourceMappingURL=p-10de6d9c.entry.js.map
@@ -0,0 +1 @@
1
+ {"version":3,"names":["tabsListCss","BcmTabsList","constructor","hostRef","this","variant","smooth","class","tv","slots","container","inkbar","tabList","backgroundLine","variants","true","false","defaultVariants","render","h","key","slot","role"],"sources":["src/components/tabs/tabs-list.css?tag=bcm-tabs-list&encapsulation=shadow","src/components/tabs/tabs-list.component.tsx"],"sourcesContent":["/* tabs-list.css */\n:host {\n display: block;\n position: relative;\n}\n\n:host([variant='full-width']) {\n width: 100%;\n}\n\n:host([variant='auto-width']) {\n width: auto;\n}\n","import { Component, Prop, h, ComponentInterface } from '@stencil/core';\nimport { tv } from '@utils/tv';\n\n/**\n * @description Container component for tab triggers that includes the sliding indicator (inkbar)\n * @slot - Default slot for tab trigger elements\n */\n@Component({\n tag: 'bcm-tabs-list',\n styleUrl: 'tabs-list.css',\n shadow: true,\n})\nexport class BcmTabsList implements ComponentInterface {\n /**\n * Tab variant - controls width behavior\n */\n @Prop({ reflect: true })\n variant: 'full-width' | 'auto-width' = 'full-width';\n\n /**\n * Whether to enable smooth animations for inkbar and transitions\n */\n @Prop({ reflect: true })\n smooth: boolean = true;\n /**\n * Tailwind variants configuration for styling the tabs list container and inkbar\n */\n private class = tv({\n slots: {\n /**\n * Main container that holds both the tablist and inkbar\n */\n container: 'flex flex-row items-center relative',\n\n /**\n * The sliding indicator that appears under the active tab\n */\n inkbar: 'inkbar absolute bottom-0 left-0 h-0.5 bg-[--bcm-ui-color-text-primary] z-10 opacity-0',\n\n /**\n * The container for tab trigger elements\n */\n tabList: 'tabs-list flex flex-row items-center relative',\n\n /**\n * Background line for auto-width variant\n */\n backgroundLine: 'absolute bottom-0 left-0 right-0 h-0.5 bg-[--bcm-ui-color-text-placeholder]',\n },\n variants: {\n variant: {\n 'full-width': {\n container: 'w-full',\n tabList: 'w-full',\n inkbar: 'right-0',\n backgroundLine: 'hidden',\n },\n 'auto-width': {\n container: 'w-auto',\n tabList: 'w-auto',\n inkbar: 'right-0',\n backgroundLine: 'block',\n },\n },\n smooth: {\n true: {\n inkbar: 'transition-all duration-200 ease-in-out',\n },\n false: {\n inkbar: '',\n },\n },\n },\n defaultVariants: {\n variant: 'full-width',\n smooth: true,\n },\n });\n\n render() {\n const { container, inkbar, tabList, backgroundLine } = this.class({\n variant: this.variant,\n smooth: this.smooth,\n });\n return (\n <div class={container()} slot=\"tabs-list\">\n <div class={backgroundLine()}></div>\n <div class={inkbar()}></div>\n <div class={tabList()} role=\"tablist\">\n <slot></slot>\n </div>\n </div>\n );\n }\n}\n"],"mappings":"+EAAA,MAAMA,EAAc,61C,MCYPC,EAAW,MALxB,WAAAC,CAAAC,G,UAUEC,KAAOC,QAAgC,aAMvCD,KAAME,OAAY,KAIVF,KAAKG,MAAGC,EAAG,CACjBC,MAAO,CAILC,UAAW,sCAKXC,OAAQ,wFAKRC,QAAS,gDAKTC,eAAgB,+EAElBC,SAAU,CACRT,QAAS,CACP,aAAc,CACZK,UAAW,SACXE,QAAS,SACTD,OAAQ,UACRE,eAAgB,UAElB,aAAc,CACZH,UAAW,SACXE,QAAS,SACTD,OAAQ,UACRE,eAAgB,UAGpBP,OAAQ,CACNS,KAAM,CACJJ,OAAQ,2CAEVK,MAAO,CACLL,OAAQ,MAIdM,gBAAiB,CACfZ,QAAS,aACTC,OAAQ,OAmBb,CAfC,MAAAY,GACE,MAAMR,UAAEA,EAASC,OAAEA,EAAMC,QAAEA,EAAOC,eAAEA,GAAmBT,KAAKG,MAAM,CAChEF,QAASD,KAAKC,QACdC,OAAQF,KAAKE,SAEf,OACEa,EAAA,OAAAC,IAAA,2CAAKb,MAAOG,IAAaW,KAAK,aAC5BF,EAAA,OAAAC,IAAA,2CAAKb,MAAOM,MACZM,EAAA,OAAAC,IAAA,2CAAKb,MAAOI,MACZQ,EAAA,OAAAC,IAAA,2CAAKb,MAAOK,IAAWU,KAAK,WAC1BH,EAAa,QAAAC,IAAA,8C","ignoreList":[]}
@@ -0,0 +1,2 @@
1
+ import{r as t,c as e,h as a,a as r}from"./p-B84DzIAh.js";import{t as o}from"./p-CEcVC0yX.js";const s=".contents{display:contents}:host{display:contents}.bcm-ui-element{-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;font-family:Inter,sans-serif}.visible{visibility:visible}.invisible{visibility:hidden}.static{position:static}.fixed{position:fixed}.inset-0{inset:0}.bottom-0{bottom:0}.left-0{left:0}.right-0{right:0}.top-0{top:0}.z-40{z-index:40}.z-50{z-index:50}.m-0{margin:0}.flex{display:flex}.hidden{display:none}.h-6{height:1.5rem}.w-6{width:1.5rem}.flex-grow{flex-grow:1}.-translate-x-full{--tw-translate-x:-100%}.-translate-x-full,.-translate-y-full{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))}.-translate-y-full{--tw-translate-y:-100%}.translate-x-0{--tw-translate-x:0px}.translate-x-0,.translate-x-full{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))}.translate-x-full{--tw-translate-x:100%}.translate-y-0{--tw-translate-y:0px}.translate-y-0,.translate-y-full{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))}.translate-y-full{--tw-translate-y: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))}.cursor-pointer{cursor:pointer}.flex-col{flex-direction:column}.items-center{align-items:center}.justify-between{justify-content:space-between}.overflow-y-auto{overflow-y:auto}.border-none{border-style:none}.bg-color-base{background-color:var(--bcm-ui-color-background-base-default)}.bg-color-default{background-color:var(--bcm-ui-color-background-default-default)}.bg-color-transparent{background-color:var(--bcm-ui-color-background-transparent-default)}.bg-transparent{background-color:transparent}.p-0{padding:0}.p-4{padding:1rem}.px-4{padding-left:1rem;padding-right:1rem}.py-3{padding-bottom:.75rem;padding-top:.75rem}.text-size-5{font-size:var(--bcm-ui-font-size-5,16px);line-height:var(--bcm-ui-line-height-5,24px)}.text-size-6{font-size:var(--bcm-ui-font-size-6,18px);line-height:var(--bcm-ui-line-height-6,24px)}.font-medium{font-weight:500}.font-semibold{font-weight:600}.text-color-default{color:var(--bcm-ui-color-text-default)}.opacity-0{opacity:0}.opacity-100{opacity:1}.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-opacity{transition-duration:.15s;transition-property:opacity;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)}.hover\\:bg-color-default-hover:hover{background-color:var(--bcm-ui-color-background-default-hover)}.active\\:bg-color-default-active:active{background-color:var(--bcm-ui-color-background-default-active)}";const i=class{constructor(a){t(this,a);this.bcmOpen=e(this,"bcmOpen",7);this.bcmClose=e(this,"bcmClose",7);this.bcmBeforeOpen=e(this,"bcmBeforeOpen",7);this.bcmBeforeClose=e(this,"bcmBeforeClose",7);this.open=false;this.size="medium";this.position="right";this.fullWidth=false;this.noHeader=false;this.drawerClass=o({slots:{backdrop:"fixed inset-0 bg-color-transparent z-40 transition-opacity duration-300",wrapper:"bcm-ui-element fixed bg-color-base text-color-default z-50 transform transition-transform duration-300 ease-in-out flex flex-col",header:"flex justify-between items-center bg-color-default text-color-default",title:"font-semibold m-0 text-size-6",closeButton:"text-size-5 font-medium text-color-default bg-transparent border-none p-0 h-6 w-6 hover:bg-color-default-hover cursor-pointer active:bg-color-default-active",content:"overflow-y-auto flex-grow"},variants:{open:{true:{backdrop:"opacity-100 visible"},false:{backdrop:"opacity-0 invisible"}},position:{left:{wrapper:"top-0 left-0 bottom-0"},right:{wrapper:"top-0 right-0 bottom-0"},top:{wrapper:"top-0 left-0 right-0"},bottom:{wrapper:"bottom-0 left-0 right-0"}},size:{small:{header:"py-3 px-4",content:"p-4"},medium:{header:"py-3 px-4",content:"p-4"},large:{header:"py-3 px-4",content:"p-4"}},noHeader:{true:{header:"hidden"}}},compoundVariants:[{open:true,position:["left","right"],class:{wrapper:"translate-x-0"}},{open:true,position:["top","bottom"],class:{wrapper:"translate-y-0"}},{open:false,position:"left",class:{wrapper:"-translate-x-full"}},{open:false,position:"right",class:{wrapper:"translate-x-full"}},{open:false,position:"top",class:{wrapper:"-translate-y-full"}},{open:false,position:"bottom",class:{wrapper:"translate-y-full"}}]})}handleOpenChange(t){if(t){document.body.style.overflow="hidden";this.bcmOpen.emit()}else{document.body.style.overflow="";this.bcmClose.emit()}}handleKeyDown(t){if(t.key==="Escape"&&this.open){this.hide()}}async show(){const t=this.bcmBeforeOpen.emit();if(!t.defaultPrevented){this.open=true}}async hide(){const t=this.bcmBeforeClose.emit();if(!t.defaultPrevented){this.open=false}}disconnectedCallback(){document.body.style.overflow=""}getWrapperStyle(){const t={};if(this.fullWidth){if(this.position==="left"||this.position==="right"){t.width="100vw"}else{t.height="100vh"}return t}if(this.position==="left"||this.position==="right"){switch(this.size){case"small":t.width="320px";break;case"medium":t.width="480px";break;case"large":t.width="1064px";break}}else{switch(this.size){case"small":t.height="40vh";break;case"medium":t.height="60vh";break;case"large":t.height="90vh";break}}return t}render(){const{backdrop:t,wrapper:e,header:r,title:o,closeButton:s,content:i}=this.drawerClass({open:this.open,position:this.position,size:this.size,noHeader:this.noHeader});return a("div",{key:"44379905f1499a16d625ac4d1ff5e89fc6367d46",part:"base"},a("div",{key:"bc53e5322a61cd4af0691905c509d4c5fb765939",part:"backdrop",class:t(),onClick:()=>this.hide()}),a("div",{key:"d5a666671d24b2f3b55b7462b5218a3e11358982",part:"wrapper",class:e(),style:this.getWrapperStyle(),role:"dialog","aria-modal":"true","aria-hidden":!this.open?"true":"false","aria-label":this.headerText},a("div",{key:"5124de9d7fa8f3aa7267f0998f4c4f98f3ebbc4a",part:"header",class:r()},a("h2",{key:"8aa4b971efa9fe0fafa1cfb94f0b6b96f21f2f15",part:"title",class:o()},a("slot",{key:"949ae8f65d13e9e1c973c16a9f90205ac7e7042f",name:"header"},this.headerText)),a("button",{key:"a0c42761ee859e87dee5c267ea7245dde4fb8756",part:"close-button",class:s(),onClick:()=>this.hide(),"aria-label":"Close"},a("bcm-icon",{key:"2df273d63da93eda2280759a909906fe4ae0c493",name:"fa-solid fa-xmark"}))),a("div",{key:"b2532537d10f9aa0dcfa2fca8ac806577363e05b",part:"content",class:i()},a("slot",{key:"bfec5cff35a7bf7bf1d9801ba89559501e6f301f"})),a("div",{key:"4d44fdba62c74fd5c893c5296f998754228cf961",part:"footer"},a("slot",{key:"fd0a58127fd2f0ba0955cef629e55700142a8f32",name:"footer"}))))}get host(){return r(this)}static get watchers(){return{open:["handleOpenChange"]}}};i.style=s;export{i as bcm_drawer};
2
+ //# sourceMappingURL=p-48c554fc.entry.js.map
@@ -0,0 +1 @@
1
+ {"version":3,"names":["drawerCss","BcmDrawer","constructor","hostRef","this","open","size","position","fullWidth","noHeader","drawerClass","tv","slots","backdrop","wrapper","header","title","closeButton","content","variants","true","false","left","right","top","bottom","small","medium","large","compoundVariants","class","handleOpenChange","isOpen","document","body","style","overflow","bcmOpen","emit","bcmClose","handleKeyDown","event","key","hide","show","bcmBeforeOpen","defaultPrevented","bcmBeforeClose","disconnectedCallback","getWrapperStyle","width","height","render","h","part","onClick","role","headerText","name"],"sources":["src/components/drawer/drawer.css?tag=bcm-drawer&encapsulation=shadow","src/components/drawer/drawer.component.tsx"],"sourcesContent":[":host {\n display: contents;\n}\n","import { Component, Prop, h, Element, Event, EventEmitter, Method, Watch, Listen } from '@stencil/core';\nimport { tv } from '@utils/tv';\nimport { DrawerPosition, DrawerSize } from './types';\n\n@Component({\n tag: 'bcm-drawer',\n styleUrl: 'drawer.css',\n shadow: true,\n})\nexport class BcmDrawer {\n @Element() host: HTMLElement;\n\n @Prop({ mutable: true, reflect: true }) open: boolean = false;\n @Prop() size: DrawerSize = 'medium';\n @Prop() position: DrawerPosition = 'right';\n @Prop({ attribute: 'full-width' }) fullWidth: boolean = false;\n @Prop() headerText?: string;\n @Prop({ attribute: 'no-header' }) noHeader: boolean = false;\n\n @Event() bcmOpen: EventEmitter<void>;\n @Event() bcmClose: EventEmitter<void>;\n @Event({ cancelable: true }) bcmBeforeOpen: EventEmitter<void>;\n @Event({ cancelable: true }) bcmBeforeClose: EventEmitter<void>;\n\n private drawerClass = tv({\n slots: {\n backdrop: 'fixed inset-0 bg-color-transparent z-40 transition-opacity duration-300',\n wrapper: 'bcm-ui-element fixed bg-color-base text-color-default z-50 transform transition-transform duration-300 ease-in-out flex flex-col',\n header: 'flex justify-between items-center bg-color-default text-color-default',\n title: 'font-semibold m-0 text-size-6',\n closeButton: 'text-size-5 font-medium text-color-default bg-transparent border-none p-0 h-6 w-6 hover:bg-color-default-hover cursor-pointer active:bg-color-default-active',\n content: 'overflow-y-auto flex-grow',\n },\n variants: {\n open: {\n true: {\n backdrop: 'opacity-100 visible',\n },\n false: {\n backdrop: 'opacity-0 invisible',\n },\n },\n position: {\n left: {\n wrapper: 'top-0 left-0 bottom-0',\n },\n right: {\n wrapper: 'top-0 right-0 bottom-0',\n },\n top: {\n wrapper: 'top-0 left-0 right-0',\n },\n bottom: {\n wrapper: 'bottom-0 left-0 right-0',\n },\n },\n size: {\n small: {\n header: 'py-3 px-4',\n content: 'p-4',\n },\n medium: {\n header: 'py-3 px-4',\n content: 'p-4',\n },\n large: {\n header: 'py-3 px-4',\n content: 'p-4',\n },\n },\n noHeader: {\n true: {\n header: 'hidden',\n },\n },\n },\n compoundVariants: [\n {\n open: true,\n position: ['left', 'right'],\n class: {\n wrapper: 'translate-x-0',\n },\n },\n {\n open: true,\n position: ['top', 'bottom'],\n class: {\n wrapper: 'translate-y-0',\n },\n },\n {\n open: false,\n position: 'left',\n class: {\n wrapper: '-translate-x-full',\n },\n },\n {\n open: false,\n position: 'right',\n class: {\n wrapper: 'translate-x-full',\n },\n },\n {\n open: false,\n position: 'top',\n class: {\n wrapper: '-translate-y-full',\n },\n },\n {\n open: false,\n position: 'bottom',\n class: {\n wrapper: 'translate-y-full',\n },\n },\n ],\n });\n\n @Watch('open')\n handleOpenChange(isOpen: boolean) {\n if (isOpen) {\n document.body.style.overflow = 'hidden';\n this.bcmOpen.emit();\n } else {\n document.body.style.overflow = '';\n this.bcmClose.emit();\n }\n }\n\n @Listen('keydown', { target: 'window' })\n handleKeyDown(event: KeyboardEvent) {\n if (event.key === 'Escape' && this.open) {\n this.hide();\n }\n }\n\n @Method()\n async show(): Promise<void> {\n const event = this.bcmBeforeOpen.emit();\n if (!event.defaultPrevented) {\n this.open = true;\n }\n }\n\n @Method()\n async hide(): Promise<void> {\n const event = this.bcmBeforeClose.emit();\n if (!event.defaultPrevented) {\n this.open = false;\n }\n }\n\n disconnectedCallback() {\n document.body.style.overflow = '';\n }\n\n private getWrapperStyle() {\n const style: { [key: string]: string } = {};\n\n if (this.fullWidth) {\n if (this.position === 'left' || this.position === 'right') {\n style.width = '100vw';\n } else {\n style.height = '100vh';\n }\n return style;\n }\n\n if (this.position === 'left' || this.position === 'right') {\n switch (this.size) {\n case 'small':\n style.width = '320px';\n break;\n case 'medium':\n style.width = '480px';\n break;\n case 'large':\n style.width = '1064px';\n break;\n }\n } else {\n switch (this.size) {\n case 'small':\n style.height = '40vh';\n break;\n case 'medium':\n style.height = '60vh';\n break;\n case 'large':\n style.height = '90vh';\n break;\n }\n }\n\n return style;\n }\n\n render() {\n const { backdrop, wrapper, header, title, closeButton, content } = this.drawerClass({\n open: this.open,\n position: this.position,\n size: this.size,\n noHeader: this.noHeader,\n });\n\n return (\n <div part=\"base\">\n <div part=\"backdrop\" class={backdrop()} onClick={() => this.hide()} />\n <div\n part=\"wrapper\"\n class={wrapper()}\n style={this.getWrapperStyle()}\n role=\"dialog\"\n aria-modal=\"true\"\n aria-hidden={!this.open ? 'true' : 'false'}\n aria-label={this.headerText}\n >\n <div part=\"header\" class={header()}>\n <h2 part=\"title\" class={title()}>\n <slot name=\"header\">{this.headerText}</slot>\n </h2>\n <button part=\"close-button\" class={closeButton()} onClick={() => this.hide()} aria-label=\"Close\">\n <bcm-icon name=\"fa-solid fa-xmark\"></bcm-icon>\n </button>\n </div>\n <div part=\"content\" class={content()}>\n <slot />\n </div>\n <div part=\"footer\">\n <slot name=\"footer\" />\n </div>\n </div>\n </div>\n );\n }\n}\n"],"mappings":"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","ignoreList":[]}
@@ -1,2 +1,2 @@
1
- import{r as t,h as i,a as s}from"./p-B84DzIAh.js";import{b as e,c as o,o as a,f as h,s as r,a as l}from"./p-DxMLMJ3r.js";import{t as c}from"./p-CEcVC0yX.js";const d=":host{--tooltip-bg:var(--bcm-ui-color-background-default-dark-default)}.bcm-ui-element{-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;font-family:Inter,sans-serif}.static{position:static}.absolute{position:absolute}.relative{position:relative}.z-\\[-1\\]{z-index:-1}.z-\\[9999\\]{z-index:9999}.block{display:block}.hidden{display:none}.h-4{height:1rem}.w-4{width:1rem}.min-w-max{min-width:max-content}.rotate-45{--tw-rotate:45deg}.rotate-45,.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))}.rounded-md{border-radius:var(--bcm-ui-border-radius-md,6px)}.bg-\\[--tooltip-bg\\]{background-color:var(--tooltip-bg)}.px-3{padding-left:.75rem;padding-right:.75rem}.py-1{padding-bottom:.25rem;padding-top:.25rem}.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}.text-color-base{color:var(--bcm-ui-color-text-base)}.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)}";const n=class{constructor(i){t(this,i);this.trigger="hover";this.placement="top";this.size="medium";this.showDelay=150;this.open=false;this.toggleTooltip=()=>{this.open=!this.open;this.updateOutsideClickListener()};this.showTooltip=()=>{clearTimeout(this.hoverTimeout);this.hoverTimeout=setTimeout((()=>{this.open=true;this.updateOutsideClickListener()}),this.showDelay)};this.hideTooltip=()=>{clearTimeout(this.hoverTimeout);this.hoverTimeout=setTimeout((()=>{this.open=false;this.updateOutsideClickListener()}),this.showDelay)};this.handleSlotChange=()=>{const t=this.el.shadowRoot.querySelector("slot");const i=t.assignedElements();this.targetElement=i[0];if(this.targetElement){this.targetElement.removeEventListener("click",this.toggleTooltip);this.targetElement.removeEventListener("mouseenter",this.showTooltip);this.targetElement.removeEventListener("mouseleave",this.hideTooltip);if(this.trigger==="click"){this.targetElement.addEventListener("click",this.toggleTooltip);this.targetElement.setAttribute("aria-expanded",this.open.toString());this.targetElement.setAttribute("aria-describedby","tooltip")}if(this.trigger==="hover"){this.targetElement.addEventListener("mouseenter",this.showTooltip);this.targetElement.addEventListener("mouseleave",this.hideTooltip);this.targetElement.setAttribute("aria-describedby","tooltip")}if(this.tooltipElement&&!this.cleanupAutoUpdate){this.cleanupAutoUpdate=e(this.targetElement,this.tooltipElement,(()=>this.updatePosition()),{animationFrame:false})}}};this.handleOutsideClick=t=>{if(!this.el.contains(t.target)&&this.open){this.open=false;this.updateOutsideClickListener()}};this.updatePosition=async()=>{if(!this.targetElement||!this.tooltipElement||!this.arrowElement)return;const{x:t,y:i,placement:s,middlewareData:e}=await o(this.targetElement,this.tooltipElement,{placement:this.placement,middleware:[a(12),h({fallbackPlacements:["top","left","bottom","right"]}),r({padding:8}),l({element:this.arrowElement})]});Object.assign(this.tooltipElement.style,{left:`${t}px`,top:`${i}px`});const{x:c,y:d}=e.arrow||{x:0,y:0};const n=s.split("-")[0];const m={top:"bottom",right:"left",bottom:"top",left:"right"}[n];Object.assign(this.arrowElement.style,{left:c!=null?`${c}px`:"",top:d!=null?`${d}px`:"",[m]:"-4px"})};this.tooltipClass=c({slots:{tooltip:"bcm-ui-element bcm-tooltip absolute bg-[--tooltip-bg] rounded-md shadow-3 py-1 px-3 min-w-max z-[9999] text-color-base font-medium",arrow:"absolute w-4 h-4 bg-[--tooltip-bg] transform rotate-45 z-[-1]"},variants:{size:{small:{tooltip:"text-size-3"},medium:{tooltip:"text-size-4"},large:{tooltip:"text-size-5"}},isOpen:{true:{tooltip:"block"},false:{tooltip:"hidden"}}},defaultVariants:{size:"medium",isOpen:false}},{twMerge:false})}disconnectedCallback(){var t;document.removeEventListener("click",this.handleOutsideClick);if(this.targetElement){this.targetElement.removeEventListener("click",this.toggleTooltip);this.targetElement.removeEventListener("mouseenter",this.showTooltip);this.targetElement.removeEventListener("mouseleave",this.hideTooltip)}(t=this.cleanupAutoUpdate)===null||t===void 0?void 0:t.call(this);this.cleanupAutoUpdate=null;clearTimeout(this.hoverTimeout)}updateOutsideClickListener(){if(this.open){document.addEventListener("click",this.handleOutsideClick)}else{document.removeEventListener("click",this.handleOutsideClick)}}async openTooltip(){this.showTooltip()}async closeTooltip(){this.hideTooltip()}render(){const{tooltip:t,arrow:s}=this.tooltipClass({size:this.size,isOpen:this.open});return i("div",{key:"dcc6e18aa58d06cb88e74d47379476c6319bdc2a",class:"relative"},i("slot",{key:"c71d60cff006d2da8e7eadb372aa854c18cf78d4",onSlotchange:()=>this.handleSlotChange()}),i("div",{key:"3809fa4c4431ace38173db76013742a5b9aba2da",role:"tooltip",class:t(),ref:t=>this.tooltipElement=t,part:"tooltip"},i("div",{key:"b9a21a339baaa3f37cad4477d990f4028cfb4e91",class:s(),ref:t=>this.arrowElement=t,part:"arrow"}),i("slot",{key:"64622a02cfd571b2cff5b51dc1c412d0b3e48396",name:"tooltip"},this.message)))}get el(){return s(this)}};n.style=d;export{n as bcm_tooltip};
2
- //# sourceMappingURL=p-b02f5178.entry.js.map
1
+ import{r as t,h as i,a as s}from"./p-B84DzIAh.js";import{b as e,c as o,o as a,f as h,s as r,a as l}from"./p-DxMLMJ3r.js";import{t as c}from"./p-CEcVC0yX.js";const n=":host{--tooltip-bg:var(--bcm-ui-color-background-default-dark-default)}.bcm-ui-element{-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;font-family:Inter,sans-serif}.static{position:static}.absolute{position:absolute}.relative{position:relative}.z-\\[-1\\]{z-index:-1}.z-\\[9999\\]{z-index:9999}.block{display:block}.hidden{display:none}.h-4{height:1rem}.w-4{width:1rem}.min-w-max{min-width:max-content}.rotate-45{--tw-rotate:45deg}.rotate-45,.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))}.rounded-md{border-radius:var(--bcm-ui-border-radius-md,6px)}.bg-\\[--tooltip-bg\\]{background-color:var(--tooltip-bg)}.px-3{padding-left:.75rem;padding-right:.75rem}.py-1{padding-bottom:.25rem;padding-top:.25rem}.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}.text-color-base{color:var(--bcm-ui-color-text-base)}.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)}";const d=class{constructor(i){t(this,i);this.trigger="hover";this.placement="top";this.size="medium";this.showDelay=150;this.open=false;this.toggleTooltip=()=>{this.open=!this.open;this.updateOutsideClickListener()};this.showTooltip=()=>{clearTimeout(this.hoverTimeout);this.hoverTimeout=setTimeout((()=>{this.open=true;this.updateOutsideClickListener()}),this.showDelay)};this.hideTooltip=()=>{clearTimeout(this.hoverTimeout);this.hoverTimeout=setTimeout((()=>{this.open=false;this.updateOutsideClickListener()}),this.showDelay)};this.handleSlotChange=()=>{const t=this.el.shadowRoot.querySelector("slot");const i=t.assignedElements();this.targetElement=i[0];if(this.targetElement){this.targetElement.removeEventListener("click",this.toggleTooltip);this.targetElement.removeEventListener("mouseenter",this.showTooltip);this.targetElement.removeEventListener("mouseleave",this.hideTooltip);if(this.trigger==="click"){this.targetElement.addEventListener("click",this.toggleTooltip);this.targetElement.setAttribute("aria-expanded",this.open.toString());this.targetElement.setAttribute("aria-describedby","tooltip")}if(this.trigger==="hover"){this.targetElement.addEventListener("mouseenter",this.showTooltip);this.targetElement.addEventListener("mouseleave",this.hideTooltip);this.targetElement.setAttribute("aria-describedby","tooltip")}if(this.tooltipElement&&!this.cleanupAutoUpdate){this.cleanupAutoUpdate=e(this.targetElement,this.tooltipElement,(()=>this.updatePosition()),{animationFrame:false})}}};this.handleOutsideClick=t=>{if(!this.el.contains(t.target)&&this.open){this.open=false;this.updateOutsideClickListener()}};this.updatePosition=async()=>{if(!this.targetElement||!this.tooltipElement||!this.arrowElement)return;const{x:t,y:i,placement:s,middlewareData:e}=await o(this.targetElement,this.tooltipElement,{placement:this.placement,middleware:[a(12),h({fallbackPlacements:["top","left","bottom","right"]}),r({padding:8}),l({element:this.arrowElement})]});Object.assign(this.tooltipElement.style,{left:`${t}px`,top:`${i}px`});const{x:c,y:n}=e.arrow||{x:0,y:0};const d=s.split("-")[0];const m={top:"bottom",right:"left",bottom:"top",left:"right"}[d];Object.assign(this.arrowElement.style,{left:c!=null?`${c}px`:"",top:n!=null?`${n}px`:"",[m]:"-4px"})};this.tooltipClass=c({slots:{tooltip:"bcm-ui-element bcm-tooltip absolute bg-[--tooltip-bg] rounded-md shadow-3 py-1 px-3 min-w-max z-[9999] text-color-base font-medium",arrow:"absolute w-4 h-4 bg-[--tooltip-bg] transform rotate-45 z-[-1]"},variants:{size:{small:{tooltip:"text-size-3"},medium:{tooltip:"text-size-4"},large:{tooltip:"text-size-5"}},isOpen:{true:{tooltip:"block"},false:{tooltip:"hidden"}}},defaultVariants:{size:"medium",isOpen:false}},{twMerge:false})}disconnectedCallback(){var t;document.removeEventListener("click",this.handleOutsideClick);if(this.targetElement){this.targetElement.removeEventListener("click",this.toggleTooltip);this.targetElement.removeEventListener("mouseenter",this.showTooltip);this.targetElement.removeEventListener("mouseleave",this.hideTooltip)}(t=this.cleanupAutoUpdate)===null||t===void 0?void 0:t.call(this);this.cleanupAutoUpdate=null;clearTimeout(this.hoverTimeout)}updateOutsideClickListener(){if(this.open){document.addEventListener("click",this.handleOutsideClick)}else{document.removeEventListener("click",this.handleOutsideClick)}}async openTooltip(){this.showTooltip()}async closeTooltip(){this.hideTooltip()}render(){const{tooltip:t,arrow:s}=this.tooltipClass({size:this.size,isOpen:this.open});return i("div",{key:"4f56a4f689b53133813d3f137cffe76681a55507",class:"relative"},i("slot",{key:"b4d9bff63de72e1983ed98d876e9d3e3087bb8af",onSlotchange:()=>this.handleSlotChange()}),i("div",{key:"e0e8268e16210582970d43124057fc16bd0dae6b",role:"tooltip",class:t(),ref:t=>this.tooltipElement=t,part:"tooltip"},i("div",{key:"bcdf720805c95c1a2ca3f734ea34473f5cf789a0",class:s(),ref:t=>this.arrowElement=t,part:"arrow"}),i("slot",{key:"c008c7ab349cbc03f7444edf80afce16795aa663",name:"tooltip"},this.message)))}get el(){return s(this)}};d.style=n;export{d as bcm_tooltip};
2
+ //# sourceMappingURL=p-7f117b72.entry.js.map
@@ -0,0 +1,2 @@
1
+ import{r as e,c as t,h as i,a as r}from"./p-B84DzIAh.js";import{g as o}from"./p-IBjzkjef.js";import{t as s}from"./p-CEcVC0yX.js";const a=":host{display:inline-block}.bcm-ui-element{-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;font-family:Inter,sans-serif}.static{position:static}.absolute{position:absolute}.relative{position:relative}.left-0\\.5{left:.125rem}.left-\\[1\\.125rem\\]{left:1.125rem}.left-\\[1\\.25rem\\]{left:1.25rem}.left-\\[1\\.375rem\\]{left:1.375rem}.order-2{order:2}.flex{display:flex}.hidden{display:none}.size-3{height:.75rem;width:.75rem}.size-3\\.5{height:.875rem;width:.875rem}.size-4{width:1rem}.h-4,.size-4{height:1rem}.h-5{height:1.25rem}.h-\\[1\\.125rem\\]{height:1.125rem}.w-10{width:2.5rem}.w-8{width:2rem}.w-9{width:2.25rem}.cursor-default{cursor:default}.cursor-pointer{cursor:pointer}.flex-col{flex-direction:column}.items-center{align-items:center}.gap-0\\.5{gap:.125rem}.gap-1{gap:.25rem}.gap-2{gap:.5rem}.gap-2\\.5{gap:.625rem}.gap-3{gap:.75rem}.rounded-full{border-radius:var(--bcm-ui-border-radius-full,9999px)}.bg-\\[--switch-bg\\]{background-color:var(--switch-bg)}.bg-\\[--switch-dot-bg\\]{background-color:var(--switch-dot-bg)}.text-size-3{font-size:var(--bcm-ui-font-size-3,12px);line-height:var(--bcm-ui-line-height-3,16px)}.text-size-4{font-size:var(--bcm-ui-font-size-4,14px);line-height:var(--bcm-ui-line-height-4,20px)}.text-size-5{font-size:var(--bcm-ui-font-size-5,16px);line-height:var(--bcm-ui-line-height-5,24px)}.text-size-6{font-size:var(--bcm-ui-font-size-6,18px);line-height:var(--bcm-ui-line-height-6,24px)}.font-medium{font-weight:500}.font-normal{font-weight:400}.\\!text-color-error{color:var(--bcm-ui-color-text-error)!important}.shadow{--tw-shadow:var(--bcm-ui-box-shadow-default);--tw-shadow-colored:var(--bcm-ui-box-shadow-default)}.shadow,.shadow-sm{box-shadow:var(--tw-ring-offset-shadow,0 0 #0000),var(--tw-ring-shadow,0 0 #0000),var(--tw-shadow)}.shadow-sm{--tw-shadow:var(--bcm-ui-box-shadow-sm);--tw-shadow-colored:var(--bcm-ui-box-shadow-sm)}.transition-all{transition-duration:.15s;transition-property:all;transition-timing-function:cubic-bezier(.4,0,.2,1)}.transition-colors{transition-duration:.15s;transition-property:color,background-color,border-color,text-decoration-color,fill,stroke;transition-timing-function:cubic-bezier(.4,0,.2,1)}.duration-300{transition-duration:.3s}.ease-in-out{transition-timing-function:cubic-bezier(.4,0,.2,1)}.group:hover .group-hover\\:bg-\\[--switch-bg-hover\\],.hover\\:bg-\\[--switch-bg-hover\\]:hover{background-color:var(--switch-bg-hover)}.peer:focus-visible~.peer-focus-visible\\:ring-2{--tw-ring-offset-shadow:var(--tw-ring-inset) 0 0 0 var(--tw-ring-offset-width) var(--tw-ring-offset-color);--tw-ring-shadow:var(--tw-ring-inset) 0 0 0 calc(2px + var(--tw-ring-offset-width)) var(--tw-ring-color);box-shadow:var(--tw-ring-offset-shadow),var(--tw-ring-shadow),var(--tw-shadow,0 0 #0000)}.peer:focus-visible~.peer-focus-visible\\:ring-blue-300{--tw-ring-color:oklch(0.809 0.105 251.813)}.peer:focus-visible~.peer-focus-visible\\:ring-offset-2{--tw-ring-offset-width:2px}.peer:disabled~.peer-disabled\\:cursor-not-allowed{cursor:not-allowed}.peer:disabled~.peer-disabled\\:\\!text-color-disabled{color:var(--bcm-ui-color-text-disabled)!important}";const c=class{constructor(i){e(this,i);this.bcmSwitchChange=t(this,"bcmSwitchChange",1);this.checked=false;this.disabled=false;this.labelPosition="right";this.error=false;this.size="medium";this.readonly=false;this.required=false;this.switchId=o("switch");this.switchStyle=()=>{const e={"--switch-bg":"var(--bcm-ui-color-background-default-dark-default)","--switch-bg-hover":"var(--bcm-ui-color-background-default-dark-hover)","--switch-dot-bg":"var(--bcm-ui-color-background-base-default)"};const t={"--switch-bg":"var(--bcm-ui-color-background-info-default)","--switch-bg-hover":"var(--bcm-ui-color-background-info-hover)"};const i={"--switch-bg":"var(--bcm-ui-color-background-error-default)","--switch-bg-hover":"var(--bcm-ui-color-background-error-hover)"};const r={"--switch-bg":"var(--bcm-ui-color-background-default-dark-default)","--switch-bg-hover":"var(--bcm-ui-color-background-default-dark-default)","--switch-dot-bg":"var(--bcm-ui-color-background-disabled-default)"};const o={"--switch-bg":"var(--bcm-ui-color-background-disabled-default)","--switch-bg-hover":"var(--bcm-ui-color-background-disabled-default)","--switch-dot-bg":"var(--bcm-ui-color-background-default-default)"};return Object.assign(Object.assign(Object.assign(Object.assign(Object.assign({},e),this.checked&&t),this.error&&i),this.readonly&&r),this.disabled&&o)};this.switchClass=s({slots:{base:"bcm-ui-element flex flex-col",switchWrapper:"flex items-center group",dotContainer:"relative flex items-center rounded-full cursor-pointer bg-[--switch-bg] group-hover:bg-[--switch-bg-hover] peer-disabled:cursor-not-allowed transition-colors duration-300",dot:"absolute bg-[--switch-dot-bg] rounded-full shadow-sm transition-all duration-300 ease-in-out peer-disabled:cursor-not-allowed",caption:"!text-color-error font-normal",label:"!text-color font-medium peer-disabled:!text-color-disabled peer-disabled:cursor-not-allowed"},variants:{size:{small:{dotContainer:"w-8 h-4",dot:"size-3",label:"text-size-4",caption:"text-size-3",switchWrapper:"gap-2",base:"gap-0.5"},medium:{dotContainer:"w-9 h-[1.125rem]",dot:"size-3.5",label:"text-size-5",caption:"text-size-4",switchWrapper:"gap-2.5",base:"gap-1"},large:{dotContainer:"w-10 h-5",dot:"size-4",label:"text-size-6",caption:"text-size-5",switchWrapper:"gap-3",base:"gap-2"}},labelPosition:{left:{label:""},right:{label:"order-2"}},checked:{true:{dot:""},false:{dot:"left-0.5"}},disabled:{true:"",false:{switchWrapper:""}},readonly:{true:{switchWrapper:"cursor-default",dotContainer:"cursor-default",dot:"cursor-default"},false:{switchWrapper:"cursor-pointer",dotContainer:"cursor-pointer hover:bg-[--switch-bg-hover]"}}},compoundVariants:[{size:"small",checked:true,class:{dot:"left-[1.125rem]"}},{size:"medium",checked:true,class:{dot:"left-[1.25rem]"}},{size:"large",checked:true,class:{dot:"left-[1.375rem]"}},{readonly:false,disabled:false,class:{dotContainer:"peer-focus-visible:ring-2 peer-focus-visible:ring-offset-2 peer-focus-visible:ring-blue-300"}}]})}toggleSwitch(){if(this.disabled||this.readonly)return;this.checked=!this.checked;this.bcmSwitchChange.emit(this.checked)}render(){const{base:e,switchWrapper:t,label:r,dot:o,dotContainer:s,caption:a}=this.switchClass({size:this.size,checked:this.checked,disabled:this.disabled,labelPosition:this.labelPosition,readonly:this.readonly});const c=Object.assign({role:"switch","aria-checked":this.checked.toString(),"aria-disabled":this.disabled.toString(),"aria-readonly":this.readonly.toString()},this.required&&{"aria-required":"true"});const l=!this.readonly&&!this.disabled?{tabindex:"0"}:{};return i("div",{key:"d3a267192ccecc212952b3140e15579868669559",class:e()},i("label",{key:"a0ed52d113eb5da56a56ec71bde2c2cae17603b9",class:t(),style:this.switchStyle()},i("input",{key:"d5f3041f00a7689244a8799d58d90281b6e44ddc",id:this.switchId,type:"checkbox",class:"hidden peer",checked:this.checked,name:this.name,value:this.value,disabled:this.disabled,readOnly:this.readonly,required:this.required,onChange:()=>this.toggleSwitch()}),this.label&&i("span",{key:"2c19141b32811c2237f272f0194677b5e85911d8",class:r()},i("slot",{key:"b0725f609b318d99ccc7eb9abb0f742754323710"},this.label)),i("label",Object.assign({key:"a9a4a95627dbe7e5ce60fdfe2188feba7ed34da3",htmlFor:this.switchId,class:s()},l,c,{onKeyDown:e=>{if((e.key==="Enter"||e.key===" ")&&!this.readonly&&!this.disabled){e.preventDefault();this.toggleSwitch()}}}),i("div",{key:"c123c5b1037558e44b30256b2b86f9c894edf75d",class:o()}))),this.error&&this.caption&&i("span",{key:"f7a50c32b5868facac9c7627237c6f3542b26bf3",class:a()},this.caption),i("slot",{key:"ed4d82b698202070324d645f358b2058c3583d28",name:"caption"}))}get el(){return r(this)}};c.style=a;export{c as bcm_switch};
2
+ //# sourceMappingURL=p-a07a257f.entry.js.map
@@ -0,0 +1 @@
1
+ {"version":3,"names":["switchCss","BcmSwitch","constructor","hostRef","this","checked","disabled","labelPosition","error","size","readonly","required","switchId","generateId","switchStyle","defaultStyle","checkedStyle","errorStyle","readonlyStyle","disabledStyle","Object","assign","switchClass","tv","slots","base","switchWrapper","dotContainer","dot","caption","label","variants","small","medium","large","left","right","true","false","compoundVariants","class","toggleSwitch","bcmSwitchChange","emit","render","ariaAttributes","role","toString","tabIndexAttr","tabindex","h","key","style","id","type","name","value","readOnly","onChange","htmlFor","onKeyDown","event","preventDefault"],"sources":["src/components/switch/switch.css?tag=bcm-switch&encapsulation=shadow","src/components/switch/switch.component.tsx"],"sourcesContent":[":host {\n display: inline-block;\n}\n","import { Component, Prop, h, Event, EventEmitter, Element, ComponentInterface } from '@stencil/core';\nimport { generateId } from '../../utils/id/generate-id';\nimport { tv } from '@utils/tv';\n\n/**\n * @component BcmSwitch\n * @description A customizable toggle switch component that provides an intuitive way to enable or disable options.\n * Supports different sizes, label positions, error states, and accessibility features.\n *\n * @example Basic usage\n * <bcm-switch label=\"Enable notifications\"></bcm-switch>\n *\n * @example With error state\n * <bcm-switch\n * label=\"Accept terms\"\n * error={true}\n * caption=\"You must accept the terms to continue\">\n * </bcm-switch>\n *\n * @example Disabled state\n * <bcm-switch\n * label=\"Advanced features\"\n * disabled={true}>\n * </bcm-switch>\n *\n * @example With custom size and label position\n * <bcm-switch\n * label=\"Dark mode\"\n * size=\"large\"\n * labelPosition=\"left\">\n * </bcm-switch>\n */\n@Component({\n tag: 'bcm-switch',\n styleUrl: 'switch.css',\n shadow: true,\n})\nexport class BcmSwitch implements ComponentInterface {\n /** Reference to the host element */\n @Element()\n el: HTMLElement;\n\n /** Whether the switch is checked or not */\n @Prop({ reflect: true, mutable: true })\n checked: boolean = false;\n\n /** Whether the switch is disabled */\n @Prop()\n disabled: boolean = false;\n\n /** The name attribute for the hidden input element */\n @Prop()\n name: string;\n\n /** The value attribute for the hidden input element */\n @Prop()\n value: string;\n\n /** Text label for the switch */\n @Prop()\n label: string;\n\n /** Position of the label relative to the switch */\n @Prop()\n labelPosition: 'left' | 'right' = 'right';\n\n /** Whether to display the switch in an error state */\n @Prop()\n error: boolean = false;\n\n /** Text to display as an error message when error is true */\n @Prop()\n caption?: string;\n\n /** Size variant of the switch */\n @Prop()\n size: 'small' | 'medium' | 'large' = 'medium';\n\n /** Whether the switch is in readonly mode */\n @Prop()\n readonly: boolean = false;\n\n /** Whether the switch is required in a form */\n @Prop()\n required: boolean = false;\n\n /** Emitted when the switch state changes */\n @Event({\n composed: false,\n bubbles: false,\n cancelable: true,\n })\n bcmSwitchChange: EventEmitter<boolean>;\n\n private switchId = generateId('switch');\n\n private toggleSwitch(): void {\n if (this.disabled || this.readonly) return;\n this.checked = !this.checked;\n this.bcmSwitchChange.emit(this.checked);\n }\n\n private switchStyle = () => {\n const defaultStyle = {\n '--switch-bg': 'var(--bcm-ui-color-background-default-dark-default)',\n '--switch-bg-hover': 'var(--bcm-ui-color-background-default-dark-hover)',\n '--switch-dot-bg': 'var(--bcm-ui-color-background-base-default)',\n };\n\n const checkedStyle = {\n '--switch-bg': 'var(--bcm-ui-color-background-info-default)',\n '--switch-bg-hover': 'var(--bcm-ui-color-background-info-hover)',\n };\n\n const errorStyle = {\n '--switch-bg': 'var(--bcm-ui-color-background-error-default)',\n '--switch-bg-hover': 'var(--bcm-ui-color-background-error-hover)',\n };\n\n const readonlyStyle = {\n '--switch-bg': 'var(--bcm-ui-color-background-default-dark-default)',\n '--switch-bg-hover': 'var(--bcm-ui-color-background-default-dark-default)',\n '--switch-dot-bg': 'var(--bcm-ui-color-background-disabled-default)',\n };\n\n const disabledStyle = {\n '--switch-bg': 'var(--bcm-ui-color-background-disabled-default)',\n '--switch-bg-hover': 'var(--bcm-ui-color-background-disabled-default)',\n '--switch-dot-bg': 'var(--bcm-ui-color-background-default-default)',\n };\n\n return {\n ...defaultStyle,\n ...(this.checked && checkedStyle),\n ...(this.error && errorStyle),\n ...(this.readonly && readonlyStyle),\n ...(this.disabled && disabledStyle),\n };\n };\n\n private switchClass = tv({\n slots: {\n base: 'bcm-ui-element flex flex-col',\n switchWrapper: 'flex items-center group',\n dotContainer:\n 'relative flex items-center rounded-full cursor-pointer bg-[--switch-bg] group-hover:bg-[--switch-bg-hover] peer-disabled:cursor-not-allowed transition-colors duration-300',\n dot: 'absolute bg-[--switch-dot-bg] rounded-full shadow-sm transition-all duration-300 ease-in-out peer-disabled:cursor-not-allowed',\n caption: '!text-color-error font-normal',\n label: '!text-color font-medium peer-disabled:!text-color-disabled peer-disabled:cursor-not-allowed',\n },\n variants: {\n size: {\n small: {\n dotContainer: 'w-8 h-4',\n dot: 'size-3',\n label: 'text-size-4',\n caption: 'text-size-3',\n switchWrapper: 'gap-2',\n base: 'gap-0.5',\n },\n medium: {\n dotContainer: 'w-9 h-[1.125rem]',\n dot: 'size-3.5',\n label: 'text-size-5',\n caption: 'text-size-4',\n switchWrapper: 'gap-2.5',\n base: 'gap-1',\n },\n large: {\n dotContainer: 'w-10 h-5',\n dot: 'size-4',\n label: 'text-size-6',\n caption: 'text-size-5',\n switchWrapper: 'gap-3',\n base: 'gap-2',\n },\n },\n labelPosition: {\n left: {\n label: '',\n },\n right: {\n label: 'order-2',\n },\n },\n checked: {\n true: {\n dot: '',\n },\n false: {\n dot: 'left-0.5',\n },\n },\n disabled: {\n true: '',\n false: {\n switchWrapper: '',\n },\n },\n readonly: {\n true: {\n switchWrapper: 'cursor-default',\n dotContainer: 'cursor-default',\n dot: 'cursor-default',\n },\n false: {\n switchWrapper: 'cursor-pointer',\n dotContainer: 'cursor-pointer hover:bg-[--switch-bg-hover]',\n },\n },\n },\n compoundVariants: [\n {\n size: 'small',\n checked: true,\n class: {\n dot: 'left-[1.125rem]',\n },\n },\n {\n size: 'medium',\n checked: true,\n class: {\n dot: 'left-[1.25rem]',\n },\n },\n {\n size: 'large',\n checked: true,\n class: {\n dot: 'left-[1.375rem]',\n },\n },\n {\n readonly: false,\n disabled: false,\n class: {\n dotContainer: 'peer-focus-visible:ring-2 peer-focus-visible:ring-offset-2 peer-focus-visible:ring-blue-300',\n },\n },\n ],\n });\n\n render() {\n const { base, switchWrapper, label, dot, dotContainer, caption } = this.switchClass({\n size: this.size,\n checked: this.checked,\n disabled: this.disabled,\n labelPosition: this.labelPosition,\n readonly: this.readonly,\n });\n\n const ariaAttributes = {\n 'role': 'switch',\n 'aria-checked': this.checked.toString(),\n 'aria-disabled': this.disabled.toString(),\n 'aria-readonly': this.readonly.toString(),\n ...(this.required && { 'aria-required': 'true' }),\n };\n\n const tabIndexAttr = !this.readonly && !this.disabled ? { tabindex: '0' } : {};\n\n return (\n <div class={base()}>\n <label class={switchWrapper()} style={this.switchStyle()}>\n <input\n id={this.switchId}\n type=\"checkbox\"\n class=\"hidden peer\"\n checked={this.checked}\n name={this.name}\n value={this.value}\n disabled={this.disabled}\n readOnly={this.readonly}\n required={this.required}\n onChange={() => this.toggleSwitch()}\n />\n\n {this.label && (\n <span class={label()}>\n <slot>{this.label}</slot>\n </span>\n )}\n <label\n htmlFor={this.switchId}\n class={dotContainer()}\n {...tabIndexAttr}\n {...ariaAttributes}\n onKeyDown={event => {\n if ((event.key === 'Enter' || event.key === ' ') && !this.readonly && !this.disabled) {\n event.preventDefault();\n this.toggleSwitch();\n }\n }}\n >\n <div class={dot()}></div>\n </label>\n </label>\n\n {this.error && this.caption && <span class={caption()}>{this.caption}</span>}\n <slot name=\"caption\"></slot>\n </div>\n );\n }\n}\n"],"mappings":"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","ignoreList":[]}
@@ -1,2 +1,2 @@
1
- import{r as e,c as t,h as r,a as o}from"./p-B84DzIAh.js";import{t as i}from"./p-CEcVC0yX.js";import{c as s}from"./p-BfTCfPZ1.js";import{g as a}from"./p-IBjzkjef.js";import{s as l,g as c,d as n}from"./p-CUvT12BL.js";const h='.visible{visibility:visible}.collapse{visibility:collapse}.relative{position:relative}.block{display:block}.flex{display:flex}.table{display:table}.contents{display:contents}.hidden{display:none}.border-collapse{border-collapse:collapse}.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-none{resize:none;resize:none!important}.resize-y{resize:vertical;resize:vertical!important}.resize-x{resize:horizontal;resize:horizontal!important}.resize{resize:both!important;resize:both}.border{border-width:1px}.underline{text-decoration-line:underline}.outline{outline-style:solid}/*! tailwindcss v3.4.17 | MIT License | https://tailwindcss.com*/*,:after,:before{border:0 solid oklch(92.8% .006 264.531deg);box-sizing:border-box}:after,:before{--tw-content:""}:host,html{-webkit-text-size-adjust:100%;font-feature-settings:normal;-webkit-tap-highlight-color:transparent;font-family:Inter,sans-serif;font-variation-settings:normal;line-height:1.5;-moz-tab-size:4;-o-tab-size:4;tab-size:4}body{line-height:inherit;margin:0}hr{border-top-width:1px;color:inherit;height:0}abbr:where([title]){-webkit-text-decoration:underline dotted;text-decoration:underline dotted}h1,h2,h3,h4,h5,h6{font-size:inherit;font-weight:inherit}a{color:inherit;text-decoration:inherit}b,strong{font-weight:bolder}code,kbd,pre,samp{font-feature-settings:normal;font-family:ui-monospace,SFMono-Regular,Menlo,Monaco,Consolas,Liberation Mono,Courier New,monospace;font-size:1em;font-variation-settings:normal}small{font-size:80%}sub,sup{font-size:75%;line-height:0;position:relative;vertical-align:baseline}sub{bottom:-.25em}sup{top:-.5em}table{border-collapse:collapse;border-color:inherit;text-indent:0}button,input,optgroup,select,textarea{font-feature-settings:inherit;color:inherit;font-family:inherit;font-size:100%;font-variation-settings:inherit;font-weight:inherit;letter-spacing:inherit;line-height:inherit;margin:0;padding:0}button,select{text-transform:none}button,input:where([type=button]),input:where([type=reset]),input:where([type=submit]){-webkit-appearance:button;background-color:transparent;background-image:none}:-moz-focusring{outline:auto}:-moz-ui-invalid{box-shadow:none}progress{vertical-align:baseline}::-webkit-inner-spin-button,::-webkit-outer-spin-button{height:auto}[type=search]{-webkit-appearance:textfield;outline-offset:-2px}::-webkit-search-decoration{-webkit-appearance:none}::-webkit-file-upload-button{-webkit-appearance:button;font:inherit}summary{display:list-item}blockquote,dd,dl,fieldset,figure,h1,h2,h3,h4,h5,h6,hr,p,pre{margin:0}fieldset,legend{padding:0}menu,ol,ul{list-style:none;margin:0;padding:0}dialog{padding:0}textarea{resize:vertical}input::-moz-placeholder,textarea::-moz-placeholder{color:oklch(70.7% .022 261.325deg);opacity:1}input::placeholder,textarea::placeholder{color:oklch(70.7% .022 261.325deg);opacity:1}[role=button],button{cursor:pointer}:disabled{cursor:default}audio,canvas,embed,iframe,img,object,svg,video{display:block;vertical-align:middle}img,video{height:auto;max-width:100%}[hidden]:where(:not([hidden=until-found])){display:none}:host{display:block;width:100%}.bcm-textarea__container{display:flex;flex-direction:column;width:100%}.bcm-ui-element{-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;font-family:Inter,sans-serif}.static{position:static}.mt-1{margin-top:.25rem}.min-h-0{min-height:0}.min-h-\\[3rem\\]{min-height:3rem}.min-h-\\[4rem\\]{min-height:4rem}.min-h-\\[5rem\\]{min-height:5rem}.w-full{width:100%}.grow{flex-grow:1}.cursor-not-allowed{cursor:not-allowed}.\\!resize-none{resize:none!important}.\\!resize-y{resize:vertical!important}.\\!resize-x{resize:horizontal!important}.\\!resize{resize:both!important}.appearance-none{appearance:none}.flex-col{flex-direction:column}.overflow-y-auto{overflow-y:auto}.rounded{border-radius:var(--bcm-ui-border-radius-default,6px)}.border-0{border-width:0}.border-solid{border-style:solid}.border-\\[--bcm-ui-color-border-default\\]{border-color:var(--bcm-ui-color-border-default)}.border-\\[--bcm-ui-color-border-error\\]{border-color:var(--bcm-ui-color-border-error)}.border-\\[--bcm-ui-color-border-info\\]{border-color:var(--bcm-ui-color-border-info)}.border-\\[--bcm-ui-color-border-success\\]{border-color:var(--bcm-ui-color-border-success)}.border-\\[--bcm-ui-color-border-warning\\]{border-color:var(--bcm-ui-color-border-warning)}.bg-\\[--bcm-ui-color-background-base-default\\]{background-color:var(--bcm-ui-color-background-base-default)}.bg-transparent{background-color:transparent}.px-1{padding-left:.25rem;padding-right:.25rem}.px-2{padding-left:.5rem;padding-right:.5rem}.py-2{padding-bottom:.5rem;padding-top:.5rem}.text-right{text-align:right}.font-sans{font-family:Inter,sans-serif}.text-size-3{font-size:var(--bcm-ui-font-size-3,12px);line-height:var(--bcm-ui-line-height-3,16px)}.text-size-4{font-size:var(--bcm-ui-font-size-4,14px);line-height:var(--bcm-ui-line-height-4,20px)}.text-size-5{font-size:var(--bcm-ui-font-size-5,16px);line-height:var(--bcm-ui-line-height-5,24px)}.text-size-6{font-size:var(--bcm-ui-font-size-6,18px);line-height:var(--bcm-ui-line-height-6,24px)}.font-medium{font-weight:500}.text-\\[--bcm-ui-color-text-caption\\]{color:var(--bcm-ui-color-text-caption)}.text-\\[--bcm-ui-color-text-default\\]{color:var(--bcm-ui-color-text-default)}.text-\\[--bcm-ui-color-text-disabled\\]{color:var(--bcm-ui-color-text-disabled)}.text-\\[--bcm-ui-color-text-error\\]{color:var(--bcm-ui-color-text-error)}.text-\\[--bcm-ui-color-text-info\\]{color:var(--bcm-ui-color-text-info)}.text-\\[--bcm-ui-color-text-placeholder\\]{color:var(--bcm-ui-color-text-placeholder)}.text-\\[--bcm-ui-color-text-success\\]{color:var(--bcm-ui-color-text-success)}.text-\\[--bcm-ui-color-text-warning\\]{color:var(--bcm-ui-color-text-warning)}.text-color-disabled{color:var(--bcm-ui-color-text-disabled)}.text-color-label{color:var(--bcm-ui-color-text-label)}.antialiased{-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale}.opacity-50{opacity:.5}.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-0{outline-width:0}.ring-2{--tw-ring-offset-shadow:var(--tw-ring-inset) 0 0 0 var(--tw-ring-offset-width) var(--tw-ring-offset-color);--tw-ring-shadow:var(--tw-ring-inset) 0 0 0 calc(2px + var(--tw-ring-offset-width)) var(--tw-ring-color);box-shadow:var(--tw-ring-offset-shadow),var(--tw-ring-shadow),var(--tw-shadow,0 0 #0000)}.ring-\\[--bcm-ui-color-border-primary\\]{--tw-ring-color:var(--bcm-ui-color-border-primary)}.ring-opacity-50{--tw-ring-opacity:0.5}.blur{--tw-blur:blur(8px);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)}.transition-colors{transition-duration:.15s;transition-property:color,background-color,border-color,text-decoration-color,fill,stroke;transition-timing-function:cubic-bezier(.4,0,.2,1)}.duration-200{transition-duration:.2s}.placeholder\\:font-normal::placeholder{font-weight:400}.placeholder\\:text-\\[--bcm-ui-color-text-placeholder\\]::placeholder{color:var(--bcm-ui-color-text-placeholder)}.hover\\:border-\\[--bcm-ui-color-border-error\\]:hover{border-color:var(--bcm-ui-color-border-error)}.hover\\:border-\\[--bcm-ui-color-border-info\\]:hover{border-color:var(--bcm-ui-color-border-info)}.hover\\:border-\\[--bcm-ui-color-border-primary\\]:hover{border-color:var(--bcm-ui-color-border-primary)}.hover\\:border-\\[--bcm-ui-color-border-success\\]:hover{border-color:var(--bcm-ui-color-border-success)}.hover\\:border-\\[--bcm-ui-color-border-warning\\]:hover{border-color:var(--bcm-ui-color-border-warning)}.has-\\[\\:focus\\]\\:border-\\[--bcm-ui-color-border-error\\]:has(:focus){border-color:var(--bcm-ui-color-border-error)}.has-\\[\\:focus\\]\\:border-\\[--bcm-ui-color-border-info\\]:has(:focus){border-color:var(--bcm-ui-color-border-info)}.has-\\[\\:focus\\]\\:border-\\[--bcm-ui-color-border-primary\\]:has(:focus){border-color:var(--bcm-ui-color-border-primary)}.has-\\[\\:focus\\]\\:border-\\[--bcm-ui-color-border-success\\]:has(:focus){border-color:var(--bcm-ui-color-border-success)}.has-\\[\\:focus\\]\\:border-\\[--bcm-ui-color-border-warning\\]:has(:focus){border-color:var(--bcm-ui-color-border-warning)}';const d=class{constructor(r){e(this,r);this.bcmInput=t(this,"bcmInput",1);this.bcmChange=t(this,"bcmChange",1);this.bcmFocus=t(this,"bcmFocus",1);this.bcmBlur=t(this,"bcmBlur",1);this.bcmKeyDown=t(this,"bcmKeyDown",1);this.bcmKeyUp=t(this,"bcmKeyUp",1);this.isFocused=false;this.isValid=true;this.internalStatus="default";this.value="";this.rows=3;this.resize="none";this.autoGrow=false;this._id=a("textarea");this.size="medium";this.status="default";this.fullWidth=false;this.disabled=false;this.readonly=false;this.required=false;this.showCounter=true;this.onChange=e=>{this.bcmChange.emit(e)};this.onFocus=e=>{this.isFocused=true;this.bcmFocus.emit(e)};this.onBlur=e=>{this.isFocused=false;this.bcmBlur.emit(e);this.validateInput()};this.onKeyDown=e=>{this.bcmKeyDown.emit(e)};this.onKeyUp=e=>{this.bcmKeyUp.emit(e)};this.styleClass=i({slots:{base:["bcm-textarea bcm-textarea__container","bg-[--bcm-ui-color-background-base-default]","border border-solid rounded","flex flex-col","transition-colors duration-200","px-2 py-2","w-full"],textareaClass:["textarea","w-full","border-0 outline-0 bg-transparent","appearance-none","text-[--bcm-ui-color-text-default] placeholder:text-[--bcm-ui-color-text-placeholder] placeholder:font-normal","font-sans antialiased font-medium","px-1","overflow-y-auto","min-h-0"],counterText:["textarea-counter-text","text-[--bcm-ui-color-text-placeholder]","text-right","mt-1"]},variants:{size:{small:{base:"",textareaClass:"text-size-4 min-h-[3rem]",counterText:"text-size-3"},medium:{base:"",textareaClass:"text-size-5 min-h-[4rem]",counterText:"text-size-4"},large:{base:"",textareaClass:"text-size-6 min-h-[5rem]",counterText:"text-size-5"}},resize:{none:{textareaClass:"!resize-none"},both:{textareaClass:"!resize"},horizontal:{textareaClass:"!resize-x"},vertical:{textareaClass:"!resize-y"}},status:{default:{base:["border-[--bcm-ui-color-border-default]","hover:border-[--bcm-ui-color-border-primary]","has-[:focus]:border-[--bcm-ui-color-border-primary]"]},error:{base:["border-[--bcm-ui-color-border-error]","hover:border-[--bcm-ui-color-border-error]","has-[:focus]:border-[--bcm-ui-color-border-error]"]},success:{base:["border-[--bcm-ui-color-border-success]","hover:border-[--bcm-ui-color-border-success]","has-[:focus]:border-[--bcm-ui-color-border-success]"]},warning:{base:["border-[--bcm-ui-color-border-warning]","hover:border-[--bcm-ui-color-border-warning]","has-[:focus]:border-[--bcm-ui-color-border-warning]"]},info:{base:["border-[--bcm-ui-color-border-info]","hover:border-[--bcm-ui-color-border-info]","has-[:focus]:border-[--bcm-ui-color-border-info]"]}},fullWidth:{true:"full-width w-full"},disabled:{true:{base:"disabled cursor-not-allowed opacity-50",textareaClass:"!resize-none"},false:""},focused:{true:{base:"ring-2 ring-[--bcm-ui-color-border-primary] ring-opacity-50"},false:""}},defaultVariants:{size:"medium",status:"default",resize:"vertical",fullWidth:false,disabled:false,focused:false}},{twMerge:false})}handleValueChange(e){if(this.textareaRef){this.textareaRef.value=e;if(this.autoGrow){this.adjustHeight()}}}watchStatus(e){this.internalStatus=e}watchErrorMessage(e){this.internalErrorMessage=e}componentWillLoad(){l("en",n);this.internalStatus=this.status;this.internalErrorMessage=this.errorMessage}componentDidLoad(){var e;if(this.autoGrow){this.adjustHeight();(e=this.textareaRef)===null||e===void 0?void 0:e.addEventListener("input",(()=>this.adjustHeight()))}}disconnectedCallback(){if(this.autoGrow&&this.textareaRef){this.textareaRef.removeEventListener("input",(()=>this.adjustHeight()))}}async setFocus(){var e;(e=this.textareaRef)===null||e===void 0?void 0:e.focus()}async setBlur(){var e;(e=this.textareaRef)===null||e===void 0?void 0:e.blur()}async select(){var e;(e=this.textareaRef)===null||e===void 0?void 0:e.select()}adjustHeight(){if(!this.autoGrow||!this.textareaRef)return;requestAnimationFrame((()=>{this.textareaRef.style.height="0px";const e=getComputedStyle(this.textareaRef);const t=parseInt(e.lineHeight);const r=parseInt(e.paddingTop);const o=parseInt(e.paddingBottom);const i=this.textareaRef.scrollHeight;let s=i;if(this.minRows){const e=this.minRows*t+r+o;s=Math.max(s,e)}if(this.maxRows){const e=this.maxRows*t+r+o;s=Math.min(s,e)}this.textareaRef.style.height=`${s}px`}))}validateInput(){if(!this.textareaRef)return;this.isValid=true;this.validationMessage="";const e=this.textareaRef.value;if(this.required&&!e){this.isValid=false;this.validationMessage=c("required");this.internalStatus="error";this.internalErrorMessage=this.validationMessage;return}if(this.minLength&&e.length<this.minLength){this.isValid=false;this.validationMessage=c("minlength",{min:this.minLength})}else if(this.maxLength&&e.length>this.maxLength){this.isValid=false;this.validationMessage=c("maxlength",{max:this.maxLength})}if(this.validator){const t=this.validator(e);if(t){this.isValid=false;this.validationMessage=t}}this.internalStatus=this.isValid?"default":"error";this.internalErrorMessage=this.validationMessage}render(){const e=this._id+"-textarea"||this.name;const{base:t,textareaClass:o,counterText:i}=this.styleClass({size:this.size,status:this.internalStatus,resize:this.resize,fullWidth:this.fullWidth,disabled:this.disabled,focused:this.isFocused});return r("div",{key:"cce4483a5f44eed885b80802ae5ee2095f4cba41",class:"bcm-ui-element"},this.label&&r("label",{key:"d9a4ac16ba8b98b46c2b2ac64840666ae837de2a",class:s("textarea-label font-medium",{"text-color-label":!this.disabled,"text-color-disabled":this.disabled},{"text-size-3":this.size==="small","text-size-4":this.size==="medium","text-size-5":this.size==="large"}),htmlFor:e},r("slot",{key:"6ce983052a2dbacfdf5dc6321a9812b3761d58a2",name:"label"},this.label),this.required&&r("span",{key:"4b01f610ee619d2143aa320a367e0acc2b8c1e94"},"*")),r("div",{key:"77ec8de4e301cf57e1a9de845bfe2402ebaa4f2e",class:t()},r("textarea",{key:"e2cd335bf9d9da8485a45dd5a3cc14052644ca43",ref:e=>this.textareaRef=e,id:e,class:o(),name:this.name,rows:this.rows,cols:this.cols,disabled:this.disabled,readonly:this.readonly,required:this.required,placeholder:this.placeholder,minLength:this.minLength,maxLength:this.maxLength,"aria-invalid":this.status==="error","aria-required":this.required,"aria-labelledby":this.labelledby,"aria-describedby":this.describedby,value:this.value,onInput:e=>{const t=e.target;this.value=t.value;this.bcmInput.emit(e);this.validateInput();if(this.autoGrow){this.adjustHeight()}},onChange:this.onChange,onFocus:this.onFocus,onBlur:this.onBlur,onKeyDown:this.onKeyDown,onKeyUp:this.onKeyUp}),this.showCounter&&r("div",{key:"151edc84e8faceee551b2de16c3dc81a5016240c",class:i()},this.value.length,this.maxLength?`/${this.maxLength}`:"")),(this.captionText||this.internalErrorMessage||this.validationMessage)&&r("div",{key:"d188a0d8dc28c80c73e66884473c2fa3c5cab514",class:s("textarea-caption-text font-regular mt-1",{"text-[--bcm-ui-color-text-caption]":!this.disabled&&this.internalStatus==="default","text-[--bcm-ui-color-text-error]":!this.disabled&&(this.internalStatus==="error"||!this.isValid),"text-[--bcm-ui-color-text-success]":!this.disabled&&this.internalStatus==="success","text-[--bcm-ui-color-text-warning]":!this.disabled&&this.internalStatus==="warning","text-[--bcm-ui-color-text-info]":!this.disabled&&this.internalStatus==="info","text-[--bcm-ui-color-text-disabled]":this.disabled},{"text-size-3":this.size==="small","text-size-4":this.size==="medium","text-size-5":this.size==="large"})},!this.isValid?this.validationMessage:this.internalStatus==="error"?this.internalErrorMessage:this.captionText))}get el(){return o(this)}static get watchers(){return{value:["handleValueChange"],status:["watchStatus"],errorMessage:["watchErrorMessage"]}}};d.style=h;export{d as bcm_textarea};
2
- //# sourceMappingURL=p-5c1b22b5.entry.js.map
1
+ import{r as e,c as t,h as r,a as o}from"./p-B84DzIAh.js";import{t as i}from"./p-CEcVC0yX.js";import{c as s}from"./p-BfTCfPZ1.js";import{g as a}from"./p-IBjzkjef.js";import{s as l,g as n,d as c}from"./p-CUvT12BL.js";const h='.visible{visibility:visible}.collapse{visibility:collapse}.relative{position:relative}.block{display:block}.flex{display:flex}.table{display:table}.contents{display:contents}.hidden{display:none}.border-collapse{border-collapse:collapse}.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-none{resize:none;resize:none!important}.resize-y{resize:vertical;resize:vertical!important}.resize-x{resize:horizontal;resize:horizontal!important}.resize{resize:both!important;resize:both}.border{border-width:1px}.underline{text-decoration-line:underline}.outline{outline-style:solid}/*! tailwindcss v3.4.17 | MIT License | https://tailwindcss.com*/*,:after,:before{border:0 solid oklch(92.8% .006 264.531deg);box-sizing:border-box}:after,:before{--tw-content:""}:host,html{-webkit-text-size-adjust:100%;font-feature-settings:normal;-webkit-tap-highlight-color:transparent;font-family:Inter,sans-serif;font-variation-settings:normal;line-height:1.5;-moz-tab-size:4;-o-tab-size:4;tab-size:4}body{line-height:inherit;margin:0}hr{border-top-width:1px;color:inherit;height:0}abbr:where([title]){-webkit-text-decoration:underline dotted;text-decoration:underline dotted}h1,h2,h3,h4,h5,h6{font-size:inherit;font-weight:inherit}a{color:inherit;text-decoration:inherit}b,strong{font-weight:bolder}code,kbd,pre,samp{font-feature-settings:normal;font-family:ui-monospace,SFMono-Regular,Menlo,Monaco,Consolas,Liberation Mono,Courier New,monospace;font-size:1em;font-variation-settings:normal}small{font-size:80%}sub,sup{font-size:75%;line-height:0;position:relative;vertical-align:baseline}sub{bottom:-.25em}sup{top:-.5em}table{border-collapse:collapse;border-color:inherit;text-indent:0}button,input,optgroup,select,textarea{font-feature-settings:inherit;color:inherit;font-family:inherit;font-size:100%;font-variation-settings:inherit;font-weight:inherit;letter-spacing:inherit;line-height:inherit;margin:0;padding:0}button,select{text-transform:none}button,input:where([type=button]),input:where([type=reset]),input:where([type=submit]){-webkit-appearance:button;background-color:transparent;background-image:none}:-moz-focusring{outline:auto}:-moz-ui-invalid{box-shadow:none}progress{vertical-align:baseline}::-webkit-inner-spin-button,::-webkit-outer-spin-button{height:auto}[type=search]{-webkit-appearance:textfield;outline-offset:-2px}::-webkit-search-decoration{-webkit-appearance:none}::-webkit-file-upload-button{-webkit-appearance:button;font:inherit}summary{display:list-item}blockquote,dd,dl,fieldset,figure,h1,h2,h3,h4,h5,h6,hr,p,pre{margin:0}fieldset,legend{padding:0}menu,ol,ul{list-style:none;margin:0;padding:0}dialog{padding:0}textarea{resize:vertical}input::-moz-placeholder,textarea::-moz-placeholder{color:oklch(70.7% .022 261.325deg);opacity:1}input::placeholder,textarea::placeholder{color:oklch(70.7% .022 261.325deg);opacity:1}[role=button],button{cursor:pointer}:disabled{cursor:default}audio,canvas,embed,iframe,img,object,svg,video{display:block;vertical-align:middle}img,video{height:auto;max-width:100%}[hidden]:where(:not([hidden=until-found])){display:none}:host{display:block;width:100%}.bcm-textarea__container{display:flex;flex-direction:column;width:100%}.bcm-ui-element{-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;font-family:Inter,sans-serif}.static{position:static}.mt-1{margin-top:.25rem}.min-h-0{min-height:0}.min-h-\\[3rem\\]{min-height:3rem}.min-h-\\[4rem\\]{min-height:4rem}.min-h-\\[5rem\\]{min-height:5rem}.w-full{width:100%}.grow{flex-grow:1}.cursor-not-allowed{cursor:not-allowed}.\\!resize-none{resize:none!important}.\\!resize-y{resize:vertical!important}.\\!resize-x{resize:horizontal!important}.\\!resize{resize:both!important}.appearance-none{appearance:none}.flex-col{flex-direction:column}.overflow-y-auto{overflow-y:auto}.rounded{border-radius:var(--bcm-ui-border-radius-default,6px)}.border-0{border-width:0}.border-solid{border-style:solid}.border-\\[--bcm-ui-color-border-default\\]{border-color:var(--bcm-ui-color-border-default)}.border-\\[--bcm-ui-color-border-error\\]{border-color:var(--bcm-ui-color-border-error)}.border-\\[--bcm-ui-color-border-info\\]{border-color:var(--bcm-ui-color-border-info)}.border-\\[--bcm-ui-color-border-success\\]{border-color:var(--bcm-ui-color-border-success)}.border-\\[--bcm-ui-color-border-warning\\]{border-color:var(--bcm-ui-color-border-warning)}.bg-\\[--bcm-ui-color-background-base-default\\]{background-color:var(--bcm-ui-color-background-base-default)}.bg-transparent{background-color:transparent}.px-1{padding-left:.25rem;padding-right:.25rem}.px-2{padding-left:.5rem;padding-right:.5rem}.py-2{padding-bottom:.5rem;padding-top:.5rem}.text-right{text-align:right}.font-sans{font-family:Inter,sans-serif}.text-size-3{font-size:var(--bcm-ui-font-size-3,12px);line-height:var(--bcm-ui-line-height-3,16px)}.text-size-4{font-size:var(--bcm-ui-font-size-4,14px);line-height:var(--bcm-ui-line-height-4,20px)}.text-size-5{font-size:var(--bcm-ui-font-size-5,16px);line-height:var(--bcm-ui-line-height-5,24px)}.text-size-6{font-size:var(--bcm-ui-font-size-6,18px);line-height:var(--bcm-ui-line-height-6,24px)}.font-medium{font-weight:500}.text-\\[--bcm-ui-color-text-caption\\]{color:var(--bcm-ui-color-text-caption)}.text-\\[--bcm-ui-color-text-default\\]{color:var(--bcm-ui-color-text-default)}.text-\\[--bcm-ui-color-text-disabled\\]{color:var(--bcm-ui-color-text-disabled)}.text-\\[--bcm-ui-color-text-error\\]{color:var(--bcm-ui-color-text-error)}.text-\\[--bcm-ui-color-text-info\\]{color:var(--bcm-ui-color-text-info)}.text-\\[--bcm-ui-color-text-placeholder\\]{color:var(--bcm-ui-color-text-placeholder)}.text-\\[--bcm-ui-color-text-success\\]{color:var(--bcm-ui-color-text-success)}.text-\\[--bcm-ui-color-text-warning\\]{color:var(--bcm-ui-color-text-warning)}.text-color-disabled{color:var(--bcm-ui-color-text-disabled)}.text-color-label{color:var(--bcm-ui-color-text-label)}.antialiased{-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale}.opacity-50{opacity:.5}.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-0{outline-width:0}.ring-2{--tw-ring-offset-shadow:var(--tw-ring-inset) 0 0 0 var(--tw-ring-offset-width) var(--tw-ring-offset-color);--tw-ring-shadow:var(--tw-ring-inset) 0 0 0 calc(2px + var(--tw-ring-offset-width)) var(--tw-ring-color);box-shadow:var(--tw-ring-offset-shadow),var(--tw-ring-shadow),var(--tw-shadow,0 0 #0000)}.ring-\\[--bcm-ui-color-border-primary\\]{--tw-ring-color:var(--bcm-ui-color-border-primary)}.ring-opacity-50{--tw-ring-opacity:0.5}.blur{--tw-blur:blur(8px);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)}.transition-colors{transition-duration:.15s;transition-property:color,background-color,border-color,text-decoration-color,fill,stroke;transition-timing-function:cubic-bezier(.4,0,.2,1)}.duration-200{transition-duration:.2s}.placeholder\\:font-normal::placeholder{font-weight:400}.placeholder\\:text-\\[--bcm-ui-color-text-placeholder\\]::placeholder{color:var(--bcm-ui-color-text-placeholder)}.hover\\:border-\\[--bcm-ui-color-border-error\\]:hover{border-color:var(--bcm-ui-color-border-error)}.hover\\:border-\\[--bcm-ui-color-border-info\\]:hover{border-color:var(--bcm-ui-color-border-info)}.hover\\:border-\\[--bcm-ui-color-border-primary\\]:hover{border-color:var(--bcm-ui-color-border-primary)}.hover\\:border-\\[--bcm-ui-color-border-success\\]:hover{border-color:var(--bcm-ui-color-border-success)}.hover\\:border-\\[--bcm-ui-color-border-warning\\]:hover{border-color:var(--bcm-ui-color-border-warning)}.has-\\[\\:focus\\]\\:border-\\[--bcm-ui-color-border-error\\]:has(:focus){border-color:var(--bcm-ui-color-border-error)}.has-\\[\\:focus\\]\\:border-\\[--bcm-ui-color-border-info\\]:has(:focus){border-color:var(--bcm-ui-color-border-info)}.has-\\[\\:focus\\]\\:border-\\[--bcm-ui-color-border-primary\\]:has(:focus){border-color:var(--bcm-ui-color-border-primary)}.has-\\[\\:focus\\]\\:border-\\[--bcm-ui-color-border-success\\]:has(:focus){border-color:var(--bcm-ui-color-border-success)}.has-\\[\\:focus\\]\\:border-\\[--bcm-ui-color-border-warning\\]:has(:focus){border-color:var(--bcm-ui-color-border-warning)}';const d=class{constructor(r){e(this,r);this.bcmInput=t(this,"bcmInput",1);this.bcmChange=t(this,"bcmChange",1);this.bcmFocus=t(this,"bcmFocus",1);this.bcmBlur=t(this,"bcmBlur",1);this.bcmKeyDown=t(this,"bcmKeyDown",1);this.bcmKeyUp=t(this,"bcmKeyUp",1);this.isFocused=false;this.isValid=true;this.internalStatus="default";this.value="";this.rows=3;this.resize="none";this.autoGrow=false;this._id=a("textarea");this.size="medium";this.status="default";this.fullWidth=false;this.disabled=false;this.readonly=false;this.required=false;this.showCounter=true;this.onChange=e=>{this.bcmChange.emit(e)};this.onFocus=e=>{this.isFocused=true;this.bcmFocus.emit(e)};this.onBlur=e=>{this.isFocused=false;this.bcmBlur.emit(e);this.validateInput()};this.onKeyDown=e=>{this.bcmKeyDown.emit(e)};this.onKeyUp=e=>{this.bcmKeyUp.emit(e)};this.styleClass=i({slots:{base:["bcm-textarea bcm-textarea__container","bg-[--bcm-ui-color-background-base-default]","border border-solid rounded","flex flex-col","transition-colors duration-200","px-2 py-2","w-full"],textareaClass:["textarea","w-full","border-0 outline-0 bg-transparent","appearance-none","text-[--bcm-ui-color-text-default] placeholder:text-[--bcm-ui-color-text-placeholder] placeholder:font-normal","font-sans antialiased font-medium","px-1","overflow-y-auto","min-h-0"],counterText:["textarea-counter-text","text-[--bcm-ui-color-text-placeholder]","text-right","mt-1"]},variants:{size:{small:{base:"",textareaClass:"text-size-4 min-h-[3rem]",counterText:"text-size-3"},medium:{base:"",textareaClass:"text-size-5 min-h-[4rem]",counterText:"text-size-4"},large:{base:"",textareaClass:"text-size-6 min-h-[5rem]",counterText:"text-size-5"}},resize:{none:{textareaClass:"!resize-none"},both:{textareaClass:"!resize"},horizontal:{textareaClass:"!resize-x"},vertical:{textareaClass:"!resize-y"}},status:{default:{base:["border-[--bcm-ui-color-border-default]","hover:border-[--bcm-ui-color-border-primary]","has-[:focus]:border-[--bcm-ui-color-border-primary]"]},error:{base:["border-[--bcm-ui-color-border-error]","hover:border-[--bcm-ui-color-border-error]","has-[:focus]:border-[--bcm-ui-color-border-error]"]},success:{base:["border-[--bcm-ui-color-border-success]","hover:border-[--bcm-ui-color-border-success]","has-[:focus]:border-[--bcm-ui-color-border-success]"]},warning:{base:["border-[--bcm-ui-color-border-warning]","hover:border-[--bcm-ui-color-border-warning]","has-[:focus]:border-[--bcm-ui-color-border-warning]"]},info:{base:["border-[--bcm-ui-color-border-info]","hover:border-[--bcm-ui-color-border-info]","has-[:focus]:border-[--bcm-ui-color-border-info]"]}},fullWidth:{true:"full-width w-full"},disabled:{true:{base:"disabled cursor-not-allowed opacity-50",textareaClass:"!resize-none"},false:""},focused:{true:{base:"ring-2 ring-[--bcm-ui-color-border-primary] ring-opacity-50"},false:""}},defaultVariants:{size:"medium",status:"default",resize:"vertical",fullWidth:false,disabled:false,focused:false}},{twMerge:false})}handleValueChange(e){if(this.textareaRef){this.textareaRef.value=e;if(this.autoGrow){this.adjustHeight()}}}watchStatus(e){this.internalStatus=e}watchErrorMessage(e){this.internalErrorMessage=e}componentWillLoad(){l("en",c);this.internalStatus=this.status;this.internalErrorMessage=this.errorMessage}componentDidLoad(){var e;if(this.autoGrow){this.adjustHeight();(e=this.textareaRef)===null||e===void 0?void 0:e.addEventListener("input",(()=>this.adjustHeight()))}}disconnectedCallback(){if(this.autoGrow&&this.textareaRef){this.textareaRef.removeEventListener("input",(()=>this.adjustHeight()))}}async setFocus(){var e;(e=this.textareaRef)===null||e===void 0?void 0:e.focus()}async setBlur(){var e;(e=this.textareaRef)===null||e===void 0?void 0:e.blur()}async select(){var e;(e=this.textareaRef)===null||e===void 0?void 0:e.select()}adjustHeight(){if(!this.autoGrow||!this.textareaRef)return;requestAnimationFrame((()=>{this.textareaRef.style.height="0px";const e=getComputedStyle(this.textareaRef);const t=parseInt(e.lineHeight);const r=parseInt(e.paddingTop);const o=parseInt(e.paddingBottom);const i=this.textareaRef.scrollHeight;let s=i;if(this.minRows){const e=this.minRows*t+r+o;s=Math.max(s,e)}if(this.maxRows){const e=this.maxRows*t+r+o;s=Math.min(s,e)}this.textareaRef.style.height=`${s}px`}))}validateInput(){if(!this.textareaRef)return;this.isValid=true;this.validationMessage="";const e=this.textareaRef.value;if(this.required&&!e){this.isValid=false;this.validationMessage=n("required");this.internalStatus="error";this.internalErrorMessage=this.validationMessage;return}if(this.minLength&&e.length<this.minLength){this.isValid=false;this.validationMessage=n("minlength",{min:this.minLength})}else if(this.maxLength&&e.length>this.maxLength){this.isValid=false;this.validationMessage=n("maxlength",{max:this.maxLength})}if(this.validator){const t=this.validator(e);if(t){this.isValid=false;this.validationMessage=t}}this.internalStatus=this.isValid?"default":"error";this.internalErrorMessage=this.validationMessage}render(){const e=this._id+"-textarea"||this.name;const{base:t,textareaClass:o,counterText:i}=this.styleClass({size:this.size,status:this.internalStatus,resize:this.resize,fullWidth:this.fullWidth,disabled:this.disabled,focused:this.isFocused});return r("div",{key:"fefeeddf26ed03353df28add5cf3316ae975b01e",class:"bcm-ui-element"},this.label&&r("label",{key:"98990540571481bd0d800de1cb4f62543c879b19",class:s("textarea-label font-medium",{"text-color-label":!this.disabled,"text-color-disabled":this.disabled},{"text-size-3":this.size==="small","text-size-4":this.size==="medium","text-size-5":this.size==="large"}),htmlFor:e},r("slot",{key:"73979bd46640de8573d63e75d31ae26ce36b890d",name:"label"},this.label),this.required&&r("span",{key:"dfe9ba4b33e1e3cd2c88e917887757b1c6bcb383"},"*")),r("div",{key:"81dad3fff00c8c31f59d026411b9e0cc3926c72f",class:t()},r("textarea",{key:"5a36b4eec939c61ee2a5bf884ad7cfabad365911",ref:e=>this.textareaRef=e,id:e,class:o(),name:this.name,rows:this.rows,cols:this.cols,disabled:this.disabled,readonly:this.readonly,required:this.required,placeholder:this.placeholder,minLength:this.minLength,maxLength:this.maxLength,"aria-invalid":this.status==="error","aria-required":this.required,"aria-labelledby":this.labelledby,"aria-describedby":this.describedby,value:this.value,onInput:e=>{const t=e.target;this.value=t.value;this.bcmInput.emit(e);this.validateInput();if(this.autoGrow){this.adjustHeight()}},onChange:this.onChange,onFocus:this.onFocus,onBlur:this.onBlur,onKeyDown:this.onKeyDown,onKeyUp:this.onKeyUp}),this.showCounter&&r("div",{key:"bcb3f8ca8ca6db30202b59774404d806250f52b5",class:i()},this.value.length,this.maxLength?`/${this.maxLength}`:"")),(this.captionText||this.internalErrorMessage||this.validationMessage)&&r("div",{key:"4b0134d3a3a16c0b32d928fb27a802a4a2e21d35",class:s("textarea-caption-text font-regular mt-1",{"text-[--bcm-ui-color-text-caption]":!this.disabled&&this.internalStatus==="default","text-[--bcm-ui-color-text-error]":!this.disabled&&(this.internalStatus==="error"||!this.isValid),"text-[--bcm-ui-color-text-success]":!this.disabled&&this.internalStatus==="success","text-[--bcm-ui-color-text-warning]":!this.disabled&&this.internalStatus==="warning","text-[--bcm-ui-color-text-info]":!this.disabled&&this.internalStatus==="info","text-[--bcm-ui-color-text-disabled]":this.disabled},{"text-size-3":this.size==="small","text-size-4":this.size==="medium","text-size-5":this.size==="large"})},!this.isValid?this.validationMessage:this.internalStatus==="error"?this.internalErrorMessage:this.captionText))}get el(){return o(this)}static get watchers(){return{value:["handleValueChange"],status:["watchStatus"],errorMessage:["watchErrorMessage"]}}};d.style=h;export{d as bcm_textarea};
2
+ //# sourceMappingURL=p-a18d34c7.entry.js.map
@@ -0,0 +1,2 @@
1
+ import{r as o,c as e,h as t,H as a,a as d}from"./p-B84DzIAh.js";import{t as i}from"./p-CEcVC0yX.js";const s=".visible{visibility:visible}.hidden{display:none}.static{position:static}.flex{display:flex}.max-h-64{max-height:16rem}.w-full{width:100%}.min-w-10{min-width:2.5rem}.max-w-64{max-width:16rem}.flex-col{flex-direction:column}.items-center{align-items:center}.overflow-y-auto{overflow-y:auto}.rounded-lg{border-radius:var(--bcm-ui-border-radius-lg,8px)}.bg-color-basic-panel{background-color:var(--bcm-ui-color-background-basic-panel)}.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}";const r=class{constructor(t){o(this,t);this.bcmDropdownChange=e(this,"bcmDropdownChange",1);this.isReady=false;this.dropdownItems=[];this.dropdownClass=i({base:"dropdown flex flex-col items-center min-w-10 shadow-3 max-w-64 max-h-64 w-full bg-color-basic-panel rounded-lg py-1.5 overflow-y-auto"});this.handleSlotChange=()=>{this.dropdownItems=Array.from(this.host.querySelectorAll("bcm-dropdown-item"));if(this.dropdownItems.length===0){console.warn("No dropdown items found in dropdown component")}}}componentDidLoad(){const o=this.host.shadowRoot.querySelector("bcm-button");if(o){this.buttonRef=o;this.isReady=true}}handleDropdownItemChange(o){var e;const{element:t,selected:a}=o===null||o===void 0?void 0:o.detail;(e=this.dropdownItems)===null||e===void 0?void 0:e.forEach((o=>{if(o!=t){o.selected=false}}));this.bcmDropdownChange.emit({element:t,selected:a})}render(){return t(a,{key:"6aaff12c84d38c32df5bc8dccb83421afb315eef"},t("bcm-button",{key:"5612cef7303a6b839531e125c895a4e7b8d32282",kind:"outline"},t("span",{key:"951418845cb1ec71fe6dc5bbbc33c49934447640",part:"text"},this.text)),this.isReady&&t("bcm-linked",{key:"d594359d6a9b7c673307c6a92e6d69cc47be3e1a",targetElement:this.buttonRef},t("div",{key:"9badba5b1e99af6a5d58b02e849cb0923e49dfd8",part:"dropdown-container",class:this.dropdownClass()},t("slot",{key:"c8191f215600170475d514bb6b4056047e6442d2",onSlotchange:this.handleSlotChange}))))}get host(){return d(this)}};r.style=s;export{r as bcm_dropdown};
2
+ //# sourceMappingURL=p-b37f2434.entry.js.map
@@ -0,0 +1 @@
1
+ {"version":3,"names":["dropdownCss","Dropdown","constructor","hostRef","this","isReady","dropdownItems","dropdownClass","tv","base","handleSlotChange","Array","from","host","querySelectorAll","length","console","warn","componentDidLoad","button","shadowRoot","querySelector","buttonRef","handleDropdownItemChange","event","element","selected","detail","_a","forEach","item","bcmDropdownChange","emit","render","h","Host","key","kind","part","text","targetElement","class","onSlotchange"],"sources":["src/components/dropdown/dropdown.css?tag=bcm-dropdown&encapsulation=shadow","src/components/dropdown/dropdown.component.tsx"],"sourcesContent":["/* :host {\n --dropdown-box-min-weight: 32px;\n --dropdown-box-max-width: 384px;\n --dropdown-box-max-height: 384px;\n --dropdown-box-background-color: var(--bcm-ui-color-background-basic-panel);\n} */\n/* \n.scroll {\n height: 140px;\n width: 140px;\n overflow-y: auto;\n}\n\n.scroll:active::-webkit-scrollbar-thumb,\n.scroll:focus::-webkit-scrollbar-thumb,\n.scroll:hover::-webkit-scrollbar-thumb {\n visibility: visible;\n}\n.scroll::-webkit-scrollbar-thumb {\n background-color: darkgrey;\n visibility: hidden;\n}\n\n.scroll::-webkit-scrollbar {\n width: 8px;\n height: 8px;\n} */\n","import { Component, ComponentInterface, h, Prop, State, Element, Host, Event, EventEmitter, Listen } from '@stencil/core';\nimport { tv } from '@utils/tv';\n\n@Component({\n tag: 'bcm-dropdown',\n styleUrl: 'dropdown.css',\n shadow: true,\n})\nexport class Dropdown implements ComponentInterface {\n @Element() host: HTMLElement;\n\n @Prop() text?: string;\n\n @State() isReady: boolean = false;\n\n @State() dropdownItems: HTMLBcmDropdownItemElement[] = [];\n\n protected buttonRef?: HTMLBcmButtonElement;\n\n @Event({\n composed: false,\n bubbles: false,\n cancelable: true,\n eventName: 'bcmDropdownChange',\n })\n bcmDropdownChange: EventEmitter<any>;\n\n componentDidLoad() {\n const button = this.host.shadowRoot.querySelector('bcm-button') as HTMLBcmButtonElement;\n if (button) {\n this.buttonRef = button;\n this.isReady = true;\n }\n }\n\n @Listen('bcmDropDownItemChange', { capture: true })\n handleDropdownItemChange(event: CustomEvent) {\n const { element, selected } = event?.detail;\n\n this.dropdownItems?.forEach(item => {\n if (item != element) {\n item.selected = false;\n }\n });\n\n this.bcmDropdownChange.emit({\n element: element,\n selected,\n });\n }\n\n private dropdownClass = tv({\n base: 'dropdown flex flex-col items-center min-w-10 shadow-3 max-w-64 max-h-64 w-full bg-color-basic-panel rounded-lg py-1.5 overflow-y-auto',\n });\n\n private handleSlotChange = () => {\n this.dropdownItems = Array.from(this.host.querySelectorAll('bcm-dropdown-item'));\n\n if (this.dropdownItems.length === 0) {\n console.warn('No dropdown items found in dropdown component');\n }\n };\n\n render() {\n return (\n <Host>\n <bcm-button kind=\"outline\">\n <span part=\"text\">{this.text}</span>\n </bcm-button>\n {this.isReady && (\n <bcm-linked targetElement={this.buttonRef}>\n <div part=\"dropdown-container\" class={this.dropdownClass()}>\n <slot onSlotchange={this.handleSlotChange}></slot>\n </div>\n </bcm-linked>\n )}\n </Host>\n );\n }\n}\n"],"mappings":"oGAAA,MAAMA,EAAc,o0B,MCQPC,EAAQ,MALrB,WAAAC,CAAAC,G,+DAUWC,KAAOC,QAAY,MAEnBD,KAAaE,cAAiC,GAoC/CF,KAAaG,cAAGC,EAAG,CACzBC,KAAM,0IAGAL,KAAgBM,iBAAG,KACzBN,KAAKE,cAAgBK,MAAMC,KAAKR,KAAKS,KAAKC,iBAAiB,sBAE3D,GAAIV,KAAKE,cAAcS,SAAW,EAAG,CACnCC,QAAQC,KAAK,gD,EAoBlB,CApDC,gBAAAC,GACE,MAAMC,EAASf,KAAKS,KAAKO,WAAWC,cAAc,cAClD,GAAIF,EAAQ,CACVf,KAAKkB,UAAYH,EACjBf,KAAKC,QAAU,I,EAKnB,wBAAAkB,CAAyBC,G,MACvB,MAAMC,QAAEA,EAAOC,SAAEA,GAAaF,IAAK,MAALA,SAAK,SAALA,EAAOG,QAErCC,EAAAxB,KAAKE,iBAAa,MAAAsB,SAAA,SAAAA,EAAEC,SAAQC,IAC1B,GAAIA,GAAQL,EAAS,CACnBK,EAAKJ,SAAW,K,KAIpBtB,KAAK2B,kBAAkBC,KAAK,CAC1BP,QAASA,EACTC,Y,CAgBJ,MAAAO,GACE,OACEC,EAACC,EAAI,CAAAC,IAAA,4CACHF,EAAY,cAAAE,IAAA,2CAAAC,KAAK,WACfH,EAAM,QAAAE,IAAA,2CAAAE,KAAK,QAAQlC,KAAKmC,OAEzBnC,KAAKC,SACJ6B,EAAA,cAAAE,IAAA,2CAAYI,cAAepC,KAAKkB,WAC9BY,EAAK,OAAAE,IAAA,2CAAAE,KAAK,qBAAqBG,MAAOrC,KAAKG,iBACzC2B,EAAM,QAAAE,IAAA,2CAAAM,aAActC,KAAKM,qB","ignoreList":[]}
@@ -0,0 +1,2 @@
1
+ import{r as t,c as i,h as s,H as a,a as e}from"./p-B84DzIAh.js";import{t as o}from"./p-CEcVC0yX.js";const n=".relative{position:relative}.block{display:block}:host{display:block;position:relative}:host([variant=full-width]){width:100%}:host([variant=auto-width]){width:auto}.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-auto{width:auto}.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)}.transition{transition-duration:.15s;transition-property:color,background-color,border-color,text-decoration-color,fill,stroke,opacity,box-shadow,transform,filter,backdrop-filter;transition-timing-function:cubic-bezier(.4,0,.2,1)}";const h=class{constructor(s){t(this,s);this.bcmTabChange=i(this,"bcmTabChange",1);this.size="medium";this.variant="full-width";this.smooth=true;this.triggers=[];this.contents=[];this.tabClass=o({base:"tabs-container bcm-ui-element flex flex-col",variants:{variant:{"full-width":"w-full","auto-width":"w-auto"}},defaultVariants:{variant:"full-width"}})}componentWillLoad(){this.activeTab=this.defaultValue}componentDidLoad(){this.refreshElementReferences();this.updateTriggerProperties();this.updateTabsListProperties();this.setupRelations();if(!this.defaultValue&&this.triggers.length>0){this.activeTab=this.triggers[0].value}if(this.variant==="auto-width"){requestAnimationFrame((()=>{this.updateInkbar();this.updateContentVisibility()}))}else{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;t.variant=this.variant;t.smooth=this.smooth}))}}updateTabsListProperties(){if(this.tabsList){this.tabsList.variant=this.variant;this.tabsList.smooth=this.smooth}}handleSizeChange(){this.updateTriggerProperties()}handleVariantChange(){this.updateTriggerProperties();this.updateTabsListProperties();if(this.variant==="auto-width"){requestAnimationFrame((()=>{this.updateInkbar()}))}else{this.updateInkbar()}}handleSmoothChange(){this.updateTriggerProperties();this.updateTabsListProperties()}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;if(!this.tabsList){console.warn("bcm-tabs-list not found");return}const s=this.triggers.length;if(s===0)return;const a=(i=(t=this.tabsList)===null||t===void 0?void 0:t.shadowRoot)===null||i===void 0?void 0:i.querySelector(".inkbar");const e=this.triggers.find((t=>t.value===this.activeTab));if(e&&a){if(this.variant==="auto-width"){requestAnimationFrame((()=>{this.updateInkbarPosition(a,e)}))}else{this.updateInkbarPosition(a,e)}}else{if(a)a.style.opacity="0"}}updateInkbarPosition(t,i){var s,a,e;const o=i.getBoundingClientRect();const n=(e=(a=(s=this.tabsList)===null||s===void 0?void 0:s.shadowRoot)===null||a===void 0?void 0:a.querySelector(".tabs-list"))===null||e===void 0?void 0:e.getBoundingClientRect();if(o&&n){const i=o.left-n.left;const s=o.width;t.style.width=`${s}px`;t.style.transform=`translateX(${i}px)`;t.style.left="0";t.style.right="auto";if(this.smooth){t.style.opacity="1"}else{t.style.transition="none";t.style.opacity="1";requestAnimationFrame((()=>{t.style.transition=""}))}}else{console.warn("Group or trigger rect calculation failed");t.style.opacity="0"}}render(){return s(a,{key:"74e8ebe53363fd2357d6f054277e3fc3f3d3e83c"},s("div",{key:"0d060bcb6b378dc9ba7523482c69c0b786782d96",class:this.tabClass({variant:this.variant})},s("slot",{key:"626fcde55ce47453b4d5252444cf046ca723c1c0",name:"tabs-list"}),s("slot",{key:"a9fc0887203531d3ea72cba945f4665d98546512"})))}get el(){return e(this)}static get watchers(){return{size:["handleSizeChange"],variant:["handleVariantChange"],smooth:["handleSmoothChange"]}}};h.style=n;export{h as bcm_tabs};
2
+ //# sourceMappingURL=p-c709842a.entry.js.map
@@ -0,0 +1 @@
1
+ {"version":3,"names":["bcmTabsCss","BcmTabs","constructor","hostRef","this","size","variant","smooth","triggers","contents","tabClass","tv","base","variants","defaultVariants","componentWillLoad","activeTab","defaultValue","componentDidLoad","refreshElementReferences","updateTriggerProperties","updateTabsListProperties","setupRelations","length","value","requestAnimationFrame","updateInkbar","updateContentVisibility","Array","from","el","querySelectorAll","tabsList","querySelector","forEach","trigger","active","panel","find","content","panelId","id","setAttribute","_a","handleSizeChange","handleVariantChange","handleSmoothChange","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","updateInkbarPosition","opacity","triggerRect","getBoundingClientRect","groupRect","_c","left","width","transform","right","transition","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}\n\n:host([variant='full-width']) {\n width: 100%;\n}\n\n:host([variant='auto-width']) {\n width: auto;\n}\n","import { Component, State, Prop, Element, h, Host, Listen, ComponentInterface, Event, EventEmitter, Watch, Method } from '@stencil/core';\nimport { tv } from '@utils/tv';\n\n/**\n * @description Tab interface component\n * @slot - Default slot for content area\n * @slot tabs-list - Special slot for tab list\n */\n@Component({\n tag: 'bcm-tabs',\n styleUrl: 'bcm-tabs.css',\n shadow: true,\n})\nexport class BcmTabs implements ComponentInterface {\n @Element() el: HTMLElement;\n\n /**\n * Default active tab value\n */\n @Prop({ reflect: true })\n defaultValue: string;\n\n /**\n * Tab size\n */\n @Prop({ reflect: true })\n size: 'small' | 'medium' | 'large' = 'medium';\n\n /**\n * Tab variant - controls width behavior\n */\n @Prop({ reflect: true })\n variant: 'full-width' | 'auto-width' = 'full-width';\n\n /**\n * Whether to enable smooth animations for inkbar and transitions\n */\n @Prop({ reflect: true })\n smooth: boolean = true;\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.updateTabsListProperties();\n this.setupRelations();\n\n // Eğer defaultValue yoksa ilk tab'ı aktif yap\n if (!this.defaultValue && this.triggers.length > 0) {\n this.activeTab = this.triggers[0].value;\n }\n\n // auto-width variant'ında inkbar hesaplaması için ek gecikme\n if (this.variant === 'auto-width') {\n requestAnimationFrame(() => {\n this.updateInkbar();\n this.updateContentVisibility();\n });\n } else {\n this.updateInkbar();\n this.updateContentVisibility();\n }\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 trigger.variant = this.variant;\n trigger.smooth = this.smooth;\n });\n }\n }\n\n private updateTabsListProperties() {\n if (this.tabsList) {\n this.tabsList.variant = this.variant;\n this.tabsList.smooth = this.smooth;\n }\n }\n\n @Watch('size')\n handleSizeChange() {\n this.updateTriggerProperties();\n }\n\n @Watch('variant')\n handleVariantChange() {\n this.updateTriggerProperties();\n this.updateTabsListProperties();\n\n // auto-width variant'ında inkbar hesaplaması için ek gecikme\n if (this.variant === 'auto-width') {\n requestAnimationFrame(() => {\n this.updateInkbar();\n });\n } else {\n this.updateInkbar();\n }\n }\n\n @Watch('smooth')\n handleSmoothChange() {\n this.updateTriggerProperties();\n this.updateTabsListProperties();\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 // auto-width variant'ında container genişliği henüz hesaplanmamış olabilir\n // Bu durumda bir sonraki frame'de tekrar deneyelim\n if (this.variant === 'auto-width') {\n requestAnimationFrame(() => {\n this.updateInkbarPosition(inkbar, activeTrigger);\n });\n } else {\n this.updateInkbarPosition(inkbar, activeTrigger);\n }\n } else {\n if (inkbar) inkbar.style.opacity = '0';\n }\n }\n\n /**\n * Updates inkbar position and size\n */\n private updateInkbarPosition(inkbar: HTMLElement, activeTrigger: HTMLElement) {\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 // Her iki variant için de aynı davranış: sadece aktif tab altında göster\n inkbar.style.width = `${width}px`;\n inkbar.style.transform = `translateX(${left}px)`;\n inkbar.style.left = '0';\n inkbar.style.right = 'auto';\n\n // smooth prop'una göre opacity geçişi\n if (this.smooth) {\n inkbar.style.opacity = '1';\n } else {\n // Animasyon olmadan anında göster\n inkbar.style.transition = 'none';\n inkbar.style.opacity = '1';\n // Bir sonraki frame'de transition'ı geri yükle\n requestAnimationFrame(() => {\n inkbar.style.transition = '';\n });\n }\n } else {\n console.warn('Group or trigger rect calculation failed');\n 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',\n variants: {\n variant: {\n 'full-width': 'w-full',\n 'auto-width': 'w-auto',\n },\n },\n defaultVariants: {\n variant: 'full-width',\n },\n });\n\n render() {\n return (\n <Host>\n <div class={this.tabClass({ variant: this.variant })}>\n <slot name=\"tabs-list\" />\n <slot></slot>\n </div>\n </Host>\n );\n }\n}\n"],"mappings":"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","ignoreList":[]}
@@ -0,0 +1,2 @@
1
+ import{r as e,c as a,h as o,a as r}from"./p-B84DzIAh.js";import{t}from"./p-CEcVC0yX.js";const c=".flex{display:flex}:host{display:inline-block;width:100%}::slotted([slot=left-content]){align-items:center;display:flex;flex-direction:row;gap:8px}::slotted([slot=right-content]){align-items:center;display:flex;flex-direction:row;gap:8px}.bcm-ui-element{-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;font-family:Inter,sans-serif}.static{position:static}.w-full{width:100%}.cursor-pointer{cursor:pointer}.flex-row{flex-direction:row}.gap-2{gap:.5rem}.text-pretty{text-wrap:pretty}.bg-\\[var\\(--bcm-ui-color-background-base-active\\)\\]{background-color:var(--bcm-ui-color-background-base-active)}.bg-\\[var\\(--bcm-ui-color-background-palette-red-default\\)\\]{background-color:var(--bcm-ui-color-background-palette-red-default)}.px-4{padding-left:1rem;padding-right:1rem}.py-2{padding-bottom:.5rem;padding-top:.5rem}.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-\\[var\\(--bcm-ui-color-background-base-active\\)\\]:hover{background-color:var(--bcm-ui-color-background-base-active)}.hover\\:bg-\\[var\\(--bcm-ui-color-background-base-hover\\)\\]:hover{background-color:var(--bcm-ui-color-background-base-hover)}.hover\\:bg-\\[var\\(--bcm-ui-color-background-palette-red-default\\)\\]:hover{background-color:var(--bcm-ui-color-background-palette-red-default)}";const i=class{constructor(o){e(this,o);this.bcmDropDownItemChange=a(this,"bcmDropDownItemChange",1);this.selected=false;this.error=false;this.disabled=false;this.dropdownItemClass=t({base:"dropdown-item bcm-ui-element bcm-ui-content-display flex flex-row gap-2 py-2 px-4 cursor-pointer text-color",variants:{selected:{true:"bg-[var(--bcm-ui-color-background-base-active)] hover:bg-[var(--bcm-ui-color-background-base-active)]",false:"hover:bg-[var(--bcm-ui-color-background-base-hover)]"},error:{true:"bg-[var(--bcm-ui-color-background-palette-red-default)] hover:bg-[var(--bcm-ui-color-background-palette-red-default)]",false:""},disabled:{true:"",false:""}},defaultVariants:{selected:false,error:false,disabled:false}},{twMerge:false})}handleClick(){this.selected=true;this.bcmDropDownItemChange.emit({element:this.host,selected:this.selected})}render(){var e;return o("div",{key:"69beaac4c9225bc7803b4002f1543c18e76e36cc","aria-checked":this.selected,class:this.dropdownItemClass({selected:this.selected,error:this.error}),onClick:()=>this.handleClick()},o("slot",{key:"ca2712023285689a1774b5869d982e87d3add46a",name:"left-content"},this.icon&&o("bcm-icon",{key:"bef7483a47c823ed746c39ae37acc3a2360f0c59","icon-name":this.icon})),o("div",{key:"a9bdddf97d4a4e07e601599a4adb11354227dd0f",class:"flex flex-row text-pretty w-full"},o("slot",{key:"51c488350d2daabc32fc9693211a4e89d8cce16f"},this.text)),o("slot",{key:"9bf3f8b4affa41ea72f181a073aea8cd56f8a2df",name:"right-content"},(e=this.rightIcons)===null||e===void 0?void 0:e.map((e=>o("bcm-icon",{"icon-name":e})))))}get host(){return r(this)}};i.style=c;export{i as bcm_dropdown_item};
2
+ //# sourceMappingURL=p-e989b918.entry.js.map
@@ -0,0 +1 @@
1
+ {"version":3,"names":["dropdownItemCss","DropdownItem","constructor","hostRef","this","selected","error","disabled","dropdownItemClass","tv","base","variants","true","false","defaultVariants","twMerge","handleClick","bcmDropDownItemChange","emit","element","host","render","h","key","class","onClick","name","icon","text","_a","rightIcons","map"],"sources":["src/components/dropdown-item/dropdown-item.css?tag=bcm-dropdown-item&encapsulation=shadow","src/components/dropdown-item/dropdown-item.component.tsx"],"sourcesContent":[":host {\n display: inline-block;\n width: 100%;\n}\n\n::slotted([slot='left-content']) {\n display: flex;\n flex-direction: row;\n align-items: center;\n gap: 8px;\n}\n\n::slotted([slot='right-content']) {\n display: flex;\n flex-direction: row;\n align-items: center;\n gap: 8px;\n}\n","import { Component, ComponentInterface, h, Prop, Event, EventEmitter, Element } from '@stencil/core';\nimport { tv } from '@utils/tv';\n\n@Component({\n tag: 'bcm-dropdown-item',\n styleUrl: 'dropdown-item.css',\n shadow: true,\n})\nexport class DropdownItem implements ComponentInterface {\n @Element() host: HTMLElement;\n @Prop() text: string;\n @Prop() icon: string;\n @Prop() rightIcons: string[];\n @Prop({ reflect: true }) selected: boolean = false;\n @Prop({ reflect: true }) error: boolean = false;\n @Prop({ reflect: true }) disabled: boolean = false;\n\n @Event({\n composed: false,\n bubbles: false,\n cancelable: true,\n eventName: 'bcmDropDownItemChange',\n })\n bcmDropDownItemChange: EventEmitter<any>;\n\n private handleClick() {\n this.selected = true;\n this.bcmDropDownItemChange.emit({\n element: this.host,\n selected: this.selected,\n });\n }\n\n private dropdownItemClass = tv(\n {\n base: 'dropdown-item bcm-ui-element bcm-ui-content-display flex flex-row gap-2 py-2 px-4 cursor-pointer text-color',\n variants: {\n selected: {\n true: 'bg-[var(--bcm-ui-color-background-base-active)] hover:bg-[var(--bcm-ui-color-background-base-active)]',\n false: 'hover:bg-[var(--bcm-ui-color-background-base-hover)]',\n },\n error: {\n true: 'bg-[var(--bcm-ui-color-background-palette-red-default)] hover:bg-[var(--bcm-ui-color-background-palette-red-default)]',\n false: '',\n },\n disabled: {\n true: '', // should be discuss with ux team\n false: '',\n },\n },\n defaultVariants: {\n selected: false,\n error: false,\n disabled: false,\n },\n },\n {\n twMerge: false,\n },\n );\n\n render() {\n return (\n <div\n aria-checked={this.selected}\n class={this.dropdownItemClass({\n selected: this.selected,\n error: this.error,\n })}\n onClick={() => this.handleClick()}\n >\n <slot name=\"left-content\">{this.icon && <bcm-icon icon-name={this.icon}></bcm-icon>}</slot>\n <div class=\"flex flex-row text-pretty w-full\">\n <slot>{this.text}</slot>\n </div>\n <slot name=\"right-content\">\n {this.rightIcons?.map(icon => (\n <bcm-icon icon-name={icon}></bcm-icon>\n ))}\n </slot>\n </div>\n );\n }\n}\n"],"mappings":"wFAAA,MAAMA,EAAkB,+6C,MCQXC,EAAY,MALzB,WAAAC,CAAAC,G,uEAU2BC,KAAQC,SAAY,MACpBD,KAAKE,MAAY,MACjBF,KAAQG,SAAY,MAkBrCH,KAAiBI,kBAAGC,EAC1B,CACEC,KAAM,8GACNC,SAAU,CACRN,SAAU,CACRO,KAAM,wGACNC,MAAO,wDAETP,MAAO,CACLM,KAAM,wHACNC,MAAO,IAETN,SAAU,CACRK,KAAM,GACNC,MAAO,KAGXC,gBAAiB,CACfT,SAAU,MACVC,MAAO,MACPC,SAAU,QAGd,CACEQ,QAAS,OA0Bd,CA1DS,WAAAC,GACNZ,KAAKC,SAAW,KAChBD,KAAKa,sBAAsBC,KAAK,CAC9BC,QAASf,KAAKgB,KACdf,SAAUD,KAAKC,U,CAgCnB,MAAAgB,G,MACE,OACEC,EACgB,OAAAC,IAAA,0DAAAnB,KAAKC,SACnBmB,MAAOpB,KAAKI,kBAAkB,CAC5BH,SAAUD,KAAKC,SACfC,MAAOF,KAAKE,QAEdmB,QAAS,IAAMrB,KAAKY,eAEpBM,EAAA,QAAAC,IAAA,2CAAMG,KAAK,gBAAgBtB,KAAKuB,MAAQL,EAAqB,YAAAC,IAAA,uDAAAnB,KAAKuB,QAClEL,EAAK,OAAAC,IAAA,2CAAAC,MAAM,oCACTF,EAAA,QAAAC,IAAA,4CAAOnB,KAAKwB,OAEdN,EAAM,QAAAC,IAAA,2CAAAG,KAAK,kBACRG,EAAAzB,KAAK0B,cAAY,MAAAD,SAAA,SAAAA,EAAAE,KAAIJ,GACpBL,EAAA,wBAAqBK,O","ignoreList":[]}
@@ -0,0 +1,2 @@
1
+ import{r as t,h as e}from"./p-B84DzIAh.js";import{c as o}from"./p-BfTCfPZ1.js";const i=":host{display:inline-block}.bcm-ui-element{-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;font-family:Inter,sans-serif}.static{position:static}.block{display:block}.h-fit{height:fit-content}.w-fit{width:fit-content}.rounded{border-radius:var(--bcm-ui-border-radius-default,6px)}.border{border-width:1px}.border-solid{border-style:solid}.border-color-default{border-color:var(--bcm-ui-color-border-default)}.bg-color-default{background-color:var(--bcm-ui-color-background-default-default)}.px-1{padding-left:.25rem;padding-right:.25rem}.text-center{text-align:center}.text-size-2{font-size:var(--bcm-ui-font-size-2,10px);line-height:var(--bcm-ui-line-height-2,12px)}.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)}.font-medium{font-weight:500}.capitalize{text-transform:capitalize}.text-color-default{color:var(--bcm-ui-color-text-default)}.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 r={ctrl:"⌘",alt:"⌥",shift:"⇧",del:"⌫",delete:"⌫",backspace:"⌦",enter:"⏎",return:"⏎"};const a=class{constructor(e){t(this,e);this.size="small";this.isMac=/Mac/.test(window.navigator.userAgent)}getHotkey(t){if(!t){return""}if(this.isMac&&(t.includes(" ")||t.includes("+"))){const e=t.split(/[\s+]+/);return e.map((t=>r[t]||t)).join("")}else{return t}}render(){const{size:t,hotkey:i}=this;return e("div",{key:"007588d1d20941ead644a3d1fd72410cb6793ff5",class:o("bcm-ui-element bcm-ui-content-display","block h-fit w-fit rounded border border-solid px-1","border-color-default bg-color-default text-color-default","text-center font-medium capitalize",{"text-size-2":t==="small","text-size-3":t==="medium","text-size-4":t==="large"})},this.getHotkey(i))}};a.style=i;export{a as bcm_shortcut};
2
+ //# sourceMappingURL=p-ed796a79.entry.js.map
@@ -0,0 +1 @@
1
+ {"version":3,"names":["shortcutCss","osKeys","ctrl","alt","shift","del","delete","backspace","enter","return","BcmShortcut","constructor","hostRef","this","size","isMac","test","window","navigator","userAgent","getHotkey","key","includes","keys","split","map","k","join","render","hotkey","h","class","cs"],"sources":["src/components/shortcut/shortcut.css?tag=bcm-shortcut&encapsulation=shadow","src/components/shortcut/shortcut.tsx"],"sourcesContent":[":host {\n display: inline-block;\n}\n","import { Component, ComponentInterface, Prop, h } from '@stencil/core';\nimport cs from 'classnames';\n\nconst osKeys = {\n ctrl: '⌘',\n alt: '⌥',\n shift: '⇧',\n del: '⌫',\n delete: '⌫',\n backspace: '⌦',\n enter: '⏎',\n return: '⏎',\n};\n\n@Component({\n tag: 'bcm-shortcut',\n styleUrl: './shortcut.css',\n shadow: true,\n})\nexport class BcmShortcut implements ComponentInterface {\n @Prop() hotkey: string;\n @Prop() size: 'small' | 'medium' | 'large' = 'small';\n\n private readonly isMac = /Mac/.test(window.navigator.userAgent);\n\n getHotkey(key: string): string {\n if (!key) {\n return '';\n }\n if (this.isMac && (key.includes(' ') || key.includes('+'))) {\n const keys = key.split(/[\\s+]+/);\n return keys.map(k => osKeys[k] || k).join('');\n } else {\n return key;\n }\n }\n\n render() {\n const { size, hotkey } = this;\n\n return (\n <div\n class={cs(\n 'bcm-ui-element bcm-ui-content-display',\n 'block h-fit w-fit rounded border border-solid px-1',\n 'border-color-default bg-color-default text-color-default',\n 'text-center font-medium capitalize',\n {\n 'text-size-2': size === 'small',\n 'text-size-3': size === 'medium',\n 'text-size-4': size === 'large',\n },\n )}\n >\n {this.getHotkey(hotkey)}\n </div>\n );\n }\n}\n"],"mappings":"+EAAA,MAAMA,EAAc,msCCGpB,MAAMC,EAAS,CACbC,KAAM,IACNC,IAAK,IACLC,MAAO,IACPC,IAAK,IACLC,OAAQ,IACRC,UAAW,IACXC,MAAO,IACPC,OAAQ,K,MAQGC,EAAW,MALxB,WAAAC,CAAAC,G,UAOUC,KAAIC,KAAiC,QAE5BD,KAAKE,MAAG,MAAMC,KAAKC,OAAOC,UAAUC,UAmCtD,CAjCC,SAAAC,CAAUC,GACR,IAAKA,EAAK,CACR,MAAO,E,CAET,GAAIR,KAAKE,QAAUM,EAAIC,SAAS,MAAQD,EAAIC,SAAS,MAAO,CAC1D,MAAMC,EAAOF,EAAIG,MAAM,UACvB,OAAOD,EAAKE,KAAIC,GAAKzB,EAAOyB,IAAMA,IAAGC,KAAK,G,KACrC,CACL,OAAON,C,EAIX,MAAAO,GACE,MAAMd,KAAEA,EAAIe,OAAEA,GAAWhB,KAEzB,OACEiB,EAAA,OAAAT,IAAA,2CACEU,MAAOC,EACL,wCACA,qDACA,2DACA,qCACA,CACE,cAAelB,IAAS,QACxB,cAAeA,IAAS,SACxB,cAAeA,IAAS,WAI3BD,KAAKO,UAAUS,G","ignoreList":[]}