le-kit 0.1.13 → 0.1.15
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/cjs/{index-o1DRKw1g.js → index-C3iQZ-Ja.js} +7 -7
- package/dist/cjs/index-C3iQZ-Ja.js.map +1 -0
- package/dist/cjs/index.cjs.js +4 -3
- package/dist/cjs/index.cjs.js.map +1 -1
- package/dist/cjs/le-box.cjs.entry.js +2 -2
- package/dist/cjs/le-button.le-checkbox.le-component.le-popover.le-popup.le-slot.le-string-input.entry.cjs.js.map +1 -0
- package/dist/cjs/{le-button_6.cjs.entry.js → le-button_7.cjs.entry.js} +279 -33
- package/dist/cjs/le-card.cjs.entry.js +2 -2
- package/dist/cjs/le-combobox.cjs.entry.js +237 -0
- package/dist/cjs/le-combobox.entry.cjs.js.map +1 -0
- package/dist/cjs/le-dropdown-base.cjs.entry.js +348 -0
- package/dist/cjs/le-dropdown-base.entry.cjs.js.map +1 -0
- package/dist/cjs/le-kit.cjs.js +2 -2
- package/dist/cjs/le-multiselect.cjs.entry.js +306 -0
- package/dist/cjs/le-multiselect.entry.cjs.js.map +1 -0
- package/dist/cjs/le-number-input.cjs.entry.js +3 -3
- package/dist/cjs/le-round-progress.cjs.entry.js +2 -2
- package/dist/cjs/le-segmented-control.cjs.entry.js +245 -0
- package/dist/cjs/le-segmented-control.entry.cjs.js.map +1 -0
- package/dist/cjs/le-select.cjs.entry.js +188 -0
- package/dist/cjs/le-select.entry.cjs.js.map +1 -0
- package/dist/cjs/le-stack.cjs.entry.js +3 -3
- package/dist/cjs/le-tab-bar.cjs.entry.js +242 -0
- package/dist/cjs/le-tab-bar.entry.cjs.js.map +1 -0
- package/dist/cjs/le-tab-panel.cjs.entry.js +100 -0
- package/dist/cjs/le-tab-panel.entry.cjs.js.map +1 -0
- package/dist/cjs/le-tab.cjs.entry.js +133 -0
- package/dist/cjs/le-tab.entry.cjs.js.map +1 -0
- package/dist/cjs/le-tabs.cjs.entry.js +307 -0
- package/dist/cjs/le-tabs.entry.cjs.js.map +1 -0
- package/dist/cjs/le-tag.cjs.entry.js +68 -0
- package/dist/cjs/le-tag.entry.cjs.js.map +1 -0
- package/dist/cjs/le-text.cjs.entry.js +2 -2
- package/dist/cjs/le-turntable.cjs.entry.js +2 -2
- package/dist/cjs/loader.cjs.js +2 -2
- package/dist/cjs/{utils-DqhadIxH.js → utils-DjPcLPN9.js} +3 -3
- package/dist/cjs/{utils-DqhadIxH.js.map → utils-DjPcLPN9.js.map} +1 -1
- package/dist/collection/collection-manifest.json +10 -0
- package/dist/collection/components/le-button/{le-button.default.css → le-button.css} +57 -30
- package/dist/collection/components/le-button/le-button.js +105 -15
- package/dist/collection/components/le-button/le-button.js.map +1 -1
- package/dist/collection/components/le-combobox/le-combobox.css +144 -0
- package/dist/collection/components/le-combobox/le-combobox.js +659 -0
- package/dist/collection/components/le-combobox/le-combobox.js.map +1 -0
- package/dist/collection/components/le-component/le-component.js +7 -6
- package/dist/collection/components/le-component/le-component.js.map +1 -1
- package/dist/collection/components/le-dropdown-base/le-dropdown-base.css +163 -0
- package/dist/collection/components/le-dropdown-base/le-dropdown-base.js +761 -0
- package/dist/collection/components/le-dropdown-base/le-dropdown-base.js.map +1 -0
- package/dist/collection/components/le-multiselect/le-multiselect.css +163 -0
- package/dist/collection/components/le-multiselect/le-multiselect.js +734 -0
- package/dist/collection/components/le-multiselect/le-multiselect.js.map +1 -0
- package/dist/collection/components/le-number-input/le-number-input.js +1 -1
- package/dist/collection/components/le-popover/le-popover.css +10 -0
- package/dist/collection/components/le-popover/le-popover.js +61 -10
- package/dist/collection/components/le-popover/le-popover.js.map +1 -1
- package/dist/collection/components/le-popup/le-popup.api.js +2 -1
- package/dist/collection/components/le-popup/le-popup.api.js.map +1 -1
- package/dist/collection/components/le-popup/le-popup.js +42 -12
- package/dist/collection/components/le-popup/le-popup.js.map +1 -1
- package/dist/collection/components/le-round-progress/le-round-progress.js +1 -1
- package/dist/collection/components/le-segmented-control/le-segmented-control.css +78 -0
- package/dist/collection/components/le-segmented-control/le-segmented-control.js +445 -0
- package/dist/collection/components/le-segmented-control/le-segmented-control.js.map +1 -0
- package/dist/collection/components/le-select/le-select.css +121 -0
- package/dist/collection/components/le-select/le-select.js +578 -0
- package/dist/collection/components/le-select/le-select.js.map +1 -0
- package/dist/collection/components/le-slot/le-slot.js +4 -6
- package/dist/collection/components/le-slot/le-slot.js.map +1 -1
- package/dist/collection/components/le-stack/le-stack.js +1 -1
- package/dist/collection/components/le-string-input/le-string-input.js +59 -5
- package/dist/collection/components/le-string-input/le-string-input.js.map +1 -1
- package/dist/collection/components/le-tab/le-tab.css +289 -0
- package/dist/collection/components/le-tab/le-tab.js +565 -0
- package/dist/collection/components/le-tab/le-tab.js.map +1 -0
- package/dist/collection/components/le-tab-bar/le-tab-bar.css +89 -0
- package/dist/collection/components/le-tab-bar/le-tab-bar.js +467 -0
- package/dist/collection/components/le-tab-bar/le-tab-bar.js.map +1 -0
- package/dist/collection/components/le-tab-panel/le-tab-panel.css +30 -0
- package/dist/collection/components/le-tab-panel/le-tab-panel.js +302 -0
- package/dist/collection/components/le-tab-panel/le-tab-panel.js.map +1 -0
- package/dist/collection/components/le-tabs/le-tabs.css +146 -0
- package/dist/collection/components/le-tabs/le-tabs.js +588 -0
- package/dist/collection/components/le-tabs/le-tabs.js.map +1 -0
- package/dist/collection/components/le-tag/le-tag.css +139 -0
- package/dist/collection/components/le-tag/le-tag.js +266 -0
- package/dist/collection/components/le-tag/le-tag.js.map +1 -0
- package/dist/collection/components/le-turntable/le-turntable.js +1 -1
- package/dist/collection/dist/components/assets/.gitkeep +1 -0
- package/{custom-elements.json → dist/collection/dist/components/assets/custom-elements.json} +5274 -1409
- package/dist/{core/collection → collection/dist/components}/themes/base.css +44 -0
- package/dist/{core/collection → collection/dist/components}/themes/dark.css +4 -1
- package/dist/collection/{themes → dist/components/themes}/default.css +4 -1
- package/dist/collection/dist/{collection → components}/themes/gradient.css +4 -1
- package/dist/{core/collection → collection/dist/components}/themes/index.css +2 -0
- package/dist/collection/{themes → dist/components/themes}/minimal.css +4 -1
- package/dist/{core/collection → collection/dist/components}/themes/warm.css +4 -1
- package/dist/collection/global/app.js +4 -4
- package/dist/collection/global/app.js.map +1 -1
- package/dist/collection/types/options.js.map +1 -1
- package/dist/components/assets/.gitkeep +1 -0
- package/dist/{collection → components}/assets/custom-elements.json +5202 -1337
- package/dist/components/index.js +1 -103
- package/dist/components/index.js.map +1 -1
- package/dist/components/le-box.js +11 -6
- package/dist/components/le-box.js.map +1 -1
- package/dist/components/le-button.js +1 -1
- package/dist/components/le-button2.js +378 -45
- package/dist/components/le-button2.js.map +1 -1
- package/dist/components/le-card.js +11 -6
- package/dist/components/le-card.js.map +1 -1
- package/dist/components/le-checkbox.js +1 -1
- package/dist/components/le-combobox.d.ts +11 -0
- package/dist/components/le-combobox.js +321 -0
- package/dist/components/le-combobox.js.map +1 -0
- package/dist/components/le-component.js +1 -1
- package/dist/components/le-dropdown-base.d.ts +11 -0
- package/dist/components/le-dropdown-base.js +9 -0
- package/dist/components/le-dropdown-base.js.map +1 -0
- package/dist/components/le-dropdown-base2.js +393 -0
- package/dist/components/le-dropdown-base2.js.map +1 -0
- package/dist/components/le-multiselect.d.ts +11 -0
- package/dist/components/le-multiselect.js +400 -0
- package/dist/components/le-multiselect.js.map +1 -0
- package/dist/components/le-number-input.js +12 -7
- package/dist/components/le-number-input.js.map +1 -1
- package/dist/components/le-popover2.js +24 -11
- package/dist/components/le-popover2.js.map +1 -1
- package/dist/{core/collection/components/le-popup → components}/le-popup.api.js +9 -4
- package/dist/components/le-popup.api.js.map +1 -0
- package/dist/components/le-popup.js +1 -271
- package/dist/components/le-popup.js.map +1 -1
- package/dist/components/le-round-progress.js +1 -1
- package/dist/components/le-segmented-control.d.ts +11 -0
- package/dist/components/le-segmented-control.js +320 -0
- package/dist/components/le-segmented-control.js.map +1 -0
- package/dist/components/le-select.d.ts +11 -0
- package/dist/components/le-select.js +271 -0
- package/dist/components/le-select.js.map +1 -0
- package/dist/components/le-slot.js +1 -1
- package/dist/components/le-stack.js +12 -7
- package/dist/components/le-stack.js.map +1 -1
- package/dist/components/le-string-input.js +1 -1
- package/dist/components/le-tab-bar.d.ts +11 -0
- package/dist/components/le-tab-bar.js +319 -0
- package/dist/components/le-tab-bar.js.map +1 -0
- package/dist/components/le-tab-panel.d.ts +11 -0
- package/dist/components/le-tab-panel.js +171 -0
- package/dist/components/le-tab-panel.js.map +1 -0
- package/dist/components/le-tab.d.ts +11 -0
- package/dist/components/le-tab.js +9 -0
- package/dist/components/le-tab.js.map +1 -0
- package/dist/components/le-tab2.js +206 -0
- package/dist/components/le-tab2.js.map +1 -0
- package/dist/components/le-tabs.d.ts +11 -0
- package/dist/components/le-tabs.js +386 -0
- package/dist/components/le-tabs.js.map +1 -0
- package/dist/components/le-tag.d.ts +11 -0
- package/dist/components/le-tag.js +9 -0
- package/dist/components/le-tag.js.map +1 -0
- package/dist/components/le-tag2.js +130 -0
- package/dist/components/le-tag2.js.map +1 -0
- package/dist/components/le-text.js +11 -6
- package/dist/components/le-text.js.map +1 -1
- package/dist/components/le-turntable.js +1 -1
- package/dist/{le-kit/dist/collection → components}/themes/base.css +44 -0
- package/dist/{collection → components}/themes/dark.css +4 -1
- package/dist/{core/collection → components}/themes/default.css +4 -1
- package/dist/{core/collection → components}/themes/gradient.css +4 -1
- package/dist/{le-kit/dist/collection → components}/themes/index.css +2 -0
- package/dist/{collection/dist/collection → components}/themes/minimal.css +4 -1
- package/dist/{le-kit/dist/collection → components}/themes/warm.css +4 -1
- package/dist/components/utils.js +4 -4
- package/dist/components/utils.js.map +1 -1
- package/dist/docs.json +6674 -1371
- package/dist/esm/{index-CwNQ1GTa.js → index-DzgCnDLJ.js} +8 -8
- package/dist/esm/index-DzgCnDLJ.js.map +1 -0
- package/dist/esm/index.js +4 -3
- package/dist/esm/index.js.map +1 -1
- package/dist/esm/le-box.entry.js +2 -2
- package/dist/esm/le-button.le-checkbox.le-component.le-popover.le-popup.le-slot.le-string-input.entry.js.map +1 -0
- package/dist/esm/{le-button_6.entry.js → le-button_7.entry.js} +279 -34
- package/dist/esm/le-card.entry.js +2 -2
- package/dist/esm/le-combobox.entry.js +235 -0
- package/dist/esm/le-combobox.entry.js.map +1 -0
- package/dist/esm/le-dropdown-base.entry.js +346 -0
- package/dist/esm/le-dropdown-base.entry.js.map +1 -0
- package/dist/esm/le-kit.js +3 -3
- package/dist/esm/le-multiselect.entry.js +304 -0
- package/dist/esm/le-multiselect.entry.js.map +1 -0
- package/dist/esm/le-number-input.entry.js +3 -3
- package/dist/esm/le-round-progress.entry.js +2 -2
- package/dist/esm/le-segmented-control.entry.js +243 -0
- package/dist/esm/le-segmented-control.entry.js.map +1 -0
- package/dist/esm/le-select.entry.js +186 -0
- package/dist/esm/le-select.entry.js.map +1 -0
- package/dist/esm/le-stack.entry.js +3 -3
- package/dist/esm/le-tab-bar.entry.js +240 -0
- package/dist/esm/le-tab-bar.entry.js.map +1 -0
- package/dist/esm/le-tab-panel.entry.js +98 -0
- package/dist/esm/le-tab-panel.entry.js.map +1 -0
- package/dist/esm/le-tab.entry.js +131 -0
- package/dist/esm/le-tab.entry.js.map +1 -0
- package/dist/esm/le-tabs.entry.js +305 -0
- package/dist/esm/le-tabs.entry.js.map +1 -0
- package/dist/esm/le-tag.entry.js +66 -0
- package/dist/esm/le-tag.entry.js.map +1 -0
- package/dist/esm/le-text.entry.js +2 -2
- package/dist/esm/le-turntable.entry.js +2 -2
- package/dist/esm/loader.js +3 -3
- package/dist/esm/{utils-Cf7fMI0j.js → utils-Dp5xFMCl.js} +3 -3
- package/dist/esm/{utils-Cf7fMI0j.js.map → utils-Dp5xFMCl.js.map} +1 -1
- package/dist/le-kit/dist/components/assets/.gitkeep +1 -0
- package/dist/{core/collection → le-kit/dist/components}/assets/custom-elements.json +5202 -1337
- package/dist/{collection/dist/collection → le-kit/dist/components}/themes/base.css +44 -0
- package/dist/{collection/dist/collection → le-kit/dist/components}/themes/dark.css +4 -1
- package/dist/le-kit/dist/{collection → components}/themes/default.css +4 -1
- package/dist/le-kit/dist/{collection → components}/themes/gradient.css +4 -1
- package/dist/{collection/dist/collection → le-kit/dist/components}/themes/index.css +2 -0
- package/dist/{core/collection → le-kit/dist/components}/themes/minimal.css +4 -1
- package/dist/{collection/dist/collection → le-kit/dist/components}/themes/warm.css +4 -1
- package/dist/le-kit/index.esm.js +1 -1
- package/dist/le-kit/index.esm.js.map +1 -1
- package/dist/le-kit/le-button.le-checkbox.le-component.le-popover.le-popup.le-slot.le-string-input.entry.esm.js.map +1 -0
- package/dist/le-kit/le-combobox.entry.esm.js.map +1 -0
- package/dist/le-kit/le-dropdown-base.entry.esm.js.map +1 -0
- package/dist/le-kit/le-kit.css +1 -1
- package/dist/le-kit/le-kit.esm.js +1 -1
- package/dist/le-kit/le-multiselect.entry.esm.js.map +1 -0
- package/dist/le-kit/le-segmented-control.entry.esm.js.map +1 -0
- package/dist/le-kit/le-select.entry.esm.js.map +1 -0
- package/dist/le-kit/le-tab-bar.entry.esm.js.map +1 -0
- package/dist/le-kit/le-tab-panel.entry.esm.js.map +1 -0
- package/dist/le-kit/le-tab.entry.esm.js.map +1 -0
- package/dist/le-kit/le-tabs.entry.esm.js.map +1 -0
- package/dist/le-kit/le-tag.entry.esm.js.map +1 -0
- package/dist/{core/le-kit/p-df552906.entry.js → le-kit/p-0bd7803f.entry.js} +2 -2
- package/dist/le-kit/p-0bd7803f.entry.js.map +1 -0
- package/dist/le-kit/p-1f55a4a2.entry.js +2 -0
- package/dist/le-kit/p-1f55a4a2.entry.js.map +1 -0
- package/dist/le-kit/{p-79ec6f7c.entry.js → p-2c37f174.entry.js} +2 -2
- package/dist/le-kit/p-2c37f174.entry.js.map +1 -0
- package/dist/{core/le-kit/p-5ef81068.entry.js → le-kit/p-33612923.entry.js} +2 -2
- package/dist/le-kit/p-33612923.entry.js.map +1 -0
- package/dist/le-kit/{p-b8122ad6.entry.js → p-3a52c4de.entry.js} +2 -2
- package/dist/le-kit/p-3a52c4de.entry.js.map +1 -0
- package/dist/le-kit/p-4130c60b.entry.js +2 -0
- package/dist/le-kit/p-4130c60b.entry.js.map +1 -0
- package/dist/le-kit/{p-64374730.entry.js → p-432e8231.entry.js} +2 -2
- package/dist/le-kit/p-432e8231.entry.js.map +1 -0
- package/dist/le-kit/p-548d130b.entry.js +2 -0
- package/dist/le-kit/p-548d130b.entry.js.map +1 -0
- package/dist/le-kit/p-6ecdad85.entry.js +2 -0
- package/dist/le-kit/p-6ecdad85.entry.js.map +1 -0
- package/dist/le-kit/p-6ee06c44.entry.js +2 -0
- package/dist/le-kit/p-6ee06c44.entry.js.map +1 -0
- package/dist/le-kit/p-71c78784.entry.js +2 -0
- package/dist/le-kit/p-71c78784.entry.js.map +1 -0
- package/dist/le-kit/p-7b180d58.entry.js +2 -0
- package/dist/le-kit/p-7b180d58.entry.js.map +1 -0
- package/dist/le-kit/p-91993261.entry.js +2 -0
- package/dist/le-kit/p-91993261.entry.js.map +1 -0
- package/dist/le-kit/p-DaA5gINj.js +2 -0
- package/dist/le-kit/{p-y3FECAx9.js.map → p-DaA5gINj.js.map} +1 -1
- package/dist/le-kit/p-DzgCnDLJ.js +3 -0
- package/dist/le-kit/p-DzgCnDLJ.js.map +1 -0
- package/dist/le-kit/p-a5d31d40.entry.js +2 -0
- package/dist/le-kit/p-a5d31d40.entry.js.map +1 -0
- package/dist/le-kit/{p-ad398acd.entry.js → p-b66fd9e1.entry.js} +2 -2
- package/dist/le-kit/p-b66fd9e1.entry.js.map +1 -0
- package/dist/le-kit/{p-f9008505.entry.js → p-beb87e61.entry.js} +2 -2
- package/dist/le-kit/p-beb87e61.entry.js.map +1 -0
- package/dist/le-kit/p-cc0797b0.entry.js +2 -0
- package/dist/le-kit/p-cc0797b0.entry.js.map +1 -0
- package/dist/le-kit/p-d504a369.entry.js +2 -0
- package/dist/le-kit/p-d504a369.entry.js.map +1 -0
- package/dist/themes/base.css +44 -0
- package/dist/themes/dark.css +4 -1
- package/dist/themes/default.css +4 -1
- package/dist/themes/gradient.css +4 -1
- package/dist/themes/index.css +2 -0
- package/dist/themes/minimal.css +4 -1
- package/dist/themes/warm.css +4 -1
- package/dist/types/components/le-button/le-button.d.ts +19 -4
- package/dist/types/components/le-combobox/le-combobox.d.ts +128 -0
- package/dist/types/components/le-dropdown-base/le-dropdown-base.d.ts +118 -0
- package/dist/types/components/le-multiselect/le-multiselect.d.ts +143 -0
- package/dist/types/components/le-popover/le-popover.d.ts +13 -2
- package/dist/types/components/le-popup/le-popup.d.ts +5 -0
- package/dist/types/components/le-segmented-control/le-segmented-control.d.ts +82 -0
- package/dist/types/components/le-select/le-select.d.ts +125 -0
- package/dist/types/components/le-string-input/le-string-input.d.ts +8 -0
- package/dist/types/components/le-tab/le-tab.d.ts +116 -0
- package/dist/types/components/le-tab-bar/le-tab-bar.d.ts +88 -0
- package/dist/types/components/le-tab-panel/le-tab-panel.d.ts +75 -0
- package/dist/types/components/le-tabs/le-tabs.d.ts +108 -0
- package/dist/types/components/le-tag/le-tag.d.ts +78 -0
- package/dist/types/components.d.ts +2310 -40
- package/dist/types/global/app.d.ts +4 -4
- package/dist/types/types/options.d.ts +9 -0
- package/package.json +5 -21
- package/readme.md +2 -2
- package/dist/cjs/index-o1DRKw1g.js.map +0 -1
- package/dist/cjs/le-button.le-checkbox.le-component.le-popover.le-slot.le-string-input.entry.cjs.js.map +0 -1
- package/dist/cjs/le-popup.cjs.entry.js +0 -212
- package/dist/cjs/le-popup.entry.cjs.js.map +0 -1
- package/dist/collection/dist/collection/themes/default.css +0 -108
- package/dist/collection/themes/base.css +0 -89
- package/dist/collection/themes/gradient.css +0 -100
- package/dist/collection/themes/index.css +0 -413
- package/dist/collection/themes/warm.css +0 -100
- package/dist/core/cjs/index-BsRb_UTe.js +0 -1835
- package/dist/core/cjs/index-BsRb_UTe.js.map +0 -1
- package/dist/core/cjs/index.cjs.js +0 -119
- package/dist/core/cjs/index.cjs.js.map +0 -1
- package/dist/core/cjs/le-box.cjs.entry.js +0 -184
- package/dist/core/cjs/le-box.entry.cjs.js.map +0 -1
- package/dist/core/cjs/le-button.cjs.entry.js +0 -92
- package/dist/core/cjs/le-button.entry.cjs.js.map +0 -1
- package/dist/core/cjs/le-card.cjs.entry.js +0 -29
- package/dist/core/cjs/le-card.entry.cjs.js.map +0 -1
- package/dist/core/cjs/le-checkbox.cjs.entry.js +0 -61
- package/dist/core/cjs/le-checkbox.entry.cjs.js.map +0 -1
- package/dist/core/cjs/le-kit.cjs.js +0 -25
- package/dist/core/cjs/le-kit.cjs.js.map +0 -1
- package/dist/core/cjs/le-number-input.cjs.entry.js +0 -202
- package/dist/core/cjs/le-number-input.entry.cjs.js.map +0 -1
- package/dist/core/cjs/le-popover.cjs.entry.js +0 -348
- package/dist/core/cjs/le-popover.entry.cjs.js.map +0 -1
- package/dist/core/cjs/le-popup.cjs.entry.js +0 -212
- package/dist/core/cjs/le-popup.entry.cjs.js.map +0 -1
- package/dist/core/cjs/le-round-progress.cjs.entry.js +0 -106
- package/dist/core/cjs/le-round-progress.entry.cjs.js.map +0 -1
- package/dist/core/cjs/le-stack.cjs.entry.js +0 -135
- package/dist/core/cjs/le-stack.entry.cjs.js.map +0 -1
- package/dist/core/cjs/le-string-input.cjs.entry.js +0 -95
- package/dist/core/cjs/le-string-input.entry.cjs.js.map +0 -1
- package/dist/core/cjs/le-text.cjs.entry.js +0 -335
- package/dist/core/cjs/le-text.entry.cjs.js.map +0 -1
- package/dist/core/cjs/le-turntable.cjs.entry.js +0 -139
- package/dist/core/cjs/le-turntable.entry.cjs.js.map +0 -1
- package/dist/core/cjs/loader.cjs.js +0 -13
- package/dist/core/cjs/loader.cjs.js.map +0 -1
- package/dist/core/cjs/utils-nsP8_w8_.js +0 -152
- package/dist/core/cjs/utils-nsP8_w8_.js.map +0 -1
- package/dist/core/collection/collection-manifest.json +0 -24
- package/dist/core/collection/components/le-box/le-box.default.css +0 -37
- package/dist/core/collection/components/le-box/le-box.js +0 -614
- package/dist/core/collection/components/le-box/le-box.js.map +0 -1
- package/dist/core/collection/components/le-button/le-button.default.css +0 -263
- package/dist/core/collection/components/le-button/le-button.js +0 -368
- package/dist/core/collection/components/le-button/le-button.js.map +0 -1
- package/dist/core/collection/components/le-card/le-card.default.css +0 -74
- package/dist/core/collection/components/le-card/le-card.js +0 -102
- package/dist/core/collection/components/le-card/le-card.js.map +0 -1
- package/dist/core/collection/components/le-checkbox/le-checkbox.css +0 -93
- package/dist/core/collection/components/le-checkbox/le-checkbox.js +0 -192
- package/dist/core/collection/components/le-checkbox/le-checkbox.js.map +0 -1
- package/dist/core/collection/components/le-number-input/le-number-input.css +0 -135
- package/dist/core/collection/components/le-number-input/le-number-input.js +0 -515
- package/dist/core/collection/components/le-number-input/le-number-input.js.map +0 -1
- package/dist/core/collection/components/le-popover/le-popover.css +0 -143
- package/dist/core/collection/components/le-popover/le-popover.js +0 -693
- package/dist/core/collection/components/le-popover/le-popover.js.map +0 -1
- package/dist/core/collection/components/le-popup/le-popup.api.js.map +0 -1
- package/dist/core/collection/components/le-popup/le-popup.css +0 -222
- package/dist/core/collection/components/le-popup/le-popup.js +0 -596
- package/dist/core/collection/components/le-popup/le-popup.js.map +0 -1
- package/dist/core/collection/components/le-round-progress/le-round-progress.css +0 -34
- package/dist/core/collection/components/le-round-progress/le-round-progress.js +0 -184
- package/dist/core/collection/components/le-round-progress/le-round-progress.js.map +0 -1
- package/dist/core/collection/components/le-stack/le-stack.default.css +0 -37
- package/dist/core/collection/components/le-stack/le-stack.js +0 -389
- package/dist/core/collection/components/le-stack/le-stack.js.map +0 -1
- package/dist/core/collection/components/le-string-input/le-string-input.css +0 -83
- package/dist/core/collection/components/le-string-input/le-string-input.js +0 -359
- package/dist/core/collection/components/le-string-input/le-string-input.js.map +0 -1
- package/dist/core/collection/components/le-text/le-text.default.css +0 -169
- package/dist/core/collection/components/le-text/le-text.js +0 -475
- package/dist/core/collection/components/le-text/le-text.js.map +0 -1
- package/dist/core/collection/components/le-turntable/le-turntable.css +0 -10
- package/dist/core/collection/components/le-turntable/le-turntable.js +0 -210
- package/dist/core/collection/components/le-turntable/le-turntable.js.map +0 -1
- package/dist/core/collection/global/app.js +0 -167
- package/dist/core/collection/global/app.js.map +0 -1
- package/dist/core/collection/index.js +0 -15
- package/dist/core/collection/index.js.map +0 -1
- package/dist/core/collection/types/blocks.js +0 -115
- package/dist/core/collection/types/blocks.js.map +0 -1
- package/dist/core/collection/types/options.js +0 -2
- package/dist/core/collection/types/options.js.map +0 -1
- package/dist/core/collection/utils/utils.js +0 -141
- package/dist/core/collection/utils/utils.js.map +0 -1
- package/dist/core/components/index.d.ts +0 -33
- package/dist/core/components/index.js +0 -113
- package/dist/core/components/index.js.map +0 -1
- package/dist/core/components/le-box.d.ts +0 -11
- package/dist/core/components/le-box.js +0 -225
- package/dist/core/components/le-box.js.map +0 -1
- package/dist/core/components/le-button.d.ts +0 -11
- package/dist/core/components/le-button.js +0 -9
- package/dist/core/components/le-button.js.map +0 -1
- package/dist/core/components/le-button2.js +0 -121
- package/dist/core/components/le-button2.js.map +0 -1
- package/dist/core/components/le-card.d.ts +0 -11
- package/dist/core/components/le-card.js +0 -52
- package/dist/core/components/le-card.js.map +0 -1
- package/dist/core/components/le-checkbox.d.ts +0 -11
- package/dist/core/components/le-checkbox.js +0 -87
- package/dist/core/components/le-checkbox.js.map +0 -1
- package/dist/core/components/le-number-input.d.ts +0 -11
- package/dist/core/components/le-number-input.js +0 -246
- package/dist/core/components/le-number-input.js.map +0 -1
- package/dist/core/components/le-popover.d.ts +0 -11
- package/dist/core/components/le-popover.js +0 -385
- package/dist/core/components/le-popover.js.map +0 -1
- package/dist/core/components/le-popup.d.ts +0 -11
- package/dist/core/components/le-popup.js +0 -253
- package/dist/core/components/le-popup.js.map +0 -1
- package/dist/core/components/le-round-progress.d.ts +0 -11
- package/dist/core/components/le-round-progress.js +0 -135
- package/dist/core/components/le-round-progress.js.map +0 -1
- package/dist/core/components/le-stack.d.ts +0 -11
- package/dist/core/components/le-stack.js +0 -167
- package/dist/core/components/le-stack.js.map +0 -1
- package/dist/core/components/le-string-input.d.ts +0 -11
- package/dist/core/components/le-string-input.js +0 -127
- package/dist/core/components/le-string-input.js.map +0 -1
- package/dist/core/components/le-text.d.ts +0 -11
- package/dist/core/components/le-text.js +0 -367
- package/dist/core/components/le-text.js.map +0 -1
- package/dist/core/components/le-turntable.d.ts +0 -11
- package/dist/core/components/le-turntable.js +0 -164
- package/dist/core/components/le-turntable.js.map +0 -1
- package/dist/core/components/utils.js +0 -310
- package/dist/core/components/utils.js.map +0 -1
- package/dist/core/esm/index-CJ-z5Zj1.js +0 -1818
- package/dist/core/esm/index-CJ-z5Zj1.js.map +0 -1
- package/dist/core/esm/index.js +0 -106
- package/dist/core/esm/index.js.map +0 -1
- package/dist/core/esm/le-box.entry.js +0 -182
- package/dist/core/esm/le-box.entry.js.map +0 -1
- package/dist/core/esm/le-button.entry.js +0 -90
- package/dist/core/esm/le-button.entry.js.map +0 -1
- package/dist/core/esm/le-card.entry.js +0 -27
- package/dist/core/esm/le-card.entry.js.map +0 -1
- package/dist/core/esm/le-checkbox.entry.js +0 -59
- package/dist/core/esm/le-checkbox.entry.js.map +0 -1
- package/dist/core/esm/le-kit.js +0 -21
- package/dist/core/esm/le-kit.js.map +0 -1
- package/dist/core/esm/le-number-input.entry.js +0 -200
- package/dist/core/esm/le-number-input.entry.js.map +0 -1
- package/dist/core/esm/le-popover.entry.js +0 -346
- package/dist/core/esm/le-popover.entry.js.map +0 -1
- package/dist/core/esm/le-popup.entry.js +0 -210
- package/dist/core/esm/le-popup.entry.js.map +0 -1
- package/dist/core/esm/le-round-progress.entry.js +0 -104
- package/dist/core/esm/le-round-progress.entry.js.map +0 -1
- package/dist/core/esm/le-stack.entry.js +0 -133
- package/dist/core/esm/le-stack.entry.js.map +0 -1
- package/dist/core/esm/le-string-input.entry.js +0 -93
- package/dist/core/esm/le-string-input.entry.js.map +0 -1
- package/dist/core/esm/le-text.entry.js +0 -333
- package/dist/core/esm/le-text.entry.js.map +0 -1
- package/dist/core/esm/le-turntable.entry.js +0 -137
- package/dist/core/esm/le-turntable.entry.js.map +0 -1
- package/dist/core/esm/loader.js +0 -11
- package/dist/core/esm/loader.js.map +0 -1
- package/dist/core/esm/utils-Bxmld82M.js +0 -146
- package/dist/core/esm/utils-Bxmld82M.js.map +0 -1
- package/dist/core/index.cjs.js +0 -1
- package/dist/core/index.js +0 -1
- package/dist/core/le-kit/index.esm.js +0 -2
- package/dist/core/le-kit/index.esm.js.map +0 -1
- package/dist/core/le-kit/le-box.entry.esm.js.map +0 -1
- package/dist/core/le-kit/le-button.entry.esm.js.map +0 -1
- package/dist/core/le-kit/le-card.entry.esm.js.map +0 -1
- package/dist/core/le-kit/le-checkbox.entry.esm.js.map +0 -1
- package/dist/core/le-kit/le-kit.css +0 -1
- package/dist/core/le-kit/le-kit.esm.js +0 -2
- package/dist/core/le-kit/le-kit.esm.js.map +0 -1
- package/dist/core/le-kit/le-number-input.entry.esm.js.map +0 -1
- package/dist/core/le-kit/le-popover.entry.esm.js.map +0 -1
- package/dist/core/le-kit/le-popup.entry.esm.js.map +0 -1
- package/dist/core/le-kit/le-round-progress.entry.esm.js.map +0 -1
- package/dist/core/le-kit/le-stack.entry.esm.js.map +0 -1
- package/dist/core/le-kit/le-string-input.entry.esm.js.map +0 -1
- package/dist/core/le-kit/le-text.entry.esm.js.map +0 -1
- package/dist/core/le-kit/le-turntable.entry.esm.js.map +0 -1
- package/dist/core/le-kit/loader.esm.js.map +0 -1
- package/dist/core/le-kit/p-0308bd1f.entry.js +0 -2
- package/dist/core/le-kit/p-0308bd1f.entry.js.map +0 -1
- package/dist/core/le-kit/p-257495cc.entry.js +0 -2
- package/dist/core/le-kit/p-257495cc.entry.js.map +0 -1
- package/dist/core/le-kit/p-2ac4789a.entry.js +0 -2
- package/dist/core/le-kit/p-2ac4789a.entry.js.map +0 -1
- package/dist/core/le-kit/p-45eace7c.entry.js +0 -2
- package/dist/core/le-kit/p-45eace7c.entry.js.map +0 -1
- package/dist/core/le-kit/p-556086ca.entry.js +0 -2
- package/dist/core/le-kit/p-556086ca.entry.js.map +0 -1
- package/dist/core/le-kit/p-5ef81068.entry.js.map +0 -1
- package/dist/core/le-kit/p-66d35f48.entry.js +0 -2
- package/dist/core/le-kit/p-66d35f48.entry.js.map +0 -1
- package/dist/core/le-kit/p-73682c5e.entry.js +0 -2
- package/dist/core/le-kit/p-73682c5e.entry.js.map +0 -1
- package/dist/core/le-kit/p-CJ-z5Zj1.js +0 -3
- package/dist/core/le-kit/p-CJ-z5Zj1.js.map +0 -1
- package/dist/core/le-kit/p-Drz36PDp.js +0 -2
- package/dist/core/le-kit/p-Drz36PDp.js.map +0 -1
- package/dist/core/le-kit/p-aa6e906f.entry.js +0 -2
- package/dist/core/le-kit/p-aa6e906f.entry.js.map +0 -1
- package/dist/core/le-kit/p-d75214f9.entry.js +0 -2
- package/dist/core/le-kit/p-d75214f9.entry.js.map +0 -1
- package/dist/core/le-kit/p-df552906.entry.js.map +0 -1
- package/dist/core/le-kit/p-e0861e82.entry.js +0 -2
- package/dist/core/le-kit/p-e0861e82.entry.js.map +0 -1
- package/dist/core/loader/cdn.js +0 -1
- package/dist/core/loader/index.cjs.js +0 -1
- package/dist/core/loader/index.d.ts +0 -24
- package/dist/core/loader/index.es2017.js +0 -1
- package/dist/core/loader/index.js +0 -2
- package/dist/core/types/components/le-box/le-box.d.ts +0 -111
- package/dist/core/types/components/le-button/le-button.d.ts +0 -78
- package/dist/core/types/components/le-card/le-card.d.ts +0 -37
- package/dist/core/types/components/le-checkbox/le-checkbox.d.ts +0 -46
- package/dist/core/types/components/le-number-input/le-number-input.d.ts +0 -106
- package/dist/core/types/components/le-popover/le-popover.d.ts +0 -109
- package/dist/core/types/components/le-popup/le-popup.api.d.ts +0 -73
- package/dist/core/types/components/le-popup/le-popup.d.ts +0 -122
- package/dist/core/types/components/le-round-progress/le-round-progress.d.ts +0 -37
- package/dist/core/types/components/le-stack/le-stack.d.ts +0 -73
- package/dist/core/types/components/le-string-input/le-string-input.d.ts +0 -83
- package/dist/core/types/components/le-text/le-text.d.ts +0 -141
- package/dist/core/types/components/le-turntable/le-turntable.d.ts +0 -55
- package/dist/core/types/components.d.ts +0 -1752
- package/dist/core/types/global/app.d.ts +0 -73
- package/dist/core/types/index.d.ts +0 -15
- package/dist/core/types/stencil-public-runtime.d.ts +0 -1756
- package/dist/core/types/types/blocks.d.ts +0 -136
- package/dist/core/types/types/options.d.ts +0 -124
- package/dist/core/types/utils/utils.d.ts +0 -54
- package/dist/esm/index-CwNQ1GTa.js.map +0 -1
- package/dist/esm/le-button.le-checkbox.le-component.le-popover.le-slot.le-string-input.entry.js.map +0 -1
- package/dist/esm/le-popup.entry.js +0 -210
- package/dist/esm/le-popup.entry.js.map +0 -1
- package/dist/le-kit/assets/custom-elements.json +0 -4305
- package/dist/le-kit/dist/collection/themes/dark.css +0 -100
- package/dist/le-kit/dist/collection/themes/minimal.css +0 -100
- package/dist/le-kit/le-button.le-checkbox.le-component.le-popover.le-slot.le-string-input.entry.esm.js.map +0 -1
- package/dist/le-kit/le-popup.entry.esm.js.map +0 -1
- package/dist/le-kit/p-08dbcc25.entry.js +0 -2
- package/dist/le-kit/p-08dbcc25.entry.js.map +0 -1
- package/dist/le-kit/p-5dc35729.entry.js +0 -2
- package/dist/le-kit/p-5dc35729.entry.js.map +0 -1
- package/dist/le-kit/p-64374730.entry.js.map +0 -1
- package/dist/le-kit/p-79ec6f7c.entry.js.map +0 -1
- package/dist/le-kit/p-8daf3c7f.entry.js +0 -2
- package/dist/le-kit/p-8daf3c7f.entry.js.map +0 -1
- package/dist/le-kit/p-9c69235d.entry.js +0 -2
- package/dist/le-kit/p-9c69235d.entry.js.map +0 -1
- package/dist/le-kit/p-CwNQ1GTa.js +0 -3
- package/dist/le-kit/p-CwNQ1GTa.js.map +0 -1
- package/dist/le-kit/p-ad398acd.entry.js.map +0 -1
- package/dist/le-kit/p-b8122ad6.entry.js.map +0 -1
- package/dist/le-kit/p-f9008505.entry.js.map +0 -1
- package/dist/le-kit/p-y3FECAx9.js +0 -2
|
@@ -1,2 +1,2 @@
|
|
|
1
|
-
import{p as e,g as
|
|
1
|
+
import{p as e,g as l,b as t}from"./p-DzgCnDLJ.js";export{s as setNonce}from"./p-DzgCnDLJ.js";var a=()=>{const l=import.meta.url;const t={};if(l!==""){t.resourcesUrl=new URL(".",l).href}return e(t)};a().then((async e=>{await l();return t([["p-cc0797b0",[[769,"le-button",{mode:[1537],variant:[1],color:[1],size:[1],selected:[4],fullWidth:[516,"full-width"],iconOnly:[1,"icon-only"],iconStart:[1,"icon-start"],iconEnd:[1,"icon-end"],disabled:[4],type:[1],href:[1],target:[1],align:[1]}],[769,"le-checkbox",{checked:[1540],disabled:[4],name:[1],value:[1],externalId:[1,"external-id"]}],[769,"le-component",{component:[1],displayName:[1,"display-name"],hostClass:[1,"host-class"],hostStyle:[16],adminMode:[32],componentMeta:[32],propertyValues:[32]}],[769,"le-popup",{mode:[1537],open:[1540],type:[1],popupTitle:[1,"popup-title"],message:[1],modal:[4],position:[1],confirmText:[1,"confirm-text"],cancelText:[1,"cancel-text"],placeholder:[1],defaultValue:[1,"default-value"],closeOnBackdrop:[4,"close-on-backdrop"],inputValue:[32],show:[64],hide:[64]}],[769,"le-slot",{type:[1],name:[1],label:[1],description:[1],allowedComponents:[1,"allowed-components"],multiple:[4],required:[4],placeholder:[1],tag:[1],slotStyle:[1,"slot-style"],adminMode:[32],textValue:[32],isValidHtml:[32],availableComponents:[32],pickerOpen:[32]}],[769,"le-string-input",{inputRef:[16],mode:[1537],value:[1537],name:[1],type:[1],label:[1],iconStart:[1,"icon-start"],iconEnd:[1,"icon-end"],placeholder:[1],hideDescription:[4,"hide-description"],disabled:[4],readonly:[4],externalId:[1,"external-id"]}],[769,"le-popover",{mode:[1537],open:[1540],position:[1],align:[1],popoverTitle:[1,"popover-title"],showClose:[4,"show-close"],closeOnClickOutside:[4,"close-on-click-outside"],closeOnEscape:[4,"close-on-escape"],offset:[2],width:[1],minWidth:[1,"min-width"],maxWidth:[1,"max-width"],triggerFullWidth:[4,"trigger-full-width"],isPositioned:[32],updatePosition:[64],show:[64],hide:[64],toggle:[64]}]]],["p-1f55a4a2",[[769,"le-multiselect",{options:[1],value:[1040],placeholder:[1],disabled:[516],required:[4],name:[1],fullWidth:[516,"full-width"],size:[513],maxSelections:[2,"max-selections"],showSelectAll:[1032,"show-select-all"],searchable:[4],emptyText:[1,"empty-text"],open:[1540],selectAllLabel:[32],deselectAllLabel:[32],selectedOptions:[32],searchQuery:[32],showDropdown:[64],hideDropdown:[64],clearSelection:[64]},null,{value:["handleValueChange"],options:["handleOptionsChange"],showSelectAll:["handleShowSelectAllChange"]}]]],["p-91993261",[[769,"le-combobox",{options:[1],value:[1032],placeholder:[1],disabled:[516],required:[4],name:[1],fullWidth:[516,"full-width"],size:[513],allowCustom:[4,"allow-custom"],minSearchLength:[2,"min-search-length"],emptyText:[1,"empty-text"],open:[1540],inputValue:[32],selectedOption:[32],showDropdown:[64],hideDropdown:[64],focusInput:[64]},[[8,"click","handleWindowClick"]],{value:["handleValueChange"],options:["handleOptionsChange"]}]]],["p-71c78784",[[769,"le-segmented-control",{options:[16],value:[1032],size:[1],overflow:[1],fullWidth:[4,"full-width"],disabled:[4],segmentConfigs:[32],focusedIndex:[32],isDeclarativeMode:[32]},[[0,"slotchange","handleSlotChange"]],{options:["tabsChanged"]}]]],["p-d504a369",[[769,"le-select",{options:[1],value:[1032],placeholder:[1],disabled:[516],required:[4],name:[1],fullWidth:[4,"full-width"],size:[513],variant:[513],searchable:[4],emptyText:[1,"empty-text"],open:[1540],selectedOption:[32],searchQuery:[32],showDropdown:[64],hideDropdown:[64]},null,{value:["handleValueChange"],options:["handleOptionsChange"]}]]],["p-7b180d58",[[769,"le-tab-bar",{tabs:[16],selected:[1032],fullWidth:[4,"full-width"],showLabels:[4,"show-labels"],position:[1],size:[1],bordered:[4],tabConfigs:[32],isDeclarativeMode:[32],focusedIndex:[32]},[[0,"slotchange","handleSlotChange"]],{selected:["selectedChanged"],tabs:["tabsChanged"]}]]],["p-a5d31d40",[[769,"le-tabs",{tabs:[16],selected:[1032],orientation:[1],position:[1],variant:[1],fullWidth:[4,"full-width"],size:[1],wrap:[4],overflow:[1],tabConfigs:[32],focusedIndex:[32],isDeclarativeMode:[32]},[[0,"slotchange","handleSlotChange"]],{selected:["selectedChanged"],tabs:["tabsChanged"]}]]],["p-2c37f174",[[769,"le-box",{grow:[2],shrink:[2],basis:[1],width:[1],height:[1],minWidth:[1,"min-width"],maxWidth:[1,"max-width"],minHeight:[1,"min-height"],maxHeight:[1,"max-height"],background:[1],borderRadius:[1,"border-radius"],border:[1],alignSelf:[1,"align-self"],alignContent:[1,"align-content"],justifyContent:[1,"justify-content"],padding:[1],order:[2],displayFlex:[4,"display-flex"],innerDirection:[1,"inner-direction"],innerGap:[1,"inner-gap"]}]]],["p-432e8231",[[769,"le-card",{variant:[1],interactive:[4]}]]],["p-3a52c4de",[[769,"le-number-input",{value:[1538],name:[1],label:[1],placeholder:[1],min:[2],max:[2],step:[2],required:[4],disabled:[4],readonly:[4],iconStart:[1,"icon-start"],showSpinners:[4,"show-spinners"],externalId:[1,"external-id"],isValid:[32],validationMessage:[32]},null,{value:["valueChanged"]}]]],["p-beb87e61",[[769,"le-stack",{direction:[1],gap:[1],align:[1],justify:[1],wrap:[4],alignContent:[1,"align-content"],reverse:[4],maxItems:[2,"max-items"],fullWidth:[4,"full-width"],fullHeight:[4,"full-height"],padding:[1]}]]],["p-6ee06c44",[[769,"le-tab-panel",{label:[1],value:[1],iconStart:[1,"icon-start"],iconEnd:[1,"icon-end"],disabled:[4],lazy:[4],active:[32],hasBeenActive:[32],getValue:[64],getTabConfig:[64],setActive:[64]},null,{active:["activeChanged"]}]]],["p-b66fd9e1",[[769,"le-text",{variant:[1537],align:[513],color:[1],truncate:[4],maxLines:[2,"max-lines"],adminMode:[32],content:[32],isFocused:[32],selectionState:[32]},null,{variant:["onVariantChange"]}]]],["p-0bd7803f",[[769,"le-round-progress",{value:[2],padding:[2],paths:[1],params:[32]},null,{value:["updateValue"],padding:["updatePadding"],paths:["updateProgressBackgrounds"]}]]],["p-33612923",[[769,"le-turntable",{center:[1],value:[2]},[[9,"mousemove","handleMouseMove"],[9,"mouseup","handleMouseUp"],[9,"resize","handleWindowResize"]],{value:["updateValue"]}]]],["p-548d130b",[[769,"le-tag",{label:[1],mode:[1537],icon:[1],dismissible:[4],disabled:[516],size:[513],variant:[513]}]]],["p-6ecdad85",[[769,"le-tab",{mode:[1537],label:[1],value:[1],variant:[1],position:[1],size:[1],focusable:[4],selected:[4],fullWidth:[516,"full-width"],icon:[1],showLabel:[4,"show-label"],iconStart:[1,"icon-start"],iconEnd:[1,"icon-end"],disabled:[4],href:[1],target:[1],align:[1],getTabConfig:[64]}]]],["p-4130c60b",[[769,"le-dropdown-base",{options:[16],value:[8],multiple:[4],open:[1540],disabled:[516],filterFn:[16],filterQuery:[1,"filter-query"],emptyText:[1,"empty-text"],showCheckboxes:[4,"show-checkboxes"],maxHeight:[1,"max-height"],width:[1],fullWidth:[4,"full-width"],closeOnClickOutside:[4,"close-on-click-outside"],focusedIndex:[32],filteredOptions:[32],show:[64],hide:[64],toggle:[64]},null,{options:["handleOptionsChange"],filterQuery:["handleOptionsChange"]}]]]],e)}));
|
|
2
2
|
//# sourceMappingURL=le-kit.esm.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"le-multiselect.entry.esm.js","sources":["src/components/le-multiselect/le-multiselect.css?tag=le-multiselect&encapsulation=shadow","src/components/le-multiselect/le-multiselect.tsx"],"sourcesContent":["/**\n * le-multiselect component styles\n *\n * CSS Custom Properties:\n * --le-multiselect-min-height\n * --le-multiselect-padding\n * --le-multiselect-font-size\n * --le-multiselect-border-radius\n * --le-multiselect-border-color\n * --le-multiselect-bg\n * --le-multiselect-color\n */\n\n:host {\n display: inline-block;\n min-width: 250px;\n\n --le-multiselect-min-height: 0;\n --le-multiselect-padding: var(--le-spacing-1) var(--le-spacing-1) var(--le-spacing-1) var(--le-spacing-2);\n --le-multiselect-border-color: var(--le-color-primary, #3b82f6);\n}\n\n:host([disabled]) {\n opacity: 0.5;\n pointer-events: none;\n}\n\n/* Trigger wrapper */\n.multiselect-trigger {\n display: flex;\n align-items: center;\n justify-content: space-between;\n gap: 0.5rem;\n width: 100%;\n min-height: var(--le-multiselect-min-height);\n padding: var(--le-multiselect-padding);\n line-height: var(--le-line-height-tight);\n background: var(--le-multiselect-bg, var(--le-color-surface, #fff));\n border: 1px solid color-mix(in srgb, var(--le-multiselect-border-color) 33%, transparent);\n border-radius: var(--le-multiselect-border-radius, 0.375rem);\n cursor: pointer;\n transition: border-color 0.15s ease, box-shadow 0.15s ease;\n}\n\n.multiselect-trigger:hover:not(.is-disabled),\n:host(:focus-within) .multiselect-trigger:not(.is-disabled) {\n border-color: var(--le-multiselect-border-color);\n}\n\n:host(:focus-within) .multiselect-trigger {\n outline: 2px solid var(--le-color-focus);\n outline-offset: 2px;\n}\n:host([full-width]) {\n width: 100%;\n}\n\n.multiselect-trigger.is-open {\n border-color: var(--le-color-primary, #3b82f6);\n}\n\n.multiselect-trigger.is-disabled {\n cursor: not-allowed;\n background: var(--le-color-surface-disabled, #f9fafb);\n}\n\n/* Placeholder */\n.multiselect-placeholder {\n color: color-mix(in srgb, var(--le-color-text-secondary) 66%, transparent);\n}\n\n/* Tags container */\n.multiselect-tags {\n display: flex;\n flex-wrap: wrap;\n gap: 0.25rem;\n flex: 1;\n min-width: 0;\n}\n\n/* Actions (clear + arrow) */\n.multiselect-actions {\n display: flex;\n align-items: center;\n gap: 0.25rem;\n flex-shrink: 0;\n}\n\n/* Clear button */\n.multiselect-clear {\n display: flex;\n align-items: center;\n justify-content: center;\n width: 1.5rem;\n height: 1.5rem;\n padding: 0;\n background: transparent;\n color: var(--le-color-primary, #3b82f6);\n border: none;\n border-radius: 0.25rem;\n cursor: pointer;\n opacity: 0.6;\n transition: opacity 0.15s ease, background-color 0.15s ease;\n}\n\n.multiselect-clear:hover {\n opacity: 1;\n background: var(--le-color-surface-hover, #f3f4f6);\n}\n\n.multiselect-clear svg {\n width: 0.875rem;\n height: 0.875rem;\n}\n\n/* Arrow icon */\n.multiselect-arrow {\n display: flex;\n align-items: center;\n justify-content: center;\n width: 1.5rem;\n height: 1rem;\n color: var(--le-color-primary, #3b82f6);\n transition: transform 0.2s ease;\n}\n\n.multiselect-arrow svg {\n width: 1rem;\n height: 1rem;\n}\n\n.multiselect-trigger.is-open .multiselect-arrow {\n transform: rotate(180deg);\n}\n\n/* Search in dropdown */\n.search-input::part(container):focus-within {\n outline: none !important;\n}\n.search-input {\n --le-input-radius: var(--le-radius-md);\n}\n\n/* Status message */\n.multiselect-status {\n display: block;\n margin-top: 0.25rem;\n font-size: 0.75rem;\n color: var(--le-color-text-muted, #6b7280);\n}\n\n/* Size variants */\n:host([size='small']) .multiselect-trigger {\n --le-multiselect-min-height: 2rem;\n --le-multiselect-padding: 0.25rem 0.375rem;\n --le-multiselect-font-size: 0.75rem;\n}\n\n:host([size='large']) .multiselect-trigger {\n --le-multiselect-min-height: 3rem;\n --le-multiselect-padding: 0.5rem 0.625rem;\n --le-multiselect-font-size: 1rem;\n}\n","import {\n Component,\n Prop,\n State,\n Event,\n EventEmitter,\n Method,\n Element,\n Watch,\n h,\n} from '@stencil/core';\nimport {\n LeOption,\n LeOptionValue,\n LeMultiOptionSelectDetail,\n LeOptionSelectDetail,\n} from '../../types/options';\n\n/**\n * A multiselect component for selecting multiple options.\n *\n * Displays selected items as tags with optional search filtering.\n *\n * @cmsEditable true\n * @cmsCategory Form\n *\n * @example Basic multiselect\n * ```html\n * <le-multiselect\n * placeholder=\"Select options...\"\n * options='[{\"label\": \"Red\"}, {\"label\": \"Green\"}, {\"label\": \"Blue\"}]'\n * ></le-multiselect>\n * ```\n *\n * @example With max selections\n * ```html\n * <le-multiselect\n * max-selections=\"3\"\n * options='[{\"label\": \"Option 1\"}, {\"label\": \"Option 2\"}, {\"label\": \"Option 3\"}, {\"label\": \"Option 4\"}]'\n * ></le-multiselect>\n * ```\n *\n * @example With search\n * ```html\n * <le-multiselect\n * searchable\n * placeholder=\"Search and select...\"\n * options='[{\"label\": \"Apple\"}, {\"label\": \"Banana\"}, {\"label\": \"Cherry\"}]'\n * ></le-multiselect>\n * ```\n */\n@Component({\n tag: 'le-multiselect',\n styleUrl: 'le-multiselect.css',\n shadow: true,\n})\nexport class LeMultiselect {\n @Element() el: HTMLElement;\n\n /**\n * The options to display in the dropdown.\n */\n @Prop() options: LeOption[] | string = [];\n\n /**\n * The currently selected values.\n */\n @Prop({ mutable: true }) value: LeOptionValue[] = [];\n\n /**\n * Placeholder text when no options are selected.\n */\n @Prop() placeholder: string = 'Select options...';\n\n /**\n * Whether the multiselect is disabled.\n */\n @Prop({ reflect: true }) disabled: boolean = false;\n\n /**\n * Whether selection is required.\n */\n @Prop() required: boolean = false;\n\n /**\n * Name attribute for form submission.\n */\n @Prop() name?: string;\n\n /**\n * Whether the multiselect should take full width of its container.\n */\n @Prop({ reflect: true }) fullWidth: boolean = false;\n\n /**\n * Size variant of the multiselect.\n */\n @Prop({ reflect: true }) size: 'small' | 'medium' | 'large' = 'medium';\n\n /**\n * Maximum number of selections allowed.\n */\n @Prop() maxSelections?: number;\n\n /**\n * Labels for the \"Select All\" option.\n */\n @State() private selectAllLabel: string = 'Select All';\n @State() private deselectAllLabel: string = 'Deselect All';\n\n /**\n * Whether to show a \"Select All\" option.\n * Also accepts a string or array of strings to customize the label(s).\n */\n @Prop({ mutable: true }) showSelectAll: boolean | string | string[] = false;\n\n /**\n * Whether the input is searchable.\n */\n @Prop() searchable: boolean = false;\n\n /**\n * Text to show when no options match the search.\n */\n @Prop() emptyText: string = 'No results found';\n\n /**\n * Whether the dropdown is currently open.\n */\n @Prop({ mutable: true, reflect: true }) open: boolean = false;\n\n /**\n * Emitted when the selected values change.\n */\n @Event() leChange: EventEmitter<LeMultiOptionSelectDetail>;\n\n /**\n * Emitted when the dropdown opens.\n */\n @Event() leOpen: EventEmitter<void>;\n\n /**\n * Emitted when the dropdown closes.\n */\n @Event() leClose: EventEmitter<void>;\n\n @State() private selectedOptions: LeOption[] = [];\n @State() private searchQuery: string = '';\n\n private dropdownEl?: HTMLLeDropdownBaseElement;\n private inputEl?: HTMLInputElement;\n\n @Watch('value')\n handleValueChange() {\n this.updateSelectedOptions();\n }\n\n @Watch('options')\n handleOptionsChange() {\n this.updateSelectedOptions();\n }\n\n @Watch('showSelectAll')\n handleShowSelectAllChange(newValue: boolean | string | string[]) {\n if (typeof newValue !== 'boolean' && typeof newValue !== 'string') {\n this.showSelectAll = false;\n } else if (typeof newValue === 'boolean') {\n this.showSelectAll = newValue;\n } else if (Array.isArray(newValue)) {\n this.showSelectAll = true;\n this.selectAllLabel = newValue[0];\n this.deselectAllLabel = newValue[1] || newValue[0];\n } else if (typeof newValue === 'string') {\n this.showSelectAll = true;\n try {\n const parsed = JSON.parse(newValue);\n if (Array.isArray(parsed) && parsed.every(item => typeof item === 'string')) {\n this.selectAllLabel = parsed[0];\n this.deselectAllLabel = parsed[1] || parsed[0];\n } else {\n this.selectAllLabel = newValue;\n this.deselectAllLabel = newValue;\n }\n } catch {\n this.selectAllLabel = newValue;\n this.deselectAllLabel = newValue;\n }\n }\n }\n\n componentWillLoad() {\n this.updateSelectedOptions();\n this.handleShowSelectAllChange(this.showSelectAll);\n }\n\n private get parsedOptions(): LeOption[] {\n if (typeof this.options === 'string') {\n try {\n return JSON.parse(this.options);\n } catch {\n return [];\n }\n }\n return this.options;\n }\n\n private get effectiveOptions(): LeOption[] {\n let options = [...this.parsedOptions];\n\n // Add \"Select All\" option if enabled\n if (this.showSelectAll && options.length > 0) {\n const allSelected =\n this.selectedOptions.length === this.parsedOptions.filter(opt => !opt.disabled).length;\n options = [\n {\n label: allSelected ? this.deselectAllLabel : this.selectAllLabel,\n value: '__select_all__',\n iconStart: allSelected ? '✕' : '⇣',\n },\n ...options,\n ];\n }\n\n return options;\n }\n\n private updateSelectedOptions() {\n const valueArray = Array.isArray(this.value) ? this.value : [];\n this.selectedOptions = this.parsedOptions.filter(opt =>\n valueArray.includes(opt.value ?? opt.label),\n );\n }\n\n private filterOption = (option: LeOption, query: string): boolean => {\n if (!query) return true;\n // Always show \"Select All\" option\n if (option.value === '__select_all__') return true;\n\n const searchLower = query.toLowerCase();\n return (\n option.label.toLowerCase().includes(searchLower) ||\n (option.description?.toLowerCase().includes(searchLower) ?? false)\n );\n };\n\n private handleOptionSelect = (e: CustomEvent<LeOptionSelectDetail>) => {\n const { value } = e.detail;\n\n const enabledOptions = this.parsedOptions.filter(opt => !opt.disabled);\n if (enabledOptions.length === 0) return;\n\n // Handle \"Select All\" option\n if (value === '__select_all__') {\n if (this.selectedOptions.length === enabledOptions.length) {\n // Deselect all\n this.value = [];\n } else {\n // Select all (respect maxSelections)\n const selectableOptions = this.maxSelections\n ? enabledOptions.slice(0, this.maxSelections)\n : enabledOptions;\n this.value = selectableOptions.map(opt => opt.value ?? opt.label);\n }\n this.emitChange();\n return;\n }\n\n const isSelected = this.value.includes(value);\n\n if (isSelected) {\n // Remove from selection\n this.value = this.value.filter(v => v !== value);\n this.selectedOptions = this.selectedOptions.filter(opt => (opt.value ?? opt.label) !== value);\n } else {\n // Add to selection (if not at max)\n if (this.maxSelections && this.value.length >= this.maxSelections) {\n return; // Don't add more\n }\n this.value = [...this.value, value];\n }\n\n this.emitChange();\n\n // Clear search after szelection\n this.searchQuery = '';\n };\n\n private emitChange() {\n this.leChange.emit({\n values: this.value,\n options: this.selectedOptions,\n });\n }\n\n private handleDropdownOpen = () => {\n this.open = true;\n this.leOpen.emit();\n\n // Focus search input if searchable\n if (this.searchable) {\n setTimeout(() => {\n this.inputEl?.focus();\n }, 50);\n }\n };\n\n private handleDropdownClose = () => {\n this.open = false;\n this.searchQuery = '';\n this.leClose.emit();\n };\n\n private handleTriggerClick = () => {\n if (!this.disabled) {\n this.dropdownEl?.toggle();\n }\n };\n\n private handleTriggerKeyDown = (e: KeyboardEvent) => {\n if (this.disabled) return;\n\n if (e.key === 'Enter' || e.key === ' ' || e.key === 'ArrowDown') {\n e.preventDefault();\n this.dropdownEl?.show();\n }\n };\n\n private handleTagDismiss = (option: LeOption, e: CustomEvent) => {\n e.stopPropagation();\n const value = option.value ?? option.label;\n this.value = this.value.filter(v => v !== value);\n this.selectedOptions = this.selectedOptions.filter(opt => opt !== option);\n this.emitChange();\n };\n\n private handleSearchInput = (e: Event) => {\n const target = e.target as HTMLInputElement;\n this.searchQuery = target.value;\n };\n\n private handleClearAll = (e: MouseEvent) => {\n e.stopPropagation();\n this.value = [];\n this.selectedOptions = [];\n this.emitChange();\n };\n\n /**\n * Opens the dropdown.\n */\n @Method()\n async showDropdown() {\n await this.dropdownEl?.show();\n }\n\n /**\n * Closes the dropdown.\n */\n @Method()\n async hideDropdown() {\n await this.dropdownEl?.hide();\n }\n\n /**\n * Clears all selections.\n */\n @Method()\n async clearSelection() {\n this.value = [];\n this.selectedOptions = [];\n this.emitChange();\n }\n\n private renderTags() {\n if (this.selectedOptions.length === 0) {\n return <span class=\"multiselect-placeholder\">{this.placeholder}</span>;\n }\n\n return (\n <div class=\"multiselect-tags\">\n {this.selectedOptions.map(option => (\n <le-tag\n key={option.value ?? option.label}\n label={option.label}\n icon={option.iconStart}\n size={this.size === 'large' ? 'medium' : 'small'}\n dismissible\n disabled={this.disabled}\n onLeDismiss={e => this.handleTagDismiss(option, e)}\n mode=\"default\"\n />\n ))}\n </div>\n );\n }\n\n render() {\n const hasSelections = this.selectedOptions.length > 0;\n const atMaxSelections = this.maxSelections && this.value.length >= this.maxSelections;\n\n return (\n <le-component component=\"le-multiselect\">\n <le-dropdown-base\n ref={el => (this.dropdownEl = el)}\n options={this.effectiveOptions}\n value={this.value}\n multiple={true}\n disabled={this.disabled}\n filterFn={this.searchable ? this.filterOption : undefined}\n filterQuery={this.searchQuery}\n emptyText={this.emptyText}\n showCheckboxes={true}\n fullWidth={this.fullWidth}\n onLeOptionSelect={this.handleOptionSelect}\n onLeDropdownOpen={this.handleDropdownOpen}\n onLeDropdownClose={this.handleDropdownClose}\n >\n <div\n slot=\"trigger\"\n class={{\n 'multiselect-trigger': true,\n 'has-selections': hasSelections,\n 'is-open': this.open,\n 'is-disabled': this.disabled,\n }}\n tabIndex={this.disabled ? -1 : 0}\n role=\"combobox\"\n aria-haspopup=\"listbox\"\n aria-expanded={this.open ? 'true' : 'false'}\n aria-disabled={this.disabled ? 'true' : undefined}\n onClick={this.handleTriggerClick}\n onKeyDown={this.handleTriggerKeyDown}\n >\n {this.renderTags()}\n\n <div class=\"multiselect-actions\">\n {hasSelections && !this.disabled && (\n <button\n type=\"button\"\n class=\"multiselect-clear\"\n onClick={this.handleClearAll}\n aria-label=\"Clear all\"\n tabIndex={-1}\n >\n <svg viewBox=\"0 0 16 16\" fill=\"none\" stroke=\"currentColor\" stroke-width=\"2\">\n <path d=\"M4 4l8 8M12 4l-8 8\" />\n </svg>\n </button>\n )}\n <span class=\"multiselect-arrow\">\n <svg viewBox=\"0 0 16 16\" fill=\"none\" stroke=\"currentColor\" stroke-width=\"2\">\n <path d=\"M4 6l4 4 4-4\" />\n </svg>\n </span>\n </div>\n </div>\n\n {/* Search input shown in dropdown header */}\n {this.searchable && this.open && (\n <div class=\"multiselect-search\" slot=\"header\">\n <le-string-input\n mode=\"default\"\n inputRef={el => (this.inputEl = el)}\n class=\"search-input\"\n placeholder=\"Search...\"\n value={this.searchQuery}\n onInput={this.handleSearchInput}\n />\n </div>\n )}\n </le-dropdown-base>\n\n {/* Hidden inputs for form submission */}\n {this.name &&\n this.value.map(val => (\n <input type=\"hidden\" name={this.name} value={val.toString()} key={val.toString()} />\n ))}\n\n {/* Status message */}\n {atMaxSelections && (\n <span class=\"multiselect-status\">Maximum {this.maxSelections} selections</span>\n )}\n </le-component>\n );\n }\n}\n"],"names":[],"mappings":"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"}
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"le-segmented-control.entry.esm.js","sources":["src/components/le-segmented-control/le-segmented-control.css?tag=le-segmented-control&encapsulation=shadow","src/components/le-segmented-control/le-segmented-control.tsx"],"sourcesContent":["/**\n * le-segmented-control - Default mode styles\n */\n\n:host {\n display: inline-block;\n max-width: 100%;\n --le-segmented-control-bg: var(--le-color-background-secondary);\n --le-segmented-control-padding: var(--le-spacing-1);\n}\n:host([full-width]) {\n width: 100%;\n}\n:host(.overflow-visible) {\n max-width: none;\n}\n\n.le-segmented-control {\n flex-direction: row;\n white-space: nowrap;\n border: none;\n gap: 0;\n background-color: var(--le-segmented-control-bg);\n border-radius: calc(var(--le-radius-md) + var(--le-segmented-control-padding));\n padding: var(--le-segmented-control-padding);\n}\n\n.le-segmented-control.overflow-auto {\n overflow: auto;\n}\n.le-segmented-control.overflow-hidden {\n overflow: hidden;\n}\n.le-segmented-control.overflow-visible {\n overflow: visible;\n}\n.le-segmented-control.overflow-scroll {\n overflow: scroll;\n}\n\n.le-segmented-control.full-width {\n display: flex;\n width: 100%;\n width: calc(100% - var(--le-segmented-control-padding) * 2);\n}\n\n.le-segmented-control.disabled {\n opacity: 0.5;\n pointer-events: none;\n}\n\n.le-segmented-control:focus {\n outline: 2px solid var(--le-color-focus);\n outline-offset: 2px;\n}\n\n\n/* ============================================\n * SEGMENT BUTTON\n * ============================================ */\n\n.full-width .segment {\n flex: 1;\n}\n\n.segment:focus-visible {\n outline: 2px solid var(--le-focus-ring-color, var(--le-color-primary));\n outline-offset: 2px;\n}\n\n.segment-active {\n color: var(--le-segmented-text-color-active, var(--le-text-primary));\n}\n\n.segment-disabled {\n opacity: 0.5;\n cursor: not-allowed;\n}\n","import {\n Component,\n Prop,\n State,\n Event,\n EventEmitter,\n h,\n Element,\n Watch,\n Listen,\n Host,\n} from '@stencil/core';\nimport { LeOption, LeOptionValue, LeOptionSelectDetail } from '../../types/options';\n\ninterface SegmentConfig {\n label: string;\n value: string;\n iconStart?: string;\n iconEnd?: string;\n disabled: boolean;\n}\n\ninterface TabConfig {\n label: string;\n value: string;\n iconStart?: string;\n iconEnd?: string;\n disabled: boolean;\n panel?: HTMLElement & { setActive: (active: boolean) => Promise<void> };\n}\n\n/**\n * A segmented control component (iOS-style toggle buttons).\n *\n * Perfect for toggling between a small set of related options.\n *\n * @cssprop --le-segmented-bg - Background color of the control\n * @cssprop --le-segmented-padding - Padding around segments\n * @cssprop --le-segmented-gap - Gap between segments\n * @cssprop --le-segmented-radius - Border radius of the control\n *\n * @csspart container - The main container\n * @csspart segment - Individual segment buttons\n * @csspart segment-active - The currently active segment\n *\n * @cmsEditable true\n * @cmsCategory Form\n */\n@Component({\n tag: 'le-segmented-control',\n styleUrl: 'le-segmented-control.css',\n shadow: true,\n})\nexport class LeSegmentedControl {\n @Element() el: HTMLElement;\n\n private containerRef?: HTMLElement;\n\n /**\n * Array of options for the segmented control.\n */\n @Prop() options: LeOption[] = [];\n\n /**\n * The value of the currently selected option.\n */\n @Prop({ mutable: true }) value?: LeOptionValue;\n\n /**\n * Size of the control.\n * @allowedValues small | medium | large\n */\n @Prop() size: 'small' | 'medium' | 'large' = 'medium';\n\n /**\n * Scroll behavior for overflowing tabs.\n * @allowedValues auto | hidden | visible | scroll\n */\n @Prop() overflow: 'auto' | 'hidden' | 'visible' | 'scroll' = 'auto';\n\n /**\n * Whether the control should take full width.\n */\n @Prop() fullWidth: boolean = false;\n\n /**\n * Whether the control is disabled.\n */\n @Prop() disabled: boolean = false;\n\n /**\n * Internal tab configurations (built from children or tabs prop)\n */\n @State() private segmentConfigs: SegmentConfig[] = [];\n\n /**\n * Internal state for focused index (keyboard navigation)\n */\n @State() private focusedIndex: number = 0;\n\n /**\n * Whether we're using declarative mode (le-tab children)\n */\n @State() private isDeclarativeMode: boolean = false;\n\n /**\n * Emitted when the selection changes.\n */\n @Event() leChange: EventEmitter<LeOptionSelectDetail>;\n\n private mutationObserver?: MutationObserver;\n\n @Watch('options')\n tabsChanged() {\n if (!this.isDeclarativeMode) {\n this.buildSegmentsConfigs();\n }\n }\n\n @Listen('slotchange')\n handleSlotChange() {\n this.buildSegmentsConfigs();\n }\n\n componentWillLoad() {\n this.buildSegmentsConfigs();\n if (this.value === undefined && this.options.length > 0) {\n const firstEnabled = this.options.find(opt => !opt.disabled);\n if (firstEnabled) {\n this.value = this.getOptionValue(firstEnabled);\n }\n }\n if (this.value !== undefined) {\n const index = this.getOptionIndex(this.value);\n if (index >= 0) {\n this.focusedIndex = index;\n }\n }\n }\n\n connectedCallback() {\n // Watch for dynamic changes to children\n this.mutationObserver = new MutationObserver(() => {\n this.buildSegmentsConfigs();\n });\n this.mutationObserver.observe(this.el, {\n attributes: true,\n childList: true,\n subtree: true,\n });\n }\n\n disconnectedCallback() {\n this.mutationObserver?.disconnect();\n }\n\n private async buildSegmentsConfigs() {\n // Check for le-tab children\n const segments = Array.from(this.el.querySelectorAll(':scope > le-tab')) as Array<\n HTMLElement & {\n getTabConfig: () => Promise<TabConfig>;\n setActive: (active: boolean) => Promise<void>;\n }\n >;\n\n if (segments.length > 0) {\n // Declarative mode - build from children\n this.isDeclarativeMode = true;\n const configs: TabConfig[] = [];\n\n for (const segment of segments) {\n const config = await segment.getTabConfig();\n configs.push({ ...config });\n }\n\n this.segmentConfigs = configs;\n } else if (this.options.length > 0) {\n // Programmatic mode - use options prop\n this.isDeclarativeMode = false;\n this.segmentConfigs = this.options.map(option => ({\n label: option.label,\n value: (option.value !== undefined ? option.value : option.label) as string,\n iconStart: option.iconStart,\n iconEnd: option.iconEnd,\n disabled: option.disabled ?? false,\n }));\n } else {\n this.segmentConfigs = [];\n }\n\n // Set default selected\n if (this.value === undefined && this.segmentConfigs.length > 0) {\n const firstEnabled = this.segmentConfigs.find(t => !t.disabled);\n if (firstEnabled) {\n this.value = firstEnabled.value;\n }\n }\n\n // Initialize focused index\n if (this.value !== undefined) {\n const index = this.segmentConfigs.findIndex(t => t.value === this.value);\n if (index >= 0) {\n this.focusedIndex = index;\n }\n }\n }\n\n private getOptionValue(option: LeOption): LeOptionValue {\n return option.value !== undefined ? option.value : option.label;\n }\n\n private getOptionIndex(value: LeOptionValue): number {\n return this.options.findIndex(opt => this.getOptionValue(opt) === value);\n }\n\n private selectOption(option: LeOption) {\n if (option.disabled || this.disabled) return;\n\n const value = this.getOptionValue(option);\n this.value = value;\n\n // update focused index\n const index = this.segmentConfigs.findIndex(seg => seg.value === value);\n if (index >= 0) {\n this.focusedIndex = index;\n }\n\n this.leChange.emit({ value, option });\n }\n\n private handleClick = (option: LeOption) => {\n this.selectOption(option);\n };\n\n private handleKeyDown = (event: KeyboardEvent) => {\n const { segmentConfigs } = this;\n let newIndex = this.focusedIndex;\n\n switch (event.key) {\n case 'ArrowLeft':\n event.preventDefault();\n newIndex = this.findNextEnabled(-1);\n break;\n case 'ArrowRight':\n event.preventDefault();\n newIndex = this.findNextEnabled(1);\n break;\n case 'Home':\n event.preventDefault();\n newIndex = this.findFirstEnabled();\n break;\n case 'End':\n event.preventDefault();\n newIndex = this.findLastEnabled();\n break;\n case 'Enter':\n case ' ':\n event.preventDefault();\n if (segmentConfigs[this.focusedIndex]) {\n this.selectOption(segmentConfigs[this.focusedIndex]);\n }\n return;\n default:\n return;\n }\n\n if (newIndex !== this.focusedIndex) {\n this.focusedIndex = newIndex;\n this.focusSegment(newIndex);\n if (segmentConfigs[newIndex]) {\n this.selectOption(segmentConfigs[newIndex]);\n }\n }\n };\n\n private findNextEnabled(direction: 1 | -1): number {\n const { segmentConfigs } = this;\n let index = this.focusedIndex;\n const length = segmentConfigs.length;\n\n for (let i = 0; i < length; i++) {\n index = (index + direction + length) % length;\n if (!segmentConfigs[index].disabled) {\n return index;\n }\n }\n return this.focusedIndex;\n }\n\n private findFirstEnabled(): number {\n return this.segmentConfigs.findIndex(opt => !opt.disabled);\n }\n\n private findLastEnabled(): number {\n for (let i = this.segmentConfigs.length - 1; i >= 0; i--) {\n if (!this.segmentConfigs[i].disabled) return i;\n }\n return 0;\n }\n\n private focusSegment(index: number) {\n const container = this.containerRef;\n const segment = container?.querySelectorAll('.segment')[index] as HTMLElement;\n segment?.focus();\n }\n\n render() {\n const { segmentConfigs, value, size, fullWidth, disabled } = this;\n\n const classes = {\n 'le-segmented-control': true,\n [`size-${size}`]: true,\n [`overflow-${this.overflow}`]: true,\n 'full-width': fullWidth,\n 'disabled': disabled,\n };\n\n return (\n <Host class={`overflow-${this.overflow}`}>\n <le-component component=\"le-segmented-control\">\n <div\n class={classes}\n ref={el => (this.containerRef = el)}\n role=\"radiogroup\"\n part=\"container\"\n onKeyDown={this.handleKeyDown}\n tabIndex={0}\n >\n {segmentConfigs.map(option => {\n const optValue = this.getOptionValue(option);\n const isSelected = optValue === value;\n const isDisabled = option.disabled || disabled;\n\n return (\n <le-tab\n key={optValue}\n class=\"segment\"\n role=\"radio\"\n variant=\"enclosed\"\n selected={isSelected}\n disabled={isDisabled}\n focusable={false}\n size={size}\n part={isSelected ? 'segment segment-active' : 'segment'}\n aria-checked={isSelected ? 'true' : 'false'}\n aria-disabled={isDisabled ? 'true' : undefined}\n onClick={() => this.handleClick(option)}\n iconStart={option.iconStart}\n iconEnd={option.iconEnd}\n >\n <span class=\"segment-label\">{option.label}</span>\n </le-tab>\n );\n })}\n </div>\n </le-component>\n </Host>\n );\n }\n}\n"],"names":[],"mappings":"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"}
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"le-select.entry.esm.js","sources":["src/components/le-select/le-select.css?tag=le-select&encapsulation=shadow","src/components/le-select/le-select.tsx"],"sourcesContent":["/**\n * le-select component styles\n *\n * CSS Custom Properties:\n * --le-select-height\n * --le-select-padding-x\n * --le-select-font-size\n * --le-select-border-radius\n * --le-select-border-color\n * --le-select-bg\n * --le-select-color\n */\n\n:host {\n display: inline-block;\n min-width: 150px;\n --le-select-color: var(--le-color-text, #1f2937);\n --le-select-border-radius: var(--le-radius-md);\n --le-select-content-padding: var(--le-spacing-2);\n}\n\n:host([disabled]) {\n opacity: 0.5;\n pointer-events: none;\n}\n\n:host([full-width]) {\n width: 100%;\n}\n\n/* Trigger button */\n.select-trigger {\n display: flex;\n align-items: center;\n gap: 0.5rem;\n width: 100%;\n padding: 0;\n --le-button-padding: var(--le-spacing-1) var(--le-spacing-1) var(--le-spacing-1) var(--le-spacing-2);\n font-size: var(--le-select-font-size, 0.875rem);\n font-family: inherit;\n line-height: 1.4;\n color: var(--le-select-color);\n background: var(--le-select-bg, var(--le-color-surface, #fff));\n border-radius: var(--le-select-border-radius);\n cursor: pointer;\n text-align: left;\n transition: border-color 0.15s ease, box-shadow 0.15s ease;\n}\n\n.select-trigger:focus {\n outline: 2px solid var(--le-color-focus);\n outline-offset: 2px;\n}\n\n/* Placeholder state */\n.select-trigger:not(.has-value) .trigger-label {\n color: color-mix(in srgb, var(--le-color-text-secondary) 66%, transparent);\n}\n\n/* Trigger icon */\n.trigger-icon {\n display: flex;\n align-items: center;\n justify-content: center;\n flex-shrink: 0;\n width: 1.25rem;\n height: 1.25rem;\n}\n\n.trigger-icon-end {\n width: 16px;\n height: 16px;\n}\n\n.trigger-icon img {\n width: 100%;\n height: 100%;\n object-fit: contain;\n}\n\n/* Trigger label */\n.trigger-label {\n flex: 1;\n overflow: hidden;\n text-overflow: ellipsis;\n white-space: nowrap;\n color: var(--le-color-text);\n}\n\n.trigger-label::not(.has-value) {\n color: var(--le-color-text-disabled, #9ca3af);\n}\n\n/* Arrow icon */\nle-button::part(icon-end) {\n display: flex;\n align-items: center;\n justify-content: center;\n flex-shrink: 0;\n width: 1.25rem;\n height: 1.25rem;\n margin-left: auto;\n transition: transform 0.2s ease;\n}\n\nle-button::part(icon-end) svg {\n width: 1rem;\n height: 1rem;\n}\n\nle-button.is-open::part(icon-end) {\n transform: rotate(180deg);\n}\n\n/* Search in dropdown */\n.search-input::part(container):focus-within {\n outline: none !important;\n}\n.search-input {\n --le-input-radius: var(--le-radius-md);\n}\n","import {\n Component,\n Prop,\n State,\n Event,\n EventEmitter,\n Method,\n Element,\n Watch,\n h,\n} from '@stencil/core';\nimport { LeOption, LeOptionValue, LeOptionSelectDetail } from '../../types/options';\n\n/**\n * A select dropdown component for single selection.\n *\n * @cmsEditable true\n * @cmsCategory Form\n *\n * @example Basic select\n * ```html\n * <le-select\n * placeholder=\"Choose an option\"\n * options='[{\"label\": \"Option 1\", \"value\": \"1\"}, {\"label\": \"Option 2\", \"value\": \"2\"}]'\n * ></le-select>\n * ```\n *\n * @example With icons\n * ```html\n * <le-select\n * options='[\n * {\"label\": \"Apple\", \"value\": \"apple\", \"iconStart\": \"🍎\"},\n * {\"label\": \"Banana\", \"value\": \"banana\", \"iconStart\": \"🍌\"}\n * ]'\n * ></le-select>\n * ```\n *\n * @example Grouped options\n * ```html\n * <le-select\n * options='[\n * {\"label\": \"Apple\", \"value\": \"apple\", \"group\": \"Fruits\"},\n * {\"label\": \"Carrot\", \"value\": \"carrot\", \"group\": \"Vegetables\"}\n * ]'\n * ></le-select>\n * ```\n */\n@Component({\n tag: 'le-select',\n styleUrl: 'le-select.css',\n shadow: true,\n})\nexport class LeSelect {\n @Element() el: HTMLElement;\n\n /**\n * The options to display in the dropdown.\n */\n @Prop() options: LeOption[] | string = [];\n\n /**\n * The currently selected value.\n */\n @Prop({ mutable: true }) value?: LeOptionValue;\n\n /**\n * Placeholder text when no option is selected.\n */\n @Prop() placeholder: string = 'Select an option';\n\n /**\n * Whether the select is disabled.\n */\n @Prop({ reflect: true }) disabled: boolean = false;\n\n /**\n * Whether selection is required.\n */\n @Prop() required: boolean = false;\n\n /**\n * Name attribute for form submission.\n */\n @Prop() name?: string;\n\n /**\n * Whether the select should take full width of its container.\n */\n @Prop() fullWidth: boolean = false;\n\n /**\n * Size variant of the select.\n */\n @Prop({ reflect: true }) size: 'small' | 'medium' | 'large' = 'medium';\n\n /**\n * Visual variant of the select.\n */\n @Prop({ reflect: true }) variant: 'default' | 'outlined' | 'solid' = 'default';\n\n /**\n * Whether the input is searchable.\n */\n @Prop() searchable: boolean = false;\n\n /**\n * Text to show when no options match the search.\n */\n @Prop() emptyText: string = 'No results found';\n\n /**\n * Whether the dropdown is currently open.\n */\n @Prop({ mutable: true, reflect: true }) open: boolean = false;\n\n /**\n * Emitted when the selected value changes.\n */\n @Event() leChange: EventEmitter<LeOptionSelectDetail>;\n\n /**\n * Emitted when the dropdown opens.\n */\n @Event() leOpen: EventEmitter<void>;\n\n /**\n * Emitted when the dropdown closes.\n */\n @Event() leClose: EventEmitter<void>;\n\n @State() private selectedOption?: LeOption;\n\n @State() private searchQuery: string = '';\n\n private dropdownEl?: HTMLLeDropdownBaseElement;\n private inputEl?: HTMLInputElement;\n\n @Watch('value')\n handleValueChange() {\n this.updateSelectedOption();\n }\n\n @Watch('options')\n handleOptionsChange() {\n this.updateSelectedOption();\n }\n\n componentWillLoad() {\n this.updateSelectedOption();\n }\n\n private get parsedOptions(): LeOption[] {\n if (typeof this.options === 'string') {\n try {\n return JSON.parse(this.options);\n } catch {\n return [];\n }\n }\n return this.options;\n }\n\n private updateSelectedOption() {\n if (this.value !== undefined) {\n this.selectedOption = this.parsedOptions.find(opt => (opt.value ?? opt.label) === this.value);\n } else {\n this.selectedOption = undefined;\n }\n }\n\n private filterOption = (option: LeOption, query: string): boolean => {\n if (!query) return true;\n\n const searchLower = query.toLowerCase();\n return (\n option.label.toLowerCase().includes(searchLower) ||\n (option.description?.toLowerCase().includes(searchLower) ?? false)\n );\n };\n\n private handleOptionSelect = (e: CustomEvent<LeOptionSelectDetail>) => {\n this.value = e.detail.value;\n this.selectedOption = e.detail.option;\n this.leChange.emit(e.detail);\n };\n\n private handleDropdownOpen = () => {\n this.open = true;\n this.leOpen.emit();\n\n // Focus search input if searchable\n if (this.searchable) {\n setTimeout(() => {\n this.inputEl?.focus();\n }, 50);\n }\n };\n\n private handleDropdownClose = () => {\n this.open = false;\n this.leClose.emit();\n };\n\n private handleTriggerClick = () => {\n if (!this.disabled) {\n this.dropdownEl?.toggle();\n }\n };\n\n private handleTriggerKeyDown = (e: KeyboardEvent) => {\n if (this.disabled) return;\n\n if (e.key === 'Enter' || e.key === ' ' || e.key === 'ArrowDown') {\n e.preventDefault();\n this.dropdownEl?.show();\n }\n };\n\n private handleSearchInput = (e: Event) => {\n const target = e.target as HTMLInputElement;\n this.searchQuery = target.value;\n };\n\n /**\n * Opens the dropdown.\n */\n @Method()\n async showDropdown() {\n await this.dropdownEl?.show();\n }\n\n /**\n * Closes the dropdown.\n */\n @Method()\n async hideDropdown() {\n await this.dropdownEl?.hide();\n }\n\n private renderIcon(icon: string | undefined) {\n if (!icon) return null;\n\n if (icon.startsWith('http') || icon.startsWith('/')) {\n return <img class=\"trigger-icon\" src={icon} alt=\"\" />;\n }\n\n return <span class=\"trigger-icon\">{icon}</span>;\n }\n\n render() {\n const hasValue = this.selectedOption !== undefined;\n\n return (\n <le-component component=\"le-select\">\n <le-dropdown-base\n ref={el => (this.dropdownEl = el)}\n options={this.parsedOptions}\n value={this.value}\n disabled={this.disabled}\n filterFn={this.searchable ? this.filterOption : undefined}\n filterQuery={this.searchQuery}\n onLeOptionSelect={this.handleOptionSelect}\n onLeDropdownOpen={this.handleDropdownOpen}\n onLeDropdownClose={this.handleDropdownClose}\n fullWidth={this.fullWidth}\n >\n <le-button\n variant={this.variant && this.variant !== 'default' ? this.variant : 'outlined'}\n slot=\"trigger\"\n align=\"space-between\"\n class={{\n 'select-trigger': true,\n 'has-value': hasValue,\n 'is-open': this.open,\n }}\n mode=\"default\"\n size={this.size}\n disabled={this.disabled}\n aria-haspopup=\"listbox\"\n aria-expanded={this.open ? 'true' : 'false'}\n onClick={this.handleTriggerClick}\n onKeyDown={this.handleTriggerKeyDown}\n fullWidth={this.fullWidth}\n iconStart={\n hasValue && this.selectedOption?.iconStart\n ? this.renderIcon(this.selectedOption.iconStart)\n : null\n }\n iconEnd={\n <svg\n width=\"16\"\n height=\"16\"\n viewBox=\"0 0 16 16\"\n fill=\"none\"\n stroke=\"currentColor\"\n stroke-width=\"2\"\n >\n <path d=\"M4 6l4 4 4-4\" />\n </svg>\n }\n >\n <span class=\"trigger-label\">\n {hasValue ? this.selectedOption!.label : this.placeholder}\n </span>\n </le-button>\n\n {/* Search input shown in dropdown header */}\n {this.searchable && this.open && (\n <div class=\"multiselect-search\" slot=\"header\">\n <le-string-input\n mode=\"default\"\n inputRef={el => (this.inputEl = el)}\n class=\"search-input\"\n placeholder=\"Search...\"\n value={this.searchQuery}\n onInput={this.handleSearchInput}\n />\n </div>\n )}\n </le-dropdown-base>\n\n {/* Hidden input for form submission */}\n {this.name && <input type=\"hidden\" name={this.name} value={this.value?.toString() ?? ''} />}\n </le-component>\n );\n }\n}\n"],"names":[],"mappings":"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"}
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"le-tab-bar.entry.esm.js","sources":["src/components/le-tab-bar/le-tab-bar.css?tag=le-tab-bar&encapsulation=shadow","src/components/le-tab-bar/le-tab-bar.tsx"],"sourcesContent":["/**\n * le-tab-bar - Default mode styles\n */\n\n:host {\n display: block;\n --le-tab-bar-background: var(--le-color-surface);\n --le-tab-bar-border-color: var(--le-color-border);\n --le-tab-bar-gap: var(--le-spacing-2);\n --le-tab-bar-padding-y: var(--le-spacing-2);\n --le-tab-bar-padding-x: var(--le-spacing-1);\n\n background: var(--le-tab-bar-background);\n padding: var(--le-tab-bar-padding-y) var(--le-tab-bar-padding-x);\n}\n\n:host([full-width]) {\n width: 100%;\n}\n:host(.bordered.position-top) {\n border-bottom: 1px solid var(--le-tab-bar-border-color);\n}\n:host(.bordered.position-bottom) {\n border-top: 1px solid var(--le-tab-bar-border-color);\n}\n\n/* ============================================\n * TABLIST\n * ============================================ */\n\n.tablist {\n display: flex;\n flex-direction: row;\n align-items: flex-end;\n justify-content: space-around;\n gap: var(--le-tab-bar-gap, var(--le-spacing-1));\n width: 100%;\n}\n\n/* ============================================\n * TAB BUTTON BASE\n * ============================================ */\n\n.tab {\n display: inline-flex;\n align-items: flex-start;\n justify-content: space-around;\n gap: var(--le-spacing-2);\n position: relative;\n \n background: transparent;\n border: none;\n cursor: pointer;\n}\n\n.tab-disabled {\n opacity: 0.5;\n cursor: not-allowed;\n}\n\n/* ============================================\n * TAB ICON\n * ============================================ */\n\n.tab-icon {\n display: inline-flex;\n align-items: center;\n justify-content: center;\n width: 1em;\n height: 1em;\n font-size: 1.1em;\n}\n\n.tab-icon img {\n width: 100%;\n height: 100%;\n object-fit: contain;\n}\n\n/* ============================================\n * TAB DESCRIPTION\n * ============================================ */\n\n.tab-description {\n font-size: var(--le-font-size-xs);\n font-weight: var(--le-font-weight-normal);\n color: var(--le-text-tertiary);\n margin-left: var(--le-spacing-1);\n}\n","import {\n Component,\n Prop,\n State,\n Event,\n EventEmitter,\n h,\n Element,\n Watch,\n Listen,\n Host,\n} from '@stencil/core';\nimport { LeOption, LeOptionValue, LeOptionSelectDetail } from '../../types/options';\n\ninterface TabConfig {\n label: string;\n value: string;\n icon?: string;\n href?: string;\n disabled: boolean;\n}\n\n/**\n * A presentational tab bar component without panels.\n *\n * Use this for navigation/routing scenarios where you manage the content\n * externally based on the selection events. For tabs with built-in panels,\n * use `le-tabs` instead.\n *\n * @cssprop --le-tab-bar-border-color - Border color\n * @cssprop --le-tab-bar-gap - Gap between tabs\n * @cssprop --le-tab-bar-indicator-color - Active indicator color\n * @cssprop --le-tab-bar-padding-x - Horizontal padding for tabs\n * @cssprop --le-tab-bar-padding-y - Vertical padding for tabs\n *\n * @csspart tablist - The tab button container\n * @csspart tab - Individual tab buttons\n * @csspart tab-active - The currently active tab\n *\n * @cmsEditable true\n * @cmsCategory Navigation\n */\n@Component({\n tag: 'le-tab-bar',\n styleUrl: 'le-tab-bar.css',\n shadow: true,\n})\nexport class LeTabBar {\n @Element() el: HTMLElement;\n\n /**\n * Array of tab options defining the tabs to display.\n */\n @Prop() tabs: LeOption[] = [];\n\n /**\n * The value of the currently selected tab.\n */\n @Prop({ mutable: true }) selected?: LeOptionValue;\n\n /**\n * Whether tabs should stretch to fill available width.\n */\n @Prop() fullWidth: boolean = true;\n\n /**\n * Whether to show labels in icon-only mode.\n */\n @Prop() showLabels: boolean = false;\n\n /**\n * Position of the tab bar.\n * @allowedValues top | bottom\n */\n @Prop() position: 'top' | 'bottom' = 'top';\n\n /**\n * Size of the tabs.\n * @allowedValues small | medium | large\n */\n @Prop() size: 'small' | 'medium' | 'large' = 'medium';\n\n /**\n * Whether to show a border below the tab bar.\n */\n @Prop() bordered: boolean = true;\n\n /**\n * Internal tab configurations (built from children or tabs prop)\n */\n @State() private tabConfigs: TabConfig[] = [];\n\n /**\n * Whether we're using declarative mode (le-tab-panel children)\n */\n @State() private isDeclarativeMode: boolean = false;\n\n /**\n * Internal state for focused tab index (for keyboard navigation)\n */\n @State() private focusedIndex: number = 0;\n\n /**\n * Emitted when the selected tab changes.\n */\n @Event() leTabChange: EventEmitter<LeOptionSelectDetail>;\n\n private mutationObserver?: MutationObserver;\n\n @Watch('selected')\n selectedChanged(newValue: LeOptionValue) {\n const index = this.tabConfigs.findIndex(t => t.value === newValue);\n if (index >= 0) {\n this.focusedIndex = index;\n }\n }\n\n @Watch('tabs')\n tabsChanged() {\n if (!this.isDeclarativeMode) {\n this.buildTabConfigs();\n }\n }\n\n @Listen('slotchange')\n handleSlotChange() {\n this.buildTabConfigs();\n }\n\n componentWillLoad() {\n this.buildTabConfigs();\n if (this.selected === undefined && this.tabs.length > 0) {\n const firstEnabled = this.tabs.find(tab => !tab.disabled);\n if (firstEnabled) {\n this.selected = this.getTabValue(firstEnabled);\n }\n }\n if (this.selected !== undefined) {\n const index = this.getTabIndex(this.selected);\n if (index >= 0) {\n this.focusedIndex = index;\n }\n }\n }\n\n connectedCallback() {\n // Watch for dynamic changes to children\n this.mutationObserver = new MutationObserver(() => {\n this.buildTabConfigs();\n });\n this.mutationObserver.observe(this.el, {\n attributes: true,\n childList: true,\n subtree: true,\n });\n }\n\n disconnectedCallback() {\n this.mutationObserver?.disconnect();\n }\n\n private async buildTabConfigs() {\n // Check for le-tab-panel children\n const tabs = Array.from(this.el.querySelectorAll(':scope > le-tab')) as Array<\n HTMLElement & {\n getTabConfig: () => Promise<TabConfig>;\n setActive: (active: boolean) => Promise<void>;\n }\n >;\n\n if (tabs.length > 0) {\n // Declarative mode - build from children\n this.isDeclarativeMode = true;\n const configs: TabConfig[] = [];\n\n for (const tab of tabs) {\n const config = await tab.getTabConfig();\n configs.push({ ...config });\n }\n\n this.tabConfigs = configs;\n } else if (this.tabs.length > 0) {\n // Programmatic mode - use tabs prop\n this.isDeclarativeMode = false;\n this.tabConfigs = this.tabs.map(tab => ({\n label: tab.label,\n value: (tab.value !== undefined ? tab.value : tab.label) as string,\n iconStart: tab.iconStart,\n iconEnd: tab.iconEnd,\n disabled: tab.disabled ?? false,\n }));\n } else {\n this.tabConfigs = [];\n }\n\n // Set default selected\n if (this.selected === undefined && this.tabConfigs.length > 0) {\n const firstEnabled = this.tabConfigs.find(t => !t.disabled);\n if (firstEnabled) {\n this.selected = firstEnabled.value;\n }\n }\n\n // Initialize focused index\n if (this.selected !== undefined) {\n const index = this.tabConfigs.findIndex(t => t.value === this.selected);\n if (index >= 0) {\n this.focusedIndex = index;\n }\n }\n }\n\n private getTabValue(tab: LeOption): LeOptionValue {\n return tab.value !== undefined ? tab.value : tab.label;\n }\n\n private getTabIndex(value: LeOptionValue): number {\n return this.tabs.findIndex(tab => this.getTabValue(tab) === value);\n }\n\n private selectTab(tab: LeOption) {\n if (tab.disabled) return;\n\n const value = this.getTabValue(tab);\n this.selected = value;\n this.leTabChange.emit({ value, option: tab });\n }\n\n private handleTabClick = (tab: LeOption) => {\n this.selectTab(tab);\n };\n\n private handleKeyDown = (event: KeyboardEvent) => {\n const { tabConfigs } = this;\n let newIndex = this.focusedIndex;\n\n switch (event.key) {\n case 'ArrowLeft':\n event.preventDefault();\n newIndex = this.findNextEnabledTab(-1);\n break;\n case 'ArrowRight':\n event.preventDefault();\n newIndex = this.findNextEnabledTab(1);\n break;\n case 'Home':\n event.preventDefault();\n newIndex = this.findFirstEnabledTab();\n break;\n case 'End':\n event.preventDefault();\n newIndex = this.findLastEnabledTab();\n break;\n case 'Enter':\n case ' ':\n event.preventDefault();\n if (tabConfigs[this.focusedIndex]) {\n this.selectTab(tabConfigs[this.focusedIndex]);\n }\n return;\n default:\n return;\n }\n\n if (newIndex !== this.focusedIndex) {\n this.focusedIndex = newIndex;\n if (tabConfigs[newIndex]) {\n this.selectTab(tabConfigs[newIndex]);\n }\n }\n };\n\n private findNextEnabledTab(direction: 1 | -1): number {\n const { tabConfigs } = this;\n let index = this.focusedIndex;\n const length = tabConfigs.length;\n\n for (let i = 0; i < length; i++) {\n index = (index + direction + length) % length;\n if (!tabConfigs[index].disabled) {\n return index;\n }\n }\n return this.focusedIndex;\n }\n\n private findFirstEnabledTab(): number {\n return this.tabConfigs.findIndex(tab => !tab.disabled);\n }\n\n private findLastEnabledTab(): number {\n for (let i = this.tabConfigs.length - 1; i >= 0; i--) {\n if (!this.tabConfigs[i].disabled) return i;\n }\n return 0;\n }\n\n render() {\n const { tabConfigs, selected, size, bordered } = this;\n\n const classes = {\n 'le-tab-bar': true,\n 'bordered': bordered,\n 'position-top': this.position === 'top',\n 'position-bottom': this.position === 'bottom',\n };\n\n return (\n <Host class={classes}>\n <le-component component=\"le-tab-bar\">\n <div\n class=\"tablist\"\n role=\"tablist\"\n aria-orientation=\"horizontal\"\n part=\"tablist\"\n onKeyDown={this.handleKeyDown}\n >\n <le-slot name=\"\" type=\"slot\" allowedComponents=\"le-tab\">\n {tabConfigs.map(tab => {\n const value = this.getTabValue(tab);\n const isSelected = value === selected;\n\n return (\n <le-tab\n key={value}\n class=\"tab\"\n role=\"tab\"\n variant=\"icon-only\"\n label={tab.label}\n value={tab.value}\n icon={tab.icon}\n href={tab.href}\n selected={isSelected}\n disabled={tab.disabled}\n showLabel={this.showLabels}\n size={size}\n part={isSelected ? 'tab tab-active' : 'tab'}\n aria-selected={isSelected ? 'true' : 'false'}\n aria-disabled={tab.disabled ? 'true' : undefined}\n tabIndex={-1}\n onClick={() => this.handleTabClick(tab)}\n >\n <span class=\"tab-label\">{tab.label}</span>\n </le-tab>\n );\n })}\n </le-slot>\n </div>\n </le-component>\n </Host>\n );\n }\n}\n"],"names":[],"mappings":"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"}
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"le-tab-panel.entry.esm.js","sources":["src/components/le-tab-panel/le-tab-panel.css?tag=le-tab-panel&encapsulation=shadow","src/components/le-tab-panel/le-tab-panel.tsx"],"sourcesContent":["/**\n * le-tab-panel - Styles\n */\n\n:host {\n display: contents;\n --le-tab-panel-radius: var(--le-radius-md);\n --le-tab-panel-padding: var(--le-spacing-4);\n}\n\n.tab-panel {\n margin-top: 4px;\n display: none;\n border-radius: var(--le-tab-panel-radius);\n padding: var(--le-tab-panel-padding);\n}\n\n.tab-panel.active {\n display: block;\n}\n\n.tab-panel:focus-visible {\n outline: 2px solid var(--le-color-focus);\n outline-offset: 2px;\n}\n\n/* For lazy panels that have been rendered but are now hidden */\n.tab-panel.lazy-hidden {\n display: none;\n}\n","import { Component, Prop, h, Element, State, Watch, Method } from '@stencil/core';\n\n/**\n * A tab panel component used as a child of le-tabs.\n *\n * Each le-tab-panel defines both the tab button label and the panel content.\n * The parent le-tabs component automatically reads these panels and creates\n * the tab interface.\n *\n * @slot - Default slot for panel content\n *\n * @cmsEditable true\n * @cmsCategory Navigation\n */\n@Component({\n tag: 'le-tab-panel',\n styleUrl: 'le-tab-panel.css',\n shadow: true,\n})\nexport class LeTabPanel {\n @Element() el: HTMLLeTabPanelElement;\n\n /**\n * The label displayed in the tab button.\n */\n @Prop() label!: string;\n\n /**\n * The value used to identify this tab.\n * Defaults to the label if not provided.\n */\n @Prop() value?: string;\n\n /**\n * Icon displayed at the start of the tab button.\n * Can be an emoji, URL, or icon class.\n */\n @Prop() iconStart?: string;\n\n /**\n * Icon displayed at the end of the tab button.\n */\n @Prop() iconEnd?: string;\n\n /**\n * Whether this tab is disabled.\n */\n @Prop() disabled: boolean = false;\n\n /**\n * Whether to render the panel content only when active (lazy loading).\n * When true, content is not rendered until the tab is first selected.\n * When false (default), content is always in DOM but hidden when inactive.\n */\n @Prop() lazy: boolean = false;\n\n /**\n * Internal: Whether this panel is currently active (set by parent le-tabs)\n */\n @State() active: boolean = false;\n\n /**\n * Internal: Track if panel has ever been activated (for lazy rendering)\n */\n @State() hasBeenActive: boolean = false;\n\n @Watch('active')\n activeChanged(isActive: boolean) {\n if (isActive && !this.hasBeenActive) {\n this.hasBeenActive = true;\n }\n }\n\n /**\n * Get the effective value (value or label as fallback)\n */\n @Method()\n async getValue(): Promise<string> {\n return this.value ?? this.label;\n }\n\n /**\n * Get tab configuration for parent component\n */\n @Method()\n async getTabConfig(): Promise<{\n label: string;\n value: string;\n iconStart?: string;\n iconEnd?: string;\n disabled: boolean;\n }> {\n return {\n label: this.label,\n value: this.value ?? this.label,\n iconStart: this.iconStart,\n iconEnd: this.iconEnd,\n disabled: this.disabled,\n };\n }\n\n /**\n * Set the active state (called by parent le-tabs)\n */\n @Method()\n async setActive(isActive: boolean) {\n this.active = isActive;\n }\n\n /**\n * Check if panel should render content\n */\n private shouldRenderContent(): boolean {\n if (!this.lazy) return true;\n return this.hasBeenActive;\n }\n\n render() {\n const shouldRender = this.shouldRenderContent();\n\n return (\n <le-component component=\"le-tab-panel\">\n <div\n class={{\n 'tab-panel': true,\n 'active': this.active,\n 'lazy-hidden': this.lazy && !this.active,\n }}\n role=\"tabpanel\"\n aria-hidden={!this.active ? 'true' : undefined}\n tabIndex={this.active ? 0 : -1}\n >\n <le-slot name=\"\" description=\"Tab panel content\" type=\"slot\">\n {shouldRender && <slot></slot>}\n </le-slot>\n </div>\n </le-component>\n );\n }\n}\n"],"names":[],"mappings":";;AAAA,MAAM,aAAa,GAAG,0XAA0X;;MCmBnY,UAAU,GAAA,MAAA;;;;;AAGrB;;AAEG;AACK,IAAA,KAAK;AAEb;;;AAGG;AACK,IAAA,KAAK;AAEb;;;AAGG;AACK,IAAA,SAAS;AAEjB;;AAEG;AACK,IAAA,OAAO;AAEf;;AAEG;IACK,QAAQ,GAAY,KAAK;AAEjC;;;;AAIG;IACK,IAAI,GAAY,KAAK;AAE7B;;AAEG;IACM,MAAM,GAAY,KAAK;AAEhC;;AAEG;IACM,aAAa,GAAY,KAAK;AAGvC,IAAA,aAAa,CAAC,QAAiB,EAAA;AAC7B,QAAA,IAAI,QAAQ,IAAI,CAAC,IAAI,CAAC,aAAa,EAAE;AACnC,YAAA,IAAI,CAAC,aAAa,GAAG,IAAI;;;AAI7B;;AAEG;AAEH,IAAA,MAAM,QAAQ,GAAA;AACZ,QAAA,OAAO,IAAI,CAAC,KAAK,IAAI,IAAI,CAAC,KAAK;;AAGjC;;AAEG;AAEH,IAAA,MAAM,YAAY,GAAA;QAOhB,OAAO;YACL,KAAK,EAAE,IAAI,CAAC,KAAK;AACjB,YAAA,KAAK,EAAE,IAAI,CAAC,KAAK,IAAI,IAAI,CAAC,KAAK;YAC/B,SAAS,EAAE,IAAI,CAAC,SAAS;YACzB,OAAO,EAAE,IAAI,CAAC,OAAO;YACrB,QAAQ,EAAE,IAAI,CAAC,QAAQ;SACxB;;AAGH;;AAEG;IAEH,MAAM,SAAS,CAAC,QAAiB,EAAA;AAC/B,QAAA,IAAI,CAAC,MAAM,GAAG,QAAQ;;AAGxB;;AAEG;IACK,mBAAmB,GAAA;QACzB,IAAI,CAAC,IAAI,CAAC,IAAI;AAAE,YAAA,OAAO,IAAI;QAC3B,OAAO,IAAI,CAAC,aAAa;;IAG3B,MAAM,GAAA;AACJ,QAAA,MAAM,YAAY,GAAG,IAAI,CAAC,mBAAmB,EAAE;QAE/C,QACE,CAAA,CAAA,cAAA,EAAA,EAAA,GAAA,EAAA,0CAAA,EAAc,SAAS,EAAC,cAAc,EAAA,EACpC,CAAA,CAAA,KAAA,EAAA,EAAA,GAAA,EAAA,0CAAA,EACE,KAAK,EAAE;AACL,gBAAA,WAAW,EAAE,IAAI;gBACjB,QAAQ,EAAE,IAAI,CAAC,MAAM;gBACrB,aAAa,EAAE,IAAI,CAAC,IAAI,IAAI,CAAC,IAAI,CAAC,MAAM;AACzC,aAAA,EACD,IAAI,EAAC,UAAU,EAAA,aAAA,EACF,CAAC,IAAI,CAAC,MAAM,GAAG,MAAM,GAAG,SAAS,EAC9C,QAAQ,EAAE,IAAI,CAAC,MAAM,GAAG,CAAC,GAAG,EAAE,EAAA,EAE9B,CAAA,CAAA,SAAA,EAAA,EAAA,GAAA,EAAA,0CAAA,EAAS,IAAI,EAAC,EAAE,EAAC,WAAW,EAAC,mBAAmB,EAAC,IAAI,EAAC,MAAM,EAAA,EACzD,YAAY,IAAI,CAAA,CAAA,MAAA,EAAA,EAAA,GAAA,EAAA,0CAAA,EAAA,CAAa,CACtB,CACN,CACO;;;;;;;;;;"}
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"le-tab.entry.esm.js","sources":["src/components/le-tab/le-tab.css?tag=le-tab&encapsulation=shadow","src/components/le-tab/le-tab.tsx"],"sourcesContent":["/**\n * Default mode styles for le-button\n * Uses global design tokens with component-specific overrides\n */\n:host {\n display: inline-block;\n \n /* Component-specific tokens */\n --le-tab-border-radius: var(--le-radius-md);\n --le-tab-padding-x: var(--le-spacing-4);\n --le-tab-padding-y: var(--le-spacing-2);\n --le-tab-padding: var(--le-tab-padding-y) var(--le-tab-padding-x);\n --le-tab-small-padding: 0.25rem;\n --le-tab-font-size: var(--le-font-size-md);\n --le-tab-font-weight: var(--le-font-weight-medium);\n --le-tab-transition: var(--le-transition-fast);\n --le-transition-easing: ease-in-out;\n --le-tab-icon-aspect-ratio: 1;\n --le-tab-icon-only-aspect-ratio: 2.5;\n --le-tab-color: var(--le-color-text-primary);\n --le-selected-tab-color: var(--le-color-primary);\n --le-selected-icon-only-tab-background: color-mix(in srgb, var(--_tab-bg) 10%, transparent);\n \n /* Internal state variables - set by color classes */\n --_tab-bg: var(--le-color-primary);\n --_tab-bg-hover: var(--le-color-primary-dark);\n --_tab-bg-system: var(--le-color-black);\n --_tab-color: var(--le-tab-color);\n --_tab-border-color: var(--le-color-primary);\n}\n\n:host([full-width]) {\n display: block;\n width: 100%;\n}\n\n.le-tab-container {\n display: inline-flex;\n flex-direction: row;\n align-items: center;\n justify-content: center;\n gap: var(--le-spacing-3);\n width: 100%;\n padding: var(--le-tab-padding);\n color: var(--_tab-color);\n font-family: var(--le-font-family-base);\n font-size: var(--le-tab-font-size);\n font-weight: var(--le-tab-font-weight);\n line-height: var(--le-line-height-tight);\n text-decoration: none;\n cursor: pointer;\n transition: \n background-color var(--le-tab-transition) var(--le-transition-easing),\n border-color var(--le-tab-transition) var(--le-transition-easing),\n box-shadow var(--le-tab-transition) var(--le-transition-easing),\n transform var(--le-tab-transition) var(--le-transition-easing);\n}\n\n.le-tab-container:hover:not(:disabled) {\n color: var(--le-selected-tab-color);\n}\n\n.le-tab-container:focus-visible {\n outline: none;\n}\n\n.le-tab-container:disabled {\n opacity: 0.5;\n cursor: not-allowed;\n}\n\n.le-tab-label {\n display: inline-flex;\n flex-direction: row;\n align-items: center;\n justify-content: center;\n gap: var(--le-spacing-2);\n}\n\n/* ===========================================\n * STYLE VARIANTS\n * =========================================== */\n\n/* Underlined (default for tabs), depends on the position (top, bottom, start, end) */\n.le-tab-container.variant-underlined {\n background: transparent;\n border: 2px solid transparent;\n border-radius: 0;\n}\n.le-tab-container.variant-underlined.position-start,\n.le-tab-container.variant-underlined.position-end {\n border-block-width: 0;\n}\n.le-tab-container.variant-underlined.position-start {\n padding-inline-start: 0;\n}\n.le-tab-container.variant-underlined.position-top,\n.le-tab-container.variant-underlined.position-bottom {\n border-inline-width: 0;\n}\n.le-tab-container.variant-underlined.position-start.selected {\n border-inline-end-color: var(--_tab-border-color);\n}\n.le-tab-container.variant-underlined.position-end.selected {\n border-inline-start-color: var(--_tab-border-color);\n}\n.le-tab-container.variant-underlined.position-top.selected {\n border-bottom-color: var(--_tab-border-color);\n}\n.le-tab-container.variant-underlined.position-bottom.selected {\n border-top-color: var(--_tab-border-color);\n}\n\n/* Solid (default) - already styled by color classes */\n.le-tab-container.variant-solid {\n background: transparent;\n border-radius: var(--le-tab-border-radius);\n border: none;\n}\n.le-tab-container.variant-solid.selected {\n background: var(--_tab-bg);\n color: var(--le-color-on-primary);\n}\n\n/* Pills */\n.le-tab-container.variant-pills {\n background: transparent;\n border-radius: var(--le-radius-full);\n border: none;\n}\n.le-tab-container.variant-pills.selected {\n background: var(--_tab-bg);\n color: var(--le-color-on-primary);\n}\n\n/* Enclosed */\n.le-tab-container.variant-enclosed {\n padding-block: var(--le-spacing-1);\n background: transparent;\n border-radius: var(--le-tab-border-radius);\n border: none;\n}\n.le-tab-container.variant-enclosed.selected {\n background: var(--_tab-bg);\n color: var(--le-color-on-primary);\n}\n\n/* Icon only (used in le-tab-bar - mobile navigation) */\n.le-tab-container.variant-icon-only {\n border: none;\n padding: 0;\n background: transparent;\n color: var(--_tab-color);\n}\n.le-tab-container.variant-icon-only .icon-only {\n flex-direction: column;\n}\n.le-tab-container.variant-icon-only .icon {\n display: flex;\n align-items: center;\n justify-content: center;\n min-height: var(--le-font-size-3xl);\n aspect-ratio: var(--le-tab-icon-only-aspect-ratio);\n font-size: var(--le-font-size-2xl);\n border-radius: var(--le-radius-full);\n}\n.le-tab-container.variant-icon-only .icon-label {\n margin-top: var(--le-spacing-1);\n font-size: var(--le-font-size-2xs);\n}\n\n.le-tab-container.variant-icon-only.selected {\n color: var(--le-selected-tab-color);\n}\n.le-tab-container.variant-icon-only.selected .icon {\n background: var(--le-selected-icon-only-tab-background);\n}\n.le-tab-container.variant-icon-only.size-small {\n padding: var(--le-tab-small-padding, 0.25rem);\n}\n.le-tab-container.variant-icon-only .content {\n display: none;\n}\n\n\n/* ===========================================\n * SIZES\n * =========================================== */\n.le-tab-container.size-small {\n --le-tab-padding-x: 0.4rem;\n --le-tab-padding-y: 0.3rem;\n --le-tab-padding-top: 0.35rem;\n --le-tab-font-size: var(--le-tab-small-font-size, var(--le-font-size-xs));\n}\n\n.le-tab-container.size-large {\n --le-tab-padding-x: 0.9rem;\n --le-tab-padding-y: 0.6rem;\n --le-tab-font-size: var(--le-font-size-xl);\n}\n\n/* ===========================================\n * STATES & MODIFIERS\n * =========================================== */\n\n/* Full width */\n.le-tab-container.full-width {\n display: block;\n width: 100%;\n}\n\n.le-tab-container.variant-underlined.selected,\n.le-tab-container.variant-clear.selected {\n color: var(--le-selected-tab-color);\n}\n\n/* Icon only */\n:host > le-component.icon-only .le-tab-container {\n padding: 0.5rem;\n padding-bottom: 0.6rem;\n aspect-ratio: var(--le-tab-icon-aspect-ratio, 1);\n}\n\n.le-tab-container.icon-only.size-small {\n padding: var(--le-tab-small-padding, 0.25rem);\n}\n\n.le-tab-container.icon-only.size-large {\n padding: 0.75rem;\n}\n\n/* Hide content in icon-only mode */\n.le-tab-container.icon-only .content {\n display: none;\n}\n\n/* ===========================================\n * CONTENT (le-slot wrapper)\n * =========================================== */\n.content {\n display: inline;\n}\n\n.content:empty {\n display: none;\n}\n\n/* ===========================================\n * ICON WRAPPERS & SLOTS\n * =========================================== */\n.icon-start,\n.icon-only,\n.icon-end {\n display: flex;\n align-items: center;\n justify-content: center;\n}\n\n.icon-start:empty,\n.icon-only:empty,\n.icon-end:empty {\n display: none;\n}\n\n::slotted([slot=\"icon-start\"]),\n::slotted([slot=\"icon-only\"]),\n::slotted([slot=\"icon-end\"]) {\n display: flex;\n align-items: center;\n justify-content: center;\n width: 1.125em;\n height: 1.125em;\n}\n\n/* ===========================================\n * ALIGNMENT MODIFIERS\n * =========================================== */\n.le-tab-align-start {\n justify-content: flex-start;\n}\n.le-tab-align-center {\n justify-content: center;\n}\n.le-tab-align-space-between {\n justify-content: space-between;\n}\n.le-tab-align-end {\n justify-content: flex-end;\n}\n","import {\n Component,\n Prop,\n h,\n Element,\n Fragment,\n Event,\n EventEmitter,\n Host,\n Method,\n} from '@stencil/core';\nimport { classnames } from '../../utils/utils';\n\n/**\n * A flexible tab component with multiple variants and states.\n *\n * @slot - Tab text content\n * @slot icon-only - Icon for icon-only tabs\n *\n * @cssprop --le-tab-bg - Tab background color\n * @cssprop --le-tab-color - Tab text color\n * @cssprop --le-tab-border-radius - Tab border radius\n * @cssprop --le-tab-padding-x - Tab horizontal padding\n * @cssprop --le-tab-padding-y - Tab vertical padding\n *\n * @csspart button - The native button element\n * @csspart content - The tab content wrapper\n * @csspart icon-start - The start icon slot\n * @csspart icon-end - The end icon slot\n *\n * @cmsEditable true\n * @cmsCategory Actions\n */\n@Component({\n tag: 'le-tab',\n styleUrl: 'le-tab.css',\n shadow: true,\n})\nexport class LeTab {\n @Element() el: HTMLElement;\n\n /**\n * Mode of the popover should be 'default' for internal use\n */\n @Prop({ mutable: true, reflect: true }) mode: 'default' | 'admin';\n\n /**\n * Label if it is not provided via slot\n */\n @Prop() label?: string;\n\n /**\n * Value of the tab, defaults to label if not provided\n */\n @Prop() value?: string;\n\n /**\n * Tab variant style\n * @allowedValues solid | underlined | clear | enclosed | icon-only\n */\n @Prop() variant: 'underlined' | 'solid' | 'pills' | 'enclosed' | 'icon-only' = 'underlined';\n\n /**\n * Position of the tabs when used within a le-tabs component\n * @allowedValues top | bottom | start | end\n */\n @Prop() position: 'top' | 'bottom' | 'start' | 'end' = 'top';\n\n /**\n * Tab size\n * @allowedValues small | medium | large\n */\n @Prop() size: 'small' | 'medium' | 'large' = 'medium';\n\n /**\n * Whether the tab can get focus\n * needed for accessibility when used in custom tab implementations\n */\n @Prop() focusable: boolean = true;\n\n /**\n * Whether the tab is in a selected/active state\n */\n @Prop() selected: boolean = false;\n\n /**\n * Whether the tab takes full width of its container\n */\n @Prop({ reflect: true }) fullWidth: boolean = false;\n\n /**\n * Icon only tab image or emoji\n * if this prop is set, the tab will render only the icon slot\n */\n @Prop() icon?: string | Node;\n\n /**\n * Whether to show the label when in icon-only mode\n */\n @Prop() showLabel: boolean = false;\n\n /**\n * Start icon image or emoji\n */\n @Prop() iconStart?: string | Node;\n\n /**\n * End icon image or emoji\n */\n @Prop() iconEnd?: string | Node;\n\n /**\n * Whether the tab is disabled\n */\n @Prop() disabled: boolean = false;\n\n /**\n * Optional href to make the tab act as a link\n */\n @Prop() href?: string;\n\n /**\n * Link target when href is set\n */\n @Prop() target?: string;\n\n /**\n * Alignment of the tab label without the end icon\n * @allowedValues start | center | space-between | end\n */\n @Prop() align: 'start' | 'center' | 'space-between' | 'end' = 'center';\n\n /**\n * Get tab configuration for parent component\n */\n @Method()\n async getTabConfig(): Promise<{\n label: string;\n value: string;\n icon: string | Node;\n iconStart?: string | Node;\n iconEnd?: string | Node;\n disabled: boolean;\n }> {\n return {\n label: this.label,\n value: this.value ?? this.label,\n icon: this.icon,\n iconStart: this.iconStart,\n iconEnd: this.iconEnd,\n disabled: this.disabled,\n };\n }\n\n /**\n * Emitted when the tab is clicked.\n * This is a custom event that wraps the native click but ensures the target is the le-tab.\n */\n @Event({ eventName: 'click' }) leClick: EventEmitter<PointerEvent>;\n\n private handleClick = (event: PointerEvent) => {\n // We stop the internal button click from bubbling up\n event.stopPropagation();\n\n if (this.disabled) {\n event.preventDefault();\n return;\n }\n\n // And emit our own click event from the host element\n this.leClick.emit(event);\n };\n\n render() {\n const classes = classnames(\n `variant-${this.variant}`,\n `size-${this.size}`,\n `position-${this.position}`,\n {\n 'selected': this.selected,\n 'full-width': this.fullWidth,\n 'icon-only': this.icon !== undefined,\n 'disabled': this.disabled,\n },\n );\n\n const TagType = this.href ? 'a' : 'button';\n const attrs = this.href\n ? { href: this.href, target: this.target, role: 'button' }\n : { disabled: this.disabled };\n\n return (\n <Host>\n <le-component component=\"le-tab\">\n <TagType\n class={classnames('le-tab-container', `le-tab-align-${this.align}`, classes)}\n part=\"button\"\n {...attrs}\n onClick={this.handleClick}\n tabIndex={this.focusable ? 0 : -1}\n >\n {this.icon !== undefined ? (\n <div class=\"icon-only\">\n <div class=\"icon\">{this.icon}</div>\n {this.showLabel && <span class=\"icon-label\">{this.label}</span>}\n </div>\n ) : (\n <Fragment>\n <span class=\"le-tab-label\">\n {this.iconStart && (\n <span class=\"icon-start\" part=\"icon-start\">\n {this.iconStart}\n </span>\n )}\n <le-slot\n name=\"\"\n description=\"Tab text\"\n type=\"text\"\n class=\"content\"\n part=\"content\"\n >\n <slot>{this.label}</slot>\n </le-slot>\n </span>\n {this.iconEnd && (\n <span class=\"icon-end\" part=\"icon-end\">\n {this.iconEnd}\n </span>\n )}\n </Fragment>\n )}\n </TagType>\n </le-component>\n </Host>\n );\n }\n}\n"],"names":[],"mappings":"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"}
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"le-tabs.entry.esm.js","sources":["src/components/le-tabs/le-tabs.css?tag=le-tabs&encapsulation=shadow","src/components/le-tabs/le-tabs.tsx"],"sourcesContent":["/**\n * le-tabs - Default mode styles\n */\n\n:host {\n display: block;\n --le-tabs-gap: var(--le-spacing-1);\n --le-tabs-border-color: var(--le-border-color);\n --le-tabs-padding-y: var(--le-spacing-2);\n --le-tabs-padding-x: var(--le-spacing-4);\n --le-tabs-enclosed-bg: var(--le-color-background-secondary);\n}\n\n.le-tabs {\n display: flex;\n flex-direction: column;\n}\n\n.le-tabs.orientation-vertical {\n flex-direction: row;\n}\n\n/* ============================================\n * TABLIST\n * ============================================ */\n\n.tablist {\n display: flex;\n position: relative;\n border-radius: var(--le-radius-md);\n gap: var(--le-tabs-gap);\n}\n.tablist.wrap-tabs {\n flex-wrap: wrap;\n}\n.tablist.overflow-auto {\n overflow: auto;\n}\n.tablist.overflow-hidden {\n overflow: hidden;\n}\n.tablist.overflow-visible {\n overflow: visible;\n}\n.tablist.overflow-scroll {\n overflow: scroll;\n}\n.tablist:focus {\n outline: 2px solid var(--le-color-focus);\n outline-offset: 2px;\n}\n\n.orientation-horizontal .tablist {\n flex-direction: row;\n border-bottom: 1px solid var(--le-tabs-border-color);\n}\n\n.orientation-vertical .tablist {\n flex-direction: column;\n border-right: 1px solid var(--le-tabs-border-color);\n min-width: 150px;\n}\n\n.full-width .tablist {\n width: 100%;\n}\n\n.full-width.orientation-horizontal .tab {\n flex: 1;\n}\n\n/* ============================================\n * VARIANT: UNDERLINED\n * ============================================ */\n\n.variant-underlined .tablist {\n padding-inline: 4px;\n}\n\n/* ============================================\n * VARIANT: PILLS\n * ============================================ */\n\n.variant-pills .tablist {\n border-radius: calc(1.12rem);\n}\n\n\n/* ============================================\n * VARIANT: ENCLOSED\n * ============================================ */\n\n.variant-enclosed .tablist {\n border: none;\n gap: 0;\n background-color: var(--le-tabs-enclosed-bg);\n border-radius: calc(var(--le-radius-md) + var(--le-spacing-1));\n padding: var(--le-spacing-1);\n}\n\n/* ============================================\n * TAB ICON\n * ============================================ */\n\n.tab-icon {\n display: inline-flex;\n align-items: center;\n justify-content: center;\n width: 1em;\n height: 1em;\n font-size: 1.1em;\n}\n\n.tab-icon img {\n width: 100%;\n height: 100%;\n object-fit: contain;\n}\n\n/* ============================================\n * PANELS\n * ============================================ */\n\n.panels {\n flex: 1;\n min-height: 0;\n}\n\n.panel {\n padding: var(--le-tabs-panel-padding, var(--le-spacing-4));\n}\n\n.panel[hidden] {\n display: none;\n}\n\n.orientation-vertical .panels {\n padding-left: var(--le-spacing-4);\n}\n\n.position-end .panels {\n order: 1;\n}\n.position-end .tablist {\n order: 2;\n}\n","import {\n Component,\n Prop,\n State,\n Event,\n EventEmitter,\n h,\n Element,\n Watch,\n Listen,\n} from '@stencil/core';\nimport { LeOption, LeOptionValue, LeOptionSelectDetail } from '../../types/options';\nimport { classnames } from '../../utils/utils';\n\ninterface TabConfig {\n label: string;\n value: string;\n iconStart?: string;\n iconEnd?: string;\n disabled: boolean;\n panel?: HTMLElement & { setActive: (active: boolean) => Promise<void> };\n}\n\n/**\n * A flexible tabs component for organizing content into tabbed panels.\n *\n * Supports two modes:\n * 1. **Declarative**: Use `<le-tab-panel>` children to define tabs and content\n * 2. **Programmatic**: Use the `tabs` prop with named slots for content\n *\n * Full keyboard navigation and ARIA support included.\n *\n * @slot - Default slot for le-tab-panel children (declarative mode)\n * @slot panel-{value} - Named slots for panel content (programmatic mode)\n *\n * @cssprop --le-tabs-border-color - Border color for tab list\n * @cssprop --le-tabs-gap - Gap between tabs\n * @cssprop --le-tabs-indicator-color - Active tab indicator color\n * @cssprop --le-tabs-padding-x - Horizontal padding for tab buttons\n * @cssprop --le-tabs-padding-y - Vertical padding for tab buttons\n *\n * @csspart tablist - The tab button container (role=\"tablist\")\n * @csspart tab - Individual tab buttons\n * @csspart tab-active - The currently active tab\n * @csspart panels - Container for panel content\n * @csspart panel - Individual panel containers\n *\n * @cmsEditable true\n * @cmsCategory Navigation\n */\n@Component({\n tag: 'le-tabs',\n styleUrl: 'le-tabs.css',\n shadow: true,\n})\nexport class LeTabs {\n @Element() el: HTMLElement;\n\n /**\n * Array of tab options (programmatic mode).\n * If le-tab-panel children exist, they take precedence.\n */\n @Prop() tabs: LeOption[] = [];\n\n /**\n * The value of the currently selected tab.\n * If not provided, defaults to the first tab.\n */\n @Prop({ mutable: true }) selected?: LeOptionValue;\n\n /**\n * Orientation of the tabs.\n * @allowedValues horizontal | vertical\n */\n @Prop() orientation: 'horizontal' | 'vertical' = 'horizontal';\n\n /**\n * Position of the tabs relative to the panels.\n * @allowedValues start | end\n */\n @Prop() position: 'start' | 'end' = 'start';\n\n /**\n * Tab variant style.\n * @allowedValues underlined | solid | pills | enclosed | icon-only\n */\n @Prop() variant: 'underlined' | 'solid' | 'pills' | 'enclosed' | 'icon-only' = 'underlined';\n\n /**\n * Whether tabs should stretch to fill available width.\n */\n @Prop() fullWidth: boolean = false;\n\n /**\n * Size of the tabs.\n * @allowedValues sm | md | lg\n */\n @Prop() size: 'small' | 'medium' | 'large' = 'medium';\n\n /**\n * Wrap the tabs if they exceed container width.\n */\n @Prop() wrap: boolean = false;\n\n /**\n * Scroll behavior for overflowing tabs.\n * @allowedValues auto | hidden | visible | scroll\n */\n @Prop() overflow: 'auto' | 'hidden' | 'visible' | 'scroll' = 'auto';\n\n /**\n * Internal tab configurations (built from children or tabs prop)\n */\n @State() private tabConfigs: TabConfig[] = [];\n\n /**\n * Internal state for focused tab index (for keyboard navigation)\n */\n @State() private focusedIndex: number = 0;\n\n /**\n * Whether we're using declarative mode (le-tab-panel children)\n */\n @State() private isDeclarativeMode: boolean = false;\n\n /**\n * Emitted when the selected tab changes.\n */\n @Event() leTabChange: EventEmitter<LeOptionSelectDetail>;\n\n private mutationObserver?: MutationObserver;\n\n @Watch('selected')\n selectedChanged(newValue: LeOptionValue) {\n const index = this.tabConfigs.findIndex(t => t.value === newValue);\n if (index >= 0) {\n this.focusedIndex = index;\n }\n this.updatePanelStates();\n }\n\n @Watch('tabs')\n tabsChanged() {\n if (!this.isDeclarativeMode) {\n this.buildTabConfigs();\n }\n }\n\n @Listen('slotchange')\n handleSlotChange() {\n this.buildTabConfigs();\n }\n\n componentWillLoad() {\n this.buildTabConfigs();\n }\n\n connectedCallback() {\n // Watch for dynamic changes to children\n this.mutationObserver = new MutationObserver(() => {\n this.buildTabConfigs();\n });\n this.mutationObserver.observe(this.el, {\n attributes: true,\n childList: true,\n subtree: true,\n });\n }\n\n disconnectedCallback() {\n this.mutationObserver?.disconnect();\n }\n\n private async buildTabConfigs() {\n // Check for le-tab-panel children\n const panels = Array.from(this.el.querySelectorAll(':scope > le-tab-panel')) as Array<\n HTMLElement & {\n getTabConfig: () => Promise<TabConfig>;\n setActive: (active: boolean) => Promise<void>;\n }\n >;\n\n if (panels.length > 0) {\n // Declarative mode - build from children\n this.isDeclarativeMode = true;\n const configs: TabConfig[] = [];\n\n for (const panel of panels) {\n const config = await panel.getTabConfig();\n configs.push({ ...config, panel });\n }\n\n this.tabConfigs = configs;\n } else if (this.tabs.length > 0) {\n // Programmatic mode - use tabs prop\n this.isDeclarativeMode = false;\n this.tabConfigs = this.tabs.map(tab => ({\n label: tab.label,\n value: (tab.value !== undefined ? tab.value : tab.label) as string,\n iconStart: tab.iconStart,\n iconEnd: tab.iconEnd,\n disabled: tab.disabled ?? false,\n }));\n } else {\n this.tabConfigs = [];\n }\n\n // Set default selected\n if (this.selected === undefined && this.tabConfigs.length > 0) {\n const firstEnabled = this.tabConfigs.find(t => !t.disabled);\n if (firstEnabled) {\n this.selected = firstEnabled.value;\n }\n }\n\n // Initialize focused index\n if (this.selected !== undefined) {\n const index = this.tabConfigs.findIndex(t => t.value === this.selected);\n if (index >= 0) {\n this.focusedIndex = index;\n }\n }\n\n // Update panel active states\n this.updatePanelStates();\n }\n\n private async updatePanelStates() {\n if (!this.isDeclarativeMode) return;\n\n for (const config of this.tabConfigs) {\n if (config.panel) {\n const isActive = config.value === this.selected;\n await config.panel.setActive(isActive);\n }\n }\n }\n\n private selectTab(config: TabConfig) {\n if (config.disabled) return;\n\n this.selected = config.value;\n this.leTabChange.emit({\n value: config.value,\n option: {\n label: config.label,\n value: config.value,\n iconStart: config.iconStart,\n iconEnd: config.iconEnd,\n disabled: config.disabled,\n },\n });\n }\n\n private handleTabClick = (config: TabConfig) => {\n this.selectTab(config);\n };\n\n private handleKeyDown = (event: KeyboardEvent) => {\n const { tabConfigs, orientation } = this;\n const isHorizontal = orientation === 'horizontal';\n\n let newIndex = this.focusedIndex;\n\n switch (event.key) {\n case 'ArrowLeft':\n if (isHorizontal) {\n event.preventDefault();\n newIndex = this.findNextEnabledTab(-1);\n }\n break;\n case 'ArrowRight':\n if (isHorizontal) {\n event.preventDefault();\n newIndex = this.findNextEnabledTab(1);\n }\n break;\n case 'ArrowUp':\n if (!isHorizontal) {\n event.preventDefault();\n newIndex = this.findNextEnabledTab(-1);\n }\n break;\n case 'ArrowDown':\n if (!isHorizontal) {\n event.preventDefault();\n newIndex = this.findNextEnabledTab(1);\n }\n break;\n case 'Home':\n event.preventDefault();\n newIndex = this.findFirstEnabledTab();\n break;\n case 'End':\n event.preventDefault();\n newIndex = this.findLastEnabledTab();\n break;\n case 'Enter':\n case ' ':\n event.preventDefault();\n if (tabConfigs[this.focusedIndex]) {\n this.selectTab(tabConfigs[this.focusedIndex]);\n }\n return;\n default:\n return;\n }\n\n if (newIndex !== this.focusedIndex) {\n this.focusedIndex = newIndex;\n this.focusTab(newIndex);\n // Auto-select on focus (recommended for tabs)\n if (tabConfigs[newIndex]) {\n this.selectTab(tabConfigs[newIndex]);\n }\n }\n };\n\n private findNextEnabledTab(direction: 1 | -1): number {\n const { tabConfigs } = this;\n let index = this.focusedIndex;\n const length = tabConfigs.length;\n\n for (let i = 0; i < length; i++) {\n index = (index + direction + length) % length;\n if (!tabConfigs[index].disabled) {\n return index;\n }\n }\n return this.focusedIndex;\n }\n\n private findFirstEnabledTab(): number {\n return this.tabConfigs.findIndex(t => !t.disabled);\n }\n\n private findLastEnabledTab(): number {\n for (let i = this.tabConfigs.length - 1; i >= 0; i--) {\n if (!this.tabConfigs[i].disabled) return i;\n }\n return 0;\n }\n\n private focusTab(index: number) {\n const tablist = this.el.shadowRoot?.querySelector('[role=\"tablist\"]');\n const tab = tablist?.querySelectorAll('[role=\"tab\"]')[index] as HTMLElement;\n tab?.focus();\n }\n\n render() {\n const { tabConfigs, selected, orientation, variant, fullWidth, size, isDeclarativeMode } = this;\n\n const classes = {\n 'le-tabs': true,\n [`orientation-${orientation}`]: true,\n [`position-${this.position}`]: true,\n [`variant-${variant}`]: true,\n [`size-${size}`]: true,\n 'full-width': fullWidth,\n };\n\n const tabPosition =\n this.orientation === 'vertical'\n ? this.position\n : this.position === 'start'\n ? 'top'\n : 'bottom';\n\n return (\n <le-component component=\"le-tabs\" hostClass={classnames(classes)}>\n <div class={classes}>\n <div\n class={{\n 'tablist': true,\n 'wrap-tabs': this.wrap,\n [`overflow-${this.overflow}`]: true,\n }}\n role=\"tablist\"\n aria-orientation={orientation}\n part=\"tablist\"\n onKeyDown={this.handleKeyDown}\n tabIndex={0}\n >\n {tabConfigs.map(config => {\n const isSelected = config.value === selected;\n const tabId = `tab-${config.value}`;\n const panelId = `panel-${config.value}`;\n\n return (\n <le-tab\n key={config.value}\n id={tabId}\n class=\"tab\"\n mode=\"default\"\n variant={this.variant}\n selected={isSelected}\n disabled={config.disabled}\n size={this.size}\n position={tabPosition}\n align={this.orientation === 'vertical' ? 'start' : 'center'}\n role=\"tab\"\n part={isSelected ? 'tab tab-active' : 'tab'}\n aria-selected={isSelected ? 'true' : 'false'}\n aria-controls={panelId}\n aria-disabled={config.disabled ? 'true' : undefined}\n focusable={false}\n onClick={() => this.handleTabClick(config)}\n iconStart={config.iconStart}\n iconEnd={config.iconEnd}\n >\n <span class=\"tab-label\">{config.label}</span>\n </le-tab>\n );\n })}\n </div>\n\n <div class=\"panels\" part=\"panels\">\n {isDeclarativeMode ? (\n // Declarative mode - render slot for le-tab-panel children\n <le-slot\n name=\"\"\n description=\"Tab panels\"\n type=\"slot\"\n allowedComponents=\"le-tab-panel\"\n >\n <slot></slot>\n </le-slot>\n ) : (\n // Programmatic mode - render named slots\n tabConfigs.map(config => {\n const isSelected = config.value === selected;\n const tabId = `tab-${config.value}`;\n const panelId = `panel-${config.value}`;\n\n return (\n <div\n key={config.value}\n id={panelId}\n class={{\n 'panel': true,\n 'panel-active': isSelected,\n }}\n role=\"tabpanel\"\n part=\"panel\"\n aria-labelledby={tabId}\n tabIndex={0}\n hidden={!isSelected}\n >\n <slot name={`panel-${config.value}`}></slot>\n </div>\n );\n })\n )}\n </div>\n </div>\n </le-component>\n );\n }\n}\n"],"names":[],"mappings":"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"}
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"le-tag.entry.esm.js","sources":["src/components/le-tag/le-tag.css?tag=le-tag&encapsulation=shadow","src/components/le-tag/le-tag.tsx"],"sourcesContent":["/**\n * le-tag component styles\n *\n * CSS Custom Properties:\n * --le-tag-font-size\n * --le-tag-font-weight\n * --le-tag-padding-x\n * --le-tag-padding-y\n * --le-tag-border-radius\n * --le-tag-gap\n * --le-tag-bg\n * --le-tag-color\n * --le-tag-border-color\n */\n\n:host {\n display: inline-flex;\n --le-tag-font-size: var(--le-font-size-sm);\n --le-tag-font-weight: var(--le-font-weight-medium);\n --le-tag-color: var(--le-color-text);\n --le-tag-bg: var(--le-color-surface-alt);\n --le-tag-dismiss-size: 1.75em;\n}\n\n:host([disabled]) {\n opacity: 0.5;\n pointer-events: none;\n}\n\n.tag {\n display: inline-flex;\n align-items: center;\n gap: var(--le-tag-gap, 0.375rem);\n padding: var(--le-tag-padding-y, 0.25rem) var(--le-tag-padding-x, 0.625rem);\n font-size: var(--le-tag-font-size);\n font-weight: var(--le-tag-font-weight);\n line-height: 1.4;\n color: var(--le-tag-color, var(--le-color-text, #1f2937));\n background: var(--le-tag-bg, var(--le-color-surface-alt, #f3f4f6));\n border: 1px solid var(--le-tag-border-color, transparent);\n border-radius: var(--le-tag-border-radius, 9999px);\n white-space: nowrap;\n user-select: none;\n}\n\n/* Sizes */\n:host([size='small']) .tag {\n --le-tag-font-size: 0.75rem;\n --le-tag-padding-x: 0.5rem;\n --le-tag-padding-y: 0.125rem;\n --le-tag-gap: 0.25rem;\n --le-tag-dismiss-size: 1.25em;\n}\n\n:host([size='large']) .tag {\n --le-tag-font-size: 1rem;\n --le-tag-padding-x: 0.875rem;\n --le-tag-padding-y: 0.375rem;\n --le-tag-gap: 0.5rem;\n --le-tag-dismiss-size: 2em;\n}\n\n/* Variants */\n:host([variant='primary']) .tag {\n --le-tag-bg: var(--le-color-primary, #dbeafe);\n --le-tag-color: var(--le-color-primary-contrast, #1e40af);\n}\n\n:host([variant='success']) .tag {\n --le-tag-bg: var(--le-color-success, #dcfce7);\n --le-tag-color: var(--le-color-success-contrast, #166534);\n}\n\n:host([variant='warning']) .tag {\n --le-tag-bg: var(--le-color-warning-light, #fef3c7);\n --le-tag-color: var(--le-color-warning-contrast, #92400e);\n}\n\n:host([variant='danger']) .tag {\n --le-tag-bg: var(--le-color-danger, #fee2e2);\n --le-tag-color: var(--le-color-danger-contrast, #991b1b);\n}\n\n/* Icon */\n.tag-icon {\n display: inline-flex;\n align-items: center;\n justify-content: center;\n flex-shrink: 0;\n}\n\n.tag-icon img {\n width: 1em;\n height: 1em;\n object-fit: contain;\n}\n\n/* Label */\n.tag-label {\n display: inline-block;\n}\n\n/* Dismiss button */\n.tag-dismiss {\n display: inline-flex;\n align-items: center;\n justify-content: center;\n width: var(--le-tag-dismiss-size);\n height: var(--le-tag-dismiss-size);\n padding: 0;\n margin-block: calc(var(--le-tag-dismiss-size) * -1);\n margin-right: calc(var(--le-tag-dismiss-size) / 3 * -1);\n border: none;\n background: transparent;\n color: currentColor;\n opacity: 0.6;\n cursor: pointer;\n border-radius: 50%;\n transition: opacity 0.15s ease, background-color 0.15s ease;\n}\n\n.tag-dismiss:hover {\n opacity: 1;\n background: rgba(0, 0, 0, 0.1);\n}\n\n.tag-dismiss:focus-visible {\n outline: 2px solid var(--le-color-primary, #3b82f6);\n outline-offset: 1px;\n}\n\n.tag-dismiss svg {\n width: 0.75em;\n height: 0.75em;\n}\n\n.tag-dismiss:disabled {\n cursor: not-allowed;\n}\n","import { Component, Prop, Event, EventEmitter, h } from '@stencil/core';\n\n/**\n * A tag/chip component for displaying labels with optional dismiss functionality.\n *\n * @cmsEditable false\n * @cmsCategory Form\n *\n * @slot - Default slot for custom content (overrides label prop)\n *\n * @example Basic tag\n * ```html\n * <le-tag label=\"JavaScript\"></le-tag>\n * ```\n *\n * @example Dismissible tag\n * ```html\n * <le-tag label=\"Remove me\" dismissible></le-tag>\n * ```\n *\n * @example With icon\n * ```html\n * <le-tag label=\"Settings\" icon=\"⚙️\"></le-tag>\n * ```\n *\n * @example Different sizes\n * ```html\n * <le-tag label=\"Small\" size=\"small\"></le-tag>\n * <le-tag label=\"Medium\" size=\"medium\"></le-tag>\n * <le-tag label=\"Large\" size=\"large\"></le-tag>\n * ```\n *\n * @example Different variants\n * ```html\n * <le-tag label=\"Default\" variant=\"default\"></le-tag>\n * <le-tag label=\"Primary\" variant=\"primary\"></le-tag>\n * <le-tag label=\"Success\" variant=\"success\"></le-tag>\n * <le-tag label=\"Warning\" variant=\"warning\"></le-tag>\n * <le-tag label=\"Danger\" variant=\"danger\"></le-tag>\n * ```\n */\n@Component({\n tag: 'le-tag',\n styleUrl: 'le-tag.css',\n shadow: true,\n})\nexport class LeTag {\n /**\n * The text label to display in the tag.\n */\n @Prop() label: string;\n\n /**\n * Mode of the popover should be 'default' for internal use\n */\n @Prop({ mutable: true, reflect: true }) mode: 'default' | 'admin';\n\n /**\n * Icon to display before the label.\n * Can be an emoji, URL, or icon name.\n */\n @Prop() icon?: string;\n\n /**\n * Whether the tag can be dismissed (shows close button).\n */\n @Prop() dismissible: boolean = false;\n\n /**\n * Whether the tag is disabled.\n */\n @Prop({ reflect: true }) disabled: boolean = false;\n\n /**\n * The size of the tag.\n */\n @Prop({ reflect: true }) size: 'small' | 'medium' | 'large' = 'medium';\n\n /**\n * The visual variant of the tag.\n */\n @Prop({ reflect: true }) variant: 'default' | 'primary' | 'success' | 'warning' | 'danger' = 'default';\n\n /**\n * Emitted when the dismiss button is clicked.\n */\n @Event() leDismiss: EventEmitter<void>;\n\n private handleDismiss = (e: MouseEvent) => {\n e.stopPropagation();\n if (!this.disabled) {\n this.leDismiss.emit();\n }\n };\n\n private renderIcon() {\n if (!this.icon) return null;\n\n // Check if it's a URL (starts with http, https, or /)\n if (this.icon.startsWith('http') || this.icon.startsWith('/')) {\n return <img class=\"tag-icon\" src={this.icon} alt=\"\" />;\n }\n\n // Otherwise render as text (emoji or icon font)\n return <span class=\"tag-icon\">{this.icon}</span>;\n }\n\n render() {\n return (\n <le-component component=\"le-tag\">\n <span class=\"tag\">\n {this.renderIcon()}\n <span class=\"tag-label\">\n <le-slot name=\"\" tag=\"span\" type=\"text\">\n <slot>{this.label}</slot>\n </le-slot>\n </span>\n {this.dismissible && (\n <button type=\"button\" class=\"tag-dismiss\" onClick={this.handleDismiss} disabled={this.disabled} aria-label=\"Remove\">\n <svg viewBox=\"0 0 16 16\" fill=\"none\" stroke=\"currentColor\" stroke-width=\"2\">\n <path d=\"M4 4l8 8M12 4l-8 8\" />\n </svg>\n </button>\n )}\n </span>\n </le-component>\n );\n }\n}\n"],"names":[],"mappings":";;AAAA,MAAM,QAAQ,GAAG,25EAA25E;;MC8C/5E,KAAK,GAAA,MAAA;;;;;AAChB;;AAEG;AACK,IAAA,KAAK;AAEb;;AAEG;AACqC,IAAA,IAAI;AAE5C;;;AAGG;AACK,IAAA,IAAI;AAEZ;;AAEG;IACK,WAAW,GAAY,KAAK;AAEpC;;AAEG;IACsB,QAAQ,GAAY,KAAK;AAElD;;AAEG;IACsB,IAAI,GAAiC,QAAQ;AAEtE;;AAEG;IACsB,OAAO,GAA6D,SAAS;AAEtG;;AAEG;AACM,IAAA,SAAS;AAEV,IAAA,aAAa,GAAG,CAAC,CAAa,KAAI;QACxC,CAAC,CAAC,eAAe,EAAE;AACnB,QAAA,IAAI,CAAC,IAAI,CAAC,QAAQ,EAAE;AAClB,YAAA,IAAI,CAAC,SAAS,CAAC,IAAI,EAAE;;AAEzB,KAAC;IAEO,UAAU,GAAA;QAChB,IAAI,CAAC,IAAI,CAAC,IAAI;AAAE,YAAA,OAAO,IAAI;;AAG3B,QAAA,IAAI,IAAI,CAAC,IAAI,CAAC,UAAU,CAAC,MAAM,CAAC,IAAI,IAAI,CAAC,IAAI,CAAC,UAAU,CAAC,GAAG,CAAC,EAAE;YAC7D,OAAO,CAAK,CAAA,KAAA,EAAA,EAAA,KAAK,EAAC,UAAU,EAAC,GAAG,EAAE,IAAI,CAAC,IAAI,EAAE,GAAG,EAAC,EAAE,GAAG;;;AAIxD,QAAA,OAAO,CAAA,CAAA,MAAA,EAAA,EAAM,KAAK,EAAC,UAAU,IAAE,IAAI,CAAC,IAAI,CAAQ;;IAGlD,MAAM,GAAA;AACJ,QAAA,QACE,CAAA,CAAA,cAAA,EAAA,EAAA,GAAA,EAAA,0CAAA,EAAc,SAAS,EAAC,QAAQ,EAAA,EAC9B,CAAM,CAAA,MAAA,EAAA,EAAA,GAAA,EAAA,0CAAA,EAAA,KAAK,EAAC,KAAK,EAAA,EACd,IAAI,CAAC,UAAU,EAAE,EAClB,CAAM,CAAA,MAAA,EAAA,EAAA,GAAA,EAAA,0CAAA,EAAA,KAAK,EAAC,WAAW,EAAA,EACrB,CAAS,CAAA,SAAA,EAAA,EAAA,GAAA,EAAA,0CAAA,EAAA,IAAI,EAAC,EAAE,EAAC,GAAG,EAAC,MAAM,EAAC,IAAI,EAAC,MAAM,EAAA,EACrC,CAAA,CAAA,MAAA,EAAA,EAAA,GAAA,EAAA,0CAAA,EAAA,EAAO,IAAI,CAAC,KAAK,CAAQ,CACjB,CACL,EACN,IAAI,CAAC,WAAW,KACf,CAAA,CAAA,QAAA,EAAA,EAAA,GAAA,EAAA,0CAAA,EAAQ,IAAI,EAAC,QAAQ,EAAC,KAAK,EAAC,aAAa,EAAC,OAAO,EAAE,IAAI,CAAC,aAAa,EAAE,QAAQ,EAAE,IAAI,CAAC,QAAQ,EAAA,YAAA,EAAa,QAAQ,EAAA,EACjH,CAAA,CAAA,KAAA,EAAA,EAAA,GAAA,EAAA,0CAAA,EAAK,OAAO,EAAC,WAAW,EAAC,IAAI,EAAC,MAAM,EAAC,MAAM,EAAC,cAAc,EAAA,cAAA,EAAc,GAAG,EAAA,EACzE,CAAM,CAAA,MAAA,EAAA,EAAA,GAAA,EAAA,0CAAA,EAAA,CAAC,EAAC,oBAAoB,EAAG,CAAA,CAC3B,CACC,CACV,CACI,CACM;;;;;;;"}
|
|
@@ -1,2 +1,2 @@
|
|
|
1
|
-
import{r as s,
|
|
2
|
-
//# sourceMappingURL=p-
|
|
1
|
+
import{r as s,c as r,h as t}from"./p-DzgCnDLJ.js";const e=".round-progress--container{position:relative}.round-progress{position:absolute;top:0;left:0;right:0;bottom:0;display:block}.round-progress--progress{filter:drop-shadow(var(--progress-shadow))}.round-progress--circle{fill:none;stroke:var(--progress-color, #999);stroke-width:var(--progress-width, 4);stroke-linecap:var(--progress-linecap, round);animation:progress--circle 0.5s ease-out forwards;transition:stroke-dasharray 0.5s ease-out}@keyframes progress--circle{0%{stroke-dasharray:0 1000}}.round-progress--path{fill:none;stroke-linecap:round}";const o=class{constructor(r){s(this,r)}get el(){return r(this)}value=0;updateValue(s){this.value=parseFloat(s)}padding=0;updatePadding(s){this.padding=parseFloat(s);this.calcParams()}paths;updateProgressBackgrounds(s){this.progressPaths=JSON.parse(s)}progressPaths;params;componentWillLoad(){if(typeof this.paths==="string"){this.updateProgressBackgrounds(this.paths)}this.calcParams()}calcParams(){const s=this.el.getBoundingClientRect().width;const r=s-this.padding;const t=Math.PI*r;this.params={width:s,diameter:r,circumference:t}}getViewBox(){return"0 0 "+this.params.width+" "+this.params.width}getPath(){return"M"+this.params.width/2+" "+(this.params.width-this.params.diameter)/2+" a "+this.params.diameter/2+" "+this.params.diameter/2+" 0 0 1 0 "+this.params.diameter+" a "+this.params.diameter/2+" "+this.params.diameter/2+" 0 0 1 0 -"+this.params.diameter}getStrokeDashArray(){return this.value/100*this.params.circumference+", "+this.params.circumference}getPaths(){if(!this.progressPaths||!this.progressPaths.length){return null}let s=[];this.progressPaths.forEach((r=>{s.push(t("path",{class:"round-progress--path",d:this.getPath(),stroke:r.color,"stroke-width":r.width,"stroke-dasharray":r.dasharray,"stroke-linecap":r.linecap}))}));return t("svg",{viewBox:this.getViewBox(),class:"round-progress"},s)}render(){return t("div",{key:"1dfe2147b5183f45f2e95e31d55228841de541d3",class:"round-progress--container"},this.getPaths(),t("svg",{key:"e16d774ff030122547b453ebd69d0bd01e916a25",viewBox:this.getViewBox(),class:"round-progress round-progress--progress"},t("path",{key:"d3db84e88a6e879f5a06b7592cdb234de9c0fdf1",class:"round-progress--circle","stroke-dasharray":this.getStrokeDashArray(),d:this.getPath()})),t("slot",{key:"5cbe02ff0bc27a432e55f8331cfad00f2c404ded"}))}static get watchers(){return{value:["updateValue"],padding:["updatePadding"],paths:["updateProgressBackgrounds"]}}};o.style=e;export{o as le_round_progress};
|
|
2
|
+
//# sourceMappingURL=p-0bd7803f.entry.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"names":["registerInstance","getElement","h","leRoundProgressCss","LeRoundProgress","constructor","hostRef","this","el","value","updateValue","newValue","parseFloat","padding","updatePadding","calcParams","paths","updateProgressBackgrounds","progressPaths","JSON","parse","params","componentWillLoad","width","getBoundingClientRect","diameter","circumference","Math","PI","getViewBox","getPath","getStrokeDashArray","getPaths","length","forEach","bg","push","class","d","stroke","color","dasharray","linecap","viewBox","render","key","watchers","style"],"sources":["0"],"mappings":"YAAcA,OAAuBC,OAAYC,MAAS,kBAE1D,MAAMC,EAAqB,qiBAE3B,MAAMC,EAAkB,MACpB,WAAAC,CAAYC,GACRN,EAAiBO,KAAMD,EAC3B,CACA,MAAIE,GAAO,OAAOP,EAAWM,KAAO,CAEpCE,MAAQ,EACR,WAAAC,CAAYC,GACRJ,KAAKE,MAAQG,WAAWD,EAC5B,CAEAE,QAAU,EACV,aAAAC,CAAcH,GACVJ,KAAKM,QAAUD,WAAWD,GAC1BJ,KAAKQ,YACT,CAGAC,MACA,yBAAAC,CAA0BN,GACtBJ,KAAKW,cAAgBC,KAAKC,MAAMT,EACpC,CACAO,cACAG,OAQA,iBAAAC,GACI,UAAWf,KAAKS,QAAU,SAAU,CAChCT,KAAKU,0BAA0BV,KAAKS,MACxC,CACAT,KAAKQ,YACT,CACA,UAAAA,GAEI,MAAMQ,EAAQhB,KAAKC,GAAGgB,wBAAwBD,MAC9C,MAAME,EAAWF,EAAQhB,KAAKM,QAE9B,MAAMa,EAAgBC,KAAKC,GAAKH,EAChClB,KAAKc,OAAS,CAAEE,QAAOE,WAAUC,gBACrC,CAKA,UAAAG,GACI,MAAO,OAAStB,KAAKc,OAAOE,MAAQ,IAAMhB,KAAKc,OAAOE,KAC1D,CAKA,OAAAO,GACI,MAAQ,IACJvB,KAAKc,OAAOE,MAAQ,EACpB,KACChB,KAAKc,OAAOE,MAAQhB,KAAKc,OAAOI,UAAY,EAC7C,MACAlB,KAAKc,OAAOI,SAAW,EACvB,IACAlB,KAAKc,OAAOI,SAAW,EACvB,YACAlB,KAAKc,OAAOI,SACZ,MACAlB,KAAKc,OAAOI,SAAW,EACvB,IACAlB,KAAKc,OAAOI,SAAW,EACvB,aACAlB,KAAKc,OAAOI,QACpB,CACA,kBAAAM,GACI,OAAQxB,KAAKE,MAAQ,IAAOF,KAAKc,OAAOK,cAAgB,KAAOnB,KAAKc,OAAOK,aAC/E,CACA,QAAAM,GACI,IAAKzB,KAAKW,gBAAkBX,KAAKW,cAAce,OAAQ,CACnD,OAAO,IACX,CACA,IAAIjB,EAAQ,GACZT,KAAKW,cAAcgB,SAAQC,IACvBnB,EAAMoB,KAAKlC,EAAE,OAAQ,CAAEmC,MAAO,uBAAwBC,EAAG/B,KAAKuB,UAAWS,OAAQJ,EAAGK,MAAO,eAAgBL,EAAGZ,MAAO,mBAAoBY,EAAGM,UAAW,iBAAkBN,EAAGO,UAAW,IAE3L,OAAQxC,EAAE,MAAO,CAAEyC,QAASpC,KAAKsB,aAAcQ,MAAO,kBAAoBrB,EAC9E,CACA,MAAA4B,GACI,OAAQ1C,EAAE,MAAO,CAAE2C,IAAK,2CAA4CR,MAAO,6BAA+B9B,KAAKyB,WAAY9B,EAAE,MAAO,CAAE2C,IAAK,2CAA4CF,QAASpC,KAAKsB,aAAcQ,MAAO,2CAA6CnC,EAAE,OAAQ,CAAE2C,IAAK,2CAA4CR,MAAO,yBAA0B,mBAAoB9B,KAAKwB,qBAAsBO,EAAG/B,KAAKuB,aAAe5B,EAAE,OAAQ,CAAE2C,IAAK,6CAChc,CACA,mBAAWC,GAAa,MAAO,CAC3BrC,MAAS,CAAC,eACVI,QAAW,CAAC,iBACZG,MAAS,CAAC,6BACX,GAEPZ,EAAgB2C,MAAQ5C,SAEfC","ignoreList":[]}
|
|
@@ -0,0 +1,2 @@
|
|
|
1
|
+
import{r as e,d as t,c as i,h as s}from"./p-DzgCnDLJ.js";const l=":host{display:inline-block;min-width:250px;--le-multiselect-min-height:0;--le-multiselect-padding:var(--le-spacing-1) var(--le-spacing-1) var(--le-spacing-1) var(--le-spacing-2);--le-multiselect-border-color:var(--le-color-primary, #3b82f6)}:host([disabled]){opacity:0.5;pointer-events:none}.multiselect-trigger{display:flex;align-items:center;justify-content:space-between;gap:0.5rem;width:100%;min-height:var(--le-multiselect-min-height);padding:var(--le-multiselect-padding);line-height:var(--le-line-height-tight);background:var(--le-multiselect-bg, var(--le-color-surface, #fff));border:1px solid color-mix(in srgb, var(--le-multiselect-border-color) 33%, transparent);border-radius:var(--le-multiselect-border-radius, 0.375rem);cursor:pointer;transition:border-color 0.15s ease, box-shadow 0.15s ease}.multiselect-trigger:hover:not(.is-disabled),:host(:focus-within) .multiselect-trigger:not(.is-disabled){border-color:var(--le-multiselect-border-color)}:host(:focus-within) .multiselect-trigger{outline:2px solid var(--le-color-focus);outline-offset:2px}:host([full-width]){width:100%}.multiselect-trigger.is-open{border-color:var(--le-color-primary, #3b82f6)}.multiselect-trigger.is-disabled{cursor:not-allowed;background:var(--le-color-surface-disabled, #f9fafb)}.multiselect-placeholder{color:color-mix(in srgb, var(--le-color-text-secondary) 66%, transparent)}.multiselect-tags{display:flex;flex-wrap:wrap;gap:0.25rem;flex:1;min-width:0}.multiselect-actions{display:flex;align-items:center;gap:0.25rem;flex-shrink:0}.multiselect-clear{display:flex;align-items:center;justify-content:center;width:1.5rem;height:1.5rem;padding:0;background:transparent;color:var(--le-color-primary, #3b82f6);border:none;border-radius:0.25rem;cursor:pointer;opacity:0.6;transition:opacity 0.15s ease, background-color 0.15s ease}.multiselect-clear:hover{opacity:1;background:var(--le-color-surface-hover, #f3f4f6)}.multiselect-clear svg{width:0.875rem;height:0.875rem}.multiselect-arrow{display:flex;align-items:center;justify-content:center;width:1.5rem;height:1rem;color:var(--le-color-primary, #3b82f6);transition:transform 0.2s ease}.multiselect-arrow svg{width:1rem;height:1rem}.multiselect-trigger.is-open .multiselect-arrow{transform:rotate(180deg)}.search-input::part(container):focus-within{outline:none !important}.search-input{--le-input-radius:var(--le-radius-md)}.multiselect-status{display:block;margin-top:0.25rem;font-size:0.75rem;color:var(--le-color-text-muted, #6b7280)}:host([size='small']) .multiselect-trigger{--le-multiselect-min-height:2rem;--le-multiselect-padding:0.25rem 0.375rem;--le-multiselect-font-size:0.75rem}:host([size='large']) .multiselect-trigger{--le-multiselect-min-height:3rem;--le-multiselect-padding:0.5rem 0.625rem;--le-multiselect-font-size:1rem}";const r=class{constructor(i){e(this,i);this.leChange=t(this,"leChange");this.leOpen=t(this,"leOpen");this.leClose=t(this,"leClose")}get el(){return i(this)}options=[];value=[];placeholder="Select options...";disabled=false;required=false;name;fullWidth=false;size="medium";maxSelections;selectAllLabel="Select All";deselectAllLabel="Deselect All";showSelectAll=false;searchable=false;emptyText="No results found";open=false;leChange;leOpen;leClose;selectedOptions=[];searchQuery="";dropdownEl;inputEl;handleValueChange(){this.updateSelectedOptions()}handleOptionsChange(){this.updateSelectedOptions()}handleShowSelectAllChange(e){if(typeof e!=="boolean"&&typeof e!=="string"){this.showSelectAll=false}else if(typeof e==="boolean"){this.showSelectAll=e}else if(Array.isArray(e)){this.showSelectAll=true;this.selectAllLabel=e[0];this.deselectAllLabel=e[1]||e[0]}else if(typeof e==="string"){this.showSelectAll=true;try{const t=JSON.parse(e);if(Array.isArray(t)&&t.every((e=>typeof e==="string"))){this.selectAllLabel=t[0];this.deselectAllLabel=t[1]||t[0]}else{this.selectAllLabel=e;this.deselectAllLabel=e}}catch{this.selectAllLabel=e;this.deselectAllLabel=e}}}componentWillLoad(){this.updateSelectedOptions();this.handleShowSelectAllChange(this.showSelectAll)}get parsedOptions(){if(typeof this.options==="string"){try{return JSON.parse(this.options)}catch{return[]}}return this.options}get effectiveOptions(){let e=[...this.parsedOptions];if(this.showSelectAll&&e.length>0){const t=this.selectedOptions.length===this.parsedOptions.filter((e=>!e.disabled)).length;e=[{label:t?this.deselectAllLabel:this.selectAllLabel,value:"__select_all__",iconStart:t?"✕":"⇣"},...e]}return e}updateSelectedOptions(){const e=Array.isArray(this.value)?this.value:[];this.selectedOptions=this.parsedOptions.filter((t=>e.includes(t.value??t.label)))}filterOption=(e,t)=>{if(!t)return true;if(e.value==="__select_all__")return true;const i=t.toLowerCase();return e.label.toLowerCase().includes(i)||(e.description?.toLowerCase().includes(i)??false)};handleOptionSelect=e=>{const{value:t}=e.detail;const i=this.parsedOptions.filter((e=>!e.disabled));if(i.length===0)return;if(t==="__select_all__"){if(this.selectedOptions.length===i.length){this.value=[]}else{const e=this.maxSelections?i.slice(0,this.maxSelections):i;this.value=e.map((e=>e.value??e.label))}this.emitChange();return}const s=this.value.includes(t);if(s){this.value=this.value.filter((e=>e!==t));this.selectedOptions=this.selectedOptions.filter((e=>(e.value??e.label)!==t))}else{if(this.maxSelections&&this.value.length>=this.maxSelections){return}this.value=[...this.value,t]}this.emitChange();this.searchQuery=""};emitChange(){this.leChange.emit({values:this.value,options:this.selectedOptions})}handleDropdownOpen=()=>{this.open=true;this.leOpen.emit();if(this.searchable){setTimeout((()=>{this.inputEl?.focus()}),50)}};handleDropdownClose=()=>{this.open=false;this.searchQuery="";this.leClose.emit()};handleTriggerClick=()=>{if(!this.disabled){this.dropdownEl?.toggle()}};handleTriggerKeyDown=e=>{if(this.disabled)return;if(e.key==="Enter"||e.key===" "||e.key==="ArrowDown"){e.preventDefault();this.dropdownEl?.show()}};handleTagDismiss=(e,t)=>{t.stopPropagation();const i=e.value??e.label;this.value=this.value.filter((e=>e!==i));this.selectedOptions=this.selectedOptions.filter((t=>t!==e));this.emitChange()};handleSearchInput=e=>{const t=e.target;this.searchQuery=t.value};handleClearAll=e=>{e.stopPropagation();this.value=[];this.selectedOptions=[];this.emitChange()};async showDropdown(){await(this.dropdownEl?.show())}async hideDropdown(){await(this.dropdownEl?.hide())}async clearSelection(){this.value=[];this.selectedOptions=[];this.emitChange()}renderTags(){if(this.selectedOptions.length===0){return s("span",{class:"multiselect-placeholder"},this.placeholder)}return s("div",{class:"multiselect-tags"},this.selectedOptions.map((e=>s("le-tag",{key:e.value??e.label,label:e.label,icon:e.iconStart,size:this.size==="large"?"medium":"small",dismissible:true,disabled:this.disabled,onLeDismiss:t=>this.handleTagDismiss(e,t),mode:"default"}))))}render(){const e=this.selectedOptions.length>0;const t=this.maxSelections&&this.value.length>=this.maxSelections;return s("le-component",{key:"982102b3b4f499fdd3f91040be9b70f8601b3bf5",component:"le-multiselect"},s("le-dropdown-base",{key:"4fdc8409dac2adbd188f0c019fd9fb730a41219c",ref:e=>this.dropdownEl=e,options:this.effectiveOptions,value:this.value,multiple:true,disabled:this.disabled,filterFn:this.searchable?this.filterOption:undefined,filterQuery:this.searchQuery,emptyText:this.emptyText,showCheckboxes:true,fullWidth:this.fullWidth,onLeOptionSelect:this.handleOptionSelect,onLeDropdownOpen:this.handleDropdownOpen,onLeDropdownClose:this.handleDropdownClose},s("div",{key:"a633ff6c22827ef11ddc86950bcf5309ccf4b58e",slot:"trigger",class:{"multiselect-trigger":true,"has-selections":e,"is-open":this.open,"is-disabled":this.disabled},tabIndex:this.disabled?-1:0,role:"combobox","aria-haspopup":"listbox","aria-expanded":this.open?"true":"false","aria-disabled":this.disabled?"true":undefined,onClick:this.handleTriggerClick,onKeyDown:this.handleTriggerKeyDown},this.renderTags(),s("div",{key:"7b872ae2a4bb5b89c63eb712b63878400d9a6a9d",class:"multiselect-actions"},e&&!this.disabled&&s("button",{key:"a6beb75e3688f6b0329726e6a1016e94ebd5a1a3",type:"button",class:"multiselect-clear",onClick:this.handleClearAll,"aria-label":"Clear all",tabIndex:-1},s("svg",{key:"8f5fd2f3be9e94bac7b8c30384f10a3ba6d6272c",viewBox:"0 0 16 16",fill:"none",stroke:"currentColor","stroke-width":"2"},s("path",{key:"241075a311ef66b150a2e3e566919cabb2054c00",d:"M4 4l8 8M12 4l-8 8"}))),s("span",{key:"780188efcf3e597d9b199ace46471d292e643a62",class:"multiselect-arrow"},s("svg",{key:"3fc4b438b95525c8631fdf73dadad9f5ff5330e3",viewBox:"0 0 16 16",fill:"none",stroke:"currentColor","stroke-width":"2"},s("path",{key:"de1501fff8b39807f97f44994404a849eb71e745",d:"M4 6l4 4 4-4"}))))),this.searchable&&this.open&&s("div",{key:"c92d7e07f90fedc588a40da04ddef0940d8e2872",class:"multiselect-search",slot:"header"},s("le-string-input",{key:"a5425ef9d7cd8c1e13b895dc73d78f0e433431ad",mode:"default",inputRef:e=>this.inputEl=e,class:"search-input",placeholder:"Search...",value:this.searchQuery,onInput:this.handleSearchInput}))),this.name&&this.value.map((e=>s("input",{type:"hidden",name:this.name,value:e.toString(),key:e.toString()}))),t&&s("span",{key:"b1d9b93267637d3d21dc3ad52bb3bbd99831f56f",class:"multiselect-status"},"Maximum ",this.maxSelections," selections"))}static get watchers(){return{value:["handleValueChange"],options:["handleOptionsChange"],showSelectAll:["handleShowSelectAllChange"]}}};r.style=l;export{r as le_multiselect};
|
|
2
|
+
//# sourceMappingURL=p-1f55a4a2.entry.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"names":["registerInstance","createEvent","getElement","h","leMultiselectCss","LeMultiselect","constructor","hostRef","this","leChange","leOpen","leClose","el","options","value","placeholder","disabled","required","name","fullWidth","size","maxSelections","selectAllLabel","deselectAllLabel","showSelectAll","searchable","emptyText","open","selectedOptions","searchQuery","dropdownEl","inputEl","handleValueChange","updateSelectedOptions","handleOptionsChange","handleShowSelectAllChange","newValue","Array","isArray","parsed","JSON","parse","every","item","componentWillLoad","parsedOptions","effectiveOptions","length","allSelected","filter","opt","label","iconStart","valueArray","includes","filterOption","option","query","searchLower","toLowerCase","description","handleOptionSelect","e","detail","enabledOptions","selectableOptions","slice","map","emitChange","isSelected","v","emit","values","handleDropdownOpen","setTimeout","focus","handleDropdownClose","handleTriggerClick","toggle","handleTriggerKeyDown","key","preventDefault","show","handleTagDismiss","stopPropagation","handleSearchInput","target","handleClearAll","showDropdown","hideDropdown","hide","clearSelection","renderTags","class","icon","dismissible","onLeDismiss","mode","render","hasSelections","atMaxSelections","component","ref","multiple","filterFn","undefined","filterQuery","showCheckboxes","onLeOptionSelect","onLeDropdownOpen","onLeDropdownClose","slot","tabIndex","role","onClick","onKeyDown","type","viewBox","fill","stroke","d","inputRef","onInput","val","toString","watchers","style"],"sources":["0"],"mappings":"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","ignoreList":[]}
|
|
@@ -1,2 +1,2 @@
|
|
|
1
|
-
import{r as t,
|
|
2
|
-
//# sourceMappingURL=p-
|
|
1
|
+
import{r as t,c as e,h as i,H as s}from"./p-DzgCnDLJ.js";import{c as n}from"./p-DaA5gINj.js";const r=":host{display:block;box-sizing:border-box}:host([hidden]){display:none}.box{width:100%;height:100%;box-sizing:border-box}.content{width:100%;height:100%;box-sizing:border-box;background:var(--le-box-bg, transparent);border-radius:var(--le-box-border-radius, 0);padding:var(--le-box-padding, 0)}:host(.display-flex) .content{min-height:100%}";const a=class{constructor(e){t(this,e)}get el(){return e(this)}grow=0;shrink=1;basis="auto";width;height;minWidth;maxWidth;minHeight;maxHeight;background;borderRadius;border;alignSelf="auto";alignContent="stretch";justifyContent="start";padding;order;displayFlex=false;innerDirection="vertical";innerGap;getAlignSelf(){const t={auto:"auto",start:"flex-start",center:"center",end:"flex-end",stretch:"stretch",baseline:"baseline"};return t[this.alignSelf]||"auto"}getContentAlign(){const t={start:"flex-start",center:"center",end:"flex-end",stretch:"stretch"};return t[this.alignContent]||"stretch"}getContentJustify(){const t={start:"flex-start",center:"center",end:"flex-end",stretch:"stretch"};return t[this.justifyContent]||"flex-start"}render(){const t={flexGrow:String(this.grow),flexShrink:String(this.shrink),flexBasis:this.basis,alignSelf:this.getAlignSelf()};if(this.width)t.width=this.width;if(this.height)t.height=this.height;if(this.minWidth)t.minWidth=this.minWidth;if(this.maxWidth)t.maxWidth=this.maxWidth;if(this.minHeight)t.minHeight=this.minHeight;if(this.maxHeight)t.maxHeight=this.maxHeight;if(this.order!==undefined)t.order=String(this.order);const e={};if(this.padding){e.padding=this.padding}if(this.background){e.background=this.background}if(this.borderRadius){e.borderRadius=this.borderRadius}if(this.border){e.border=this.border}if(this.displayFlex){e.display="flex";e.flexDirection=this.innerDirection==="vertical"?"column":"row";e.alignItems=this.getContentAlign();e.justifyContent=this.getContentJustify();if(this.innerGap){e.gap=this.innerGap}}const r=n({"has-grow":this.grow>0,"display-flex":this.displayFlex,[`inner-${this.innerDirection}`]:this.displayFlex});return i(s,{key:"8d71daaa3a1f34cf1b5fa3afe4f788d974d14dde",style:t,class:r},i("le-component",{key:"350393fef2159c40de43792502545ba93e0ec84c",component:"le-box"},i("div",{key:"425be85bce62b600a383e164a847a2f0622496bd",class:"box",part:"box"},i("div",{key:"104275e435d64a76428b5934aa0ece7ae3284cd8",class:"content",part:"content",style:e},i("le-slot",{key:"7655d6bd5140ffcac514b266b4ca2f790a44e8ae",name:"",description:"Content inside this flex item",type:"slot","allowed-components":"le-text,le-card,le-button,le-stack,le-box"},i("slot",{key:"47efcfcc9b9efe5283fa8f558026b3b13ea5b959"}))))))}};a.style=r;export{a as le_box};
|
|
2
|
+
//# sourceMappingURL=p-2c37f174.entry.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"names":["registerInstance","getElement","h","Host","classnames","leBoxDefaultCss","LeBox","constructor","hostRef","this","el","grow","shrink","basis","width","height","minWidth","maxWidth","minHeight","maxHeight","background","borderRadius","border","alignSelf","alignContent","justifyContent","padding","order","displayFlex","innerDirection","innerGap","getAlignSelf","alignMap","auto","start","center","end","stretch","baseline","getContentAlign","getContentJustify","justifyMap","render","hostStyle","flexGrow","String","flexShrink","flexBasis","undefined","contentStyle","display","flexDirection","alignItems","gap","hostClass","key","style","class","component","part","name","description","type"],"sources":["0"],"mappings":"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","ignoreList":[]}
|
|
@@ -1,2 +1,2 @@
|
|
|
1
|
-
import{r as t,
|
|
2
|
-
//# sourceMappingURL=p-
|
|
1
|
+
import{r as t,c as s,h as e}from"./p-DzgCnDLJ.js";const i=":host{display:block;cursor:grab}div.turntable{width:100%;height:100%;padding:1px}";const h=class{constructor(s){t(this,s)}get el(){return s(this)}center="center";value=0;updateValue(t){if(!this.rotating){this.currentAngle=parseFloat(t);this.setAngle(this.currentAngle)}}rotating=false;centerX;centerY;pageX;pageY;currentAngle=0;startAngle;handleMouseDown(t){this.rotating=true;this.startAngle=this.getAngle(t.pageX,t.pageY);t.preventDefault();t.stopPropagation();return false}handleMouseMove(t){if(this.rotating){this.setAngle(this.currentAngle+(this.getAngle(t.pageX,t.pageY)-this.startAngle));return false}}handleMouseUp(t){if(this.rotating){const s=this.currentAngle+(this.getAngle(t.pageX,t.pageY)-this.startAngle);this.setAngle(s);this.currentAngle=s;this.rotating=false;return false}}handleWindowResize(){this.getTransformOrigin()}componentDidLoad(){this.el.style.transformOrigin=this.center;this.currentAngle=this.value;this.getTransformOrigin();this.setAngle(this.currentAngle)}componentDidUpdate(){this.getTransformOrigin()}getTransformOrigin(){[this.centerX,this.centerY]=window.getComputedStyle(this.el,null).transformOrigin.split(" ").map((t=>Math.round(parseFloat(t))));let t=null;const s=((t=document.documentElement)||(t=document.body.parentNode))&&typeof t.scrollLeft==="number"?t:document.body;const e=this.el.getBoundingClientRect();this.pageX=Math.round(e.left+s.scrollLeft);this.pageY=Math.round(e.top+s.scrollTop)}getAngle(t,s){const e=t-this.pageX-this.centerX;const i=s-this.pageY-this.centerY;const h=Math.round(Math.atan2(i,e)*180/Math.PI*100)/100;return h}setAngle(t){this.el.style.transform=`rotate(${t}deg)`}render(){return e("div",{key:"9c762d15b467b7c5fa6170b49581d31104f6e76d",class:"turntable",onMouseDown:this.handleMouseDown.bind(this)},e("slot",{key:"8d30d85ebf8002771ff05f758b4b4bc6c12b72c2"}))}static get watchers(){return{value:["updateValue"]}}};h.style=i;export{h as le_turntable};
|
|
2
|
+
//# sourceMappingURL=p-33612923.entry.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"names":["registerInstance","getElement","h","leTurntableCss","LeTurntable","constructor","hostRef","this","el","center","value","updateValue","newValue","rotating","currentAngle","parseFloat","setAngle","centerX","centerY","pageX","pageY","startAngle","handleMouseDown","evt","getAngle","preventDefault","stopPropagation","handleMouseMove","handleMouseUp","angle","handleWindowResize","getTransformOrigin","componentDidLoad","style","transformOrigin","componentDidUpdate","window","getComputedStyle","split","map","val","Math","round","t","scrollContainer","document","documentElement","body","parentNode","scrollLeft","clientRects","getBoundingClientRect","left","top","scrollTop","posX","posY","x","y","atan2","PI","transform","render","key","class","onMouseDown","bind","watchers"],"sources":["0"],"mappings":"YAAcA,OAAuBC,OAAYC,MAAS,kBAE1D,MAAMC,EAAiB,oFAEvB,MAAMC,EAAc,MAChB,WAAAC,CAAYC,GACRN,EAAiBO,KAAMD,EAC3B,CACA,MAAIE,GAAO,OAAOP,EAAWM,KAAO,CAGpCE,OAAS,SAETC,MAAQ,EACR,WAAAC,CAAYC,GACR,IAAKL,KAAKM,SAAU,CAChBN,KAAKO,aAAeC,WAAWH,GAC/BL,KAAKS,SAAST,KAAKO,aACvB,CACJ,CASAD,SAAW,MAEXI,QACAC,QAEAC,MACAC,MACAN,aAAe,EAEfO,WAIA,eAAAC,CAAgBC,GAEZhB,KAAKM,SAAW,KAIhBN,KAAKc,WAAad,KAAKiB,SAASD,EAAIJ,MAAOI,EAAIH,OAE/CG,EAAIE,iBACJF,EAAIG,kBACJ,OAAO,KACX,CAQA,eAAAC,CAAgBJ,GACZ,GAAIhB,KAAKM,SAAU,CAEfN,KAAKS,SAAST,KAAKO,cAAgBP,KAAKiB,SAASD,EAAIJ,MAAOI,EAAIH,OAASb,KAAKc,aAC9E,OAAO,KACX,CACJ,CACA,aAAAO,CAAcL,GACV,GAAIhB,KAAKM,SAAU,CACf,MAAMgB,EAAQtB,KAAKO,cAAgBP,KAAKiB,SAASD,EAAIJ,MAAOI,EAAIH,OAASb,KAAKc,YAC9Ed,KAAKS,SAASa,GACdtB,KAAKO,aAAee,EACpBtB,KAAKM,SAAW,MAChB,OAAO,KACX,CACJ,CAEA,kBAAAiB,GACIvB,KAAKwB,oBACT,CAIA,gBAAAC,GACIzB,KAAKC,GAAGyB,MAAMC,gBAAkB3B,KAAKE,OACrCF,KAAKO,aAAeP,KAAKG,MACzBH,KAAKwB,qBACLxB,KAAKS,SAAST,KAAKO,aACvB,CACA,kBAAAqB,GACI5B,KAAKwB,oBACT,CAOA,kBAAAA,IAEKxB,KAAKU,QAASV,KAAKW,SAAWkB,OAC1BC,iBAAiB9B,KAAKC,GAAI,MAC1B0B,gBAAgBI,MAAM,KACtBC,KAAIC,GAAOC,KAAKC,MAAM3B,WAAWyB,MAEtC,IAAIG,EAAI,KACR,MAAMC,IAAoBD,EAAIE,SAASC,mBAAqBH,EAAIE,SAASE,KAAKC,qBAAuBL,EAAEM,aAAe,SAAWN,EAAIE,SAASE,KAC9I,MAAMG,EAAc3C,KAAKC,GAAG2C,wBAC5B5C,KAAKY,MAAQsB,KAAKC,MAAMQ,EAAYE,KAAOR,EAAgBK,YAC3D1C,KAAKa,MAAQqB,KAAKC,MAAMQ,EAAYG,IAAMT,EAAgBU,UAC9D,CAOA,QAAA9B,CAAS+B,EAAMC,GACX,MAAMC,EAAIF,EAAOhD,KAAKY,MAAQZ,KAAKU,QACnC,MAAMyC,EAAIF,EAAOjD,KAAKa,MAAQb,KAAKW,QACnC,MAAMW,EAAQY,KAAKC,MAAQD,KAAKkB,MAAMD,EAAGD,GAAK,IAAOhB,KAAKmB,GAAM,KAAO,IACvE,OAAO/B,CACX,CACA,QAAAb,CAASa,GACLtB,KAAKC,GAAGyB,MAAM4B,UAAY,UAAUhC,OACxC,CACA,MAAAiC,GACI,OAAQ5D,EAAE,MAAO,CAAE6D,IAAK,2CAA4CC,MAAO,YAAaC,YAAa1D,KAAKe,gBAAgB4C,KAAK3D,OAASL,EAAE,OAAQ,CAAE6D,IAAK,6CAC7J,CACA,mBAAWI,GAAa,MAAO,CAC3BzD,MAAS,CAAC,eACX,GAEPN,EAAY6B,MAAQ9B,SAEXC","ignoreList":[]}
|
|
@@ -1,2 +1,2 @@
|
|
|
1
|
-
import{r as e,
|
|
2
|
-
//# sourceMappingURL=p-
|
|
1
|
+
import{r as e,d as t,c as i,h as n}from"./p-DzgCnDLJ.js";import{c as r}from"./p-DaA5gINj.js";const l=":host{display:block;--le-input-bg:var(--le-color-surface, #ffffff);--le-input-color:var(--le-color-text-primary, #333333);--le-input-border:var(--le-border-width, 2px) solid var(--le-color-border-input, #007bff);--le-input-radius:var(--le-radius-sm, 4px);--le-input-padding:2px 6px;--le-input-height:1.5rem;--le-input-label-color:var(--le-color-text-primary, #333333);--le-input-desc-color:var(--le-color-text-secondary, #666666);--le-input-placeholder-color:#999999;--le-input-border-error:2px solid var(--le-color-danger, #dc3545);--le-input-error-color:var(--le-color-danger, #dc3545)}.le-input-wrapper{display:flex;flex-direction:column;gap:2px}.le-input-label{display:block;font-size:0.9em;font-weight:500;color:var(--le-input-label-color);margin-bottom:2px}.le-input-container{position:relative;display:flex;align-items:center;background:var(--le-input-bg);border:var(--le-input-border);border-radius:var(--le-input-radius);transition:border-color 0.2s}.le-input-container:focus-within{outline:2px solid var(--le-color-focus);outline-offset:2px}.le-input-container.has-error{border:var(--le-input-border-error)}:host([disabled]) .le-input-container{opacity:0.6;background-color:rgba(0,0,0,0.05);cursor:not-allowed}input{flex:1;width:100%;height:calc(var(--le-input-height) - 2px);padding:var(--le-input-padding);border:none;background:transparent;color:var(--le-input-color);font-family:inherit;font-size:inherit;outline:none;text-align:right;-moz-appearance:textfield;}input::-webkit-outer-spin-button,input::-webkit-inner-spin-button{-webkit-appearance:none;margin:0}input::placeholder{color:var(--le-input-placeholder-color)}.icon-start,.icon-end{display:flex;align-items:center;justify-content:center;padding:0 8px;color:var(--le-input-desc-color)}.le-input-controls{display:flex;flex-direction:column;border-left:1px solid var(--le-color-border, #cccccc);height:100%}.le-input-control-btn{--le-button-border-radius:0;--le-button-padding-x:0;--le-button-padding-y:0;--le-button-small-font-size:9.5px;--le-button-small-padding:0 0.2rem;--le-button-icon-aspect-ratio:2;display:flex;align-items:center;justify-content:center;height:50%;cursor:pointer;background:none;border:none;color:var(--le-input-desc-color);font-size:10px;line-height:1}.le-input-control-btn:hover{background-color:rgba(0,0,0,0.05);color:var(--le-color-primary, #007bff)}.le-input-control-btn:active{background-color:rgba(0,0,0,0.1)}.le-input-description{font-size:0.85em;color:var(--le-input-desc-color);margin-top:2px}.le-input-error{font-size:0.85em;color:var(--le-input-error-color);margin-top:2px}";const s=class{constructor(i){e(this,i);this.leChange=t(this,"leChange");this.leInput=t(this,"leInput")}get el(){return i(this)}value;name;label;placeholder;min;max;step=1;required=false;disabled=false;readonly=false;iconStart;showSpinners=true;externalId;isValid=true;validationMessage="";leChange;leInput;valueChanged(){this.validate()}validate(){if(this.required&&(this.value===undefined||this.value===null||isNaN(this.value))){this.isValid=false;this.validationMessage="This field is required";return}if(this.value!==undefined&&this.value!==null&&!isNaN(this.value)){if(this.min!==undefined&&this.value<this.min){this.isValid=false;this.validationMessage=`Value must be at least ${this.min}`;return}if(this.max!==undefined&&this.value>this.max){this.isValid=false;this.validationMessage=`Value must be at most ${this.max}`;return}}this.isValid=true;this.validationMessage=""}emitChange(){this.leChange.emit({value:this.value,name:this.name,externalId:this.externalId,isValid:this.isValid})}emitInput(){this.leInput.emit({value:this.value,name:this.name,externalId:this.externalId,isValid:this.isValid})}updateValue(e){if(this.disabled||this.readonly)return;const t=this.step.toString().split(".")[1]?.length||0;const i=parseFloat(e.toFixed(t));this.value=i;this.validate();this.emitInput()}handleInput=e=>{const t=e.target;const i=parseFloat(t.value);if(t.value===""){this.value=undefined}else if(!isNaN(i)){this.value=i}this.validate();this.emitInput()};handleChange=()=>{this.validate();this.emitChange()};handleKeyDown=e=>{if(this.disabled||this.readonly)return;let t=1;if(e.shiftKey)t=10;if(e.altKey)t=.1;const i=this.value||0;if(e.key==="ArrowUp"){e.preventDefault();this.updateValue(i+this.step*t)}else if(e.key==="ArrowDown"){e.preventDefault();this.updateValue(i-this.step*t)}};handleWheel=e=>{if(this.disabled||this.readonly)return;if(document.activeElement!==e.target)return;e.preventDefault();const t=this.value||0;if(e.deltaY<0){this.updateValue(t+this.step)}else{this.updateValue(t-this.step)}};increment=e=>{e.preventDefault();const t=this.value||0;this.updateValue(t+this.step);this.emitChange()};decrement=e=>{e.preventDefault();const t=this.value||0;this.updateValue(t-this.step);this.emitChange()};render(){return n("le-component",{key:"7d39afd1052ccef592917d7495e18599f11d3406",component:"le-number-input",hostClass:r({disabled:this.disabled})},n("div",{key:"1af0bdff2099c3bba4755cfe27fbee215ad2d047",class:"le-input-wrapper"},this.label&&n("label",{key:"c227db3239ae5a539c945447b44e021915f6d9e8",class:"le-input-label",htmlFor:this.name},this.label),n("div",{key:"4cfea6fab05a1af81dd560d81e79c3a868828605",class:r("le-input-container",{"has-error":!this.isValid})},this.iconStart&&n("span",{key:"bd42857961f70a49892398cd508ef0f53c4b6c70",class:"icon-start"},this.iconStart),n("input",{key:"53bc332a0a9f7119eb15b6cd73edeca040a8c868",id:this.name,type:"number",name:this.name,placeholder:this.placeholder,min:this.min,max:this.max,step:this.step,value:this.value,disabled:this.disabled,readOnly:this.readonly,required:this.required,onInput:this.handleInput,onChange:this.handleChange,onKeyDown:this.handleKeyDown,onWheel:this.handleWheel}),this.showSpinners&&n("div",{key:"f6d1ff990c38a45f09ad764523d46e7b4c78262f",class:"le-input-controls"},n("le-button",{key:"2895f758ead72dae3699de4d5cd8e8fac4a36f9d",mode:"default",variant:"clear",size:"small","icon-only":true,class:"le-input-control-btn",onClick:this.increment,disabled:this.disabled||this.readonly||this.max!==undefined&&this.value>=this.max,tabindex:"-1"},n("span",{key:"56e1186d12cd13ef1867eb1ab63af58c89b45429",slot:"icon-only"},"↑")),n("le-button",{key:"52511872cdd166da5ef5237db8af25722b639eb2",mode:"default",variant:"clear",size:"small","icon-only":true,class:"le-input-control-btn",onClick:this.decrement,disabled:this.disabled||this.readonly||this.min!==undefined&&this.value<=this.min,tabindex:"-1"},n("span",{key:"867153b5fde0c70ce426590b4ae3e8bedf53c29a",slot:"icon-only"},"↓")))),!this.isValid&&n("div",{key:"5d7e522754e64fe2227485f637907977fb60ca6d",class:"le-input-error"},this.validationMessage),n("div",{key:"7f175e902a0fdc4f1d2fe18832d25fe58b9f988d",class:"le-input-description"},n("le-slot",{key:"32b9cfaa207de01d100f3f6542a6975117b1d26f",name:"description",type:"text",tag:"p",label:"Description"},n("slot",{key:"2e56d9ce860162e431afde3d9df8d107f73c1343",name:"description"})))))}static get watchers(){return{value:["valueChanged"]}}};s.style=l;export{s as le_number_input};
|
|
2
|
+
//# sourceMappingURL=p-3a52c4de.entry.js.map
|