bromcom-ui-next 0.1.20 → 0.1.21
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.
- package/dist/bromcom-ui/bromcom-ui.esm.js +1 -1
- package/dist/bromcom-ui/{p-94ced142.entry.js → p-06d42346.entry.js} +2 -2
- package/dist/bromcom-ui/p-06d42346.entry.js.map +1 -0
- package/dist/bromcom-ui/p-0c8a9725.entry.js +2 -0
- package/dist/bromcom-ui/p-0c8a9725.entry.js.map +1 -0
- package/dist/bromcom-ui/p-11227d96.entry.js +2 -0
- package/dist/bromcom-ui/p-11227d96.entry.js.map +1 -0
- package/dist/bromcom-ui/p-1b4ccb21.entry.js +2 -0
- package/dist/bromcom-ui/{p-b6dd459b.entry.js.map → p-1b4ccb21.entry.js.map} +1 -1
- package/dist/bromcom-ui/{p-5fcf77f9.js → p-2c58fcb7.js} +2 -2
- package/dist/bromcom-ui/p-2c58fcb7.js.map +1 -0
- package/dist/bromcom-ui/p-2e469cb9.entry.js +2 -0
- package/dist/bromcom-ui/p-2e469cb9.entry.js.map +1 -0
- package/dist/bromcom-ui/{p-145dce31.entry.js → p-350c97e1.entry.js} +2 -2
- package/dist/bromcom-ui/p-350c97e1.entry.js.map +1 -0
- package/dist/bromcom-ui/p-4027f5c4.entry.js +2 -0
- package/dist/bromcom-ui/p-4027f5c4.entry.js.map +1 -0
- package/dist/bromcom-ui/p-45f4c75b.entry.js +2 -0
- package/dist/bromcom-ui/p-45f4c75b.entry.js.map +1 -0
- package/dist/bromcom-ui/{p-42feef7e.entry.js → p-4652635d.entry.js} +2 -2
- package/dist/bromcom-ui/p-4652635d.entry.js.map +1 -0
- package/dist/bromcom-ui/p-77122bc2.entry.js +2 -0
- package/dist/bromcom-ui/p-77122bc2.entry.js.map +1 -0
- package/dist/bromcom-ui/{p-d975579d.entry.js → p-78d8f63c.entry.js} +2 -2
- package/dist/bromcom-ui/p-78d8f63c.entry.js.map +1 -0
- package/dist/bromcom-ui/{p-4149c766.entry.js → p-87a0f20b.entry.js} +2 -2
- package/dist/bromcom-ui/p-87a0f20b.entry.js.map +1 -0
- package/dist/bromcom-ui/{p-b867a105.entry.js → p-881ccea1.entry.js} +2 -2
- package/dist/bromcom-ui/p-881ccea1.entry.js.map +1 -0
- package/dist/bromcom-ui/{p-1e5da10e.entry.js → p-8ae92b62.entry.js} +2 -2
- package/dist/bromcom-ui/p-8ae92b62.entry.js.map +1 -0
- package/dist/bromcom-ui/{p-b582c170.entry.js → p-9a6cec21.entry.js} +2 -2
- package/dist/bromcom-ui/p-9a6cec21.entry.js.map +1 -0
- package/dist/bromcom-ui/{p-8550a2aa.entry.js → p-a03922f8.entry.js} +2 -2
- package/dist/bromcom-ui/p-a03922f8.entry.js.map +1 -0
- package/dist/bromcom-ui/{p-9ba07f12.entry.js → p-a20f6baf.entry.js} +2 -2
- package/dist/bromcom-ui/p-a20f6baf.entry.js.map +1 -0
- package/dist/bromcom-ui/{p-bc962a70.entry.js → p-b1f9ad67.entry.js} +2 -2
- package/dist/bromcom-ui/p-b1f9ad67.entry.js.map +1 -0
- package/dist/bromcom-ui/p-bf213fe6.entry.js +2 -0
- package/dist/bromcom-ui/p-bf213fe6.entry.js.map +1 -0
- package/dist/bromcom-ui/{p-bbe4aac2.entry.js → p-c89f7997.entry.js} +2 -2
- package/dist/bromcom-ui/p-c89f7997.entry.js.map +1 -0
- package/dist/bromcom-ui/{p-e2f468ab.entry.js → p-f56b22de.entry.js} +2 -2
- package/dist/bromcom-ui/p-f56b22de.entry.js.map +1 -0
- package/dist/bromcom-ui/p-fdcb9dbd.entry.js +2 -0
- package/dist/bromcom-ui/p-fdcb9dbd.entry.js.map +1 -0
- package/dist/cjs/bcm-accordion.cjs.entry.js +4 -4
- package/dist/cjs/bcm-accordion.cjs.entry.js.map +1 -1
- package/dist/cjs/bcm-alert.cjs.entry.js +4 -4
- package/dist/cjs/bcm-alert.cjs.entry.js.map +1 -1
- package/dist/cjs/bcm-avatar.cjs.entry.js +1 -1
- package/dist/cjs/bcm-avatar.cjs.entry.js.map +1 -1
- package/dist/cjs/bcm-badge.cjs.entry.js +5 -5
- package/dist/cjs/bcm-badge.cjs.entry.js.map +1 -1
- package/dist/cjs/bcm-basic-badge.cjs.entry.js +5 -5
- package/dist/cjs/bcm-basic-badge.cjs.entry.js.map +1 -1
- package/dist/cjs/bcm-button-group.cjs.entry.js +4 -4
- package/dist/cjs/bcm-button-group.cjs.entry.js.map +1 -1
- package/dist/cjs/bcm-button_8.cjs.entry.js +19 -21
- package/dist/cjs/bcm-button_8.cjs.entry.js.map +1 -1
- package/dist/cjs/bcm-checkbox.cjs.entry.js +3 -3
- package/dist/cjs/bcm-checkbox.cjs.entry.js.map +1 -1
- package/dist/cjs/bcm-chip.cjs.entry.js +3 -3
- package/dist/cjs/bcm-chip.cjs.entry.js.map +1 -1
- package/dist/cjs/bcm-divider.cjs.entry.js +3 -3
- package/dist/cjs/bcm-divider.cjs.entry.js.map +1 -1
- package/dist/cjs/bcm-pop-confirm.cjs.entry.js +3 -3
- package/dist/cjs/bcm-pop-confirm.cjs.entry.js.map +1 -1
- package/dist/cjs/bcm-popover.cjs.entry.js +3 -3
- package/dist/cjs/bcm-popover.cjs.entry.js.map +1 -1
- package/dist/cjs/bcm-radio-group.cjs.entry.js +6 -6
- package/dist/cjs/bcm-radio-group.cjs.entry.js.map +1 -1
- package/dist/cjs/bcm-radio.cjs.entry.js +3 -3
- package/dist/cjs/bcm-radio.cjs.entry.js.map +1 -1
- package/dist/cjs/bcm-segmented-picker-option.cjs.entry.js +4 -4
- package/dist/cjs/bcm-segmented-picker-option.cjs.entry.js.map +1 -1
- package/dist/cjs/bcm-segmented-picker.cjs.entry.js +4 -4
- package/dist/cjs/bcm-segmented-picker.cjs.entry.js.map +1 -1
- package/dist/cjs/bcm-switch.cjs.entry.js +4 -4
- package/dist/cjs/bcm-switch.cjs.entry.js.map +1 -1
- package/dist/cjs/bcm-tabs-list.cjs.entry.js +3 -3
- package/dist/cjs/bcm-tabs-list.cjs.entry.js.map +1 -1
- package/dist/cjs/bcm-tabs-trigger.cjs.entry.js +3 -3
- package/dist/cjs/bcm-tabs-trigger.cjs.entry.js.map +1 -1
- package/dist/cjs/bcm-tabs.cjs.entry.js +3 -3
- package/dist/cjs/bcm-tabs.cjs.entry.js.map +1 -1
- package/dist/cjs/bcm-textarea.cjs.entry.js +6 -6
- package/dist/cjs/bcm-textarea.cjs.entry.js.map +1 -1
- package/dist/cjs/bcm-tooltip.cjs.entry.js +4 -9
- package/dist/cjs/bcm-tooltip.cjs.entry.js.map +1 -1
- package/dist/cjs/{index-310db2a6.js → tv-d2e35446.js} +16 -3
- package/dist/cjs/tv-d2e35446.js.map +1 -0
- package/dist/collection/components/accordion/accordion.component.js +3 -3
- package/dist/collection/components/accordion/accordion.component.js.map +1 -1
- package/dist/collection/components/alert/alert.component.js +2 -2
- package/dist/collection/components/alert/alert.component.js.map +1 -1
- package/dist/collection/components/alert/alert.css +1 -1
- package/dist/collection/components/avatar/avatar.css +1 -1
- package/dist/collection/components/badge/badge.component.js +3 -3
- package/dist/collection/components/badge/badge.component.js.map +1 -1
- package/dist/collection/components/badge/badge.css +1 -1
- package/dist/collection/components/basic-badge/basic-badge.component.js +3 -3
- package/dist/collection/components/basic-badge/basic-badge.component.js.map +1 -1
- package/dist/collection/components/basic-badge/basic-badge.css +1 -1
- package/dist/collection/components/button/button.component.js +3 -3
- package/dist/collection/components/button/button.component.js.map +1 -1
- package/dist/collection/components/button-group/button-group.component.js +3 -3
- package/dist/collection/components/button-group/button-group.component.js.map +1 -1
- package/dist/collection/components/checkbox/checkbox.component.js +2 -2
- package/dist/collection/components/checkbox/checkbox.component.js.map +1 -1
- package/dist/collection/components/chip/chip.component.js +2 -2
- package/dist/collection/components/chip/chip.component.js.map +1 -1
- package/dist/collection/components/divider/divider.component.js +2 -2
- package/dist/collection/components/divider/divider.component.js.map +1 -1
- package/dist/collection/components/drawer/drawer.component.js +3 -5
- package/dist/collection/components/drawer/drawer.component.js.map +1 -1
- package/dist/collection/components/drawer/drawer.css +1 -1
- package/dist/collection/components/dropdown/dropdown.component.js +2 -2
- package/dist/collection/components/dropdown/dropdown.component.js.map +1 -1
- package/dist/collection/components/dropdown-item/dropdown-item.component.js +3 -3
- package/dist/collection/components/dropdown-item/dropdown-item.component.js.map +1 -1
- package/dist/collection/components/input/input.component.js +3 -3
- package/dist/collection/components/input/input.component.js.map +1 -1
- package/dist/collection/components/pop-confirm/pop-confirm.component.js +2 -2
- package/dist/collection/components/pop-confirm/pop-confirm.component.js.map +1 -1
- package/dist/collection/components/popover/popover.component.js +2 -2
- package/dist/collection/components/popover/popover.component.js.map +1 -1
- package/dist/collection/components/radio/radio.component.js +2 -2
- package/dist/collection/components/radio/radio.component.js.map +1 -1
- package/dist/collection/components/radio-group/radio-group.component.js +4 -4
- package/dist/collection/components/radio-group/radio-group.component.js.map +1 -1
- package/dist/collection/components/segmented-picker/segmented-picker-option.component.js +3 -3
- package/dist/collection/components/segmented-picker/segmented-picker-option.component.js.map +1 -1
- package/dist/collection/components/segmented-picker/segmented-picker.component.js +3 -3
- package/dist/collection/components/segmented-picker/segmented-picker.component.js.map +1 -1
- package/dist/collection/components/switch/switch.component.js +3 -3
- package/dist/collection/components/switch/switch.component.js.map +1 -1
- package/dist/collection/components/tabs/tabs-list.component.js +2 -2
- package/dist/collection/components/tabs/tabs-list.component.js.map +1 -1
- package/dist/collection/components/tabs/tabs-trigger.component.js +2 -2
- package/dist/collection/components/tabs/tabs-trigger.component.js.map +1 -1
- package/dist/collection/components/tabs/tabs.component.js +2 -2
- package/dist/collection/components/tabs/tabs.component.js.map +1 -1
- package/dist/collection/components/textarea/textarea.component.js +4 -4
- package/dist/collection/components/textarea/textarea.component.js.map +1 -1
- package/dist/collection/components/tooltip/tooltip.component.js +3 -8
- package/dist/collection/components/tooltip/tooltip.component.js.map +1 -1
- package/dist/collection/utils/tv.js +14 -0
- package/dist/collection/utils/tv.js.map +1 -0
- package/dist/components/bcm-accordion.js +4 -4
- package/dist/components/bcm-accordion.js.map +1 -1
- package/dist/components/bcm-alert.js +4 -4
- package/dist/components/bcm-alert.js.map +1 -1
- package/dist/components/bcm-avatar.js +2 -2
- package/dist/components/bcm-avatar.js.map +1 -1
- package/dist/components/bcm-badge.js +1 -1
- package/dist/components/bcm-basic-badge.js +5 -5
- package/dist/components/bcm-basic-badge.js.map +1 -1
- package/dist/components/bcm-button-group.js +4 -4
- package/dist/components/bcm-button-group.js.map +1 -1
- package/dist/components/bcm-button.js +1 -1
- package/dist/components/bcm-checkbox.js +3 -3
- package/dist/components/bcm-checkbox.js.map +1 -1
- package/dist/components/bcm-chip.js +3 -3
- package/dist/components/bcm-chip.js.map +1 -1
- package/dist/components/bcm-divider.js +3 -3
- package/dist/components/bcm-divider.js.map +1 -1
- package/dist/components/bcm-drawer.js +5 -7
- package/dist/components/bcm-drawer.js.map +1 -1
- package/dist/components/bcm-dropdown-item.js +4 -4
- package/dist/components/bcm-dropdown-item.js.map +1 -1
- package/dist/components/bcm-dropdown.js +4 -4
- package/dist/components/bcm-dropdown.js.map +1 -1
- package/dist/components/bcm-input.js +4 -4
- package/dist/components/bcm-input.js.map +1 -1
- package/dist/components/bcm-pop-confirm.js +4 -4
- package/dist/components/bcm-pop-confirm.js.map +1 -1
- package/dist/components/bcm-popover.js +3 -3
- package/dist/components/bcm-popover.js.map +1 -1
- package/dist/components/bcm-radio-group.js +5 -5
- package/dist/components/bcm-radio-group.js.map +1 -1
- package/dist/components/bcm-radio.js +3 -3
- package/dist/components/bcm-radio.js.map +1 -1
- package/dist/components/bcm-segmented-picker-option.js +4 -4
- package/dist/components/bcm-segmented-picker-option.js.map +1 -1
- package/dist/components/bcm-segmented-picker.js +4 -4
- package/dist/components/bcm-segmented-picker.js.map +1 -1
- package/dist/components/bcm-switch.js +4 -4
- package/dist/components/bcm-switch.js.map +1 -1
- package/dist/components/bcm-tabs-list.js +3 -3
- package/dist/components/bcm-tabs-list.js.map +1 -1
- package/dist/components/bcm-tabs-trigger.js +3 -3
- package/dist/components/bcm-tabs-trigger.js.map +1 -1
- package/dist/components/bcm-tabs.js +3 -3
- package/dist/components/bcm-tabs.js.map +1 -1
- package/dist/components/bcm-textarea.js +5 -5
- package/dist/components/bcm-textarea.js.map +1 -1
- package/dist/components/bcm-tooltip.js +4 -9
- package/dist/components/bcm-tooltip.js.map +1 -1
- package/dist/components/{p-5fcf77f9.js → p-2c58fcb7.js} +16 -3
- package/dist/components/p-2c58fcb7.js.map +1 -0
- package/dist/components/{p-d54398ea.js → p-bf273460.js} +6 -6
- package/dist/components/p-bf273460.js.map +1 -0
- package/dist/components/{p-d56f8a26.js → p-c491a7c9.js} +5 -5
- package/dist/components/p-c491a7c9.js.map +1 -0
- package/dist/esm/bcm-accordion.entry.js +4 -4
- package/dist/esm/bcm-accordion.entry.js.map +1 -1
- package/dist/esm/bcm-alert.entry.js +4 -4
- package/dist/esm/bcm-alert.entry.js.map +1 -1
- package/dist/esm/bcm-avatar.entry.js +1 -1
- package/dist/esm/bcm-avatar.entry.js.map +1 -1
- package/dist/esm/bcm-badge.entry.js +5 -5
- package/dist/esm/bcm-badge.entry.js.map +1 -1
- package/dist/esm/bcm-basic-badge.entry.js +5 -5
- package/dist/esm/bcm-basic-badge.entry.js.map +1 -1
- package/dist/esm/bcm-button-group.entry.js +4 -4
- package/dist/esm/bcm-button-group.entry.js.map +1 -1
- package/dist/esm/bcm-button_8.entry.js +16 -18
- package/dist/esm/bcm-button_8.entry.js.map +1 -1
- package/dist/esm/bcm-checkbox.entry.js +3 -3
- package/dist/esm/bcm-checkbox.entry.js.map +1 -1
- package/dist/esm/bcm-chip.entry.js +3 -3
- package/dist/esm/bcm-chip.entry.js.map +1 -1
- package/dist/esm/bcm-divider.entry.js +3 -3
- package/dist/esm/bcm-divider.entry.js.map +1 -1
- package/dist/esm/bcm-pop-confirm.entry.js +3 -3
- package/dist/esm/bcm-pop-confirm.entry.js.map +1 -1
- package/dist/esm/bcm-popover.entry.js +3 -3
- package/dist/esm/bcm-popover.entry.js.map +1 -1
- package/dist/esm/bcm-radio-group.entry.js +5 -5
- package/dist/esm/bcm-radio-group.entry.js.map +1 -1
- package/dist/esm/bcm-radio.entry.js +3 -3
- package/dist/esm/bcm-radio.entry.js.map +1 -1
- package/dist/esm/bcm-segmented-picker-option.entry.js +4 -4
- package/dist/esm/bcm-segmented-picker-option.entry.js.map +1 -1
- package/dist/esm/bcm-segmented-picker.entry.js +4 -4
- package/dist/esm/bcm-segmented-picker.entry.js.map +1 -1
- package/dist/esm/bcm-switch.entry.js +4 -4
- package/dist/esm/bcm-switch.entry.js.map +1 -1
- package/dist/esm/bcm-tabs-list.entry.js +3 -3
- package/dist/esm/bcm-tabs-list.entry.js.map +1 -1
- package/dist/esm/bcm-tabs-trigger.entry.js +3 -3
- package/dist/esm/bcm-tabs-trigger.entry.js.map +1 -1
- package/dist/esm/bcm-tabs.entry.js +3 -3
- package/dist/esm/bcm-tabs.entry.js.map +1 -1
- package/dist/esm/bcm-textarea.entry.js +5 -5
- package/dist/esm/bcm-textarea.entry.js.map +1 -1
- package/dist/esm/bcm-tooltip.entry.js +4 -9
- package/dist/esm/bcm-tooltip.entry.js.map +1 -1
- package/dist/esm/{index-f3b17e60.js → tv-6dcd2224.js} +16 -3
- package/dist/esm/tv-6dcd2224.js.map +1 -0
- package/dist/types/utils/tv.d.ts +20 -0
- package/package.json +1 -1
- package/dist/bromcom-ui/p-01c8dde2.entry.js +0 -2
- package/dist/bromcom-ui/p-01c8dde2.entry.js.map +0 -1
- package/dist/bromcom-ui/p-03be08cc.entry.js +0 -2
- package/dist/bromcom-ui/p-03be08cc.entry.js.map +0 -1
- package/dist/bromcom-ui/p-145dce31.entry.js.map +0 -1
- package/dist/bromcom-ui/p-1e5da10e.entry.js.map +0 -1
- package/dist/bromcom-ui/p-25583111.entry.js +0 -2
- package/dist/bromcom-ui/p-25583111.entry.js.map +0 -1
- package/dist/bromcom-ui/p-4149c766.entry.js.map +0 -1
- package/dist/bromcom-ui/p-42feef7e.entry.js.map +0 -1
- package/dist/bromcom-ui/p-5fcf77f9.js.map +0 -1
- package/dist/bromcom-ui/p-74b51cfc.entry.js +0 -2
- package/dist/bromcom-ui/p-74b51cfc.entry.js.map +0 -1
- package/dist/bromcom-ui/p-7b93985f.entry.js +0 -2
- package/dist/bromcom-ui/p-7b93985f.entry.js.map +0 -1
- package/dist/bromcom-ui/p-842b48ae.entry.js +0 -2
- package/dist/bromcom-ui/p-842b48ae.entry.js.map +0 -1
- package/dist/bromcom-ui/p-8550a2aa.entry.js.map +0 -1
- package/dist/bromcom-ui/p-94ced142.entry.js.map +0 -1
- package/dist/bromcom-ui/p-9ba07f12.entry.js.map +0 -1
- package/dist/bromcom-ui/p-a02e437c.entry.js +0 -2
- package/dist/bromcom-ui/p-a02e437c.entry.js.map +0 -1
- package/dist/bromcom-ui/p-b582c170.entry.js.map +0 -1
- package/dist/bromcom-ui/p-b6dd459b.entry.js +0 -2
- package/dist/bromcom-ui/p-b867a105.entry.js.map +0 -1
- package/dist/bromcom-ui/p-bbe4aac2.entry.js.map +0 -1
- package/dist/bromcom-ui/p-bc962a70.entry.js.map +0 -1
- package/dist/bromcom-ui/p-ceaa2fc5.entry.js +0 -2
- package/dist/bromcom-ui/p-ceaa2fc5.entry.js.map +0 -1
- package/dist/bromcom-ui/p-d975579d.entry.js.map +0 -1
- package/dist/bromcom-ui/p-e2f468ab.entry.js.map +0 -1
- package/dist/cjs/index-310db2a6.js.map +0 -1
- package/dist/components/p-5fcf77f9.js.map +0 -1
- package/dist/components/p-d54398ea.js.map +0 -1
- package/dist/components/p-d56f8a26.js.map +0 -1
- package/dist/esm/index-f3b17e60.js.map +0 -1
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"names":["radioGroupCss","BcmRadioGroupStyle0","BcmRadioGroup","constructor","hostRef","this","disabled","required","error","size","direction","radioGroupName","generateId","handleSlotChange","radios","forEach","radio","name","_a","radioGroupClass","tv","slots","host","container","variants","small","medium","large","horizontal","vertical","defaultVariants","querySelectorAll","componentWillLoad","value","updateRadios","setClear","checked","resetCaption","captionText","undefined","handleValueChange","newValue","handleRadioChange","event","target","r","bcmRadioGroupChange","emit","element","render","h","key","class","label","classNames","onSlotchange"],"sources":["src/components/radio-group/radio-group.css?tag=bcm-radio-group&encapsulation=shadow","src/components/radio-group/radio-group.component.tsx"],"sourcesContent":[null,"/**\n * @component BcmRadioGroup\n * @description A radio group component that manages a collection of `bcm-radio` components, ensuring only one radio button is selected at a time.\n * Supports horizontal or vertical layouts, various sizes, and states such as disabled, required, and error.\n *\n * @example\n * <bcm-radio-group name=\"group1\" size=\"medium\" direction=\"vertical\" label=\"Select an option\">\n * <bcm-radio label=\"Option 1\" value=\"1\"></bcm-radio>\n * <bcm-radio label=\"Option 2\" value=\"2\"></bcm-radio>\n * </bcm-radio-group>\n *\n * @example Radio group with error state and caption\n * <bcm-radio-group name=\"group1\" error={true} caption-text=\"Please select an option\">\n * <bcm-radio label=\"Option 1\" value=\"1\"></bcm-radio>\n * <bcm-radio label=\"Option 2\" value=\"2\"></bcm-radio>\n * </bcm-radio-group>\n *\n * @prop {string} name - The name attribute for the radio group, used to group radio buttons.\n * @defaultValue undefined\n * @prop {string} value - The currently selected value of the radio group.\n * @defaultValue undefined\n * @prop {boolean} disabled - Whether the radio group and its radio buttons are disabled.\n * @defaultValue false\n * @prop {boolean} required - Whether the radio group is required in a form.\n * @defaultValue false\n * @prop {boolean} error - Whether the radio group is in an error state.\n * @defaultValue false\n * @prop {string} label - The label text to display above the radio group.\n * @defaultValue undefined\n * @prop {RadioSize} size - Defines the size of the radio group and its radio buttons: 'small' | 'medium' | 'large'.\n * @defaultValue 'medium'\n * @prop {Direction} direction - The layout direction of the radio buttons: 'horizontal' | 'vertical'.\n * @defaultValue 'vertical'\n * @prop {string} captionText - Optional caption text to display below the radio group, often used for error messages or hints.\n * @defaultValue undefined\n *\n * @event {EventEmitter<HTMLBcmRadioElement>} bcmRadioGroupChange - Emitted when the selected radio button changes, passing the selected radio element.\n *\n * @method setClear - Clears the selected value and unchecks all radio buttons.\n * @method resetCaption - Resets the error state and caption.\n *\n * @csspart host - The root element of the radio group.\n * @csspart container - The container for the radio buttons.\n * @csspart label - The label element above the radio group.\n * @csspart caption - The caption text below the radio group.\n */\n\nimport { Component, ComponentInterface, Prop, h, Element, Listen, Event, EventEmitter, Method, Watch } from '@stencil/core';\nimport { tv } from '@utils/tv';\nimport { generateId } from '../../utils/id/generate-id';\nimport classNames from 'classnames';\n\n@Component({\n tag: 'bcm-radio-group',\n styleUrl: 'radio-group.css',\n shadow: true,\n})\nexport class BcmRadioGroup implements ComponentInterface {\n @Element() host: HTMLBcmRadioGroupElement;\n\n /**\n * The name attribute for the radio group, used to group radio buttons.\n * @prop\n * @defaultValue undefined\n */\n @Prop()\n name: string;\n\n /**\n * The currently selected value of the radio group.\n * @prop\n * @defaultValue undefined\n */\n @Prop()\n value: string;\n\n /**\n * Whether the radio group and its radio buttons are disabled.\n * @prop\n * @defaultValue false\n */\n @Prop()\n disabled: boolean = false;\n\n /**\n * Whether the radio group is required in a form.\n * @prop\n * @defaultValue false\n */\n @Prop()\n required: boolean = false;\n\n /**\n * Whether the radio group is in an error state.\n * @prop\n * @defaultValue false\n */\n @Prop()\n error: boolean = false;\n\n /**\n * The label text to display above the radio group.\n * @prop\n * @defaultValue undefined\n */\n @Prop()\n label: string;\n\n /**\n * Defines the size of the radio group and its radio buttons: 'small' | 'medium' | 'large'.\n * @prop\n * @defaultValue 'medium'\n */\n @Prop()\n size: 'small' | 'medium' | 'large' = 'medium';\n\n /**\n * The layout direction of the radio buttons: 'horizontal' | 'vertical'.\n * @prop\n * @defaultValue 'vertical'\n */\n @Prop()\n direction: 'horizontal' | 'vertical' = 'vertical';\n\n /**\n * Optional caption text to display below the radio group, often used for error messages or hints.\n * @prop\n * @defaultValue undefined\n */\n @Prop()\n captionText?: string;\n\n @Event({\n composed: false,\n bubbles: false,\n cancelable: true,\n eventName: 'bcmRadioGroupChange',\n })\n bcmRadioGroupChange: EventEmitter<any>;\n\n private readonly radioGroupName = generateId('radio-group-name');\n\n get radios() {\n return this.host.querySelectorAll('bcm-radio');\n }\n\n componentWillLoad() {\n if (this.value) {\n this.updateRadios(this.value);\n }\n }\n\n /**\n * Clears the selected value (sets it to an empty string) and unchecks all radio buttons.\n * @method\n */\n @Method()\n async setClear() {\n this.value = '';\n this.radios?.forEach(radio => {\n radio.checked = false;\n });\n }\n\n /**\n * Resets the error state and caption.\n * @method\n */\n @Method()\n async resetCaption() {\n this.error = false;\n this.captionText = undefined;\n }\n\n private handleSlotChange = () => {\n this.radios.forEach(radio => {\n radio.size = this.size;\n radio.name = this.name ?? this.radioGroupName;\n radio.disabled = this.disabled;\n radio.error = this.error;\n });\n };\n\n @Watch('value')\n handleValueChange(newValue: string) {\n this.updateRadios(newValue);\n }\n\n @Listen('bcmRadioChange', { capture: true })\n handleRadioChange(event: CustomEvent) {\n const radio = event.target as HTMLBcmRadioElement;\n const radios = this.host.querySelectorAll('bcm-radio');\n radios.forEach(r => {\n if (r !== radio) {\n r.checked = false;\n }\n });\n this.bcmRadioGroupChange.emit({\n value: radio.value,\n element: radio,\n });\n }\n\n private updateRadios(value: string) {\n this.radios.forEach(radio => {\n radio.checked = radio.value === value;\n });\n }\n\n private radioGroupClass = tv({\n slots: {\n host: ['bcm-ui-element bcm-radio-group flex flex-col'],\n container: ['flex'],\n },\n variants: {\n size: {\n small: {\n host: 'gap-1.5',\n container: 'gap-1.5',\n },\n medium: {\n host: 'gap-2',\n container: 'gap-2',\n },\n large: {\n host: 'gap-2.5',\n container: 'gap-2.5',\n },\n },\n direction: {\n horizontal: {\n container: ['flex-row flex-wrap'],\n },\n vertical: {\n container: ['flex-col'],\n },\n },\n },\n defaultVariants: {\n size: 'medium',\n direction: 'vertical',\n },\n });\n\n render() {\n const { host, container } = this.radioGroupClass({\n size: this.size,\n direction: this.direction,\n });\n return (\n <div class={host()}>\n {this.label && (\n <label\n class={classNames(\n 'input-label font-medium',\n {\n 'text-color-label': !this.disabled,\n 'text-color-disabled': this.disabled,\n },\n {\n 'text-size-3': this.size === 'small',\n 'text-size-4': this.size === 'medium',\n 'text-size-5': this.size === 'large',\n },\n )}\n >\n <slot name=\"label\">{this.label}</slot>\n {this.required && <span>*</span>}\n </label>\n )}\n <div class={container()}>\n <slot onSlotchange={this.handleSlotChange}></slot>\n </div>\n\n {this.captionText && (\n <div\n class={classNames(\n 'input-caption-text font-regular mt-1',\n {\n 'text-[--bcm-ui-color-text-caption]': !this.disabled,\n 'text-[--bcm-ui-color-text-error]': !this.disabled && this.error,\n 'text-[--bcm-ui-color-text-disabled]': this.disabled,\n },\n {\n 'text-size-3': this.size === 'small',\n 'text-size-4': this.size === 'medium',\n 'text-size-5': this.size === 'large',\n },\n )}\n >\n {this.captionText}\n </div>\n )}\n </div>\n );\n }\n}\n"],"mappings":"qKAAA,MAAMA,EAAgB,q+CACtB,MAAAC,EAAeD,E,MCwDFE,EAAa,MAL1B,WAAAC,CAAAC,G,mEA8BEC,KAAAC,SAAoB,MAQpBD,KAAAE,SAAoB,MAQpBF,KAAAG,MAAiB,MAgBjBH,KAAAI,KAAqC,SAQrCJ,KAAAK,UAAuC,WAkBtBL,KAAAM,eAAiBC,EAAW,oBAkCrCP,KAAAQ,iBAAmB,KACzBR,KAAKS,OAAOC,SAAQC,I,MAClBA,EAAMP,KAAOJ,KAAKI,KAClBO,EAAMC,MAAOC,EAAAb,KAAKY,QAAI,MAAAC,SAAA,EAAAA,EAAIb,KAAKM,eAC/BK,EAAMV,SAAWD,KAAKC,SACtBU,EAAMR,MAAQH,KAAKG,KAAK,GACxB,EA6BIH,KAAAc,gBAAkBC,EAAG,CAC3BC,MAAO,CACLC,KAAM,CAAC,gDACPC,UAAW,CAAC,SAEdC,SAAU,CACRf,KAAM,CACJgB,MAAO,CACLH,KAAM,UACNC,UAAW,WAEbG,OAAQ,CACNJ,KAAM,QACNC,UAAW,SAEbI,MAAO,CACLL,KAAM,UACNC,UAAW,YAGfb,UAAW,CACTkB,WAAY,CACVL,UAAW,CAAC,uBAEdM,SAAU,CACRN,UAAW,CAAC,eAIlBO,gBAAiB,CACfrB,KAAM,SACNC,UAAW,a,CAlGf,UAAII,GACF,OAAOT,KAAKiB,KAAKS,iBAAiB,Y,CAGpC,iBAAAC,GACE,GAAI3B,KAAK4B,MAAO,CACd5B,KAAK6B,aAAa7B,KAAK4B,M,EAS3B,cAAME,G,MACJ9B,KAAK4B,MAAQ,IACbf,EAAAb,KAAKS,UAAM,MAAAI,SAAA,SAAAA,EAAEH,SAAQC,IACnBA,EAAMoB,QAAU,KAAK,G,CASzB,kBAAMC,GACJhC,KAAKG,MAAQ,MACbH,KAAKiC,YAAcC,S,CAarB,iBAAAC,CAAkBC,GAChBpC,KAAK6B,aAAaO,E,CAIpB,iBAAAC,CAAkBC,GAChB,MAAM3B,EAAQ2B,EAAMC,OACpB,MAAM9B,EAAST,KAAKiB,KAAKS,iBAAiB,aAC1CjB,EAAOC,SAAQ8B,IACb,GAAIA,IAAM7B,EAAO,CACf6B,EAAET,QAAU,K,KAGhB/B,KAAKyC,oBAAoBC,KAAK,CAC5Bd,MAAOjB,EAAMiB,MACbe,QAAShC,G,CAIL,YAAAkB,CAAaD,GACnB5B,KAAKS,OAAOC,SAAQC,IAClBA,EAAMoB,QAAUpB,EAAMiB,QAAUA,CAAK,G,CAuCzC,MAAAgB,GACE,MAAM3B,KAAEA,EAAIC,UAAEA,GAAclB,KAAKc,gBAAgB,CAC/CV,KAAMJ,KAAKI,KACXC,UAAWL,KAAKK,YAElB,OACEwC,EAAA,OAAAC,IAAA,2CAAKC,MAAO9B,KACTjB,KAAKgD,OACJH,EAAA,SAAAC,IAAA,2CACEC,MAAOE,EACL,0BACA,CACE,oBAAqBjD,KAAKC,SAC1B,sBAAuBD,KAAKC,UAE9B,CACE,cAAeD,KAAKI,OAAS,QAC7B,cAAeJ,KAAKI,OAAS,SAC7B,cAAeJ,KAAKI,OAAS,WAIjCyC,EAAA,QAAAC,IAAA,2CAAMlC,KAAK,SAASZ,KAAKgD,OACxBhD,KAAKE,UAAY2C,EAAA,QAAAC,IAAA,kDAGtBD,EAAA,OAAAC,IAAA,2CAAKC,MAAO7B,KACV2B,EAAA,QAAAC,IAAA,2CAAMI,aAAclD,KAAKQ,oBAG1BR,KAAKiC,aACJY,EAAA,OAAAC,IAAA,2CACEC,MAAOE,EACL,uCACA,CACE,sCAAuCjD,KAAKC,SAC5C,oCAAqCD,KAAKC,UAAYD,KAAKG,MAC3D,sCAAuCH,KAAKC,UAE9C,CACE,cAAeD,KAAKI,OAAS,QAC7B,cAAeJ,KAAKI,OAAS,SAC7B,cAAeJ,KAAKI,OAAS,WAIhCJ,KAAKiC,a","ignoreList":[]}
|
|
@@ -1,2 +1,2 @@
|
|
|
1
|
-
import{r as t,h as i}from"./p-9d0aeb92.js";import{
|
|
2
|
-
//# sourceMappingURL=p-
|
|
1
|
+
import{r as t,h as i}from"./p-9d0aeb92.js";import{t as a}from"./p-2c58fcb7.js";const o=".relative{position:relative}.block{display:block}:host{display:block;position:relative;width:100%}.container{width:100%}@media (min-width:640px){.container{max-width:640px}}@media (min-width:768px){.container{max-width:768px}}@media (min-width:1024px){.container{max-width:1024px}}@media (min-width:1280px){.container{max-width:1280px}}@media (min-width:1536px){.container{max-width:1536px}}.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}.h-0\\.5{height:.125rem}.w-full{width:100%}.flex-row{flex-direction:row}.items-center{align-items:center}.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=o;const r=class{constructor(i){t(this,i);this.class=a({slots:{container:"flex flex-row items-center w-full relative",inkbar:"inkbar absolute bottom-0 left-0 right-0 h-0.5 bg-[--bcm-ui-color-text-primary] transition-all duration-200 ease-in-out z-10 opacity-0",tabList:"tabs-list flex flex-row items-center w-full relative"}})}render(){const{container:t,inkbar:a,tabList:o}=this.class();return i("div",{key:"9752a4024488845eda6a6701818364dab7fe96f2",class:t(),slot:"tabs-list"},i("div",{key:"c97ec0649dc5054b1dc374e5dd47d37eaaf0001a",class:a()}),i("div",{key:"f0da62c82904ad4bc90cf02ec19c3da48118471c",class:o(),role:"tablist"},i("slot",{key:"c4f7086fac00127505adfc74032bc4a2cd8fbb11"})))}};r.style=e;export{r as bcm_tabs_list};
|
|
2
|
+
//# sourceMappingURL=p-b1f9ad67.entry.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"names":["tabsListCss","BcmTabsListStyle0","BcmTabsList","constructor","hostRef","this","class","tv","slots","container","inkbar","tabList","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 width: 100%;\n}\n","import { Component, 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 * 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 w-full relative',\n\n /**\n * The sliding indicator that appears under the active tab\n */\n inkbar: 'inkbar absolute bottom-0 left-0 right-0 h-0.5 bg-[--bcm-ui-color-text-primary] transition-all duration-200 ease-in-out z-10 opacity-0',\n\n /**\n * The container for tab trigger elements\n */\n tabList: 'tabs-list flex flex-row items-center w-full relative',\n },\n });\n\n render() {\n const { container, inkbar, tabList } = this.class();\n return (\n <div class={container()} slot=\"tabs-list\">\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,kpCACpB,MAAAC,EAAeD,E,MCWFE,EAAW,MALxB,WAAAC,CAAAC,G,UASUC,KAAAC,MAAQC,EAAG,CACjBC,MAAO,CAILC,UAAW,6CAKXC,OAAQ,wIAKRC,QAAS,yD,CAIb,MAAAC,GACE,MAAMH,UAAEA,EAASC,OAAEA,EAAMC,QAAEA,GAAYN,KAAKC,QAC5C,OACEO,EAAA,OAAAC,IAAA,2CAAKR,MAAOG,IAAaM,KAAK,aAC5BF,EAAA,OAAAC,IAAA,2CAAKR,MAAOI,MACZG,EAAA,OAAAC,IAAA,2CAAKR,MAAOK,IAAWK,KAAK,WAC1BH,EAAA,QAAAC,IAAA,8C","ignoreList":[]}
|
|
@@ -0,0 +1,2 @@
|
|
|
1
|
+
import{r as e,h as t}from"./p-9d0aeb92.js";import{t as i}from"./p-2c58fcb7.js";const a=":host{--bcm-badge-bg:var(--bcm-ui-color-background-default-default);--bcm-badge-text:var(--bcm-ui-color-text-default);--bcm-badge-radius:9999px;display:inline-flex;height:-moz-fit-content;height:fit-content;width:-moz-fit-content;width:fit-content}.badge-content{color:var(--bcm-badge-text);font-weight:500}.bcm-ui-element{-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;font-family:Inter,sans-serif}.inline-flex{display:inline-flex}.size-1{height:.25rem;width:.25rem}.size-1\\.5{height:.375rem;width:.375rem}.size-2{height:.5rem;width:.5rem}.select-none{user-select:none}.items-center{align-items:center}.justify-center{justify-content:center}.gap-0{gap:0}.whitespace-nowrap{white-space:nowrap}.rounded-\\[--bcm-badge-radius\\]{border-radius:var(--bcm-badge-radius)}.bg-\\[--bcm-badge-bg\\]{background-color:var(--bcm-badge-bg)}.p-0{padding:0}.px-1{padding-left:.25rem;padding-right:.25rem}.px-1\\.5{padding-left:.375rem;padding-right:.375rem}.px-2{padding-left:.5rem;padding-right:.5rem}.py-0\\.5{padding-bottom:.125rem;padding-top:.125rem}.py-1{padding-bottom:.25rem;padding-top:.25rem}.text-\\[0px\\]{font-size:0}.text-size-3{font-size:var(--bcm-ui-font-size-3,12px);line-height:var(--bcm-ui-line-height-3,16px)}.text-size-4{font-size:var(--bcm-ui-font-size-4,14px);line-height:var(--bcm-ui-line-height-4,20px)}.text-size-5{font-size:var(--bcm-ui-font-size-5,16px);line-height:var(--bcm-ui-line-height-5,24px)}.font-medium{font-weight:500}.leading-none{line-height:1}.text-\\[--bcm-badge-text\\]{color:var(--bcm-badge-text)}.shadow{--tw-shadow:var(--bcm-ui-box-shadow-default);--tw-shadow-colored:var(--bcm-ui-box-shadow-default);box-shadow:var(--tw-ring-offset-shadow,0 0 #0000),var(--tw-ring-shadow,0 0 #0000),var(--tw-shadow)}";const s=a;const n=class{constructor(t){e(this,t);this.size="medium";this.variant="text";this.soft=false;this.classes=i({base:"badge bcm-ui-element inline-flex items-center justify-center whitespace-nowrap select-none font-medium bg-[--bcm-badge-bg] text-[--bcm-badge-text] rounded-[--bcm-badge-radius]",variants:{size:{small:"px-1 text-size-3",medium:"py-0.5 px-1.5 text-size-4",large:"py-1 px-2 text-size-5"},variant:{dot:"gap-0 p-0 text-[0px] leading-none",text:""}},compoundVariants:[{variant:"dot",size:"small",class:"size-1"},{variant:"dot",size:"medium",class:"size-1.5"},{variant:"dot",size:"large",class:"size-2"}],defaultVariants:{variant:"text",size:"medium",blink:false}})}get badgeStyle(){if(!this.color)return{};const e=this.soft?"palette":"vivid";return{"--bcm-badge-bg":`var(--bcm-ui-color-background-${e}-${this.color}-default)`,"--bcm-badge-text":this.soft?`var(--bcm-ui-color-text-palette-${this.color})`:"var(--bcm-ui-color-text-base)"}}render(){return t("span",{key:"bfbf8ca56ea7e47a7ae8905ba85e851241a847e4",part:"base",role:"status","aria-live":"polite",style:this.badgeStyle,class:this.classes({size:this.size,variant:this.variant})},this.variant==="text"&&t("span",{key:"7f752ae67fe7eff49c9e95fb2fd5043223e1beb8",class:"badge-content"},t("slot",{key:"25cc949858b1c39614be77f4f06cd98a7ce5a62a"})))}};n.style=s;export{n as bcm_basic_badge};
|
|
2
|
+
//# sourceMappingURL=p-bf213fe6.entry.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"names":["basicBadgeCss","BcmBasicBadgeStyle0","BasicBadge","constructor","hostRef","this","size","variant","soft","classes","tv","base","variants","small","medium","large","dot","text","compoundVariants","class","defaultVariants","blink","badgeStyle","color","variantType","render","h","key","part","role","style"],"sources":["src/components/basic-badge/basic-badge.css?tag=bcm-basic-badge&encapsulation=shadow","src/components/basic-badge/basic-badge.component.tsx"],"sourcesContent":[":host {\n display: inline-flex;\n height: fit-content;\n width: fit-content;\n --bcm-badge-bg: var(--bcm-ui-color-background-default-default);\n --bcm-badge-text: var(--bcm-ui-color-text-default);\n --bcm-badge-radius: 9999px;\n}\n\n.badge-content {\n color: var(--bcm-badge-text);\n font-weight: 500;\n}\n","import { Component, ComponentInterface, Prop, h } from '@stencil/core';\nimport { tv } from '@utils/tv';\n\n/**\n * @component BcmBasicBadge\n * @description A basic badge component that can be used as a status indicator or to highlight content.\n * Supports dot and text variants with different sizes and color options.\n *\n * @example Basic usage\n * <bcm-basic-badge size=\"medium\" color=\"primary\">\n * New\n * </bcm-basic-badge>\n *\n * @example Dot variant\n * <bcm-basic-badge variant=\"dot\" color=\"success\" />\n */\n\n@Component({\n tag: 'bcm-basic-badge',\n styleUrl: 'basic-badge.css',\n shadow: true,\n})\nexport class BasicBadge implements ComponentInterface {\n /**\n * Determines the size of the badge.\n * @type {'small' | 'medium' | 'large'}\n * @default 'medium'\n */\n @Prop()\n size: 'small' | 'medium' | 'large' = 'medium';\n\n /**\n * Sets the visual variant of the badge.\n * 'dot': Appears as a small dot indicator\n * 'text': Displays content as text\n * @type {'dot' | 'text'}\n * @default 'text'\n */\n @Prop()\n variant: 'dot' | 'text' = 'text';\n\n /**\n * Defines the color of the badge.\n * Uses system color variables (e.g., 'primary', 'success', 'warning', etc.)\n * @type {string}\n * @optional\n */\n @Prop()\n color?: string;\n\n /**\n * Enables soft color mode for the badge.\n * When true, uses lighter tones and pastel colors.\n * @type {boolean}\n * @default false\n */\n @Prop()\n soft: boolean = false;\n\n /**\n * Text to be displayed inside the badge.\n * Used when variant is set to 'text'.\n * @type {string}\n * @optional\n */\n @Prop()\n text?: string;\n\n private classes = tv({\n base: 'badge bcm-ui-element inline-flex items-center justify-center whitespace-nowrap select-none font-medium bg-[--bcm-badge-bg] text-[--bcm-badge-text] rounded-[--bcm-badge-radius]',\n variants: {\n size: {\n small: 'px-1 text-size-3',\n medium: 'py-0.5 px-1.5 text-size-4',\n large: 'py-1 px-2 text-size-5',\n },\n variant: {\n dot: 'gap-0 p-0 text-[0px] leading-none',\n text: '',\n },\n },\n compoundVariants: [\n {\n variant: 'dot',\n size: 'small',\n class: 'size-1',\n },\n {\n variant: 'dot',\n size: 'medium',\n class: 'size-1.5',\n },\n {\n variant: 'dot',\n size: 'large',\n class: 'size-2',\n },\n ],\n defaultVariants: {\n variant: 'text',\n size: 'medium',\n blink: false,\n },\n });\n\n private get badgeStyle() {\n if (!this.color) return {};\n const variantType = this.soft ? 'palette' : 'vivid';\n\n return {\n '--bcm-badge-bg': `var(--bcm-ui-color-background-${variantType}-${this.color}-default)`,\n '--bcm-badge-text': this.soft ? `var(--bcm-ui-color-text-palette-${this.color})` : 'var(--bcm-ui-color-text-base)',\n };\n }\n\n render() {\n return (\n <span\n part=\"base\"\n role=\"status\"\n aria-live=\"polite\"\n style={this.badgeStyle}\n class={this.classes({\n size: this.size,\n variant: this.variant,\n })}\n >\n {this.variant === 'text' && (\n <span class=\"badge-content\">\n <slot></slot>\n </span>\n )}\n </span>\n );\n }\n}\n"],"mappings":"+EAAA,MAAMA,EAAgB,6tDACtB,MAAAC,EAAeD,E,MCqBFE,EAAU,MALvB,WAAAC,CAAAC,G,UAYEC,KAAAC,KAAqC,SAUrCD,KAAAE,QAA0B,OAkB1BF,KAAAG,KAAgB,MAWRH,KAAAI,QAAUC,EAAG,CACnBC,KAAM,kLACNC,SAAU,CACRN,KAAM,CACJO,MAAO,mBACPC,OAAQ,4BACRC,MAAO,yBAETR,QAAS,CACPS,IAAK,oCACLC,KAAM,KAGVC,iBAAkB,CAChB,CACEX,QAAS,MACTD,KAAM,QACNa,MAAO,UAET,CACEZ,QAAS,MACTD,KAAM,SACNa,MAAO,YAET,CACEZ,QAAS,MACTD,KAAM,QACNa,MAAO,WAGXC,gBAAiB,CACfb,QAAS,OACTD,KAAM,SACNe,MAAO,Q,CAIX,cAAYC,GACV,IAAKjB,KAAKkB,MAAO,MAAO,GACxB,MAAMC,EAAcnB,KAAKG,KAAO,UAAY,QAE5C,MAAO,CACL,iBAAkB,iCAAiCgB,KAAenB,KAAKkB,iBACvE,mBAAoBlB,KAAKG,KAAO,mCAAmCH,KAAKkB,SAAW,gC,CAIvF,MAAAE,GACE,OACEC,EAAA,QAAAC,IAAA,2CACEC,KAAK,OACLC,KAAK,SAAQ,YACH,SACVC,MAAOzB,KAAKiB,WACZH,MAAOd,KAAKI,QAAQ,CAClBH,KAAMD,KAAKC,KACXC,QAASF,KAAKE,WAGfF,KAAKE,UAAY,QAChBmB,EAAA,QAAAC,IAAA,2CAAMR,MAAM,iBACVO,EAAA,QAAAC,IAAA,8C","ignoreList":[]}
|
|
@@ -1,2 +1,2 @@
|
|
|
1
|
-
import{r as e,c as t,h as i,H as o,g as r}from"./p-9d0aeb92.js";import{
|
|
2
|
-
//# sourceMappingURL=p-
|
|
1
|
+
import{r as e,c as t,h as i,H as o,g as r}from"./p-9d0aeb92.js";import{t as a}from"./p-2c58fcb7.js";const s=".relative{position:relative}.flex{display:flex}.transition{transition-duration:.15s;transition-property:color,background-color,border-color,text-decoration-color,fill,stroke,opacity,box-shadow,transform,filter,backdrop-filter;transition-timing-function:cubic-bezier(.4,0,.2,1)}:host{display:inline-block;position:relative}:host([full-width]){width:100%}.segmented-container{border-radius:var(--bcm-ui-border-radius,4px)}.segmented-indicator{border-radius:var(--bcm-ui-border-radius-md,2px);height:100%;top:0;transition:left .2s ease-in-out,width .2s ease-in-out}.segmented-options{display:flex}.bcm-ui-element{-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;font-family:Inter,sans-serif}.static{position:static}.absolute{position:absolute}.z-0{z-index:0}.z-10{z-index:10}.inline-flex{display:inline-flex}.w-full{width:100%}.cursor-not-allowed{cursor:not-allowed}.cursor-pointer{cursor:pointer}.overflow-hidden{overflow:hidden}.rounded{border-radius:var(--bcm-ui-border-radius-default,6px)}.border{border-width:1px}.border-solid{border-style:solid}.border-\\[--bcm-ui-color-border-default\\]{border-color:var(--bcm-ui-color-border-default)}.bg-\\[--bcm-ui-color-background-base-default\\]{background-color:var(--bcm-ui-color-background-base-default)}.bg-\\[--bcm-ui-color-background-default-default\\]{background-color:var(--bcm-ui-color-background-default-default)}.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)}.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)}.filter{filter:var(--tw-blur) var(--tw-brightness) var(--tw-contrast) var(--tw-grayscale) var(--tw-hue-rotate) var(--tw-invert) var(--tw-saturate) var(--tw-sepia) var(--tw-drop-shadow)}.ease-in-out{transition-timing-function:cubic-bezier(.4,0,.2,1)}";const n=s;const d=class{constructor(i){e(this,i);this.bcmChange=t(this,"bcmChange",1);this.size="medium";this.disabled=false;this.fullWidth=false;this.options=[];this.indicatorStyles={left:"0",width:"0",transition:"none"};this.segmentedClass=a({base:"segmented-container bcm-ui-element inline-flex relative bg-[--bcm-ui-color-background-default-default] border border-solid border-[--bcm-ui-color-border-default] rounded overflow-hidden",variants:{size:{small:"text-size-4",medium:"text-size-5",large:"text-size-6"},fullWidth:{true:"w-full"},disabled:{true:"opacity-50 cursor-not-allowed",false:"cursor-pointer"}},defaultVariants:{size:"medium",fullWidth:false,disabled:false}},{twMerge:false})}componentWillLoad(){this.parseOptions();if(!this.value&&this.options.length>0){this.value=this.options[0].value}}componentDidLoad(){this.updateIndicatorPosition(false)}componentDidUpdate(){this.updateIndicatorPosition()}valueChanged(){this.updateIndicatorPosition()}handleOptionClick(e){if(this.disabled)return;const t=e.detail;if(this.value!==t){this.value=t;this.bcmChange.emit({value:t})}}parseOptions(){const e=Array.from(this.host.children);this.options=e.filter((e=>e.nodeName.toLowerCase()==="bcm-segmented-picker-option")).map((e=>({value:e.getAttribute("value")||"",label:e.getAttribute("label")||e.textContent||""})))}updateIndicatorPosition(e=true){const t=this.host.querySelector(`bcm-segmented-picker-option[value="${this.value}"]`);if(!t)return;const i=this.host.querySelectorAll("bcm-segmented-picker-option");let o=-1;for(let e=0;e<i.length;e++){if(i[e].getAttribute("value")===this.value){o=e;break}}if(o===-1)return;setTimeout((()=>{try{let t=0;for(let e=0;e<o;e++){const o=i[e];if(o){t+=o.offsetWidth}}const r=i[o].offsetWidth;this.indicatorStyles={left:`${t}px`,width:`${r}px`,transition:e?"all 0.2s ease-in-out":"none"}}catch(e){console.error("Error updating indicator position:",e)}}),10)}render(){return i(o,{key:"da5fd3ac598c6e782387ead9a994c3e2cffb0120"},i("div",{key:"8095a9eb1c5cc455989402ca89ef45ad8799cc4c",class:this.segmentedClass({size:this.size,fullWidth:this.fullWidth,disabled:this.disabled})},i("div",{key:"09be9fc279d015a8d1050591ea287ca192f2e1ea",class:"segmented-indicator absolute bg-[--bcm-ui-color-background-base-default] z-0 rounded",style:this.indicatorStyles}),i("div",{key:"41b20cd2a9a5b3abe7bda035c91c801a211c0f23",class:"segmented-options flex relative z-10 w-full"},i("slot",{key:"102516eba6f3470073e54fba0943efb26037b8a4"}))))}get host(){return r(this)}static get watchers(){return{value:["valueChanged"]}}};d.style=n;export{d as bcm_segmented_picker};
|
|
2
|
+
//# sourceMappingURL=p-c89f7997.entry.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"names":["segmentedPickerCss","BcmSegmentedPickerStyle0","BcmSegmentedPicker","constructor","hostRef","this","size","disabled","fullWidth","options","indicatorStyles","left","width","transition","segmentedClass","tv","base","variants","small","medium","large","true","false","defaultVariants","twMerge","componentWillLoad","parseOptions","value","length","componentDidLoad","updateIndicatorPosition","componentDidUpdate","valueChanged","handleOptionClick","event","detail","bcmChange","emit","slotNodes","Array","from","host","children","filter","node","nodeName","toLowerCase","map","option","getAttribute","label","textContent","animate","selectedOption","querySelector","allOptions","querySelectorAll","selectedIndex","i","setTimeout","leftPosition","optionElement","offsetWidth","selectedWidth","error","console","render","h","Host","key","class","style"],"sources":["src/components/segmented-picker/segmented-picker.css?tag=bcm-segmented-picker&encapsulation=shadow","src/components/segmented-picker/segmented-picker.component.tsx"],"sourcesContent":[":host {\n display: inline-block;\n position: relative;\n}\n\n:host([full-width]) {\n width: 100%;\n}\n\n.segmented-container {\n border-radius: var(--bcm-ui-border-radius, 4px);\n}\n\n.segmented-indicator {\n height: 100%;\n top: 0;\n border-radius: var(--bcm-ui-border-radius-md, 2px);\n transition: left 0.2s ease-in-out, width 0.2s ease-in-out;\n}\n\n.segmented-options {\n display: flex;\n}\n","import { Component, Prop, h, Host, Element, Event, EventEmitter, Watch, State, Listen } from '@stencil/core';\nimport { tv } from '@utils/tv';\nimport { SegmentedPickerSize } from './types';\n\n@Component({\n tag: 'bcm-segmented-picker',\n styleUrl: 'segmented-picker.css',\n shadow: true,\n})\nexport class BcmSegmentedPicker {\n @Element() host: HTMLElement;\n\n /** Controls the component size */\n @Prop()\n size: SegmentedPickerSize = 'medium';\n\n /** The selected option value */\n @Prop({ mutable: true, reflect: true })\n value?: string;\n\n /** Disabled state */\n @Prop()\n disabled = false;\n\n /** Full width component */\n @Prop({ attribute: 'full-width', reflect: true })\n fullWidth = false;\n\n /** Change event */\n @Event({\n composed: false,\n bubbles: false,\n cancelable: true,\n })\n bcmChange: EventEmitter<{ value: string }>;\n\n @State() options: Array<{ value: string; label: string }> = [];\n @State() indicatorStyles: { left: string; width: string; transition: string } = {\n left: '0',\n width: '0',\n transition: 'none',\n };\n\n componentWillLoad() {\n // İlk yüklemede options'ları belirle\n this.parseOptions();\n\n // Eğer value belirtilmemişse ve options varsa, ilk option'ı seç\n if (!this.value && this.options.length > 0) {\n this.value = this.options[0].value;\n }\n }\n\n componentDidLoad() {\n // DOM yüklendikten sonra sadece gösterge pozisyonunu güncelle\n this.updateIndicatorPosition(false);\n }\n\n componentDidUpdate() {\n this.updateIndicatorPosition();\n }\n\n @Watch('value')\n valueChanged() {\n this.updateIndicatorPosition();\n }\n\n @Listen('bcmOptionClick')\n handleOptionClick(event: CustomEvent<string>) {\n if (this.disabled) return;\n\n const value = event.detail;\n if (this.value !== value) {\n this.value = value;\n this.bcmChange.emit({ value });\n }\n }\n\n private parseOptions() {\n const slotNodes = Array.from(this.host.children);\n this.options = slotNodes\n .filter(node => node.nodeName.toLowerCase() === 'bcm-segmented-picker-option')\n .map(option => ({\n value: option.getAttribute('value') || '',\n label: option.getAttribute('label') || option.textContent || '',\n }));\n }\n\n private updateIndicatorPosition(animate = true) {\n // Seçili option elemanını bul\n const selectedOption = this.host.querySelector(`bcm-segmented-picker-option[value=\"${this.value}\"]`) as HTMLElement;\n if (!selectedOption) return;\n\n // Tüm option'ları seç\n const allOptions = this.host.querySelectorAll('bcm-segmented-picker-option');\n\n // Seçili option'ın indeksini bul\n let selectedIndex = -1;\n for (let i = 0; i < allOptions.length; i++) {\n if (allOptions[i].getAttribute('value') === this.value) {\n selectedIndex = i;\n break;\n }\n }\n\n if (selectedIndex === -1) return;\n\n // DOM manipülasyonu asenkron olarak yap\n setTimeout(() => {\n try {\n // Seçili option'a kadar olan genişliği hesapla\n let leftPosition = 0;\n\n for (let i = 0; i < selectedIndex; i++) {\n const optionElement = allOptions[i] as HTMLElement;\n if (optionElement) {\n leftPosition += optionElement.offsetWidth;\n }\n }\n\n // Seçili option'ın genişliği\n const selectedWidth = (allOptions[selectedIndex] as HTMLElement).offsetWidth;\n\n // İndikatör stillerini güncelle\n this.indicatorStyles = {\n left: `${leftPosition}px`,\n width: `${selectedWidth}px`,\n transition: animate ? 'all 0.2s ease-in-out' : 'none',\n };\n } catch (error) {\n console.error('Error updating indicator position:', error);\n }\n }, 10);\n }\n\n private segmentedClass = tv(\n {\n base: 'segmented-container bcm-ui-element inline-flex relative bg-[--bcm-ui-color-background-default-default] border border-solid border-[--bcm-ui-color-border-default] rounded overflow-hidden',\n variants: {\n size: {\n small: 'text-size-4',\n medium: 'text-size-5',\n large: 'text-size-6',\n },\n fullWidth: {\n true: 'w-full',\n },\n disabled: {\n true: 'opacity-50 cursor-not-allowed',\n false: 'cursor-pointer',\n },\n },\n defaultVariants: {\n size: 'medium',\n fullWidth: false,\n disabled: false,\n },\n },\n {\n twMerge: false,\n },\n );\n\n render() {\n return (\n <Host>\n <div\n class={this.segmentedClass({\n size: this.size,\n fullWidth: this.fullWidth,\n disabled: this.disabled,\n })}\n >\n <div class=\"segmented-indicator absolute bg-[--bcm-ui-color-background-base-default] z-0 rounded\" style={this.indicatorStyles}></div>\n <div class=\"segmented-options flex relative z-10 w-full\">\n <slot></slot>\n </div>\n </div>\n </Host>\n );\n }\n}\n"],"mappings":"oGAAA,MAAMA,EAAqB,mnEAC3B,MAAAC,EAAeD,E,MCQFE,EAAkB,MAL/B,WAAAC,CAAAC,G,+CAUEC,KAAAC,KAA4B,SAQ5BD,KAAAE,SAAW,MAIXF,KAAAG,UAAY,MAUHH,KAAAI,QAAmD,GACnDJ,KAAAK,gBAAuE,CAC9EC,KAAM,IACNC,MAAO,IACPC,WAAY,QA+FNR,KAAAS,eAAiBC,EACvB,CACEC,KAAM,4LACNC,SAAU,CACRX,KAAM,CACJY,MAAO,cACPC,OAAQ,cACRC,MAAO,eAETZ,UAAW,CACTa,KAAM,UAERd,SAAU,CACRc,KAAM,gCACNC,MAAO,mBAGXC,gBAAiB,CACfjB,KAAM,SACNE,UAAW,MACXD,SAAU,QAGd,CACEiB,QAAS,O,CApHb,iBAAAC,GAEEpB,KAAKqB,eAGL,IAAKrB,KAAKsB,OAAStB,KAAKI,QAAQmB,OAAS,EAAG,CAC1CvB,KAAKsB,MAAQtB,KAAKI,QAAQ,GAAGkB,K,EAIjC,gBAAAE,GAEExB,KAAKyB,wBAAwB,M,CAG/B,kBAAAC,GACE1B,KAAKyB,yB,CAIP,YAAAE,GACE3B,KAAKyB,yB,CAIP,iBAAAG,CAAkBC,GAChB,GAAI7B,KAAKE,SAAU,OAEnB,MAAMoB,EAAQO,EAAMC,OACpB,GAAI9B,KAAKsB,QAAUA,EAAO,CACxBtB,KAAKsB,MAAQA,EACbtB,KAAK+B,UAAUC,KAAK,CAAEV,S,EAIlB,YAAAD,GACN,MAAMY,EAAYC,MAAMC,KAAKnC,KAAKoC,KAAKC,UACvCrC,KAAKI,QAAU6B,EACZK,QAAOC,GAAQA,EAAKC,SAASC,gBAAkB,gCAC/CC,KAAIC,IAAM,CACTrB,MAAOqB,EAAOC,aAAa,UAAY,GACvCC,MAAOF,EAAOC,aAAa,UAAYD,EAAOG,aAAe,M,CAI3D,uBAAArB,CAAwBsB,EAAU,MAExC,MAAMC,EAAiBhD,KAAKoC,KAAKa,cAAc,sCAAsCjD,KAAKsB,WAC1F,IAAK0B,EAAgB,OAGrB,MAAME,EAAalD,KAAKoC,KAAKe,iBAAiB,+BAG9C,IAAIC,GAAiB,EACrB,IAAK,IAAIC,EAAI,EAAGA,EAAIH,EAAW3B,OAAQ8B,IAAK,CAC1C,GAAIH,EAAWG,GAAGT,aAAa,WAAa5C,KAAKsB,MAAO,CACtD8B,EAAgBC,EAChB,K,EAIJ,GAAID,KAAmB,EAAG,OAG1BE,YAAW,KACT,IAEE,IAAIC,EAAe,EAEnB,IAAK,IAAIF,EAAI,EAAGA,EAAID,EAAeC,IAAK,CACtC,MAAMG,EAAgBN,EAAWG,GACjC,GAAIG,EAAe,CACjBD,GAAgBC,EAAcC,W,EAKlC,MAAMC,EAAiBR,EAAWE,GAA+BK,YAGjEzD,KAAKK,gBAAkB,CACrBC,KAAM,GAAGiD,MACThD,MAAO,GAAGmD,MACVlD,WAAYuC,EAAU,uBAAyB,O,CAEjD,MAAOY,GACPC,QAAQD,MAAM,qCAAsCA,E,IAErD,G,CA+BL,MAAAE,GACE,OACEC,EAACC,EAAI,CAAAC,IAAA,4CACHF,EAAA,OAAAE,IAAA,2CACEC,MAAOjE,KAAKS,eAAe,CACzBR,KAAMD,KAAKC,KACXE,UAAWH,KAAKG,UAChBD,SAAUF,KAAKE,YAGjB4D,EAAA,OAAAE,IAAA,2CAAKC,MAAM,uFAAuFC,MAAOlE,KAAKK,kBAC9GyD,EAAA,OAAAE,IAAA,2CAAKC,MAAM,+CACTH,EAAA,QAAAE,IAAA,+C","ignoreList":[]}
|
|
@@ -1,2 +1,2 @@
|
|
|
1
|
-
import{r as t,c as e,h as s,g as i}from"./p-9d0aeb92.js";import{a,c as o,o as h,f as r,s as c,b as l}from"./p-50133556.js";import{
|
|
2
|
-
//# sourceMappingURL=p-
|
|
1
|
+
import{r as t,c as e,h as s,g as i}from"./p-9d0aeb92.js";import{a,c as o,o as h,f as r,s as c,b as l}from"./p-50133556.js";import{t as n}from"./p-2c58fcb7.js";const d=":host{--popover-bg:var(--bcm-ui-color-background-base-default);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}.z-\\[9999\\]{z-index:9999}.flex{display:flex}.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))}.flex-col{flex-direction:column}.gap-1\\.5{gap:.375rem}.rounded-md{border-radius:var(--bcm-ui-border-radius-md,6px)}.bg-\\[--popover-bg\\]{background-color:var(--popover-bg)}.p-3{padding:.75rem}.text-size-3{font-size:var(--bcm-ui-font-size-3,12px);line-height:var(--bcm-ui-line-height-3,16px)}.text-size-4{font-size:var(--bcm-ui-font-size-4,14px);line-height:var(--bcm-ui-line-height-4,20px)}.text-size-5{font-size:var(--bcm-ui-font-size-5,16px);line-height:var(--bcm-ui-line-height-5,24px)}.font-normal{font-weight:400}.font-semibold{font-weight:600}.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 b=d;const f=class{constructor(s){t(this,s);this.bcmPopoverOpen=e(this,"bcmPopoverOpen",1);this.bcmPopoverClose=e(this,"bcmPopoverClose",1);this.size="medium";this.placement="top";this.trigger="click";this.hoverDelay=150;this.open=false;this.togglePopover=()=>{this.open=!this.open;if(this.open){this.bcmPopoverOpen.emit()}else{this.bcmPopoverClose.emit()}this.updatePosition()};this.showPopover=()=>{clearTimeout(this.hoverTimeout);this.hoverTimeout=setTimeout((()=>{this.open=true;this.bcmPopoverOpen.emit();this.updatePosition()}),this.hoverDelay)};this.hidePopover=()=>{clearTimeout(this.hoverTimeout);this.hoverTimeout=setTimeout((()=>{this.open=false;this.bcmPopoverClose.emit()}),this.hoverDelay)};this.handleSlotChange=()=>{const t=this.el.shadowRoot.querySelector("slot");const e=t.assignedElements();this.targetElement=e[0];if(this.targetElement){this.targetElement.removeEventListener("click",this.togglePopover);this.targetElement.removeEventListener("mouseenter",this.showPopover);this.targetElement.removeEventListener("mouseleave",this.hidePopover);if(this.trigger==="click"){this.targetElement.addEventListener("click",this.togglePopover);this.targetElement.setAttribute("aria-expanded",this.open.toString())}if(this.trigger==="hover"){this.targetElement.addEventListener("mouseenter",this.showPopover);this.targetElement.addEventListener("mouseleave",this.hidePopover)}if(this.popoverElement&&!this.cleanupAutoUpdate){this.cleanupAutoUpdate=a(this.targetElement,this.popoverElement,(()=>this.updatePosition()))}}};this.handleOutsideClick=t=>{if(!this.el.contains(t.target)&&this.open){this.open=false}};this.updatePosition=async()=>{if(!this.targetElement||!this.popoverElement||!this.arrowElement)return;const{x:t,y:e,placement:s,middlewareData:i}=await o(this.targetElement,this.popoverElement,{placement:this.placement,middleware:[h(12),r({fallbackPlacements:["top","left","bottom","right"]}),c({padding:8}),l({element:this.arrowElement})]});Object.assign(this.popoverElement.style,{left:`${t}px`,top:`${e}px`});const{x:a,y:n}=i.arrow||{x:0,y:0};const d=s.split("-")[0];const b={top:"bottom",right:"left",bottom:"top",left:"right"}[d];Object.assign(this.arrowElement.style,{left:a!=null?`${a}px`:"",top:n!=null?`${n}px`:"",[b]:"-4px"})};this.popoverClass=n({slots:{box:"bcm-ui-element bcm-popover absolute flex flex-col bg-[--popover-bg] rounded-md shadow-3 p-3 gap-1.5 min-w-max z-[9999]",header:"font-semibold text-color",content:"font-normal text-color",arrow:"absolute w-4 h-4 bg-[--popover-bg] transform rotate-45"},variants:{size:{small:{box:"text-size-3"},medium:{box:"text-size-4"},large:{box:"text-size-5"}},isOpen:{true:{box:"flex"},false:{box:"hidden"}}},defaultVariants:{size:"medium",isOpen:false}})}connectedCallback(){document.addEventListener("click",this.handleOutsideClick)}disconnectedCallback(){var t;document.removeEventListener("click",this.handleOutsideClick);if(this.targetElement){this.targetElement.removeEventListener("click",this.togglePopover);this.targetElement.removeEventListener("mouseenter",this.showPopover);this.targetElement.removeEventListener("mouseleave",this.hidePopover)}(t=this.cleanupAutoUpdate)===null||t===void 0?void 0:t.call(this);this.cleanupAutoUpdate=null;clearTimeout(this.hoverTimeout)}async openPopup(){this.showPopover()}async closePopup(){this.hidePopover()}render(){const{box:t,header:e,content:i,arrow:a}=this.popoverClass({isOpen:this.open,size:this.size});return s("div",{key:"e57bc4bf987d3e0ab1c32093c0c2aa4fb19ec403",class:"relative"},s("slot",{key:"4e2cf108937324457a86501891f280abc1ab1bbb",onSlotchange:()=>this.handleSlotChange()}),s("div",{key:"63ef22a0aaed9d37a570686c191a2d1b901a38df",part:"popover",class:t(),role:"dialog","aria-hidden":!this.open?"true":"false",ref:t=>this.popoverElement=t},s("div",{key:"f6c3d7d6733e60928703b3be49b69abc69693a2e",class:a(),ref:t=>this.arrowElement=t,part:"arrow"}),s("div",{key:"88898bfe6a978e5a7f85c9bd72387a1965bd5e8b",class:e(),part:"header"},s("slot",{key:"13d490f43ac484bfe7c7ece3d93cc5161d85ef6f",name:"header"},this.headerText)),s("div",{key:"a1de41f15a483d4eefdbc915109f971225163852",class:i(),part:"content"},s("slot",{key:"8000dff7ff5ed0466fcb50dae1b23c0510a7bfc8",name:"content"},this.message))))}get el(){return i(this)}};f.style=b;export{f as bcm_popover};
|
|
2
|
+
//# sourceMappingURL=p-f56b22de.entry.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"names":["popoverCss","BcmPopoverStyle0","Popover","constructor","hostRef","this","size","placement","trigger","hoverDelay","open","togglePopover","bcmPopoverOpen","emit","bcmPopoverClose","updatePosition","showPopover","clearTimeout","hoverTimeout","setTimeout","hidePopover","handleSlotChange","slot","el","shadowRoot","querySelector","elements","assignedElements","targetElement","removeEventListener","addEventListener","setAttribute","toString","popoverElement","cleanupAutoUpdate","autoUpdate","handleOutsideClick","event","contains","target","async","arrowElement","x","y","middlewareData","computePosition","middleware","offset","flip","fallbackPlacements","shift","padding","arrow","element","Object","assign","style","left","top","arrowX","arrowY","basePlacement","split","staticSide","right","bottom","popoverClass","tv","slots","box","header","content","variants","small","medium","large","isOpen","true","false","defaultVariants","connectedCallback","document","disconnectedCallback","_a","call","openPopup","closePopup","render","h","key","class","onSlotchange","part","role","ref","name","headerText","message"],"sources":["src/components/popover/popover.css?tag=bcm-popover&encapsulation=shadow","src/components/popover/popover.component.tsx"],"sourcesContent":[":host {\n display: inline-block;\n --popover-bg: var(--bcm-ui-color-background-base-default);\n}\n","import { arrow, computePosition, flip, offset, shift, autoUpdate } from '@floating-ui/dom';\nimport { Component, ComponentInterface, Element, Prop, Event, EventEmitter, h, Method } from '@stencil/core';\nimport { tv } from '@utils/tv';\n\n/**\n * @component BcmPopover\n * @description A flexible popover component that displays contextual information or content relative to a target element.\n * Supports different sizes, trigger types (click or hover), placements (top, right, bottom, left), and can be controlled via slots or props.\n *\n * @example Basic Click Popover\n * <bcm-popover trigger=\"click\" size=\"medium\" placement=\"top\">\n * <bcm-button>Click Me</bcm-button>\n * <span slot=\"header\">Header</span>\n * <span slot=\"content\">This is a simple popover content.</span>\n * </bcm-popover>\n *\n * @example Hover Popover with Props\n * <bcm-popover trigger=\"hover\" hover-delay=\"200\" size=\"large\" placement=\"right\" header-text=\"Prop Header\" message=\"This is a hover popover with props.\">\n * <bcm-button>Hover Me</bcm-button>\n * </bcm-popover>\n *\n * @example Programmatic Control\n * <bcm-popover id=\"my-popover\" trigger=\"click\">\n * <bcm-button>Toggle Me</bcm-button>\n * <span slot=\"content\">Controlled popover</span>\n * </bcm-popover>\n * <script>\n * const popover = document.querySelector('#my-popover');\n * popover.openPopup(); // Opens the popover\n * popover.closePopup(); // Closes the popover\n * </script>\n *\n * @slot - Default slot for the target element that triggers the popover\n * @slot header - Slot for custom header content\n * @slot content - Slot for custom popover content\n *\n * @csspart popover - The root popover container element, stylable for the entire popover\n * @csspart header - The header section of the popover, stylable for the title area\n * @csspart content - The content section of the popover, stylable for the main content area\n * @csspart arrow - The arrow element of the popover, stylable for the positioning arrow\n */\n\n@Component({\n tag: 'bcm-popover',\n styleUrl: 'popover.css',\n shadow: true,\n})\nexport class Popover implements ComponentInterface {\n @Element() el: HTMLElement;\n private targetElement: HTMLElement;\n private popoverElement: HTMLElement;\n private arrowElement: HTMLElement;\n private hoverTimeout: any;\n private cleanupAutoUpdate: () => void;\n /**\n * @prop {('small' | 'medium' | 'large')} size - Defines the size of the popover.\n * Controls the text size and padding of the popover content.\n * Default: 'medium'\n */\n @Prop()\n size: 'small' | 'medium' | 'large' = 'medium';\n /**\n * @prop {('top' | 'right' | 'bottom' | 'left')} placement - Defines the position of the popover relative to the target element.\n * Determines where the popover appears around the trigger element.\n * Default: 'top'\n */\n @Prop()\n placement: 'top' | 'right' | 'bottom' | 'left' = 'top';\n /**\n * @prop {('click' | 'hover')} trigger - Defines the interaction type to show/hide the popover.\n * 'click' toggles on click, 'hover' shows on mouse enter and hides on mouse leave.\n * Default: 'click'\n */\n @Prop()\n trigger: 'click' | 'hover' = 'click';\n /**\n * @prop {number} hoverDelay - Delay in milliseconds before showing or hiding the popover when trigger is 'hover'.\n * Adds a delay to prevent flickering on quick mouse movements.\n * Default: 150\n */\n @Prop()\n hoverDelay: number = 150;\n /**\n * @prop {boolean} open - Indicates whether the popover is currently open.\n * Can be set programmatically or toggled by user interaction. Mutable.\n * Default: false\n */\n @Prop({ mutable: true })\n open: boolean = false;\n /**\n * @prop {string} headerText - Custom text for the popover header.\n * Used as fallback content if the 'header' slot is not provided.\n */\n @Prop()\n headerText: string;\n /**\n * @prop {string} message - Custom text for the popover content.\n * Used as fallback content if the 'content' slot is not provided.\n */\n @Prop()\n message: string;\n /**\n * @event {EventEmitter<void>} bcmPopoverOpen - Emitted when the popover is opened.\n * Useful for tracking when the popover becomes visible.\n */\n @Event({ composed: false, bubbles: false, cancelable: true })\n bcmPopoverOpen: EventEmitter<void>;\n\n /**\n * @event {EventEmitter<void>} bcmPopoverClose - Emitted when the popover is closed.\n * Useful for tracking when the popover is hidden.\n */\n @Event({ composed: false, bubbles: false, cancelable: true })\n bcmPopoverClose: EventEmitter<void>;\n\n connectedCallback() {\n document.addEventListener('click', this.handleOutsideClick);\n }\n\n disconnectedCallback() {\n document.removeEventListener('click', this.handleOutsideClick);\n if (this.targetElement) {\n this.targetElement.removeEventListener('click', this.togglePopover);\n this.targetElement.removeEventListener('mouseenter', this.showPopover);\n this.targetElement.removeEventListener('mouseleave', this.hidePopover);\n }\n this.cleanupAutoUpdate?.();\n this.cleanupAutoUpdate = null;\n clearTimeout(this.hoverTimeout);\n }\n\n private togglePopover = () => {\n this.open = !this.open;\n if (this.open) {\n this.bcmPopoverOpen.emit();\n } else {\n this.bcmPopoverClose.emit();\n }\n this.updatePosition();\n };\n\n private showPopover = () => {\n clearTimeout(this.hoverTimeout);\n this.hoverTimeout = setTimeout(() => {\n this.open = true;\n this.bcmPopoverOpen.emit();\n this.updatePosition();\n }, this.hoverDelay);\n };\n\n private hidePopover = () => {\n clearTimeout(this.hoverTimeout);\n this.hoverTimeout = setTimeout(() => {\n this.open = false;\n this.bcmPopoverClose.emit();\n }, this.hoverDelay);\n };\n\n /**\n * @method {Promise<void>} openPopup - Programmatically opens the popover.\n * Triggers the showPopover logic to display the popover with the specified hover delay (if applicable).\n * @returns {Promise<void>} A promise that resolves when the popover is opened.\n */\n @Method()\n async openPopup() {\n this.showPopover();\n }\n\n /**\n * @method {Promise<void>} closePopup - Programmatically closes the popover.\n * Triggers the hidePopover logic to hide the popover with the specified hover delay (if applicable).\n * @returns {Promise<void>} A promise that resolves when the popover is closed.\n */\n @Method()\n async closePopup() {\n this.hidePopover();\n }\n\n private handleSlotChange = () => {\n const slot = this.el.shadowRoot.querySelector('slot');\n const elements = slot.assignedElements();\n this.targetElement = elements[0] as HTMLElement;\n\n if (this.targetElement) {\n this.targetElement.removeEventListener('click', this.togglePopover);\n this.targetElement.removeEventListener('mouseenter', this.showPopover);\n this.targetElement.removeEventListener('mouseleave', this.hidePopover);\n\n if (this.trigger === 'click') {\n this.targetElement.addEventListener('click', this.togglePopover);\n this.targetElement.setAttribute('aria-expanded', this.open.toString());\n }\n\n if (this.trigger === 'hover') {\n this.targetElement.addEventListener('mouseenter', this.showPopover);\n this.targetElement.addEventListener('mouseleave', this.hidePopover);\n }\n\n if (this.popoverElement && !this.cleanupAutoUpdate) {\n this.cleanupAutoUpdate = autoUpdate(this.targetElement, this.popoverElement, () => this.updatePosition());\n }\n }\n };\n\n private handleOutsideClick = (event: Event) => {\n if (!this.el.contains(event.target as Node) && this.open) {\n this.open = false;\n }\n };\n\n private updatePosition = async () => {\n if (!this.targetElement || !this.popoverElement || !this.arrowElement) return;\n\n const { x, y, placement, middlewareData } = await computePosition(this.targetElement, this.popoverElement, {\n placement: this.placement,\n middleware: [offset(12), flip({ fallbackPlacements: ['top', 'left', 'bottom', 'right'] }), shift({ padding: 8 }), arrow({ element: this.arrowElement })],\n });\n\n Object.assign(this.popoverElement.style, {\n left: `${x}px`,\n top: `${y}px`,\n });\n\n const { x: arrowX, y: arrowY } = middlewareData.arrow || { x: 0, y: 0 };\n const basePlacement = placement.split('-')[0] as 'top' | 'right' | 'bottom' | 'left';\n const staticSide = {\n top: 'bottom',\n right: 'left',\n bottom: 'top',\n left: 'right',\n }[basePlacement];\n\n Object.assign(this.arrowElement.style, {\n left: arrowX != null ? `${arrowX}px` : '',\n top: arrowY != null ? `${arrowY}px` : '',\n [staticSide]: '-4px',\n });\n };\n\n private popoverClass = tv({\n slots: {\n box: 'bcm-ui-element bcm-popover absolute flex flex-col bg-[--popover-bg] rounded-md shadow-3 p-3 gap-1.5 min-w-max z-[9999]',\n header: 'font-semibold text-color',\n content: 'font-normal text-color',\n arrow: 'absolute w-4 h-4 bg-[--popover-bg] transform rotate-45',\n },\n variants: {\n size: {\n small: { box: 'text-size-3' },\n medium: { box: 'text-size-4' },\n large: { box: 'text-size-5' },\n },\n isOpen: {\n true: { box: 'flex' },\n false: { box: 'hidden' },\n },\n },\n defaultVariants: {\n size: 'medium',\n isOpen: false,\n },\n });\n\n render() {\n const { box, header, content, arrow } = this.popoverClass({\n isOpen: this.open,\n size: this.size,\n });\n\n return (\n <div class=\"relative\">\n <slot onSlotchange={() => this.handleSlotChange()}></slot>\n <div part=\"popover\" class={box()} role=\"dialog\" aria-hidden={!this.open ? 'true' : 'false'} ref={el => (this.popoverElement = el)}>\n <div class={arrow()} ref={el => (this.arrowElement = el)} part=\"arrow\"></div>\n <div class={header()} part=\"header\">\n <slot name=\"header\">{this.headerText}</slot>\n </div>\n <div class={content()} part=\"content\">\n <slot name=\"content\">{this.message}</slot>\n </div>\n </div>\n </div>\n );\n }\n}\n"],"mappings":"+JAAA,MAAMA,EAAa,q/CACnB,MAAAC,EAAeD,E,MC8CFE,EAAO,MALpB,WAAAC,CAAAC,G,0GAkBEC,KAAAC,KAAqC,SAOrCD,KAAAE,UAAiD,MAOjDF,KAAAG,QAA6B,QAO7BH,KAAAI,WAAqB,IAOrBJ,KAAAK,KAAgB,MA2CRL,KAAAM,cAAgB,KACtBN,KAAKK,MAAQL,KAAKK,KAClB,GAAIL,KAAKK,KAAM,CACbL,KAAKO,eAAeC,M,KACf,CACLR,KAAKS,gBAAgBD,M,CAEvBR,KAAKU,gBAAgB,EAGfV,KAAAW,YAAc,KACpBC,aAAaZ,KAAKa,cAClBb,KAAKa,aAAeC,YAAW,KAC7Bd,KAAKK,KAAO,KACZL,KAAKO,eAAeC,OACpBR,KAAKU,gBAAgB,GACpBV,KAAKI,WAAW,EAGbJ,KAAAe,YAAc,KACpBH,aAAaZ,KAAKa,cAClBb,KAAKa,aAAeC,YAAW,KAC7Bd,KAAKK,KAAO,MACZL,KAAKS,gBAAgBD,MAAM,GAC1BR,KAAKI,WAAW,EAuBbJ,KAAAgB,iBAAmB,KACzB,MAAMC,EAAOjB,KAAKkB,GAAGC,WAAWC,cAAc,QAC9C,MAAMC,EAAWJ,EAAKK,mBACtBtB,KAAKuB,cAAgBF,EAAS,GAE9B,GAAIrB,KAAKuB,cAAe,CACtBvB,KAAKuB,cAAcC,oBAAoB,QAASxB,KAAKM,eACrDN,KAAKuB,cAAcC,oBAAoB,aAAcxB,KAAKW,aAC1DX,KAAKuB,cAAcC,oBAAoB,aAAcxB,KAAKe,aAE1D,GAAIf,KAAKG,UAAY,QAAS,CAC5BH,KAAKuB,cAAcE,iBAAiB,QAASzB,KAAKM,eAClDN,KAAKuB,cAAcG,aAAa,gBAAiB1B,KAAKK,KAAKsB,W,CAG7D,GAAI3B,KAAKG,UAAY,QAAS,CAC5BH,KAAKuB,cAAcE,iBAAiB,aAAczB,KAAKW,aACvDX,KAAKuB,cAAcE,iBAAiB,aAAczB,KAAKe,Y,CAGzD,GAAIf,KAAK4B,iBAAmB5B,KAAK6B,kBAAmB,CAClD7B,KAAK6B,kBAAoBC,EAAW9B,KAAKuB,cAAevB,KAAK4B,gBAAgB,IAAM5B,KAAKU,kB,IAKtFV,KAAA+B,mBAAsBC,IAC5B,IAAKhC,KAAKkB,GAAGe,SAASD,EAAME,SAAmBlC,KAAKK,KAAM,CACxDL,KAAKK,KAAO,K,GAIRL,KAAAU,eAAiByB,UACvB,IAAKnC,KAAKuB,gBAAkBvB,KAAK4B,iBAAmB5B,KAAKoC,aAAc,OAEvE,MAAMC,EAAEA,EAACC,EAAEA,EAACpC,UAAEA,EAASqC,eAAEA,SAAyBC,EAAgBxC,KAAKuB,cAAevB,KAAK4B,eAAgB,CACzG1B,UAAWF,KAAKE,UAChBuC,WAAY,CAACC,EAAO,IAAKC,EAAK,CAAEC,mBAAoB,CAAC,MAAO,OAAQ,SAAU,WAAaC,EAAM,CAAEC,QAAS,IAAMC,EAAM,CAAEC,QAAShD,KAAKoC,kBAG1Ia,OAAOC,OAAOlD,KAAK4B,eAAeuB,MAAO,CACvCC,KAAM,GAAGf,MACTgB,IAAK,GAAGf,QAGV,MAAQD,EAAGiB,EAAQhB,EAAGiB,GAAWhB,EAAeQ,OAAS,CAAEV,EAAG,EAAGC,EAAG,GACpE,MAAMkB,EAAgBtD,EAAUuD,MAAM,KAAK,GAC3C,MAAMC,EAAa,CACjBL,IAAK,SACLM,MAAO,OACPC,OAAQ,MACRR,KAAM,SACNI,GAEFP,OAAOC,OAAOlD,KAAKoC,aAAae,MAAO,CACrCC,KAAME,GAAU,KAAO,GAAGA,MAAa,GACvCD,IAAKE,GAAU,KAAO,GAAGA,MAAa,GACtCG,CAACA,GAAa,QACd,EAGI1D,KAAA6D,aAAeC,EAAG,CACxBC,MAAO,CACLC,IAAK,yHACLC,OAAQ,2BACRC,QAAS,yBACTnB,MAAO,0DAEToB,SAAU,CACRlE,KAAM,CACJmE,MAAO,CAAEJ,IAAK,eACdK,OAAQ,CAAEL,IAAK,eACfM,MAAO,CAAEN,IAAK,gBAEhBO,OAAQ,CACNC,KAAM,CAAER,IAAK,QACbS,MAAO,CAAET,IAAK,YAGlBU,gBAAiB,CACfzE,KAAM,SACNsE,OAAQ,Q,CAhJZ,iBAAAI,GACEC,SAASnD,iBAAiB,QAASzB,KAAK+B,mB,CAG1C,oBAAA8C,G,MACED,SAASpD,oBAAoB,QAASxB,KAAK+B,oBAC3C,GAAI/B,KAAKuB,cAAe,CACtBvB,KAAKuB,cAAcC,oBAAoB,QAASxB,KAAKM,eACrDN,KAAKuB,cAAcC,oBAAoB,aAAcxB,KAAKW,aAC1DX,KAAKuB,cAAcC,oBAAoB,aAAcxB,KAAKe,Y,EAE5D+D,EAAA9E,KAAK6B,qBAAiB,MAAAiD,SAAA,SAAAA,EAAAC,KAAA/E,MACtBA,KAAK6B,kBAAoB,KACzBjB,aAAaZ,KAAKa,a,CAoCpB,eAAMmE,GACJhF,KAAKW,a,CASP,gBAAMsE,GACJjF,KAAKe,a,CAwFP,MAAAmE,GACE,MAAMlB,IAAEA,EAAGC,OAAEA,EAAMC,QAAEA,EAAOnB,MAAEA,GAAU/C,KAAK6D,aAAa,CACxDU,OAAQvE,KAAKK,KACbJ,KAAMD,KAAKC,OAGb,OACEkF,EAAA,OAAAC,IAAA,2CAAKC,MAAM,YACTF,EAAA,QAAAC,IAAA,2CAAME,aAAc,IAAMtF,KAAKgB,qBAC/BmE,EAAA,OAAAC,IAAA,2CAAKG,KAAK,UAAUF,MAAOrB,IAAOwB,KAAK,SAAQ,eAAexF,KAAKK,KAAO,OAAS,QAASoF,IAAKvE,GAAOlB,KAAK4B,eAAiBV,GAC5HiE,EAAA,OAAAC,IAAA,2CAAKC,MAAOtC,IAAS0C,IAAKvE,GAAOlB,KAAKoC,aAAelB,EAAKqE,KAAK,UAC/DJ,EAAA,OAAAC,IAAA,2CAAKC,MAAOpB,IAAUsB,KAAK,UACzBJ,EAAA,QAAAC,IAAA,2CAAMM,KAAK,UAAU1F,KAAK2F,aAE5BR,EAAA,OAAAC,IAAA,2CAAKC,MAAOnB,IAAWqB,KAAK,WAC1BJ,EAAA,QAAAC,IAAA,2CAAMM,KAAK,WAAW1F,KAAK4F,W","ignoreList":[]}
|
|
@@ -0,0 +1,2 @@
|
|
|
1
|
+
import{r as t,c as e,h as i,H as o,g as r}from"./p-9d0aeb92.js";import{t as a}from"./p-2c58fcb7.js";import{c as s}from"./p-12360e4c.js";import{g as n}from"./p-ba2410ef.js";import{s as l,g as c,d}from"./p-13a245f6.js";import{a as h,o as b,f as u,s as f,c as m}from"./p-50133556.js";const p={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 x=".relative{position:relative}:host{display:inline-block;position:relative}:host([full-width]){width:100%}:host([position=first]) .bcm-button{border-bottom-right-radius:0;border-top-right-radius:0}:host([position=middle]) .bcm-button{border-radius:0}:host([position=last]) .bcm-button{border-bottom-left-radius:0;border-top-left-radius:0}:host([position=first].orientation-vertical) .bcm-button{border-bottom-left-radius:0;border-bottom-right-radius:0;border-top-left-radius:var(--bcm-ui-border-radius,4px);border-top-right-radius:var(--bcm-ui-border-radius,4px)}:host([position=middle].orientation-vertical) .bcm-button{border-radius:0}:host([position=last].orientation-vertical) .bcm-button{border-bottom-left-radius:var(--bcm-ui-border-radius,4px);border-bottom-right-radius:var(--bcm-ui-border-radius,4px);border-top-left-radius:0;border-top-right-radius:0}.static{position:static}.inline-flex{display:inline-flex}.min-h-10{min-height:2.5rem}.min-h-6{min-height:1.5rem}.min-h-8{min-height:2rem}.w-full{width:100%}.cursor-not-allowed{cursor:not-allowed}.cursor-pointer{cursor:pointer}.appearance-none{appearance:none}.items-center{align-items:center}.justify-center{justify-content:center}.rounded{border-radius:var(--bcm-ui-border-radius-default,6px)}.border{border-width:1px}.border-solid{border-style:solid}.border-\\[--bcm-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}.text-size-4{font-size:var(--bcm-ui-font-size-4,14px);line-height:var(--bcm-ui-line-height-4,20px)}.text-size-5{font-size:var(--bcm-ui-font-size-5,16px);line-height:var(--bcm-ui-line-height-5,24px)}.text-size-6{font-size:var(--bcm-ui-font-size-6,18px);line-height:var(--bcm-ui-line-height-6,24px)}.leading-none{line-height:1}.text-\\[--bcm-final-text-color\\]{color:var(--bcm-final-text-color)}.text-color-disabled{color:var(--bcm-ui-color-text-disabled)}.shadow{--tw-shadow:var(--bcm-ui-box-shadow-default);--tw-shadow-colored:var(--bcm-ui-box-shadow-default);box-shadow:var(--tw-ring-offset-shadow,0 0 #0000),var(--tw-ring-shadow,0 0 #0000),var(--tw-shadow)}.outline{outline-style:solid}.outline-0{outline-width:0}.hover\\:bg-\\[--bcm-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)}.flex{display:flex}.max-h-64{max-height:16rem}.min-w-10{min-width:2.5rem}.max-w-64{max-width:16rem}.flex-col{flex-direction:column}.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,.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)}.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%}.flex-row{flex-direction:row}.justify-end{justify-content:flex-end}.justify-between{justify-content:space-between}.gap-2{gap:.5rem}.gap-2\\.5{gap:.625rem}.gap-3{gap:.75rem}.gap-4{gap:1rem}.gap-6{gap:1.5rem}.gap-8{gap:2rem}.text-pretty{text-wrap:pretty}.rounded-\\[--popover-radius\\]{border-radius:var(--popover-radius)}.rounded-full{border-radius:var(--bcm-ui-border-radius-full,9999px)}.bg-\\[--popover-bg\\]{background-color:var(--popover-bg)}.p-4{padding:1rem}.p-6{padding:1.5rem}.p-8{padding:2rem}.font-sans{font-family:Inter,sans-serif}.text-size-7{font-size:var(--bcm-ui-font-size-7,20px);line-height:var(--bcm-ui-line-height-7,28px)}.text-size-inherit{font-size:inherit;line-height:inherit}.font-semibold{font-weight:600}.\\!text-color-header{color:var(--bcm-ui-color-text-header)!important}.text-\\[--text-color\\]{color:var(--text-color)}.shadow,.shadow-2{box-shadow:var(--tw-ring-offset-shadow,0 0 #0000),var(--tw-ring-shadow,0 0 #0000),var(--tw-shadow)}.shadow-2{--tw-shadow:var(--bcm-ui-box-shadow-2);--tw-shadow-colored:var(--bcm-ui-box-shadow-2)}.hover\\:bg-gray-100:hover{background-color:oklch(.967 .003 264.542)}";const g=x;const w=class{constructor(i){t(this,i);this.bcmClick=e(this,"bcmClick",1);this.bcmFocus=e(this,"bcmFocus",1);this.bcmBlur=e(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=a({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?p[this.variant].text:"")}get buttonIcon(){if(this.variant&&p[this.variant].icon){return{icon:p[this.variant].icon,position:p[this.variant].iconPosition||"prefix"}}return{icon:this.icon,position:this.iconPosition}}get buttonStatus(){return this.variant?p[this.variant].status:this.status}get buttonStyles(){const t=this.buttonStatus==="default"?"primary":this.buttonStatus;const e={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=e[this.kind];const o={"--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),o)}render(){const{icon:t,position:e}=this.buttonIcon;return i(o,{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"},e==="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"},e==="suffix"&&t&&i("i",{key:"69631e99a8b7f47dd1d00984f582ec6e7b5433e8",class:" leading-none "+t})))))}};w.style=g;const v=".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 y=v;const k=class{constructor(i){t(this,i);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=a({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:o,title:r,closeButton:a,content:s}=this.drawerClass({open:this.open,position:this.position,size:this.size,noHeader:this.noHeader});return i("div",{key:"44379905f1499a16d625ac4d1ff5e89fc6367d46",part:"base"},i("div",{key:"bc53e5322a61cd4af0691905c509d4c5fb765939",part:"backdrop",class:t(),onClick:()=>this.hide()}),i("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},i("div",{key:"5124de9d7fa8f3aa7267f0998f4c4f98f3ebbc4a",part:"header",class:o()},i("h2",{key:"8aa4b971efa9fe0fafa1cfb94f0b6b96f21f2f15",part:"title",class:r()},i("slot",{key:"949ae8f65d13e9e1c973c16a9f90205ac7e7042f",name:"header"},this.headerText)),i("button",{key:"a0c42761ee859e87dee5c267ea7245dde4fb8756",part:"close-button",class:a(),onClick:()=>this.hide(),"aria-label":"Close"},i("bcm-icon",{key:"2df273d63da93eda2280759a909906fe4ae0c493",name:"fa-solid fa-xmark"}))),i("div",{key:"b2532537d10f9aa0dcfa2fca8ac806577363e05b",part:"content",class:s()},i("slot",{key:"bfec5cff35a7bf7bf1d9801ba89559501e6f301f"})),i("div",{key:"4d44fdba62c74fd5c893c5296f998754228cf961",part:"footer"},i("slot",{key:"fd0a58127fd2f0ba0955cef629e55700142a8f32",name:"footer"}))))}get host(){return r(this)}static get watchers(){return{open:["handleOpenChange"]}}};k.style=y;const z=".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 C=z;const P=class{constructor(i){t(this,i);this.bcmDropdownChange=e(this,"bcmDropdownChange",1);this.isReady=false;this.dropdownItems=[];this.dropdownClass=a({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 t=this.host.shadowRoot.querySelector("bcm-button");if(t){this.buttonRef=t;this.isReady=true}}handleDropdownItemChange(t){var e;const{element:i,selected:o}=t===null||t===void 0?void 0:t.detail;(e=this.dropdownItems)===null||e===void 0?void 0:e.forEach((t=>{if(t!=i){t.selected=false}}));this.bcmDropdownChange.emit({element:i,selected:o})}render(){return i(o,{key:"6aaff12c84d38c32df5bc8dccb83421afb315eef"},i("bcm-button",{key:"5612cef7303a6b839531e125c895a4e7b8d32282",kind:"outline"},i("span",{key:"951418845cb1ec71fe6dc5bbbc33c49934447640",part:"text"},this.text)),this.isReady&&i("bcm-linked",{key:"d594359d6a9b7c673307c6a92e6d69cc47be3e1a",targetElement:this.buttonRef},i("div",{key:"9badba5b1e99af6a5d58b02e849cb0923e49dfd8",part:"dropdown-container",class:this.dropdownClass()},i("slot",{key:"c8191f215600170475d514bb6b4056047e6442d2",onSlotchange:this.handleSlotChange}))))}get host(){return r(this)}};P.style=C;const j=".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=j;const $=class{constructor(i){t(this,i);this.bcmDropDownItemChange=e(this,"bcmDropDownItemChange",1);this.selected=false;this.error=false;this.disabled=false;this.dropdownItemClass=a({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 t;return i("div",{key:"69beaac4c9225bc7803b4002f1543c18e76e36cc","aria-checked":this.selected,class:this.dropdownItemClass({selected:this.selected,error:this.error}),onClick:()=>this.handleClick()},i("slot",{key:"ca2712023285689a1774b5869d982e87d3add46a",name:"left-content"},this.icon&&i("bcm-icon",{key:"bef7483a47c823ed746c39ae37acc3a2360f0c59","icon-name":this.icon})),i("div",{key:"a9bdddf97d4a4e07e601599a4adb11354227dd0f",class:"flex flex-row text-pretty w-full"},i("slot",{key:"51c488350d2daabc32fc9693211a4e89d8cce16f"},this.text)),i("slot",{key:"9bf3f8b4affa41ea72f181a073aea8cd56f8a2df",name:"right-content"},(t=this.rightIcons)===null||t===void 0?void 0:t.map((t=>i("bcm-icon",{"icon-name":t})))))}get host(){return r(this)}};$.style=I;const S=(t,e)=>{var i;const o=(i=t.shadowRoot)===null||i===void 0?void 0:i.querySelector(`slot[name="${e}"]`);if(!o)return false;const r=o.assignedNodes();return r.length>0};const Y='.visible{visibility:visible}.collapse{visibility:collapse}.relative{position:relative}.block{display:block}.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{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(.928 .006 264.531);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(.707 .022 261.325);opacity:1}input::placeholder,textarea::placeholder{color:oklch(.707 .022 261.325);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:inline-block}.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}.flex{display:flex}.h-10{height:2.5rem}.h-6{height:1.5rem}.h-8{height:2rem}.h-full{height:100%}.w-6{width:1.5rem}.w-full{width:100%}.flex-1{flex:1 1 0%}.cursor-not-allowed{cursor:not-allowed}.appearance-none{appearance:none}.items-center{align-items:center}.justify-center{justify-content:center}.justify-between{justify-content:space-between}.gap-2{gap:.5rem}.text-ellipsis{text-overflow:ellipsis}.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}.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-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}.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}.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)}.\\[\\&\\:\\:-webkit-inner-spin-button\\]\\:appearance-none::-webkit-inner-spin-button{appearance:none}';const T=Y;const D=class{constructor(o){t(this,o);this.bcmInput=e(this,"bcmInput",1);this.bcmChange=e(this,"bcmChange",1);this.bcmFocus=e(this,"bcmFocus",1);this.bcmBlur=e(this,"bcmBlur",1);this.bcmKeyDown=e(this,"bcmKeyDown",1);this.bcmKeyUp=e(this,"bcmKeyUp",1);this.isFocused=false;this.isValid=true;this.internalStatus="default";this.isPasswordVisible=false;this.value="";this._id=n("input");this.size="medium";this.status="default";this.fullWidth=false;this.type="text";this.disabled=false;this.readonly=false;this.required=false;this.useNativeValidation=true;this.onInput=t=>{const e=t.target;this.value=e.value;this.bcmInput.emit(t);this.validateInput()};this.onChange=t=>{this.bcmChange.emit(t)};this.onFocus=t=>{this.isFocused=true;this.bcmFocus.emit(t)};this.onBlur=t=>{this.isFocused=false;this.bcmBlur.emit(t);this.validateInput()};this.onKeyDown=t=>{this.bcmKeyDown.emit(t)};this.onKeyUp=t=>{this.bcmKeyUp.emit(t)};this.styleClass=a({slots:{base:["bcm-input bcm-input__container","bg-[--bcm-ui-color-background-base-default]","text-[--bcm-ui-color-text-default]","border border-solid rounded","flex items-center justify-between","transition-colors duration-200","px-2"],inputClass:["input","w-full flex-1","border-0 outline-0 bg-transparent","appearance-none text-ellipsis","text-[--bcm-ui-color-text-default] placeholder:text-[--bcm-ui-color-text-placeholder] placeholder:font-normal","font-sans antialiased font-medium","px-1","[appearance:textfield][&::-webkit-outer-spin-button]:appearance-none [&::-webkit-inner-spin-button]:appearance-none"]},variants:{size:{small:{base:"",inputClass:"text-size-4 h-6"},medium:{base:"",inputClass:"text-size-5 h-8"},large:{base:"",inputClass:"text-size-6 h-10"}},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:"disabled cursor-not-allowed",false:""},focused:{true:{base:""}}},defaultVariants:{size:"medium",status:"default",fullWidth:false,disabled:false,focused:false}},{twMerge:false});this.togglePasswordVisibility=()=>{this.isPasswordVisible=!this.isPasswordVisible;this.inputRef.type=this.isPasswordVisible?"text":"password"};this.PasswordToggleButton=()=>{var t;if(this.type!=="password"||this.disabled||this.readonly||((t=this.value)===null||t===void 0?void 0:t.length)===0)return null;return i("button",{class:"appearance-none flex items-center w-6 h-full justify-center",onClick:this.togglePasswordVisibility,type:"button"},i("bcm-icon",{name:this.isPasswordVisible?"fa-eye-slash fa-regular":"fa-regular fa-eye",size:this.iconSize}))};this.iconSize={small:14,medium:16,large:18}[this.size]}handleValueChange(t){if(this.inputRef){this.inputRef.value=t}}watchStatus(t){this.internalStatus=t}watchErrorMessage(t){this.internalErrorMessage=t}async setFocus(){var t;(t=this.inputRef)===null||t===void 0?void 0:t.focus()}async setBlur(){var t;(t=this.inputRef)===null||t===void 0?void 0:t.blur()}async select(){var t;(t=this.inputRef)===null||t===void 0?void 0:t.select()}async setLocale(t,e){l(t,e);if(!this.isValid){this.validateInput()}}componentWillLoad(){l("en",d);this.internalStatus=this.status;this.internalErrorMessage=this.errorMessage}validateInput(){if(!this.inputRef)return;this.isValid=true;this.validationMessage="";const t=this.inputRef.value;if(this.required&&!t){this.isValid=false;this.validationMessage=c("required");this.internalStatus="error";this.internalErrorMessage=this.validationMessage;return}else if(this.minLength&&t.length<this.minLength){this.isValid=false;this.validationMessage=c("minlength",{min:this.minLength})}else if(this.maxLength&&t.length>this.maxLength){this.isValid=false;this.validationMessage=c("maxlength",{max:this.maxLength})}else if(this.pattern&&!new RegExp(this.pattern).test(t)){this.isValid=false;this.validationMessage=c("pattern")}else if(this.type==="email"&&t&&!/^[^\s@]+@[^\s@]+\.[^\s@]+$/.test(t)){this.isValid=false;this.validationMessage=c("email")}else if(this.type==="number"&&t){const e=parseFloat(t);if(this.min!==undefined&&e<this.min){this.isValid=false;this.validationMessage=c("min",{min:this.min})}else if(this.max!==undefined&&e>this.max){this.isValid=false;this.validationMessage=c("max",{max:this.max})}}this.internalStatus=this.isValid?"default":"error";this.internalErrorMessage=this.validationMessage}hasSlotContent(t){return S(this.el,t)}getDefaultIconForType(){return}render(){const t=this._id+"-input"||this.name;const{base:e,inputClass:o}=this.styleClass({size:this.size,status:this.internalStatus,fullWidth:this.fullWidth,disabled:this.disabled,focused:this.isFocused});return i("div",{key:"2b470d6a8d48e3867345a1baaf038f464167bd8c",class:"bcm-ui-element"},this.label&&i("label",{key:"65aa7f333c4cc7deb68dec12ac25fd953d03e5a9",class:s("input-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:t},i("slot",{key:"5507aaf837e03b059b5ee37270406519e3460d84",name:"label"},this.label),this.required&&i("span",{key:"ae92e270cf66574dd511403df99ce6f0172f7cf0"},"*")),i("div",{key:"c562649dbb4085830f2229af20b450de50af18ab",class:e()},(this.hasSlotContent("prefix")||this.prefixIcon||this.getDefaultIconForType())&&i("div",{key:"8e53088d990111325fad2c78c99818761e729e80",class:"flex items-center gap-2 px-2"},(this.prefixIcon||this.getDefaultIconForType())&&i("bcm-icon",{key:"0dd292f047e02ce75051b8a271ffcedb35036631",class:"prefix-icon","icon-name":this.prefixIcon||this.getDefaultIconForType(),size:this.iconSize}),i("slot",{key:"6dd835e17b66f29681232748a9cc8fd04ef8365e",name:"prefix"})),i("input",{key:"965fa5a5d2188a8608ae997973c792708fd986bf",ref:t=>this.inputRef=t,id:t,class:o(),type:this.type,name:this.name,disabled:this.disabled,readonly:this.readonly,required:this.required,placeholder:this.placeholder,autocomplete:this.autocomplete,minlength:this.minLength,maxlength:this.maxLength,min:this.min,max:this.max,step:this.step,pattern:this.pattern,"aria-invalid":this.status==="error","aria-required":this.required,"aria-labelledby":this.labelledby,"aria-describedby":this.describedby,value:this.value,onInput:this.onInput,onChange:this.onChange,onFocus:this.onFocus,onBlur:this.onBlur,onKeyDown:this.onKeyDown,onKeyUp:this.onKeyUp}),(this.hasSlotContent("suffix")||this.suffixIcon)&&i("div",{key:"f0f78deaa350963ff31b07c2076a405bb4560fc5",class:"flex items-center gap-2 px-2"},i("slot",{key:"6b6afb6088fa96b9c1daa97641e70bd9d1a8f044",name:"suffix"}),this.suffixIcon&&i("bcm-icon",{key:"9f33e74c6629341ba5cc447af1b4ba9237997138",class:"suffix-icon","icon-name":this.suffixIcon,size:this.iconSize})),this.PasswordToggleButton()),(this.captionText||this.internalErrorMessage||this.validationMessage)&&i("div",{key:"416b4a6c586ebd6e722a68181ca4dc1125fc5e7d",class:s("input-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 r(this)}static get watchers(){return{value:["handleValueChange"],status:["watchStatus"],errorMessage:["watchErrorMessage"]}}};D.style=T;const F='.absolute{position:absolute}.relative{position:relative}.block{display:block}.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))}.border{border-width:1px}.transition{transition-duration:.15s;transition-property:color,background-color,border-color,text-decoration-color,fill,stroke,opacity,box-shadow,transform,filter,backdrop-filter;transition-timing-function:cubic-bezier(.4,0,.2,1)}bcm-linked{display:block;position:relative}bcm-linked[append-to-body]{display:none}.floating-content{min-width:-moz-max-content;min-width:max-content;transition:opacity .2s ease,visibility .2s ease,transform .2s ease;will-change:transform,opacity}.floating-visible{animation:fadeInScale .2s ease-out}.floating-hidden{display:none!important;pointer-events:none}.floating-wrapper{position:relative;z-index:1}@keyframes fadeInScale{0%{opacity:0;transform:scale(.95) translateY(-5px)}to{opacity:1;transform:scale(1) translateY(0)}}.floating-arrow{z-index:-1}.floating-arrow,.floating-arrow:before{height:10px;position:absolute;width:10px}.floating-arrow:before{background:#fff;border:1px solid #e2e8f0;content:"";transform:rotate(45deg)}.arrow-top{bottom:-5px}.arrow-bottom,.arrow-top{left:50%;transform:translateX(-50%)}.arrow-bottom{top:-5px}.arrow-left{right:-5px}.arrow-left,.arrow-right{top:50%;transform:translateY(-50%)}.arrow-right{left:-5px}.arrow-top:before{border-bottom:0;border-right:0}.arrow-bottom:before{border-left:0;border-top:0}.arrow-left:before{border-right:0;border-top:0}.arrow-right:before{border-bottom:0;border-left:0}@media (max-width:768px){.floating-content{max-height:calc(100vh - 32px);max-width:calc(100vw - 32px)}}.visible{visibility:visible}.static{position:static}.fixed{position:fixed}.hidden{display:none}.resize{resize:both}.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)}.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 O=F;const X=class{constructor(i){t(this,i);this.bcmShow=e(this,"bcmShow",7);this.bcmHide=e(this,"bcmHide",7);this.bcmShown=e(this,"bcmShown",7);this.bcmHidden=e(this,"bcmHidden",7);this.trigger="click";this.placement="bottom-start";this.showDelay=0;this.hideDelay=0;this.offset=8;this.arrow=false;this.disabled=false;this.zIndex=1e3;this.appendToBody=false;this.destroyOnHide=false;this.isVisible=false;this.isReady=false;this.handleMouseEnter=()=>{this.clearTimeouts();if(this.showDelay>0){this.showTimeout=setTimeout((()=>this.show()),this.showDelay)}else{this.show()}};this.handleMouseLeave=()=>{this.clearTimeouts();if(this.hideDelay>0){this.hideTimeout=setTimeout((()=>this.hide()),this.hideDelay)}else{this.hide()}};this.handleFloatingMouseEnter=()=>{this.clearTimeouts()};this.handleFloatingMouseLeave=()=>{this.clearTimeouts();if(this.hideDelay>0){this.hideTimeout=setTimeout((()=>this.hide()),this.hideDelay)}else{this.hide()}};this.handleClick=t=>{t.stopPropagation();this.toggle()};this.handleFocus=()=>{this.show()};this.handleBlur=()=>{this.hide()}}setupTarget(){this.disconnectTarget();this.connectTarget()}onVisibilityChange(t){if(t){this.updatePosition();this.bcmShown.emit()}else{this.bcmHidden.emit()}}async componentDidLoad(){await new Promise((t=>requestAnimationFrame(t)));this.floatingEl=this.host.querySelector(".floating-content");if(this.floatingEl){this.isReady=true;this.connectTarget();this.setupFloatingObserver();console.log("✅ bcm-linked initialized successfully")}else{console.error("❌ Could not find .floating-content element")}}disconnectedCallback(){var t,e;this.disconnectTarget();this.clearTimeouts();(t=this.cleanup)===null||t===void 0?void 0:t.call(this);(e=this.resizeObserver)===null||e===void 0?void 0:e.disconnect();if(this.appendToBody&&this.floatingEl&&this.originalParent){this.originalParent.appendChild(this.floatingEl)}}connectTarget(){if(!this.isReady)return;this.targetEl=this.targetElement||(this.targetId?document.getElementById(this.targetId):null)||this.host.previousElementSibling||this.host.parentElement;if(!this.targetEl){console.warn("bcm-linked: No target element found");return}this.setupEventListeners();if(this.targetEl&&this.floatingEl){this.cleanup=h(this.targetEl,this.floatingEl,(()=>{if(this.isVisible){this.updatePosition()}}))}this.resizeObserver=new ResizeObserver((()=>{if(this.isVisible){this.updatePosition()}}));this.resizeObserver.observe(this.floatingEl)}disconnectTarget(){var t,e;if(this.targetEl){this.removeEventListeners()}(t=this.cleanup)===null||t===void 0?void 0:t.call(this);(e=this.resizeObserver)===null||e===void 0?void 0:e.disconnect()}setupEventListeners(){var t,e;if(!this.targetEl||this.disabled)return;switch(this.trigger){case"hover":this.targetEl.addEventListener("mouseenter",this.handleMouseEnter);this.targetEl.addEventListener("mouseleave",this.handleMouseLeave);(t=this.floatingEl)===null||t===void 0?void 0:t.addEventListener("mouseenter",this.handleFloatingMouseEnter);(e=this.floatingEl)===null||e===void 0?void 0:e.addEventListener("mouseleave",this.handleFloatingMouseLeave);break;case"click":this.targetEl.addEventListener("click",this.handleClick);this.setupClickOutside();break;case"focus":this.targetEl.addEventListener("focus",this.handleFocus);this.targetEl.addEventListener("blur",this.handleBlur);break}}removeEventListeners(){var t,e;if(!this.targetEl)return;this.targetEl.removeEventListener("mouseenter",this.handleMouseEnter);this.targetEl.removeEventListener("mouseleave",this.handleMouseLeave);this.targetEl.removeEventListener("click",this.handleClick);this.targetEl.removeEventListener("focus",this.handleFocus);this.targetEl.removeEventListener("blur",this.handleBlur);(t=this.floatingEl)===null||t===void 0?void 0:t.removeEventListener("mouseenter",this.handleFloatingMouseEnter);(e=this.floatingEl)===null||e===void 0?void 0:e.removeEventListener("mouseleave",this.handleFloatingMouseLeave);this.removeClickOutside()}setupClickOutside(){this.clickOutsideHandler=t=>{var e,i;const o=t.target;if(!((e=this.floatingEl)===null||e===void 0?void 0:e.contains(o))&&!((i=this.targetEl)===null||i===void 0?void 0:i.contains(o))&&!this.host.contains(o)){this.hide()}};document.addEventListener("click",this.clickOutsideHandler,true)}removeClickOutside(){if(this.clickOutsideHandler){document.removeEventListener("click",this.clickOutsideHandler,true);this.clickOutsideHandler=undefined}}clearTimeouts(){if(this.showTimeout){clearTimeout(this.showTimeout);this.showTimeout=undefined}if(this.hideTimeout){clearTimeout(this.hideTimeout);this.hideTimeout=undefined}}async updatePosition(){if(!this.targetEl||!this.floatingEl||!this.isVisible)return;const t=[b(this.offset),u({fallbackPlacements:["top","bottom","left","right","top-start","top-end","bottom-start","bottom-end","left-start","left-end","right-start","right-end"]}),f({padding:8})];const{x:e,y:i,placement:o}=await m(this.targetEl,this.floatingEl,{placement:this.placement,middleware:t,strategy:"fixed"});Object.assign(this.floatingEl.style,{left:`${e}px`,top:`${i}px`,zIndex:this.zIndex.toString()});if(this.arrow){this.updateArrow(o)}}updateArrow(t){var e;const i=(e=this.floatingEl)===null||e===void 0?void 0:e.querySelector(".floating-arrow");if(!i)return;i.className="floating-arrow";const o=t.split("-")[0];i.classList.add(`arrow-${o}`)}async show(){if(this.disabled||this.isVisible)return;this.bcmShow.emit();if(this.appendToBody&&this.floatingEl){this.originalParent=this.floatingEl.parentNode;this.originalNextSibling=this.floatingEl.nextSibling;document.body.appendChild(this.floatingEl)}this.isVisible=true;await new Promise((t=>requestAnimationFrame(t)));await this.updatePosition()}async hide(){if(!this.isVisible)return;this.bcmHide.emit();this.isVisible=false;if(this.appendToBody&&this.floatingEl&&this.originalParent){if(this.originalNextSibling){this.originalParent.insertBefore(this.floatingEl,this.originalNextSibling)}else{this.originalParent.appendChild(this.floatingEl)}this.originalParent=undefined;this.originalNextSibling=undefined}if(this.destroyOnHide&&this.floatingEl&&this.floatingEl.parentNode){this.floatingEl.parentNode.removeChild(this.floatingEl)}}async toggle(){if(this.isVisible){await this.hide()}else{await this.show()}}async updatePositioning(){await this.updatePosition()}setupFloatingObserver(){if(!this.floatingEl)return;this.resizeObserver=new ResizeObserver((()=>{if(this.isVisible){this.updatePosition()}}));this.resizeObserver.observe(this.floatingEl)}render(){const t={"floating-content":true,"floating-visible":this.isVisible,"floating-hidden":!this.isVisible,"floating-with-arrow":this.arrow,"floating-destroy-on-hide":this.destroyOnHide};return i(o,{key:"f5835cc1b6044476e66402d23a3becf18d3f2049"},i("div",{key:"2c7f92bbe85bc938a767734ef4b27702247fb390",class:t,style:{position:"fixed",top:"0px",left:"0px",zIndex:this.zIndex.toString(),display:this.isVisible?"block":"none",visibility:this.isVisible?"visible":"hidden",opacity:this.isVisible?"1":"0",pointerEvents:this.isVisible?"auto":"none"}},this.arrow&&i("div",{key:"f6eedac02b29b3ca00a9a84eea940ac89089f30c",class:"floating-arrow"}),i("div",{key:"7cb19f085de1d77a41fd9897be90999e78a0a54d",class:"floating-wrapper"},i("slot",{key:"a4b4289642850e3c2f7f27771b3d28bc41c8248a"}))),i("div",{key:"61cd7af9a4a47c87c308e1e67f96efb987c97312",style:{display:"none"}},i("slot",{key:"7160df275f5c7c66733158f95266598d0d207a17",name:"fallback"})))}get host(){return r(this)}static get watchers(){return{targetId:["setupTarget"],targetElement:["setupTarget"],isVisible:["onVisibilityChange"]}}};X.style=O;const M=":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 A=M;const E={ctrl:"⌘",alt:"⌥",shift:"⇧",del:"⌫",delete:"⌫",backspace:"⌦",enter:"⏎",return:"⏎"};const _=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=>E[t]||t)).join("")}else{return t}}render(){const{size:t,hotkey:e}=this;return i("div",{key:"007588d1d20941ead644a3d1fd72410cb6793ff5",class:s("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(e))}};_.style=A;const B={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 V=".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 L=V;const W=class{constructor(e){t(this,e);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=(t,e)=>{const i=this.variantClassMap[t];if(typeof i==="string"){return i}return i[e]};this.getOverflowClass=t=>t?"truncate":""}render(){var t;const e=B[this.variant];const o=this.getTextClass(this.variant,this.size);const r=this.getOverflowClass((t=this.overflow)!==null&&t!==void 0?t:false);return i(e,{key:"152d737752eea962ac3c5086011da69578ef0920",class:s("bcm-text appearance-none m-0 p-0",o,r),part:"text"},i("slot",{key:"e8c8c89a5925936a2e22a75265b7f42317eab983"},this.text))}};W.style=L;export{w as bcm_button,k as bcm_drawer,P as bcm_dropdown,$ as bcm_dropdown_item,D as bcm_input,X as bcm_linked,_ as bcm_shortcut,W as bcm_text};
|
|
2
|
+
//# sourceMappingURL=p-fdcb9dbd.entry.js.map
|