le-kit 0.1.12 → 0.1.14
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/components/index.d.ts +33 -0
- package/dist/components/le-box.d.ts +11 -0
- package/dist/components/le-button.d.ts +11 -0
- package/dist/components/le-card.d.ts +11 -0
- package/dist/components/le-checkbox.d.ts +11 -0
- package/dist/components/le-component.d.ts +11 -0
- package/dist/components/le-number-input.d.ts +11 -0
- package/dist/components/le-popover.d.ts +11 -0
- package/dist/components/le-popup.d.ts +11 -0
- package/dist/components/le-round-progress.d.ts +11 -0
- package/dist/components/le-slot.d.ts +11 -0
- package/dist/components/le-stack.d.ts +11 -0
- package/dist/components/le-string-input.d.ts +11 -0
- package/dist/components/le-text.d.ts +11 -0
- package/dist/components/le-turntable.d.ts +11 -0
- package/dist/core/cjs/{index-BsRb_UTe.js → index-B0mg71He.js} +6 -6
- package/dist/core/cjs/index-B0mg71He.js.map +1 -0
- package/dist/core/cjs/index.cjs.js +2 -2
- package/dist/core/cjs/le-box.cjs.entry.js +2 -2
- package/dist/core/cjs/le-button.cjs.entry.js +2 -2
- package/dist/core/cjs/le-card.cjs.entry.js +2 -2
- package/dist/core/cjs/le-checkbox.cjs.entry.js +2 -2
- package/dist/core/cjs/le-kit.cjs.js +1 -1
- package/dist/core/cjs/le-number-input.cjs.entry.js +2 -2
- package/dist/core/cjs/le-popover.cjs.entry.js +1 -1
- package/dist/core/cjs/le-popup.cjs.entry.js +1 -1
- package/dist/core/cjs/le-round-progress.cjs.entry.js +1 -1
- package/dist/core/cjs/le-stack.cjs.entry.js +2 -2
- package/dist/core/cjs/le-string-input.cjs.entry.js +2 -2
- package/dist/core/cjs/le-text.cjs.entry.js +2 -2
- package/dist/core/cjs/le-turntable.cjs.entry.js +1 -1
- package/dist/core/cjs/loader.cjs.js +1 -1
- package/dist/{cjs/utils-DqhadIxH.js → core/cjs/utils-jdqP71LP.js} +3 -3
- package/dist/core/cjs/{utils-nsP8_w8_.js.map → utils-jdqP71LP.js.map} +1 -1
- package/dist/core/collection/global/app.js +4 -4
- package/dist/core/collection/global/app.js.map +1 -1
- package/dist/core/components/index.d.ts +33 -0
- package/dist/{esm → core/components}/index.js +9 -2
- package/dist/core/components/index.js.map +1 -0
- package/dist/core/components/le-box.d.ts +11 -0
- package/dist/{cjs/le-box.cjs.entry.js → core/components/le-box.js} +87 -14
- package/dist/core/components/le-box.js.map +1 -0
- package/dist/core/components/le-button.d.ts +11 -0
- package/dist/core/components/le-button.js +9 -0
- package/dist/core/components/le-button.js.map +1 -0
- package/dist/{esm/le-button_6.entry.js → core/components/le-button2.js} +919 -972
- package/dist/core/components/le-button2.js.map +1 -0
- package/dist/core/components/le-card.d.ts +11 -0
- package/dist/core/components/le-card.js +84 -0
- package/dist/core/components/le-card.js.map +1 -0
- package/dist/core/components/le-checkbox.d.ts +11 -0
- package/dist/core/components/le-checkbox.js +9 -0
- package/dist/core/components/le-checkbox.js.map +1 -0
- package/dist/core/components/le-component.d.ts +11 -0
- package/dist/core/components/le-component.js +9 -0
- package/dist/core/components/le-component.js.map +1 -0
- package/dist/core/components/le-number-input.d.ts +11 -0
- package/dist/{cjs/le-number-input.cjs.entry.js → core/components/le-number-input.js} +85 -15
- package/dist/core/components/le-number-input.js.map +1 -0
- package/dist/core/components/le-popover.d.ts +11 -0
- package/dist/core/components/le-popover.js +9 -0
- package/dist/core/components/le-popover.js.map +1 -0
- package/dist/{collection/components/le-popover/le-popover.js → core/components/le-popover2.js} +49 -360
- package/dist/core/components/le-popover2.js.map +1 -0
- package/dist/core/components/le-popup.d.ts +11 -0
- package/dist/{cjs/le-popup.cjs.entry.js → core/components/le-popup.js} +88 -21
- package/dist/core/components/le-popup.js.map +1 -0
- package/dist/core/components/le-round-progress.d.ts +11 -0
- package/dist/{cjs/le-round-progress.cjs.entry.js → core/components/le-round-progress.js} +43 -14
- package/dist/core/components/le-round-progress.js.map +1 -0
- package/dist/core/components/le-slot.d.ts +11 -0
- package/dist/core/components/le-slot.js +9 -0
- package/dist/core/components/le-slot.js.map +1 -0
- package/dist/core/components/le-stack.d.ts +11 -0
- package/dist/{cjs/le-stack.cjs.entry.js → core/components/le-stack.js} +78 -14
- package/dist/core/components/le-stack.js.map +1 -0
- package/dist/core/components/le-string-input.d.ts +11 -0
- package/dist/core/components/le-string-input.js +9 -0
- package/dist/core/components/le-string-input.js.map +1 -0
- package/dist/core/components/le-text.d.ts +11 -0
- package/dist/{cjs/le-text.cjs.entry.js → core/components/le-text.js} +80 -16
- package/dist/core/components/le-text.js.map +1 -0
- package/dist/core/components/le-turntable.d.ts +11 -0
- package/dist/{cjs/le-turntable.cjs.entry.js → core/components/le-turntable.js} +37 -12
- package/dist/core/components/le-turntable.js.map +1 -0
- package/dist/core/components/utils.js +310 -0
- package/dist/core/components/utils.js.map +1 -0
- package/dist/core/esm/{index-CJ-z5Zj1.js → index-SKsXnjWI.js} +6 -6
- package/dist/core/{le-kit/p-CJ-z5Zj1.js.map → esm/index-SKsXnjWI.js.map} +1 -1
- package/dist/core/esm/index.js +2 -2
- package/dist/core/esm/le-box.entry.js +2 -2
- package/dist/core/esm/le-button.entry.js +2 -2
- package/dist/core/esm/le-card.entry.js +2 -2
- package/dist/core/esm/le-checkbox.entry.js +2 -2
- package/dist/core/esm/le-kit.js +2 -2
- package/dist/core/esm/le-number-input.entry.js +2 -2
- package/dist/core/esm/le-popover.entry.js +1 -1
- package/dist/core/esm/le-popup.entry.js +1 -1
- package/dist/core/esm/le-round-progress.entry.js +1 -1
- package/dist/core/esm/le-stack.entry.js +2 -2
- package/dist/core/esm/le-string-input.entry.js +2 -2
- package/dist/core/esm/le-text.entry.js +2 -2
- package/dist/core/esm/le-turntable.entry.js +1 -1
- package/dist/core/esm/loader.js +2 -2
- package/dist/{esm/utils-Cf7fMI0j.js → core/esm/utils-DZdP1JiG.js} +3 -3
- package/dist/core/esm/{utils-Bxmld82M.js.map → utils-DZdP1JiG.js.map} +1 -1
- package/dist/core/le-kit/index.esm.js +1 -1
- package/dist/core/le-kit/le-kit.esm.js +1 -1
- package/dist/core/le-kit/p--VxUdzYV.js +2 -0
- package/dist/core/le-kit/{p-Drz36PDp.js.map → p--VxUdzYV.js.map} +1 -1
- package/dist/core/le-kit/{p-2ac4789a.entry.js → p-189cb775.entry.js} +2 -2
- package/dist/core/le-kit/{p-556086ca.entry.js → p-35c1d413.entry.js} +2 -2
- package/dist/core/le-kit/{p-aa6e906f.entry.js → p-4f133e72.entry.js} +2 -2
- package/dist/core/le-kit/{p-df552906.entry.js → p-55f70091.entry.js} +2 -2
- package/dist/core/le-kit/{p-e0861e82.entry.js → p-5fd7b23a.entry.js} +2 -2
- package/dist/core/le-kit/{p-5ef81068.entry.js → p-6e414a5c.entry.js} +2 -2
- package/dist/core/le-kit/{p-d75214f9.entry.js → p-7b121ca7.entry.js} +2 -2
- package/dist/core/le-kit/{p-45eace7c.entry.js → p-8c81fa95.entry.js} +2 -2
- package/dist/core/le-kit/{p-257495cc.entry.js → p-9aa81442.entry.js} +2 -2
- package/dist/core/le-kit/p-SKsXnjWI.js +3 -0
- package/dist/core/le-kit/p-SKsXnjWI.js.map +1 -0
- package/dist/core/le-kit/{p-66d35f48.entry.js → p-a9d05ef6.entry.js} +2 -2
- package/dist/core/le-kit/{p-73682c5e.entry.js → p-b2bd2a80.entry.js} +2 -2
- package/dist/core/le-kit/{p-0308bd1f.entry.js → p-ccac9611.entry.js} +2 -2
- package/dist/core/types/global/app.d.ts +4 -4
- package/dist/le-kit/assets/custom-elements.json +1230 -1230
- package/dist/le-kit/index-CAY3Hk_i.js +4559 -0
- package/dist/le-kit/index-CAY3Hk_i.js.map +1 -0
- package/dist/le-kit/index.esm.js +116 -2
- package/dist/le-kit/index.esm.js.map +1 -1
- package/dist/{esm → le-kit}/le-box.entry.js +3 -3
- package/dist/le-kit/le-button.entry.esm.js.map +1 -0
- package/dist/le-kit/le-button.entry.js +90 -0
- package/dist/{esm → le-kit}/le-card.entry.js +3 -3
- package/dist/le-kit/le-checkbox.entry.esm.js.map +1 -0
- package/dist/le-kit/le-checkbox.entry.js +59 -0
- package/dist/le-kit/le-component.entry.esm.js.map +1 -0
- package/dist/{collection/components/le-component/le-component.js → le-kit/le-component.entry.js} +19 -138
- package/dist/le-kit/le-kit.css +1010 -1
- package/dist/le-kit/le-kit.esm.js +48 -2
- package/dist/le-kit/le-kit.esm.js.map +1 -1
- package/dist/{esm → le-kit}/le-number-input.entry.js +5 -5
- package/dist/le-kit/le-popover.entry.esm.js.map +1 -0
- package/dist/le-kit/le-popover.entry.js +346 -0
- package/dist/{esm → le-kit}/le-popup.entry.js +6 -6
- package/dist/{esm → le-kit}/le-round-progress.entry.js +2 -2
- package/dist/le-kit/le-slot.entry.esm.js.map +1 -0
- package/dist/{collection/components/le-slot/le-slot.js → le-kit/le-slot.entry.js} +20 -273
- package/dist/{esm → le-kit}/le-stack.entry.js +3 -3
- package/dist/le-kit/le-string-input.entry.esm.js.map +1 -0
- package/dist/le-kit/le-string-input.entry.js +93 -0
- package/dist/{esm → le-kit}/le-text.entry.js +3 -3
- package/dist/{esm → le-kit}/le-turntable.entry.js +2 -2
- package/dist/{core/esm/utils-Bxmld82M.js → le-kit/utils-cwSNy7ZS.js} +3 -3
- package/dist/{esm/utils-Cf7fMI0j.js.map → le-kit/utils-cwSNy7ZS.js.map} +1 -1
- package/dist/types/global/app.d.ts +4 -4
- package/package.json +4 -5
- package/readme.md +2 -2
- package/custom-elements.json +0 -4305
- package/dist/cjs/index-o1DRKw1g.js +0 -1842
- package/dist/cjs/index-o1DRKw1g.js.map +0 -1
- package/dist/cjs/index.cjs.js +0 -119
- package/dist/cjs/index.cjs.js.map +0 -1
- package/dist/cjs/le-box.entry.cjs.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-button_6.cjs.entry.js +0 -1206
- package/dist/cjs/le-card.cjs.entry.js +0 -29
- package/dist/cjs/le-card.entry.cjs.js.map +0 -1
- package/dist/cjs/le-kit.cjs.js +0 -25
- package/dist/cjs/le-kit.cjs.js.map +0 -1
- package/dist/cjs/le-number-input.entry.cjs.js.map +0 -1
- package/dist/cjs/le-popup.entry.cjs.js.map +0 -1
- package/dist/cjs/le-round-progress.entry.cjs.js.map +0 -1
- package/dist/cjs/le-stack.entry.cjs.js.map +0 -1
- package/dist/cjs/le-text.entry.cjs.js.map +0 -1
- package/dist/cjs/le-turntable.entry.cjs.js.map +0 -1
- package/dist/cjs/loader.cjs.js +0 -13
- package/dist/cjs/loader.cjs.js.map +0 -1
- package/dist/cjs/utils-DqhadIxH.js.map +0 -1
- package/dist/collection/assets/custom-elements.json +0 -4305
- package/dist/collection/collection-manifest.json +0 -26
- package/dist/collection/components/le-box/le-box.default.css +0 -37
- package/dist/collection/components/le-box/le-box.js +0 -614
- package/dist/collection/components/le-box/le-box.js.map +0 -1
- package/dist/collection/components/le-button/le-button.default.css +0 -263
- package/dist/collection/components/le-button/le-button.js +0 -368
- package/dist/collection/components/le-button/le-button.js.map +0 -1
- package/dist/collection/components/le-card/le-card.default.css +0 -74
- package/dist/collection/components/le-card/le-card.js +0 -102
- package/dist/collection/components/le-card/le-card.js.map +0 -1
- package/dist/collection/components/le-checkbox/le-checkbox.css +0 -93
- package/dist/collection/components/le-checkbox/le-checkbox.js +0 -192
- package/dist/collection/components/le-checkbox/le-checkbox.js.map +0 -1
- package/dist/collection/components/le-component/le-component.css +0 -189
- package/dist/collection/components/le-component/le-component.js.map +0 -1
- package/dist/collection/components/le-number-input/le-number-input.css +0 -135
- package/dist/collection/components/le-number-input/le-number-input.js +0 -515
- package/dist/collection/components/le-number-input/le-number-input.js.map +0 -1
- package/dist/collection/components/le-popover/le-popover.css +0 -143
- package/dist/collection/components/le-popover/le-popover.js.map +0 -1
- package/dist/collection/components/le-popup/le-popup.api.js +0 -101
- package/dist/collection/components/le-popup/le-popup.api.js.map +0 -1
- package/dist/collection/components/le-popup/le-popup.css +0 -222
- package/dist/collection/components/le-popup/le-popup.js +0 -596
- package/dist/collection/components/le-popup/le-popup.js.map +0 -1
- package/dist/collection/components/le-round-progress/le-round-progress.css +0 -34
- package/dist/collection/components/le-round-progress/le-round-progress.js +0 -184
- package/dist/collection/components/le-round-progress/le-round-progress.js.map +0 -1
- package/dist/collection/components/le-slot/le-slot.default.css +0 -222
- package/dist/collection/components/le-slot/le-slot.js.map +0 -1
- package/dist/collection/components/le-stack/le-stack.default.css +0 -37
- package/dist/collection/components/le-stack/le-stack.js +0 -389
- package/dist/collection/components/le-stack/le-stack.js.map +0 -1
- package/dist/collection/components/le-string-input/le-string-input.css +0 -83
- package/dist/collection/components/le-string-input/le-string-input.js +0 -359
- package/dist/collection/components/le-string-input/le-string-input.js.map +0 -1
- package/dist/collection/components/le-text/le-text.default.css +0 -169
- package/dist/collection/components/le-text/le-text.js +0 -475
- package/dist/collection/components/le-text/le-text.js.map +0 -1
- package/dist/collection/components/le-turntable/le-turntable.css +0 -10
- package/dist/collection/components/le-turntable/le-turntable.js +0 -210
- package/dist/collection/components/le-turntable/le-turntable.js.map +0 -1
- package/dist/collection/global/app.js +0 -167
- package/dist/collection/global/app.js.map +0 -1
- package/dist/collection/index.js +0 -15
- package/dist/collection/index.js.map +0 -1
- package/dist/collection/types/blocks.js +0 -115
- package/dist/collection/types/blocks.js.map +0 -1
- package/dist/collection/types/options.js +0 -2
- package/dist/collection/types/options.js.map +0 -1
- package/dist/collection/utils/utils.js +0 -141
- package/dist/collection/utils/utils.js.map +0 -1
- package/dist/core/cjs/index-BsRb_UTe.js.map +0 -1
- package/dist/core/cjs/utils-nsP8_w8_.js +0 -152
- package/dist/core/esm/index-CJ-z5Zj1.js.map +0 -1
- package/dist/core/le-kit/p-CJ-z5Zj1.js +0 -3
- package/dist/core/le-kit/p-Drz36PDp.js +0 -2
- package/dist/docs.d.ts +0 -443
- package/dist/docs.json +0 -5185
- package/dist/esm/index-CwNQ1GTa.js +0 -1824
- package/dist/esm/index-CwNQ1GTa.js.map +0 -1
- package/dist/esm/index.js.map +0 -1
- package/dist/esm/le-box.entry.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-card.entry.js.map +0 -1
- package/dist/esm/le-kit.js +0 -21
- package/dist/esm/le-kit.js.map +0 -1
- package/dist/esm/le-number-input.entry.js.map +0 -1
- package/dist/esm/le-popup.entry.js.map +0 -1
- package/dist/esm/le-round-progress.entry.js.map +0 -1
- package/dist/esm/le-stack.entry.js.map +0 -1
- package/dist/esm/le-text.entry.js.map +0 -1
- package/dist/esm/le-turntable.entry.js.map +0 -1
- package/dist/esm/loader.js +0 -11
- package/dist/esm/loader.js.map +0 -1
- package/dist/index.cjs.js +0 -1
- package/dist/index.js +0 -1
- 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/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 +0 -2
- package/dist/le-kit/p-64374730.entry.js.map +0 -1
- package/dist/le-kit/p-79ec6f7c.entry.js +0 -2
- 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 +0 -2
- package/dist/le-kit/p-ad398acd.entry.js.map +0 -1
- package/dist/le-kit/p-b8122ad6.entry.js +0 -2
- package/dist/le-kit/p-b8122ad6.entry.js.map +0 -1
- package/dist/le-kit/p-f9008505.entry.js +0 -2
- package/dist/le-kit/p-f9008505.entry.js.map +0 -1
- package/dist/le-kit/p-y3FECAx9.js +0 -2
- package/dist/le-kit/p-y3FECAx9.js.map +0 -1
- package/dist/themes/base.css +0 -89
- package/dist/themes/dark.css +0 -100
- package/dist/themes/default.css +0 -108
- package/dist/themes/gradient.css +0 -100
- package/dist/themes/index.css +0 -413
- package/dist/themes/minimal.css +0 -100
- package/dist/themes/warm.css +0 -100
- /package/dist/{collection → components}/themes/base.css +0 -0
- /package/dist/{collection → components}/themes/dark.css +0 -0
- /package/dist/{collection → components}/themes/default.css +0 -0
- /package/dist/{collection → components}/themes/gradient.css +0 -0
- /package/dist/{collection → components}/themes/index.css +0 -0
- /package/dist/{collection → components}/themes/minimal.css +0 -0
- /package/dist/{collection → components}/themes/warm.css +0 -0
- /package/dist/core/le-kit/{p-2ac4789a.entry.js.map → p-189cb775.entry.js.map} +0 -0
- /package/dist/core/le-kit/{p-556086ca.entry.js.map → p-35c1d413.entry.js.map} +0 -0
- /package/dist/core/le-kit/{p-aa6e906f.entry.js.map → p-4f133e72.entry.js.map} +0 -0
- /package/dist/core/le-kit/{p-df552906.entry.js.map → p-55f70091.entry.js.map} +0 -0
- /package/dist/core/le-kit/{p-e0861e82.entry.js.map → p-5fd7b23a.entry.js.map} +0 -0
- /package/dist/core/le-kit/{p-5ef81068.entry.js.map → p-6e414a5c.entry.js.map} +0 -0
- /package/dist/core/le-kit/{p-d75214f9.entry.js.map → p-7b121ca7.entry.js.map} +0 -0
- /package/dist/core/le-kit/{p-45eace7c.entry.js.map → p-8c81fa95.entry.js.map} +0 -0
- /package/dist/core/le-kit/{p-257495cc.entry.js.map → p-9aa81442.entry.js.map} +0 -0
- /package/dist/core/le-kit/{p-66d35f48.entry.js.map → p-a9d05ef6.entry.js.map} +0 -0
- /package/dist/core/le-kit/{p-73682c5e.entry.js.map → p-b2bd2a80.entry.js.map} +0 -0
- /package/dist/core/le-kit/{p-0308bd1f.entry.js.map → p-ccac9611.entry.js.map} +0 -0
- /package/dist/le-kit/{themes → dist/components/themes}/base.css +0 -0
- /package/dist/le-kit/{themes → dist/components/themes}/dark.css +0 -0
- /package/dist/le-kit/{themes → dist/components/themes}/default.css +0 -0
- /package/dist/le-kit/{themes → dist/components/themes}/gradient.css +0 -0
- /package/dist/le-kit/{themes → dist/components/themes}/index.css +0 -0
- /package/dist/le-kit/{themes → dist/components/themes}/minimal.css +0 -0
- /package/dist/le-kit/{themes → dist/components/themes}/warm.css +0 -0
|
@@ -1,18 +1,22 @@
|
|
|
1
|
-
|
|
2
|
-
|
|
3
|
-
|
|
1
|
+
import { proxyCustomElement, HTMLElement, createEvent, h } from '@stencil/core/internal/client';
|
|
2
|
+
import { d as defineCustomElement$2, a as defineCustomElement$3, b as defineCustomElement$5, c as defineCustomElement$6, e as defineCustomElement$7 } from './le-button2.js';
|
|
3
|
+
import { d as defineCustomElement$4 } from './le-popover2.js';
|
|
4
4
|
|
|
5
5
|
const lePopupCss = ":host{display:contents}.le-popup-dialog{position:fixed;z-index:100;top:0;right:0;bottom:0;left:0;padding:0;border:none;background:transparent;max-width:none;max-height:none;overflow:visible;--_popup-min-width:var(--le-popup-min-width, 320px);--_popup-max-width:var(--le-popup-max-width, min(500px, 90vw));--_popup-min-height:var(--le-popup-min-height, auto)}.le-popup-dialog::backdrop{background:var(--le-popup-backdrop-color, rgba(0, 0, 0, 0.5));animation:le-popup-backdrop-fade 0.2s ease-out}@keyframes le-popup-backdrop-fade{from{opacity:0}to{opacity:1}}.le-popup-position-center{margin:auto}.le-popup-position-top{margin:var(--le-space-2xl, 48px) auto auto auto}.le-popup-position-top-left{margin:var(--le-space-lg, 24px) auto auto var(--le-space-lg, 24px)}.le-popup-position-top-right{margin:var(--le-space-lg, 24px) var(--le-space-lg, 24px) auto auto}.le-popup-position-bottom{margin:auto auto var(--le-space-2xl, 48px) auto}.le-popup-position-bottom-left{margin:auto auto var(--le-space-lg, 24px) var(--le-space-lg, 24px)}.le-popup-position-bottom-right{margin:auto var(--le-space-lg, 24px) var(--le-space-lg, 24px) auto}.le-popup-container{display:flex;flex-direction:column;min-width:var(--_popup-min-width);max-width:var(--_popup-max-width);min-height:var(--_popup-min-height);max-height:calc(100vh - var(--le-space-2xl, 48px) * 2);background:var(--le-color-surface, #ffffff);border:1px solid var(--le-color-border, #e0e0e0);border-radius:var(--le-radius-lg, 12px);box-shadow:var(--le-shadow-xl, 0 8px 32px rgba(0, 0, 0, 0.15));overflow:hidden;font-family:var(--le-font-family, system-ui, -apple-system, sans-serif);color:var(--le-color-text, #333);animation:le-popup-appear 0.2s ease-out}@keyframes le-popup-appear{from{opacity:0;transform:scale(0.95) translateY(-10px)}to{opacity:1;transform:scale(1) translateY(0)}}.le-popup-header{flex-shrink:0;padding:var(--le-space-md, 16px) var(--le-space-lg, 24px);border-bottom:1px solid var(--le-color-border, #e0e0e0);background:var(--le-color-surface-alt, #f9f9f9);font-size:var(--le-font-size-lg, 1.125rem);font-weight:var(--le-font-weight-semibold, 600);color:var(--le-color-text, #333)}.le-popup-body{flex:1;padding:var(--le-space-lg, 24px);overflow-y:auto}.le-popup-message{margin:0;font-size:var(--le-font-size-md, 1rem);line-height:var(--le-line-height-relaxed, 1.6);color:var(--le-color-text, #333)}.le-popup-message+::slotted(*){margin-top:var(--le-space-md, 16px)}.le-popup-input{display:block;width:100%;margin-top:var(--le-space-md, 16px);padding:var(--le-space-sm, 8px) var(--le-space-md, 16px);font-family:inherit;font-size:var(--le-font-size-md, 1rem);color:var(--le-color-text, #333);background:var(--le-color-background, #fff);border:1px solid var(--le-color-border, #e0e0e0);border-radius:var(--le-radius-md, 8px);outline:none;transition:border-color var(--le-transition-fast, 0.15s ease),\n box-shadow var(--le-transition-fast, 0.15s ease);box-sizing:border-box}.le-popup-input:focus{border-color:var(--le-color-primary, #2196f3);box-shadow:0 0 0 3px var(--le-color-primary-light, rgba(33, 150, 243, 0.2))}.le-popup-input::placeholder{color:var(--le-color-text-muted, #999)}.le-popup-footer{flex-shrink:0;display:flex;justify-content:flex-end;gap:var(--le-space-sm, 8px);padding:var(--le-space-md, 16px) var(--le-space-lg, 24px);border-top:1px solid var(--le-color-border, #e0e0e0);background:var(--le-color-surface-alt, #f9f9f9)}.le-popup-btn{min-width:80px}@media (max-width: 480px){.le-popup-container{min-width:calc(100vw - var(--le-space-md, 16px) * 2);max-width:calc(100vw - var(--le-space-md, 16px) * 2)}.le-popup-footer{flex-direction:column-reverse}.le-popup-btn{width:100%}}";
|
|
6
6
|
|
|
7
|
-
const LePopup = class {
|
|
8
|
-
constructor(
|
|
9
|
-
|
|
10
|
-
|
|
11
|
-
|
|
12
|
-
|
|
13
|
-
this.
|
|
7
|
+
const LePopup$1 = /*@__PURE__*/ proxyCustomElement(class LePopup extends HTMLElement {
|
|
8
|
+
constructor(registerHost) {
|
|
9
|
+
super();
|
|
10
|
+
if (registerHost !== false) {
|
|
11
|
+
this.__registerHost();
|
|
12
|
+
}
|
|
13
|
+
this.__attachShadow();
|
|
14
|
+
this.leConfirm = createEvent(this, "leConfirm", 7);
|
|
15
|
+
this.leCancel = createEvent(this, "leCancel", 7);
|
|
16
|
+
this.leOpen = createEvent(this, "leOpen", 7);
|
|
17
|
+
this.leClose = createEvent(this, "leClose", 7);
|
|
14
18
|
}
|
|
15
|
-
get el() { return
|
|
19
|
+
get el() { return this; }
|
|
16
20
|
/**
|
|
17
21
|
* Whether the popup is currently visible
|
|
18
22
|
*/
|
|
@@ -181,32 +185,95 @@ const LePopup = class {
|
|
|
181
185
|
}
|
|
182
186
|
renderHeader() {
|
|
183
187
|
if (this.hasSlot('header')) {
|
|
184
|
-
return (
|
|
188
|
+
return (h("div", { class: "le-popup-header", part: "header" }, h("slot", { name: "header" })));
|
|
185
189
|
}
|
|
186
190
|
if (this.popupTitle) {
|
|
187
|
-
return (
|
|
191
|
+
return (h("div", { class: "le-popup-header", part: "header" }, this.popupTitle));
|
|
188
192
|
}
|
|
189
193
|
return null;
|
|
190
194
|
}
|
|
191
195
|
renderBody() {
|
|
192
|
-
return (
|
|
196
|
+
return (h("div", { class: "le-popup-body", part: "body" }, this.message && h("p", { class: "le-popup-message" }, this.message), this.type === 'prompt' && (h("input", { type: "text", class: "le-popup-input", part: "input", placeholder: this.placeholder, value: this.inputValue, onInput: this.handleInputChange, onKeyDown: this.handleKeyDown, ref: (el) => (this.inputEl = el) })), h("le-slot", { name: "", tag: "div", description: "Custom popup content", type: "slot" }, h("slot", null))));
|
|
193
197
|
}
|
|
194
198
|
renderFooter() {
|
|
195
199
|
if (this.hasSlot('footer')) {
|
|
196
|
-
return (
|
|
200
|
+
return (h("div", { class: "le-popup-footer", part: "footer" }, h("slot", { name: "footer" })));
|
|
197
201
|
}
|
|
198
202
|
// For custom type without footer slot, don't render default buttons
|
|
199
203
|
if (this.type === 'custom') {
|
|
200
204
|
return null;
|
|
201
205
|
}
|
|
202
|
-
return (
|
|
206
|
+
return (h("div", { class: "le-popup-footer", part: "footer" }, (this.type === 'confirm' || this.type === 'prompt') && (h("le-button", { variant: "outlined", part: "button-cancel", class: "le-popup-btn", onClick: this.handleCancel }, this.cancelText)), h("le-button", { variant: "solid", part: "button-confirm", class: "le-popup-btn", onClick: this.handleConfirm }, this.confirmText)));
|
|
203
207
|
}
|
|
204
208
|
render() {
|
|
205
209
|
const positionClass = `le-popup-position-${this.position}`;
|
|
206
|
-
return (
|
|
210
|
+
return (h("dialog", { key: '1c38c82d3f466449ff57f731fc22936a7e5af0eb', class: `le-popup-dialog ${positionClass}`, part: "dialog", ref: (el) => (this.dialogEl = el), onClick: this.handleBackdropClick }, h("le-component", { key: '8f82316129786f9fe17ae6cc5f5a8cf7cbc3a9b5', component: "le-popup" }, h("div", { key: 'e5fef42ae8b41ea52db123b4576849407be33c65', class: "le-popup-container", part: "container" }, this.renderHeader(), this.renderBody(), this.renderFooter()))));
|
|
211
|
+
}
|
|
212
|
+
static get style() { return lePopupCss; }
|
|
213
|
+
}, [769, "le-popup", {
|
|
214
|
+
"open": [1540],
|
|
215
|
+
"type": [1],
|
|
216
|
+
"popupTitle": [1, "popup-title"],
|
|
217
|
+
"message": [1],
|
|
218
|
+
"modal": [4],
|
|
219
|
+
"position": [1],
|
|
220
|
+
"confirmText": [1, "confirm-text"],
|
|
221
|
+
"cancelText": [1, "cancel-text"],
|
|
222
|
+
"placeholder": [1],
|
|
223
|
+
"defaultValue": [1, "default-value"],
|
|
224
|
+
"closeOnBackdrop": [4, "close-on-backdrop"],
|
|
225
|
+
"inputValue": [32],
|
|
226
|
+
"show": [64],
|
|
227
|
+
"hide": [64]
|
|
228
|
+
}]);
|
|
229
|
+
function defineCustomElement$1() {
|
|
230
|
+
if (typeof customElements === "undefined") {
|
|
231
|
+
return;
|
|
207
232
|
}
|
|
208
|
-
|
|
209
|
-
|
|
233
|
+
const components = ["le-popup", "le-button", "le-checkbox", "le-component", "le-popover", "le-slot", "le-string-input"];
|
|
234
|
+
components.forEach(tagName => { switch (tagName) {
|
|
235
|
+
case "le-popup":
|
|
236
|
+
if (!customElements.get(tagName)) {
|
|
237
|
+
customElements.define(tagName, LePopup$1);
|
|
238
|
+
}
|
|
239
|
+
break;
|
|
240
|
+
case "le-button":
|
|
241
|
+
if (!customElements.get(tagName)) {
|
|
242
|
+
defineCustomElement$7();
|
|
243
|
+
}
|
|
244
|
+
break;
|
|
245
|
+
case "le-checkbox":
|
|
246
|
+
if (!customElements.get(tagName)) {
|
|
247
|
+
defineCustomElement$6();
|
|
248
|
+
}
|
|
249
|
+
break;
|
|
250
|
+
case "le-component":
|
|
251
|
+
if (!customElements.get(tagName)) {
|
|
252
|
+
defineCustomElement$5();
|
|
253
|
+
}
|
|
254
|
+
break;
|
|
255
|
+
case "le-popover":
|
|
256
|
+
if (!customElements.get(tagName)) {
|
|
257
|
+
defineCustomElement$4();
|
|
258
|
+
}
|
|
259
|
+
break;
|
|
260
|
+
case "le-slot":
|
|
261
|
+
if (!customElements.get(tagName)) {
|
|
262
|
+
defineCustomElement$3();
|
|
263
|
+
}
|
|
264
|
+
break;
|
|
265
|
+
case "le-string-input":
|
|
266
|
+
if (!customElements.get(tagName)) {
|
|
267
|
+
defineCustomElement$2();
|
|
268
|
+
}
|
|
269
|
+
break;
|
|
270
|
+
} });
|
|
271
|
+
}
|
|
272
|
+
|
|
273
|
+
const LePopup = LePopup$1;
|
|
274
|
+
const defineCustomElement = defineCustomElement$1;
|
|
275
|
+
|
|
276
|
+
export { LePopup, defineCustomElement };
|
|
277
|
+
//# sourceMappingURL=le-popup.js.map
|
|
210
278
|
|
|
211
|
-
|
|
212
|
-
//# sourceMappingURL=le-popup.entry.cjs.js.map
|
|
279
|
+
//# sourceMappingURL=le-popup.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"file":"le-popup.js","mappings":"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","names":["LePopup","__stencil_proxyCustomElement"],"sources":["src/components/le-popup/le-popup.css?tag=le-popup&encapsulation=shadow","src/components/le-popup/le-popup.tsx"],"sourcesContent":["/* ============================================\n le-popup.css\n Popup/Dialog component using native <dialog>\n Uses CSS variables for easy theming\n ============================================ */\n\n:host {\n display: contents;\n}\n\n/* ============================================\n Native Dialog Element\n ============================================ */\n\n.le-popup-dialog {\n /* Reset default dialog styles */\n position: fixed;\n z-index: 100;\n top: 0;\n right: 0;\n bottom: 0;\n left: 0;\n padding: 0;\n border: none;\n background: transparent;\n max-width: none;\n max-height: none;\n overflow: visible;\n \n /* Sizing variables */\n --_popup-min-width: var(--le-popup-min-width, 320px);\n --_popup-max-width: var(--le-popup-max-width, min(500px, 90vw));\n --_popup-min-height: var(--le-popup-min-height, auto);\n}\n\n/* Backdrop styling (native ::backdrop pseudo-element) */\n.le-popup-dialog::backdrop {\n background: var(--le-popup-backdrop-color, rgba(0, 0, 0, 0.5));\n animation: le-popup-backdrop-fade 0.2s ease-out;\n}\n\n@keyframes le-popup-backdrop-fade {\n from { opacity: 0; }\n to { opacity: 1; }\n}\n\n/* ============================================\n Position Variants\n Using margin to position within viewport\n ============================================ */\n\n/* Center (default) */\n.le-popup-position-center {\n margin: auto;\n}\n\n/* Top positions */\n.le-popup-position-top {\n margin: var(--le-space-2xl, 48px) auto auto auto;\n}\n\n.le-popup-position-top-left {\n margin: var(--le-space-lg, 24px) auto auto var(--le-space-lg, 24px);\n}\n\n.le-popup-position-top-right {\n margin: var(--le-space-lg, 24px) var(--le-space-lg, 24px) auto auto;\n}\n\n/* Bottom positions */\n.le-popup-position-bottom {\n margin: auto auto var(--le-space-2xl, 48px) auto;\n}\n\n.le-popup-position-bottom-left {\n margin: auto auto var(--le-space-lg, 24px) var(--le-space-lg, 24px);\n}\n\n.le-popup-position-bottom-right {\n margin: auto var(--le-space-lg, 24px) var(--le-space-lg, 24px) auto;\n}\n\n/* ============================================\n Container (the visible dialog box)\n ============================================ */\n\n.le-popup-container {\n display: flex;\n flex-direction: column;\n min-width: var(--_popup-min-width);\n max-width: var(--_popup-max-width);\n min-height: var(--_popup-min-height);\n max-height: calc(100vh - var(--le-space-2xl, 48px) * 2);\n background: var(--le-color-surface, #ffffff);\n border: 1px solid var(--le-color-border, #e0e0e0);\n border-radius: var(--le-radius-lg, 12px);\n box-shadow: var(--le-shadow-xl, 0 8px 32px rgba(0, 0, 0, 0.15));\n overflow: hidden;\n font-family: var(--le-font-family, system-ui, -apple-system, sans-serif);\n color: var(--le-color-text, #333);\n \n /* Animation */\n animation: le-popup-appear 0.2s ease-out;\n}\n\n@keyframes le-popup-appear {\n from {\n opacity: 0;\n transform: scale(0.95) translateY(-10px);\n }\n to {\n opacity: 1;\n transform: scale(1) translateY(0);\n }\n}\n\n/* ============================================\n Header\n ============================================ */\n\n.le-popup-header {\n flex-shrink: 0;\n padding: var(--le-space-md, 16px) var(--le-space-lg, 24px);\n border-bottom: 1px solid var(--le-color-border, #e0e0e0);\n background: var(--le-color-surface-alt, #f9f9f9);\n font-size: var(--le-font-size-lg, 1.125rem);\n font-weight: var(--le-font-weight-semibold, 600);\n color: var(--le-color-text, #333);\n}\n\n/* ============================================\n Body\n ============================================ */\n\n.le-popup-body {\n flex: 1;\n padding: var(--le-space-lg, 24px);\n overflow-y: auto;\n}\n\n.le-popup-message {\n margin: 0;\n font-size: var(--le-font-size-md, 1rem);\n line-height: var(--le-line-height-relaxed, 1.6);\n color: var(--le-color-text, #333);\n}\n\n/* When there's both message and slot content */\n.le-popup-message + ::slotted(*) {\n margin-top: var(--le-space-md, 16px);\n}\n\n/* ============================================\n Input (for prompt type)\n ============================================ */\n\n.le-popup-input {\n display: block;\n width: 100%;\n margin-top: var(--le-space-md, 16px);\n padding: var(--le-space-sm, 8px) var(--le-space-md, 16px);\n font-family: inherit;\n font-size: var(--le-font-size-md, 1rem);\n color: var(--le-color-text, #333);\n background: var(--le-color-background, #fff);\n border: 1px solid var(--le-color-border, #e0e0e0);\n border-radius: var(--le-radius-md, 8px);\n outline: none;\n transition: border-color var(--le-transition-fast, 0.15s ease),\n box-shadow var(--le-transition-fast, 0.15s ease);\n box-sizing: border-box;\n}\n\n.le-popup-input:focus {\n border-color: var(--le-color-primary, #2196f3);\n box-shadow: 0 0 0 3px var(--le-color-primary-light, rgba(33, 150, 243, 0.2));\n}\n\n.le-popup-input::placeholder {\n color: var(--le-color-text-muted, #999);\n}\n\n/* ============================================\n Footer (buttons)\n ============================================ */\n\n.le-popup-footer {\n flex-shrink: 0;\n display: flex;\n justify-content: flex-end;\n gap: var(--le-space-sm, 8px);\n padding: var(--le-space-md, 16px) var(--le-space-lg, 24px);\n border-top: 1px solid var(--le-color-border, #e0e0e0);\n background: var(--le-color-surface-alt, #f9f9f9);\n}\n\n/* ============================================\n Buttons\n ============================================ */\n\n.le-popup-btn {\n min-width: 80px;\n}\n\n/* ============================================\n Responsive adjustments\n ============================================ */\n\n@media (max-width: 480px) {\n .le-popup-container {\n min-width: calc(100vw - var(--le-space-md, 16px) * 2);\n max-width: calc(100vw - var(--le-space-md, 16px) * 2);\n }\n \n .le-popup-footer {\n flex-direction: column-reverse;\n }\n \n .le-popup-btn {\n width: 100%;\n }\n}","import { Component, Prop, Method, Event, EventEmitter, State, Element, h } from '@stencil/core';\n\n/**\n * Popup type determines the buttons shown\n */\nexport type PopupType = 'alert' | 'confirm' | 'prompt' | 'custom';\n\n/**\n * Popup position on the screen\n */\nexport type PopupPosition = 'center' | 'top' | 'bottom' | 'top-left' | 'top-right' | 'bottom-left' | 'bottom-right';\n\n/**\n * Result returned by the popup when closed\n */\nexport interface PopupResult {\n confirmed: boolean;\n value?: string;\n}\n\n/**\n * A flexible popup/dialog component for alerts, confirms, prompts, and custom content.\n * \n * Uses the native HTML <dialog> element for proper modal behavior, accessibility,\n * and focus management. Can be used declaratively in HTML or programmatically \n * via leAlert(), leConfirm(), lePrompt().\n *\n * @slot - Default slot for custom body content\n * @slot header - Custom header content (replaces title)\n * @slot footer - Custom footer content (replaces default buttons)\n * \n * @cmsInternal true\n * @cmsCategory System\n */\n@Component({\n tag: 'le-popup',\n styleUrl: 'le-popup.css',\n shadow: true,\n})\nexport class LePopup {\n @Element() el: HTMLElement;\n\n /**\n * Whether the popup is currently visible\n */\n @Prop({ mutable: true, reflect: true }) open: boolean = false;\n\n /**\n * Type of popup: alert (OK only), confirm (OK/Cancel), prompt (input + OK/Cancel), custom\n */\n @Prop() type: PopupType = 'alert';\n\n /**\n * Optional title for the popup header\n */\n @Prop() popupTitle?: string;\n\n /**\n * Message text to display (for alert/confirm/prompt types)\n */\n @Prop() message?: string;\n\n /**\n * Whether the popup is modal (blocks interaction with page behind)\n */\n @Prop() modal: boolean = true;\n\n /**\n * Position of the popup on screen\n */\n @Prop() position: PopupPosition = 'center';\n\n /**\n * Text for the confirm/OK button\n */\n @Prop() confirmText: string = 'OK';\n\n /**\n * Text for the cancel button\n */\n @Prop() cancelText: string = 'Cancel';\n\n /**\n * Placeholder text for prompt input\n */\n @Prop() placeholder: string = '';\n\n /**\n * Default value for prompt input\n */\n @Prop() defaultValue: string = '';\n\n /**\n * Whether clicking the backdrop closes the popup (modal only)\n */\n @Prop() closeOnBackdrop: boolean = true;\n\n /**\n * Internal state for prompt input value\n */\n @State() inputValue: string = '';\n\n /**\n * Emitted when the popup is confirmed (OK clicked)\n */\n @Event() leConfirm: EventEmitter<PopupResult>;\n\n /**\n * Emitted when the popup is cancelled (Cancel clicked or dismissed)\n */\n @Event() leCancel: EventEmitter<PopupResult>;\n\n /**\n * Emitted when the popup opens\n */\n @Event() leOpen: EventEmitter<void>;\n\n /**\n * Emitted when the popup closes\n */\n @Event() leClose: EventEmitter<PopupResult>;\n\n private dialogEl?: HTMLDialogElement;\n private inputEl?: HTMLInputElement;\n private resolvePromise?: (result: PopupResult) => void;\n\n componentWillLoad() {\n this.inputValue = this.defaultValue;\n }\n\n componentDidLoad() {\n // Native dialog handles Escape key automatically when modal\n // We just need to listen for the cancel event\n this.dialogEl?.addEventListener('cancel', this.handleDialogCancel);\n }\n\n disconnectedCallback() {\n this.dialogEl?.removeEventListener('cancel', this.handleDialogCancel);\n }\n\n private handleDialogCancel = (e: Event) => {\n e.preventDefault(); // Prevent default close to handle it ourselves\n this.handleCancel();\n };\n\n /**\n * Opens the popup and returns a promise that resolves when closed\n */\n @Method()\n async show(): Promise<PopupResult> {\n return new Promise((resolve) => {\n this.resolvePromise = resolve;\n this.inputValue = this.defaultValue;\n this.open = true;\n \n // Use requestAnimationFrame to ensure the dialog element is rendered\n requestAnimationFrame(() => {\n if (this.dialogEl) {\n if (this.modal) {\n this.dialogEl.showModal();\n } else {\n this.dialogEl.show();\n }\n \n this.leOpen.emit();\n \n // Focus input for prompt type\n if (this.type === 'prompt' && this.inputEl) {\n this.inputEl.focus();\n this.inputEl.select();\n }\n }\n });\n });\n }\n\n /**\n * Closes the popup with a result\n */\n @Method()\n async hide(confirmed: boolean = false) {\n const result: PopupResult = {\n confirmed,\n value: this.type === 'prompt' ? this.inputValue : undefined,\n };\n \n this.dialogEl?.close();\n this.open = false;\n this.leClose.emit(result);\n \n if (this.resolvePromise) {\n this.resolvePromise(result);\n this.resolvePromise = undefined;\n }\n }\n\n private handleConfirm = () => {\n const result: PopupResult = {\n confirmed: true,\n value: this.type === 'prompt' ? this.inputValue : undefined,\n };\n this.leConfirm.emit(result);\n this.hide(true);\n };\n\n private handleCancel = () => {\n const result: PopupResult = {\n confirmed: false,\n value: undefined,\n };\n this.leCancel.emit(result);\n this.hide(false);\n };\n\n private handleBackdropClick = (e: MouseEvent) => {\n // Check if click was on the dialog backdrop (outside the dialog box)\n if (this.closeOnBackdrop && e.target === this.dialogEl) {\n const rect = this.dialogEl.getBoundingClientRect();\n const clickedInDialog = (\n e.clientX >= rect.left &&\n e.clientX <= rect.right &&\n e.clientY >= rect.top &&\n e.clientY <= rect.bottom\n );\n if (!clickedInDialog) {\n this.handleCancel();\n }\n }\n };\n\n private handleInputChange = (e: Event) => {\n this.inputValue = (e.target as HTMLInputElement).value;\n };\n\n private handleKeyDown = (e: KeyboardEvent) => {\n if (e.key === 'Enter' && this.type !== 'custom') {\n e.preventDefault();\n this.handleConfirm();\n }\n };\n\n private hasSlot(name: string): boolean {\n return !!this.el.querySelector(`[slot=\"${name}\"]`);\n }\n\n private renderHeader() {\n if (this.hasSlot('header')) {\n return (\n <div class=\"le-popup-header\" part=\"header\">\n <slot name=\"header\"></slot>\n </div>\n );\n }\n \n if (this.popupTitle) {\n return (\n <div class=\"le-popup-header\" part=\"header\">\n {this.popupTitle}\n </div>\n );\n }\n \n return null;\n }\n\n private renderBody() {\n return (\n <div class=\"le-popup-body\" part=\"body\">\n {this.message && <p class=\"le-popup-message\">{this.message}</p>}\n \n {this.type === 'prompt' && (\n <input\n type=\"text\"\n class=\"le-popup-input\"\n part=\"input\"\n placeholder={this.placeholder}\n value={this.inputValue}\n onInput={this.handleInputChange}\n onKeyDown={this.handleKeyDown}\n ref={(el) => (this.inputEl = el)}\n />\n )}\n \n {/* Default slot for custom content */}\n <le-slot name=\"\" tag=\"div\" description=\"Custom popup content\" type=\"slot\">\n <slot></slot>\n </le-slot>\n </div>\n );\n }\n\n private renderFooter() {\n if (this.hasSlot('footer')) {\n return (\n <div class=\"le-popup-footer\" part=\"footer\">\n <slot name=\"footer\"></slot>\n </div>\n );\n }\n \n // For custom type without footer slot, don't render default buttons\n if (this.type === 'custom') {\n return null;\n }\n \n return (\n <div class=\"le-popup-footer\" part=\"footer\">\n {(this.type === 'confirm' || this.type === 'prompt') && (\n <le-button\n variant=\"outlined\"\n part=\"button-cancel\"\n class=\"le-popup-btn\"\n onClick={this.handleCancel}\n >\n {this.cancelText}\n </le-button>\n )}\n <le-button\n variant=\"solid\"\n part=\"button-confirm\"\n class=\"le-popup-btn\"\n onClick={this.handleConfirm}\n >\n {this.confirmText}\n </le-button>\n </div>\n );\n }\n\n render() {\n const positionClass = `le-popup-position-${this.position}`;\n \n return (\n <dialog\n class={`le-popup-dialog ${positionClass}`}\n part=\"dialog\"\n ref={(el) => (this.dialogEl = el)}\n onClick={this.handleBackdropClick}\n >\n <le-component component=\"le-popup\">\n <div class=\"le-popup-container\" part=\"container\">\n {this.renderHeader()}\n {this.renderBody()}\n {this.renderFooter()}\n </div>\n </le-component>\n </dialog>\n );\n }\n}\n"],"version":3}
|
|
@@ -0,0 +1,11 @@
|
|
|
1
|
+
import type { Components, JSX } from "../../dist/types/components";
|
|
2
|
+
|
|
3
|
+
interface LeRoundProgress extends Components.LeRoundProgress, HTMLElement {}
|
|
4
|
+
export const LeRoundProgress: {
|
|
5
|
+
prototype: LeRoundProgress;
|
|
6
|
+
new (): LeRoundProgress;
|
|
7
|
+
};
|
|
8
|
+
/**
|
|
9
|
+
* Used to define this component and all nested components recursively.
|
|
10
|
+
*/
|
|
11
|
+
export const defineCustomElement: () => void;
|
|
@@ -1,14 +1,16 @@
|
|
|
1
|
-
|
|
2
|
-
|
|
3
|
-
var index = require('./index-o1DRKw1g.js');
|
|
1
|
+
import { proxyCustomElement, HTMLElement, h } from '@stencil/core/internal/client';
|
|
4
2
|
|
|
5
3
|
const leRoundProgressCss = ".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}";
|
|
6
4
|
|
|
7
|
-
const LeRoundProgress = class {
|
|
8
|
-
constructor(
|
|
9
|
-
|
|
5
|
+
const LeRoundProgress$1 = /*@__PURE__*/ proxyCustomElement(class LeRoundProgress extends HTMLElement {
|
|
6
|
+
constructor(registerHost) {
|
|
7
|
+
super();
|
|
8
|
+
if (registerHost !== false) {
|
|
9
|
+
this.__registerHost();
|
|
10
|
+
}
|
|
11
|
+
this.__attachShadow();
|
|
10
12
|
}
|
|
11
|
-
get el() { return
|
|
13
|
+
get el() { return this; }
|
|
12
14
|
// progress value coming from an attribute
|
|
13
15
|
value = 0;
|
|
14
16
|
updateValue(newValue) {
|
|
@@ -87,20 +89,47 @@ const LeRoundProgress = class {
|
|
|
87
89
|
}
|
|
88
90
|
let paths = [];
|
|
89
91
|
this.progressPaths.forEach(bg => {
|
|
90
|
-
paths.push(
|
|
92
|
+
paths.push(h("path", { class: "round-progress--path", d: this.getPath(), stroke: bg.color, "stroke-width": bg.width, "stroke-dasharray": bg.dasharray, "stroke-linecap": bg.linecap }));
|
|
91
93
|
});
|
|
92
|
-
return (
|
|
94
|
+
return (h("svg", { viewBox: this.getViewBox(), class: "round-progress" }, paths));
|
|
93
95
|
}
|
|
94
96
|
render() {
|
|
95
|
-
return (
|
|
97
|
+
return (h("div", { key: '1ffc36704bee5d0822623ac4559ad2d4690095a4', class: "round-progress--container" }, this.getPaths(), h("svg", { key: '12e4dfe5fe2df0cb672d4c001459b8dcc8253591', viewBox: this.getViewBox(), class: "round-progress round-progress--progress" }, h("path", { key: 'd8ce69610687fb578ce2104bd3eccba24951dd96', class: "round-progress--circle", "stroke-dasharray": this.getStrokeDashArray(), d: this.getPath() })), h("slot", { key: '3976b08a7e838579d6af34a778a8756255d98e57' })));
|
|
96
98
|
}
|
|
97
99
|
static get watchers() { return {
|
|
98
100
|
"value": ["updateValue"],
|
|
99
101
|
"padding": ["updatePadding"],
|
|
100
102
|
"paths": ["updateProgressBackgrounds"]
|
|
101
103
|
}; }
|
|
102
|
-
}
|
|
103
|
-
|
|
104
|
+
static get style() { return leRoundProgressCss; }
|
|
105
|
+
}, [769, "le-round-progress", {
|
|
106
|
+
"value": [2],
|
|
107
|
+
"padding": [2],
|
|
108
|
+
"paths": [1],
|
|
109
|
+
"params": [32]
|
|
110
|
+
}, undefined, {
|
|
111
|
+
"value": ["updateValue"],
|
|
112
|
+
"padding": ["updatePadding"],
|
|
113
|
+
"paths": ["updateProgressBackgrounds"]
|
|
114
|
+
}]);
|
|
115
|
+
function defineCustomElement$1() {
|
|
116
|
+
if (typeof customElements === "undefined") {
|
|
117
|
+
return;
|
|
118
|
+
}
|
|
119
|
+
const components = ["le-round-progress"];
|
|
120
|
+
components.forEach(tagName => { switch (tagName) {
|
|
121
|
+
case "le-round-progress":
|
|
122
|
+
if (!customElements.get(tagName)) {
|
|
123
|
+
customElements.define(tagName, LeRoundProgress$1);
|
|
124
|
+
}
|
|
125
|
+
break;
|
|
126
|
+
} });
|
|
127
|
+
}
|
|
128
|
+
|
|
129
|
+
const LeRoundProgress = LeRoundProgress$1;
|
|
130
|
+
const defineCustomElement = defineCustomElement$1;
|
|
131
|
+
|
|
132
|
+
export { LeRoundProgress, defineCustomElement };
|
|
133
|
+
//# sourceMappingURL=le-round-progress.js.map
|
|
104
134
|
|
|
105
|
-
|
|
106
|
-
//# sourceMappingURL=le-round-progress.entry.cjs.js.map
|
|
135
|
+
//# sourceMappingURL=le-round-progress.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"file":"le-round-progress.js","mappings":"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","names":["LeRoundProgress","__stencil_proxyCustomElement"],"sources":["src/components/le-round-progress/le-round-progress.css?tag=le-round-progress&encapsulation=shadow","src/components/le-round-progress/le-round-progress.tsx"],"sourcesContent":[".round-progress--container {\n position: relative;\n}\n\n.round-progress {\n position: absolute;\n top: 0;\n left: 0;\n right: 0;\n bottom: 0;\n display: block;\n}\n\n.round-progress--progress {\n filter: drop-shadow(var(--progress-shadow));\n}\n\n.round-progress--circle {\n fill: none;\n stroke: var(--progress-color, #999);\n stroke-width: var(--progress-width, 4);\n stroke-linecap: var(--progress-linecap, round);\n animation: progress--circle 0.5s ease-out forwards;\n transition: stroke-dasharray 0.5s ease-out;\n}\n\n@keyframes progress--circle {\n 0% { stroke-dasharray: 0 1000; }\n}\n\n.round-progress--path {\n fill: none;\n stroke-linecap: round;\n}\n","import { Component, Element, h, Prop, State, Watch } from '@stencil/core';\n\n@Component({\n tag: 'le-round-progress',\n styleUrl: 'le-round-progress.css',\n shadow: true,\n})\nexport class LeRoundProgress {\n // host element\n @Element() el: HTMLElement;\n\n // progress value coming from an attribute\n @Prop() value: number = 0;\n @Watch('value')\n updateValue(newValue: string) {\n this.value = parseFloat(newValue);\n }\n\n // padding value coming from an attribute\n @Prop() padding: number = 0;\n @Watch('padding')\n updatePadding(newValue: string) {\n this.padding = parseFloat(newValue);\n this.calcParams();\n }\n\n // the progress backgrounds can be as many as needed\n // but it should be JSON format: double quotes and strict commas\n @Prop() paths: string;\n @Watch('paths')\n updateProgressBackgrounds(newValue: string) {\n this.progressPaths = JSON.parse(newValue);\n }\n progressPaths: any[];\n\n @State() params: {\n width: number;\n diameter: number;\n circumference: number;\n };\n\n /**\n * Component lifecycles\n *\n * Before the component is loaded, we need to calculate and update params\n * using the component size (width of the round progress)\n * and progress width (max of )\n */\n componentWillLoad() {\n if (typeof this.paths === 'string') {\n this.updateProgressBackgrounds(this.paths);\n }\n this.calcParams();\n }\n\n calcParams() {\n // get element width\n const width = this.el.getBoundingClientRect().width;\n const diameter = width - this.padding;\n // calc circumference — we'll need it later to calc the stroke paths\n const circumference = Math.PI * diameter;\n\n this.params = { width, diameter, circumference };\n }\n\n /**\n * Returns the viewPath attribute value for the SVG\n * based on the width of the parent element\n */\n getViewBox() {\n return '0 0 ' + this.params.width + ' ' + this.params.width;\n }\n\n /**\n * Returns the circular path for the progress stroke\n * and additional paths in the background\n */\n getPath() {\n return (\n 'M' +\n this.params.width / 2 +\n ' ' +\n (this.params.width - this.params.diameter) / 2 +\n ' a ' +\n this.params.diameter / 2 +\n ' ' +\n this.params.diameter / 2 +\n ' 0 0 1 0 ' +\n this.params.diameter +\n ' a ' +\n this.params.diameter / 2 +\n ' ' +\n this.params.diameter / 2 +\n ' 0 0 1 0 -' +\n this.params.diameter\n );\n }\n\n getStrokeDashArray() {\n return (this.value / 100) * this.params.circumference + ', ' + this.params.circumference;\n }\n\n getPaths() {\n if (!this.progressPaths || !this.progressPaths.length) {\n return null;\n }\n let paths = [];\n this.progressPaths.forEach(bg => {\n paths.push(<path class=\"round-progress--path\" d={this.getPath()} stroke={bg.color} stroke-width={bg.width} stroke-dasharray={bg.dasharray} stroke-linecap={bg.linecap} />);\n });\n return (\n <svg viewBox={this.getViewBox()} class=\"round-progress\">\n {paths}\n </svg>\n );\n }\n\n render() {\n return (\n <div class=\"round-progress--container\">\n {this.getPaths()}\n <svg viewBox={this.getViewBox()} class=\"round-progress round-progress--progress\">\n <path class=\"round-progress--circle\" stroke-dasharray={this.getStrokeDashArray()} d={this.getPath()} />\n </svg>\n <slot />\n </div>\n );\n }\n}\n"],"version":3}
|
|
@@ -0,0 +1,11 @@
|
|
|
1
|
+
import type { Components, JSX } from "../../dist/types/components";
|
|
2
|
+
|
|
3
|
+
interface LeSlot extends Components.LeSlot, HTMLElement {}
|
|
4
|
+
export const LeSlot: {
|
|
5
|
+
prototype: LeSlot;
|
|
6
|
+
new (): LeSlot;
|
|
7
|
+
};
|
|
8
|
+
/**
|
|
9
|
+
* Used to define this component and all nested components recursively.
|
|
10
|
+
*/
|
|
11
|
+
export const defineCustomElement: () => void;
|
|
@@ -0,0 +1,9 @@
|
|
|
1
|
+
import { h as LeSlot$1, a as defineCustomElement$1 } from './le-button2.js';
|
|
2
|
+
|
|
3
|
+
const LeSlot = LeSlot$1;
|
|
4
|
+
const defineCustomElement = defineCustomElement$1;
|
|
5
|
+
|
|
6
|
+
export { LeSlot, defineCustomElement };
|
|
7
|
+
//# sourceMappingURL=le-slot.js.map
|
|
8
|
+
|
|
9
|
+
//# sourceMappingURL=le-slot.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"file":"le-slot.js","mappings":";;;;;;;","names":[],"sources":[],"sourcesContent":[],"version":3}
|
|
@@ -0,0 +1,11 @@
|
|
|
1
|
+
import type { Components, JSX } from "../../dist/types/components";
|
|
2
|
+
|
|
3
|
+
interface LeStack extends Components.LeStack, HTMLElement {}
|
|
4
|
+
export const LeStack: {
|
|
5
|
+
prototype: LeStack;
|
|
6
|
+
new (): LeStack;
|
|
7
|
+
};
|
|
8
|
+
/**
|
|
9
|
+
* Used to define this component and all nested components recursively.
|
|
10
|
+
*/
|
|
11
|
+
export const defineCustomElement: () => void;
|
|
@@ -1,15 +1,19 @@
|
|
|
1
|
-
|
|
2
|
-
|
|
3
|
-
|
|
4
|
-
|
|
1
|
+
import { proxyCustomElement, HTMLElement, h } from '@stencil/core/internal/client';
|
|
2
|
+
import { h as classnames } from './utils.js';
|
|
3
|
+
import { d as defineCustomElement$2, a as defineCustomElement$3, b as defineCustomElement$5, c as defineCustomElement$6, e as defineCustomElement$7 } from './le-button2.js';
|
|
4
|
+
import { d as defineCustomElement$4 } from './le-popover2.js';
|
|
5
5
|
|
|
6
6
|
const leStackDefaultCss = ":host{display:block}:host([hidden]){display:none}.stack{gap:var(--le-stack-gap, var(--le-space-md))}:host(.full-width){width:100%}:host(.full-height){height:100%}:host(.direction-horizontal) .stack{min-height:0}:host(.direction-vertical) .stack{min-width:0}";
|
|
7
7
|
|
|
8
|
-
const LeStack = class {
|
|
9
|
-
constructor(
|
|
10
|
-
|
|
8
|
+
const LeStack$1 = /*@__PURE__*/ proxyCustomElement(class LeStack extends HTMLElement {
|
|
9
|
+
constructor(registerHost) {
|
|
10
|
+
super();
|
|
11
|
+
if (registerHost !== false) {
|
|
12
|
+
this.__registerHost();
|
|
13
|
+
}
|
|
14
|
+
this.__attachShadow();
|
|
11
15
|
}
|
|
12
|
-
get el() { return
|
|
16
|
+
get el() { return this; }
|
|
13
17
|
/**
|
|
14
18
|
* Direction of the stack layout
|
|
15
19
|
* @allowedValues horizontal | vertical
|
|
@@ -118,7 +122,7 @@ const LeStack = class {
|
|
|
118
122
|
// if (this.fullHeight) {
|
|
119
123
|
// style.height = '100%';
|
|
120
124
|
// }
|
|
121
|
-
const hostClass =
|
|
125
|
+
const hostClass = classnames(`direction-${this.direction}`, {
|
|
122
126
|
'wrap': this.wrap,
|
|
123
127
|
'reverse': this.reverse,
|
|
124
128
|
'full-width': this.fullWidth,
|
|
@@ -126,10 +130,70 @@ const LeStack = class {
|
|
|
126
130
|
});
|
|
127
131
|
// Slot style for admin mode - make items display in the same direction
|
|
128
132
|
const slotStyle = `display: flex; flex-direction: ${this.getFlexDirection()}; gap: ${this.gap || 'var(--le-space-md)'}; flex-wrap: ${this.wrap ? 'wrap' : 'nowrap'}; justify-content: ${this.getJustifyContent()}; align-items: ${this.getAlignItems()};`;
|
|
129
|
-
return (
|
|
133
|
+
return (h("le-component", { key: 'e1547512915e47e4c5ddbcbcbd3971579e45a140', component: "le-stack", hostClass: hostClass }, h("div", { key: '61a4fd57c61c56a8abac0ae2348e6e48034efc4d', class: "stack", part: "stack", style: style }, h("le-slot", { key: '0ef0f996ce0efcb20a47171197d82e5b326c7e8c', name: "", description: `Items arranged ${this.direction}ly${this.maxItems ? ` (max ${this.maxItems})` : ''}`, type: "slot", "allowed-components": "le-text,le-box,le-card,le-button,le-stack", slotStyle: slotStyle }, h("slot", { key: 'f41f351d8b6dbdaf20756e9bc317a35a0424fc6c' })))));
|
|
134
|
+
}
|
|
135
|
+
static get style() { return leStackDefaultCss; }
|
|
136
|
+
}, [769, "le-stack", {
|
|
137
|
+
"direction": [1],
|
|
138
|
+
"gap": [1],
|
|
139
|
+
"align": [1],
|
|
140
|
+
"justify": [1],
|
|
141
|
+
"wrap": [4],
|
|
142
|
+
"alignContent": [1, "align-content"],
|
|
143
|
+
"reverse": [4],
|
|
144
|
+
"maxItems": [2, "max-items"],
|
|
145
|
+
"fullWidth": [4, "full-width"],
|
|
146
|
+
"fullHeight": [4, "full-height"],
|
|
147
|
+
"padding": [1]
|
|
148
|
+
}]);
|
|
149
|
+
function defineCustomElement$1() {
|
|
150
|
+
if (typeof customElements === "undefined") {
|
|
151
|
+
return;
|
|
130
152
|
}
|
|
131
|
-
|
|
132
|
-
|
|
153
|
+
const components = ["le-stack", "le-button", "le-checkbox", "le-component", "le-popover", "le-slot", "le-string-input"];
|
|
154
|
+
components.forEach(tagName => { switch (tagName) {
|
|
155
|
+
case "le-stack":
|
|
156
|
+
if (!customElements.get(tagName)) {
|
|
157
|
+
customElements.define(tagName, LeStack$1);
|
|
158
|
+
}
|
|
159
|
+
break;
|
|
160
|
+
case "le-button":
|
|
161
|
+
if (!customElements.get(tagName)) {
|
|
162
|
+
defineCustomElement$7();
|
|
163
|
+
}
|
|
164
|
+
break;
|
|
165
|
+
case "le-checkbox":
|
|
166
|
+
if (!customElements.get(tagName)) {
|
|
167
|
+
defineCustomElement$6();
|
|
168
|
+
}
|
|
169
|
+
break;
|
|
170
|
+
case "le-component":
|
|
171
|
+
if (!customElements.get(tagName)) {
|
|
172
|
+
defineCustomElement$5();
|
|
173
|
+
}
|
|
174
|
+
break;
|
|
175
|
+
case "le-popover":
|
|
176
|
+
if (!customElements.get(tagName)) {
|
|
177
|
+
defineCustomElement$4();
|
|
178
|
+
}
|
|
179
|
+
break;
|
|
180
|
+
case "le-slot":
|
|
181
|
+
if (!customElements.get(tagName)) {
|
|
182
|
+
defineCustomElement$3();
|
|
183
|
+
}
|
|
184
|
+
break;
|
|
185
|
+
case "le-string-input":
|
|
186
|
+
if (!customElements.get(tagName)) {
|
|
187
|
+
defineCustomElement$2();
|
|
188
|
+
}
|
|
189
|
+
break;
|
|
190
|
+
} });
|
|
191
|
+
}
|
|
192
|
+
|
|
193
|
+
const LeStack = LeStack$1;
|
|
194
|
+
const defineCustomElement = defineCustomElement$1;
|
|
195
|
+
|
|
196
|
+
export { LeStack, defineCustomElement };
|
|
197
|
+
//# sourceMappingURL=le-stack.js.map
|
|
133
198
|
|
|
134
|
-
|
|
135
|
-
//# sourceMappingURL=le-stack.entry.cjs.js.map
|
|
199
|
+
//# sourceMappingURL=le-stack.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"file":"le-stack.js","mappings":";;;;;AAAA,MAAM,iBAAiB,GAAG,mQAAmQ;;MCwBhRA,SAAO,iBAAAC,kBAAA,CAAA,MAAA,OAAA,SAAA,WAAA,CAAA;;;;;;;;;AAGlB;;;AAGG;IACK,SAAS,GAA8B,YAAY;AAE3D;;AAEG;AACK,IAAA,GAAG;AAEX;;;AAGG;IACK,KAAK,GAAwD,SAAS;AAE9E;;;AAGG;IACK,OAAO,GAAmF,OAAO;AAEzG;;AAEG;IACK,IAAI,GAAY,KAAK;AAE7B;;;AAGG;IACK,YAAY,GAA8E,SAAS;AAE3G;;AAEG;IACK,OAAO,GAAY,KAAK;AAEhC;;;AAGG;AACK,IAAA,QAAQ;AAEhB;;AAEG;IACK,SAAS,GAAY,KAAK;AAElC;;AAEG;IACK,UAAU,GAAY,KAAK;AAEnC;;AAEG;AACK,IAAA,OAAO;IAEP,gBAAgB,GAAA;AACtB,QAAA,MAAM,IAAI,GAAG,IAAI,CAAC,SAAS,KAAK,UAAU,GAAG,QAAQ,GAAG,KAAK;AAC7D,QAAA,OAAO,IAAI,CAAC,OAAO,GAAG,CAAG,EAAA,IAAI,CAAU,QAAA,CAAA,GAAG,IAAI;;IAGxC,aAAa,GAAA;AACnB,QAAA,MAAM,QAAQ,GAA2B;AACvC,YAAA,KAAK,EAAE,YAAY;AACnB,YAAA,MAAM,EAAE,QAAQ;AAChB,YAAA,GAAG,EAAE,UAAU;AACf,YAAA,OAAO,EAAE,SAAS;AAClB,YAAA,QAAQ,EAAE,UAAU;SACrB;QACD,OAAO,QAAQ,CAAC,IAAI,CAAC,KAAK,CAAC,IAAI,SAAS;;IAGlC,iBAAiB,GAAA;AACvB,QAAA,MAAM,UAAU,GAA2B;AACzC,YAAA,KAAK,EAAE,YAAY;AACnB,YAAA,MAAM,EAAE,QAAQ;AAChB,YAAA,GAAG,EAAE,UAAU;AACf,YAAA,eAAe,EAAE,eAAe;AAChC,YAAA,cAAc,EAAE,cAAc;AAC9B,YAAA,cAAc,EAAE,cAAc;SAC/B;QACD,OAAO,UAAU,CAAC,IAAI,CAAC,OAAO,CAAC,IAAI,YAAY;;IAGzC,eAAe,GAAA;AACrB,QAAA,MAAM,eAAe,GAA2B;AAC9C,YAAA,KAAK,EAAE,YAAY;AACnB,YAAA,MAAM,EAAE,QAAQ;AAChB,YAAA,GAAG,EAAE,UAAU;AACf,YAAA,OAAO,EAAE,SAAS;AAClB,YAAA,eAAe,EAAE,eAAe;AAChC,YAAA,cAAc,EAAE,cAAc;SAC/B;QACD,OAAO,eAAe,CAAC,IAAI,CAAC,YAAY,CAAC,IAAI,SAAS;;IAGxD,MAAM,GAAA;AACJ,QAAA,MAAM,KAAK,GAA8B;AACvC,YAAA,OAAO,EAAE,MAAM;AACf,YAAA,aAAa,EAAE,IAAI,CAAC,gBAAgB,EAAE;AACtC,YAAA,UAAU,EAAE,IAAI,CAAC,aAAa,EAAE;AAChC,YAAA,cAAc,EAAE,IAAI,CAAC,iBAAiB,EAAE;YACxC,QAAQ,EAAE,IAAI,CAAC,IAAI,GAAG,MAAM,GAAG,QAAQ;SACxC;AAED,QAAA,IAAI,IAAI,CAAC,IAAI,EAAE;AACb,YAAA,KAAK,CAAC,YAAY,GAAG,IAAI,CAAC,eAAe,EAAE;;AAG7C,QAAA,IAAI,IAAI,CAAC,GAAG,EAAE;AACZ,YAAA,KAAK,CAAC,GAAG,GAAG,IAAI,CAAC,GAAG;;AAGtB,QAAA,IAAI,IAAI,CAAC,OAAO,EAAE;AAChB,YAAA,KAAK,CAAC,OAAO,GAAG,IAAI,CAAC,OAAO;;;;;;;;QAW9B,MAAM,SAAS,GAAG,UAAU,CAC1B,aAAa,IAAI,CAAC,SAAS,CAAA,CAAE,EAC7B;YACE,MAAM,EAAE,IAAI,CAAC,IAAI;YACjB,SAAS,EAAE,IAAI,CAAC,OAAO;YACvB,YAAY,EAAE,IAAI,CAAC,SAAS;YAC5B,aAAa,EAAE,IAAI,CAAC,UAAU;AAC/B,SAAA,CACF;;AAGD,QAAA,MAAM,SAAS,GAAG,CAAA,+BAAA,EAAkC,IAAI,CAAC,gBAAgB,EAAE,CAAA,OAAA,EAAU,IAAI,CAAC,GAAG,IAAI,oBAAoB,CAAgB,aAAA,EAAA,IAAI,CAAC,IAAI,GAAG,MAAM,GAAG,QAAQ,sBAAsB,IAAI,CAAC,iBAAiB,EAAE,kBAAkB,IAAI,CAAC,aAAa,EAAE,GAAG;QAEzP,QACE,qEAAc,SAAS,EAAC,UAAU,EAAC,SAAS,EAAE,SAAS,EAAA,EACrD,CAAK,CAAA,KAAA,EAAA,EAAA,GAAA,EAAA,0CAAA,EAAA,KAAK,EAAC,OAAO,EAAC,IAAI,EAAC,OAAO,EAAC,KAAK,EAAE,KAAK,EAAA,EAC1C,CAAA,CAAA,SAAA,EAAA,EAAA,GAAA,EAAA,0CAAA,EACE,IAAI,EAAC,EAAE,EACP,WAAW,EAAE,CAAkB,eAAA,EAAA,IAAI,CAAC,SAAS,CAAA,EAAA,EAAK,IAAI,CAAC,QAAQ,GAAG,CAAA,MAAA,EAAS,IAAI,CAAC,QAAQ,CAAA,CAAA,CAAG,GAAG,EAAE,CAAA,CAAE,EAClG,IAAI,EAAC,MAAM,EACQ,oBAAA,EAAA,2CAA2C,EAC9D,SAAS,EAAE,SAAS,EAAA,EAEpB,CAAA,CAAA,MAAA,EAAA,EAAA,GAAA,EAAA,0CAAA,EAAA,CAAa,CACL,CACN,CACO;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;","names":["LeStack","__stencil_proxyCustomElement"],"sources":["src/components/le-stack/le-stack.default.css?tag=le-stack&encapsulation=shadow","src/components/le-stack/le-stack.tsx"],"sourcesContent":["/**\n * le-stack default styles\n *\n * The component uses inline styles for flex properties to allow\n * dynamic prop-based configuration. This CSS handles theming.\n */\n\n:host {\n display: block;\n}\n\n:host([hidden]) {\n display: none;\n}\n\n/* Base stack container */\n.stack {\n gap: var(--le-stack-gap, var(--le-space-md));\n}\n\n/* Full width/height variants */\n:host(.full-width) {\n width: 100%;\n}\n\n:host(.full-height) {\n height: 100%;\n}\n\n/* Direction-specific defaults */\n:host(.direction-horizontal) .stack {\n min-height: 0;\n}\n\n:host(.direction-vertical) .stack {\n min-width: 0;\n}\n","import { Component, Prop, h, Element } from '@stencil/core';\nimport { classnames } from '../../utils/utils';\n\n/**\n * A flexible stack layout component using CSS flexbox.\n *\n * `le-stack` arranges its children in a row (horizontal) or column (vertical)\n * with configurable spacing, alignment, and wrapping behavior. Perfect for\n * creating responsive layouts.\n *\n * @slot - Default slot for stack items (le-box components recommended)\n *\n * @cssprop --le-stack-gap - Gap between items (defaults to var(--le-space-md))\n *\n * @csspart stack - The main stack container\n *\n * @cmsEditable true\n * @cmsCategory Layout\n */\n@Component({\n tag: 'le-stack',\n styleUrl: 'le-stack.default.css',\n shadow: true,\n})\nexport class LeStack {\n @Element() el: HTMLElement;\n\n /**\n * Direction of the stack layout\n * @allowedValues horizontal | vertical\n */\n @Prop() direction: 'horizontal' | 'vertical' = 'horizontal';\n\n /**\n * Gap between items (CSS value like '8px', '1rem', 'var(--le-space-md)')\n */\n @Prop() gap?: string;\n\n /**\n * Alignment of items on the cross axis\n * @allowedValues start | center | end | stretch | baseline\n */\n @Prop() align: 'start' | 'center' | 'end' | 'stretch' | 'baseline' = 'stretch';\n\n /**\n * Distribution of items on the main axis\n * @allowedValues start | center | end | space-between | space-around | space-evenly\n */\n @Prop() justify: 'start' | 'center' | 'end' | 'space-between' | 'space-around' | 'space-evenly' = 'start';\n\n /**\n * Whether items should wrap to multiple lines\n */\n @Prop() wrap: boolean = false;\n\n /**\n * Alignment of wrapped lines (only applies when wrap is true)\n * @allowedValues start | center | end | stretch | space-between | space-around\n */\n @Prop() alignContent: 'start' | 'center' | 'end' | 'stretch' | 'space-between' | 'space-around' = 'stretch';\n\n /**\n * Whether to reverse the order of items\n */\n @Prop() reverse: boolean = false;\n\n /**\n * Maximum number of items allowed in the stack (for CMS validation)\n * @min 1\n */\n @Prop() maxItems?: number;\n\n /**\n * Whether the stack should take full width of its container\n */\n @Prop() fullWidth: boolean = false;\n\n /**\n * Whether the stack should take full height of its container\n */\n @Prop() fullHeight: boolean = false;\n\n /**\n * Padding inside the stack container (CSS value)\n */\n @Prop() padding?: string;\n\n private getFlexDirection(): string {\n const base = this.direction === 'vertical' ? 'column' : 'row';\n return this.reverse ? `${base}-reverse` : base;\n }\n\n private getAlignItems(): string {\n const alignMap: Record<string, string> = {\n start: 'flex-start',\n center: 'center',\n end: 'flex-end',\n stretch: 'stretch',\n baseline: 'baseline',\n };\n return alignMap[this.align] || 'stretch';\n }\n\n private getJustifyContent(): string {\n const justifyMap: Record<string, string> = {\n start: 'flex-start',\n center: 'center',\n end: 'flex-end',\n 'space-between': 'space-between',\n 'space-around': 'space-around',\n 'space-evenly': 'space-evenly',\n };\n return justifyMap[this.justify] || 'flex-start';\n }\n\n private getAlignContent(): string {\n const alignContentMap: Record<string, string> = {\n start: 'flex-start',\n center: 'center',\n end: 'flex-end',\n stretch: 'stretch',\n 'space-between': 'space-between',\n 'space-around': 'space-around',\n };\n return alignContentMap[this.alignContent] || 'stretch';\n }\n\n render() {\n const style: { [key: string]: string } = {\n display: 'flex',\n flexDirection: this.getFlexDirection(),\n alignItems: this.getAlignItems(),\n justifyContent: this.getJustifyContent(),\n flexWrap: this.wrap ? 'wrap' : 'nowrap',\n };\n\n if (this.wrap) {\n style.alignContent = this.getAlignContent();\n }\n\n if (this.gap) {\n style.gap = this.gap;\n }\n\n if (this.padding) {\n style.padding = this.padding;\n }\n\n // if (this.fullWidth) {\n // style.width = '100%';\n // }\n\n // if (this.fullHeight) {\n // style.height = '100%';\n // }\n\n const hostClass = classnames(\n `direction-${this.direction}`,\n {\n 'wrap': this.wrap,\n 'reverse': this.reverse,\n 'full-width': this.fullWidth,\n 'full-height': this.fullHeight,\n }\n );\n\n // Slot style for admin mode - make items display in the same direction\n const slotStyle = `display: flex; flex-direction: ${this.getFlexDirection()}; gap: ${this.gap || 'var(--le-space-md)'}; flex-wrap: ${this.wrap ? 'wrap' : 'nowrap'}; justify-content: ${this.getJustifyContent()}; align-items: ${this.getAlignItems()};`;\n\n return (\n <le-component component=\"le-stack\" hostClass={hostClass}>\n <div class=\"stack\" part=\"stack\" style={style}>\n <le-slot\n name=\"\"\n description={`Items arranged ${this.direction}ly${this.maxItems ? ` (max ${this.maxItems})` : ''}`}\n type=\"slot\"\n allowed-components=\"le-text,le-box,le-card,le-button,le-stack\"\n slotStyle={slotStyle}\n >\n <slot></slot>\n </le-slot>\n </div>\n </le-component>\n );\n }\n}\n"],"version":3}
|
|
@@ -0,0 +1,11 @@
|
|
|
1
|
+
import type { Components, JSX } from "../../dist/types/components";
|
|
2
|
+
|
|
3
|
+
interface LeStringInput extends Components.LeStringInput, HTMLElement {}
|
|
4
|
+
export const LeStringInput: {
|
|
5
|
+
prototype: LeStringInput;
|
|
6
|
+
new (): LeStringInput;
|
|
7
|
+
};
|
|
8
|
+
/**
|
|
9
|
+
* Used to define this component and all nested components recursively.
|
|
10
|
+
*/
|
|
11
|
+
export const defineCustomElement: () => void;
|
|
@@ -0,0 +1,9 @@
|
|
|
1
|
+
import { i as LeStringInput$1, d as defineCustomElement$1 } from './le-button2.js';
|
|
2
|
+
|
|
3
|
+
const LeStringInput = LeStringInput$1;
|
|
4
|
+
const defineCustomElement = defineCustomElement$1;
|
|
5
|
+
|
|
6
|
+
export { LeStringInput, defineCustomElement };
|
|
7
|
+
//# sourceMappingURL=le-string-input.js.map
|
|
8
|
+
|
|
9
|
+
//# sourceMappingURL=le-string-input.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"file":"le-string-input.js","mappings":";;;;;;;","names":[],"sources":[],"sourcesContent":[],"version":3}
|
|
@@ -0,0 +1,11 @@
|
|
|
1
|
+
import type { Components, JSX } from "../../dist/types/components";
|
|
2
|
+
|
|
3
|
+
interface LeText extends Components.LeText, HTMLElement {}
|
|
4
|
+
export const LeText: {
|
|
5
|
+
prototype: LeText;
|
|
6
|
+
new (): LeText;
|
|
7
|
+
};
|
|
8
|
+
/**
|
|
9
|
+
* Used to define this component and all nested components recursively.
|
|
10
|
+
*/
|
|
11
|
+
export const defineCustomElement: () => void;
|