le-kit 0.1.13 → 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/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.js.map +1 -1
- package/dist/core/components/le-box.js +34 -2
- package/dist/core/components/le-box.js.map +1 -1
- package/dist/core/components/le-button.js +1 -1
- package/dist/core/components/le-button2.js +1031 -6
- package/dist/core/components/le-button2.js.map +1 -1
- package/dist/core/components/le-card.js +36 -4
- package/dist/core/components/le-card.js.map +1 -1
- package/dist/core/components/le-checkbox.js +1 -79
- package/dist/core/components/le-checkbox.js.map +1 -1
- package/dist/core/components/le-component.d.ts +11 -0
- package/dist/core/components/le-number-input.js +30 -4
- package/dist/core/components/le-number-input.js.map +1 -1
- package/dist/core/components/le-popover.js +1 -377
- package/dist/core/components/le-popover.js.map +1 -1
- package/dist/core/components/le-popup.js +30 -4
- package/dist/core/components/le-popup.js.map +1 -1
- package/dist/core/components/le-round-progress.js +1 -1
- package/dist/core/components/le-round-progress.js.map +1 -1
- package/dist/core/components/le-slot.d.ts +11 -0
- package/dist/core/components/le-stack.js +36 -4
- package/dist/core/components/le-stack.js.map +1 -1
- package/dist/core/components/le-string-input.js +1 -119
- package/dist/core/components/le-string-input.js.map +1 -1
- package/dist/core/components/le-text.js +34 -2
- package/dist/core/components/le-text.js.map +1 -1
- package/dist/core/components/le-turntable.js +1 -1
- package/dist/core/components/le-turntable.js.map +1 -1
- package/dist/core/components/utils.js +4 -4
- package/dist/core/components/utils.js.map +1 -1
- 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 +1007 -1007
- 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/{collection/components/le-popover/le-popover.js → le-kit/le-popover.entry.js} +16 -363
- 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 +3 -4
- 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.cjs.entry.js +0 -184
- 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.cjs.entry.js +0 -202
- package/dist/cjs/le-number-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/cjs/le-round-progress.cjs.entry.js +0 -106
- package/dist/cjs/le-round-progress.entry.cjs.js.map +0 -1
- package/dist/cjs/le-stack.cjs.entry.js +0 -135
- package/dist/cjs/le-stack.entry.cjs.js.map +0 -1
- package/dist/cjs/le-text.cjs.entry.js +0 -335
- package/dist/cjs/le-text.entry.cjs.js.map +0 -1
- package/dist/cjs/le-turntable.cjs.entry.js +0 -139
- 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/components/index.js +0 -113
- package/dist/components/index.js.map +0 -1
- package/dist/components/le-box.js +0 -257
- package/dist/components/le-box.js.map +0 -1
- package/dist/components/le-button.js +0 -9
- package/dist/components/le-button.js.map +0 -1
- package/dist/components/le-button2.js +0 -1149
- package/dist/components/le-button2.js.map +0 -1
- package/dist/components/le-card.js +0 -84
- package/dist/components/le-card.js.map +0 -1
- package/dist/components/le-checkbox.js +0 -9
- package/dist/components/le-checkbox.js.map +0 -1
- package/dist/components/le-number-input.js +0 -272
- package/dist/components/le-number-input.js.map +0 -1
- package/dist/components/le-popover.js +0 -9
- package/dist/components/le-popover.js.map +0 -1
- package/dist/components/le-popup.js +0 -279
- package/dist/components/le-popup.js.map +0 -1
- package/dist/components/le-round-progress.js +0 -135
- package/dist/components/le-round-progress.js.map +0 -1
- package/dist/components/le-stack.js +0 -199
- package/dist/components/le-stack.js.map +0 -1
- package/dist/components/le-string-input.js +0 -9
- package/dist/components/le-string-input.js.map +0 -1
- package/dist/components/le-text.js +0 -399
- package/dist/components/le-text.js.map +0 -1
- package/dist/components/le-turntable.js +0 -164
- package/dist/components/le-turntable.js.map +0 -1
- package/dist/components/utils.js +0 -310
- package/dist/components/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/collection/assets/custom-elements.json +0 -4305
- package/dist/core/collection/themes/base.css +0 -89
- package/dist/core/collection/themes/dark.css +0 -100
- package/dist/core/collection/themes/default.css +0 -108
- package/dist/core/collection/themes/gradient.css +0 -100
- package/dist/core/collection/themes/index.css +0 -413
- package/dist/core/collection/themes/minimal.css +0 -100
- package/dist/core/collection/themes/warm.css +0 -100
- 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 +0 -106
- 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-button_6.entry.js +0 -1199
- 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/dist/collection/themes/base.css +0 -89
- package/dist/le-kit/dist/collection/themes/dark.css +0 -100
- package/dist/le-kit/dist/collection/themes/default.css +0 -108
- package/dist/le-kit/dist/collection/themes/gradient.css +0 -100
- package/dist/le-kit/dist/collection/themes/index.css +0 -413
- package/dist/le-kit/dist/collection/themes/minimal.css +0 -100
- package/dist/le-kit/dist/collection/themes/warm.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/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/dist/collection → components}/themes/base.css +0 -0
- /package/dist/{collection/dist/collection → components}/themes/dark.css +0 -0
- /package/dist/{collection/dist/collection → components}/themes/default.css +0 -0
- /package/dist/{collection/dist/collection → components}/themes/gradient.css +0 -0
- /package/dist/{collection/dist/collection → components}/themes/index.css +0 -0
- /package/dist/{collection/dist/collection → components}/themes/minimal.css +0 -0
- /package/dist/{collection/dist/collection → components}/themes/warm.css +0 -0
- /package/dist/{components → core/components}/le-component.js +0 -0
- /package/dist/{components → core/components}/le-component.js.map +0 -0
- /package/dist/{components → core/components}/le-popover2.js +0 -0
- /package/dist/{components → core/components}/le-popover2.js.map +0 -0
- /package/dist/{components → core/components}/le-slot.js +0 -0
- /package/dist/{components → core/components}/le-slot.js.map +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/{collection → le-kit/dist/components}/themes/base.css +0 -0
- /package/dist/{collection → le-kit/dist/components}/themes/dark.css +0 -0
- /package/dist/{collection → le-kit/dist/components}/themes/default.css +0 -0
- /package/dist/{collection → le-kit/dist/components}/themes/gradient.css +0 -0
- /package/dist/{collection → le-kit/dist/components}/themes/index.css +0 -0
- /package/dist/{collection → le-kit/dist/components}/themes/minimal.css +0 -0
- /package/dist/{collection → le-kit/dist/components}/themes/warm.css +0 -0
|
@@ -1,596 +0,0 @@
|
|
|
1
|
-
import { h } from "@stencil/core";
|
|
2
|
-
/**
|
|
3
|
-
* A flexible popup/dialog component for alerts, confirms, prompts, and custom content.
|
|
4
|
-
*
|
|
5
|
-
* Uses the native HTML <dialog> element for proper modal behavior, accessibility,
|
|
6
|
-
* and focus management. Can be used declaratively in HTML or programmatically
|
|
7
|
-
* via leAlert(), leConfirm(), lePrompt().
|
|
8
|
-
*
|
|
9
|
-
* @slot - Default slot for custom body content
|
|
10
|
-
* @slot header - Custom header content (replaces title)
|
|
11
|
-
* @slot footer - Custom footer content (replaces default buttons)
|
|
12
|
-
*
|
|
13
|
-
* @cmsInternal true
|
|
14
|
-
* @cmsCategory System
|
|
15
|
-
*/
|
|
16
|
-
export class LePopup {
|
|
17
|
-
el;
|
|
18
|
-
/**
|
|
19
|
-
* Whether the popup is currently visible
|
|
20
|
-
*/
|
|
21
|
-
open = false;
|
|
22
|
-
/**
|
|
23
|
-
* Type of popup: alert (OK only), confirm (OK/Cancel), prompt (input + OK/Cancel), custom
|
|
24
|
-
*/
|
|
25
|
-
type = 'alert';
|
|
26
|
-
/**
|
|
27
|
-
* Optional title for the popup header
|
|
28
|
-
*/
|
|
29
|
-
popupTitle;
|
|
30
|
-
/**
|
|
31
|
-
* Message text to display (for alert/confirm/prompt types)
|
|
32
|
-
*/
|
|
33
|
-
message;
|
|
34
|
-
/**
|
|
35
|
-
* Whether the popup is modal (blocks interaction with page behind)
|
|
36
|
-
*/
|
|
37
|
-
modal = true;
|
|
38
|
-
/**
|
|
39
|
-
* Position of the popup on screen
|
|
40
|
-
*/
|
|
41
|
-
position = 'center';
|
|
42
|
-
/**
|
|
43
|
-
* Text for the confirm/OK button
|
|
44
|
-
*/
|
|
45
|
-
confirmText = 'OK';
|
|
46
|
-
/**
|
|
47
|
-
* Text for the cancel button
|
|
48
|
-
*/
|
|
49
|
-
cancelText = 'Cancel';
|
|
50
|
-
/**
|
|
51
|
-
* Placeholder text for prompt input
|
|
52
|
-
*/
|
|
53
|
-
placeholder = '';
|
|
54
|
-
/**
|
|
55
|
-
* Default value for prompt input
|
|
56
|
-
*/
|
|
57
|
-
defaultValue = '';
|
|
58
|
-
/**
|
|
59
|
-
* Whether clicking the backdrop closes the popup (modal only)
|
|
60
|
-
*/
|
|
61
|
-
closeOnBackdrop = true;
|
|
62
|
-
/**
|
|
63
|
-
* Internal state for prompt input value
|
|
64
|
-
*/
|
|
65
|
-
inputValue = '';
|
|
66
|
-
/**
|
|
67
|
-
* Emitted when the popup is confirmed (OK clicked)
|
|
68
|
-
*/
|
|
69
|
-
leConfirm;
|
|
70
|
-
/**
|
|
71
|
-
* Emitted when the popup is cancelled (Cancel clicked or dismissed)
|
|
72
|
-
*/
|
|
73
|
-
leCancel;
|
|
74
|
-
/**
|
|
75
|
-
* Emitted when the popup opens
|
|
76
|
-
*/
|
|
77
|
-
leOpen;
|
|
78
|
-
/**
|
|
79
|
-
* Emitted when the popup closes
|
|
80
|
-
*/
|
|
81
|
-
leClose;
|
|
82
|
-
dialogEl;
|
|
83
|
-
inputEl;
|
|
84
|
-
resolvePromise;
|
|
85
|
-
componentWillLoad() {
|
|
86
|
-
this.inputValue = this.defaultValue;
|
|
87
|
-
}
|
|
88
|
-
componentDidLoad() {
|
|
89
|
-
// Native dialog handles Escape key automatically when modal
|
|
90
|
-
// We just need to listen for the cancel event
|
|
91
|
-
this.dialogEl?.addEventListener('cancel', this.handleDialogCancel);
|
|
92
|
-
}
|
|
93
|
-
disconnectedCallback() {
|
|
94
|
-
this.dialogEl?.removeEventListener('cancel', this.handleDialogCancel);
|
|
95
|
-
}
|
|
96
|
-
handleDialogCancel = (e) => {
|
|
97
|
-
e.preventDefault(); // Prevent default close to handle it ourselves
|
|
98
|
-
this.handleCancel();
|
|
99
|
-
};
|
|
100
|
-
/**
|
|
101
|
-
* Opens the popup and returns a promise that resolves when closed
|
|
102
|
-
*/
|
|
103
|
-
async show() {
|
|
104
|
-
return new Promise((resolve) => {
|
|
105
|
-
this.resolvePromise = resolve;
|
|
106
|
-
this.inputValue = this.defaultValue;
|
|
107
|
-
this.open = true;
|
|
108
|
-
// Use requestAnimationFrame to ensure the dialog element is rendered
|
|
109
|
-
requestAnimationFrame(() => {
|
|
110
|
-
if (this.dialogEl) {
|
|
111
|
-
if (this.modal) {
|
|
112
|
-
this.dialogEl.showModal();
|
|
113
|
-
}
|
|
114
|
-
else {
|
|
115
|
-
this.dialogEl.show();
|
|
116
|
-
}
|
|
117
|
-
this.leOpen.emit();
|
|
118
|
-
// Focus input for prompt type
|
|
119
|
-
if (this.type === 'prompt' && this.inputEl) {
|
|
120
|
-
this.inputEl.focus();
|
|
121
|
-
this.inputEl.select();
|
|
122
|
-
}
|
|
123
|
-
}
|
|
124
|
-
});
|
|
125
|
-
});
|
|
126
|
-
}
|
|
127
|
-
/**
|
|
128
|
-
* Closes the popup with a result
|
|
129
|
-
*/
|
|
130
|
-
async hide(confirmed = false) {
|
|
131
|
-
const result = {
|
|
132
|
-
confirmed,
|
|
133
|
-
value: this.type === 'prompt' ? this.inputValue : undefined,
|
|
134
|
-
};
|
|
135
|
-
this.dialogEl?.close();
|
|
136
|
-
this.open = false;
|
|
137
|
-
this.leClose.emit(result);
|
|
138
|
-
if (this.resolvePromise) {
|
|
139
|
-
this.resolvePromise(result);
|
|
140
|
-
this.resolvePromise = undefined;
|
|
141
|
-
}
|
|
142
|
-
}
|
|
143
|
-
handleConfirm = () => {
|
|
144
|
-
const result = {
|
|
145
|
-
confirmed: true,
|
|
146
|
-
value: this.type === 'prompt' ? this.inputValue : undefined,
|
|
147
|
-
};
|
|
148
|
-
this.leConfirm.emit(result);
|
|
149
|
-
this.hide(true);
|
|
150
|
-
};
|
|
151
|
-
handleCancel = () => {
|
|
152
|
-
const result = {
|
|
153
|
-
confirmed: false,
|
|
154
|
-
value: undefined,
|
|
155
|
-
};
|
|
156
|
-
this.leCancel.emit(result);
|
|
157
|
-
this.hide(false);
|
|
158
|
-
};
|
|
159
|
-
handleBackdropClick = (e) => {
|
|
160
|
-
// Check if click was on the dialog backdrop (outside the dialog box)
|
|
161
|
-
if (this.closeOnBackdrop && e.target === this.dialogEl) {
|
|
162
|
-
const rect = this.dialogEl.getBoundingClientRect();
|
|
163
|
-
const clickedInDialog = (e.clientX >= rect.left &&
|
|
164
|
-
e.clientX <= rect.right &&
|
|
165
|
-
e.clientY >= rect.top &&
|
|
166
|
-
e.clientY <= rect.bottom);
|
|
167
|
-
if (!clickedInDialog) {
|
|
168
|
-
this.handleCancel();
|
|
169
|
-
}
|
|
170
|
-
}
|
|
171
|
-
};
|
|
172
|
-
handleInputChange = (e) => {
|
|
173
|
-
this.inputValue = e.target.value;
|
|
174
|
-
};
|
|
175
|
-
handleKeyDown = (e) => {
|
|
176
|
-
if (e.key === 'Enter' && this.type !== 'custom') {
|
|
177
|
-
e.preventDefault();
|
|
178
|
-
this.handleConfirm();
|
|
179
|
-
}
|
|
180
|
-
};
|
|
181
|
-
hasSlot(name) {
|
|
182
|
-
return !!this.el.querySelector(`[slot="${name}"]`);
|
|
183
|
-
}
|
|
184
|
-
renderHeader() {
|
|
185
|
-
if (this.hasSlot('header')) {
|
|
186
|
-
return (h("div", { class: "le-popup-header", part: "header" }, h("slot", { name: "header" })));
|
|
187
|
-
}
|
|
188
|
-
if (this.popupTitle) {
|
|
189
|
-
return (h("div", { class: "le-popup-header", part: "header" }, this.popupTitle));
|
|
190
|
-
}
|
|
191
|
-
return null;
|
|
192
|
-
}
|
|
193
|
-
renderBody() {
|
|
194
|
-
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))));
|
|
195
|
-
}
|
|
196
|
-
renderFooter() {
|
|
197
|
-
if (this.hasSlot('footer')) {
|
|
198
|
-
return (h("div", { class: "le-popup-footer", part: "footer" }, h("slot", { name: "footer" })));
|
|
199
|
-
}
|
|
200
|
-
// For custom type without footer slot, don't render default buttons
|
|
201
|
-
if (this.type === 'custom') {
|
|
202
|
-
return null;
|
|
203
|
-
}
|
|
204
|
-
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)));
|
|
205
|
-
}
|
|
206
|
-
render() {
|
|
207
|
-
const positionClass = `le-popup-position-${this.position}`;
|
|
208
|
-
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()))));
|
|
209
|
-
}
|
|
210
|
-
static get is() { return "le-popup"; }
|
|
211
|
-
static get encapsulation() { return "shadow"; }
|
|
212
|
-
static get originalStyleUrls() {
|
|
213
|
-
return {
|
|
214
|
-
"$": ["le-popup.css"]
|
|
215
|
-
};
|
|
216
|
-
}
|
|
217
|
-
static get styleUrls() {
|
|
218
|
-
return {
|
|
219
|
-
"$": ["le-popup.css"]
|
|
220
|
-
};
|
|
221
|
-
}
|
|
222
|
-
static get properties() {
|
|
223
|
-
return {
|
|
224
|
-
"open": {
|
|
225
|
-
"type": "boolean",
|
|
226
|
-
"mutable": true,
|
|
227
|
-
"complexType": {
|
|
228
|
-
"original": "boolean",
|
|
229
|
-
"resolved": "boolean",
|
|
230
|
-
"references": {}
|
|
231
|
-
},
|
|
232
|
-
"required": false,
|
|
233
|
-
"optional": false,
|
|
234
|
-
"docs": {
|
|
235
|
-
"tags": [],
|
|
236
|
-
"text": "Whether the popup is currently visible"
|
|
237
|
-
},
|
|
238
|
-
"getter": false,
|
|
239
|
-
"setter": false,
|
|
240
|
-
"reflect": true,
|
|
241
|
-
"attribute": "open",
|
|
242
|
-
"defaultValue": "false"
|
|
243
|
-
},
|
|
244
|
-
"type": {
|
|
245
|
-
"type": "string",
|
|
246
|
-
"mutable": false,
|
|
247
|
-
"complexType": {
|
|
248
|
-
"original": "PopupType",
|
|
249
|
-
"resolved": "\"alert\" | \"confirm\" | \"custom\" | \"prompt\"",
|
|
250
|
-
"references": {
|
|
251
|
-
"PopupType": {
|
|
252
|
-
"location": "local",
|
|
253
|
-
"path": "/Users/andreylechev/Projects/le-kit/src/components/le-popup/le-popup.tsx",
|
|
254
|
-
"id": "src/components/le-popup/le-popup.tsx::PopupType"
|
|
255
|
-
}
|
|
256
|
-
}
|
|
257
|
-
},
|
|
258
|
-
"required": false,
|
|
259
|
-
"optional": false,
|
|
260
|
-
"docs": {
|
|
261
|
-
"tags": [],
|
|
262
|
-
"text": "Type of popup: alert (OK only), confirm (OK/Cancel), prompt (input + OK/Cancel), custom"
|
|
263
|
-
},
|
|
264
|
-
"getter": false,
|
|
265
|
-
"setter": false,
|
|
266
|
-
"reflect": false,
|
|
267
|
-
"attribute": "type",
|
|
268
|
-
"defaultValue": "'alert'"
|
|
269
|
-
},
|
|
270
|
-
"popupTitle": {
|
|
271
|
-
"type": "string",
|
|
272
|
-
"mutable": false,
|
|
273
|
-
"complexType": {
|
|
274
|
-
"original": "string",
|
|
275
|
-
"resolved": "string",
|
|
276
|
-
"references": {}
|
|
277
|
-
},
|
|
278
|
-
"required": false,
|
|
279
|
-
"optional": true,
|
|
280
|
-
"docs": {
|
|
281
|
-
"tags": [],
|
|
282
|
-
"text": "Optional title for the popup header"
|
|
283
|
-
},
|
|
284
|
-
"getter": false,
|
|
285
|
-
"setter": false,
|
|
286
|
-
"reflect": false,
|
|
287
|
-
"attribute": "popup-title"
|
|
288
|
-
},
|
|
289
|
-
"message": {
|
|
290
|
-
"type": "string",
|
|
291
|
-
"mutable": false,
|
|
292
|
-
"complexType": {
|
|
293
|
-
"original": "string",
|
|
294
|
-
"resolved": "string",
|
|
295
|
-
"references": {}
|
|
296
|
-
},
|
|
297
|
-
"required": false,
|
|
298
|
-
"optional": true,
|
|
299
|
-
"docs": {
|
|
300
|
-
"tags": [],
|
|
301
|
-
"text": "Message text to display (for alert/confirm/prompt types)"
|
|
302
|
-
},
|
|
303
|
-
"getter": false,
|
|
304
|
-
"setter": false,
|
|
305
|
-
"reflect": false,
|
|
306
|
-
"attribute": "message"
|
|
307
|
-
},
|
|
308
|
-
"modal": {
|
|
309
|
-
"type": "boolean",
|
|
310
|
-
"mutable": false,
|
|
311
|
-
"complexType": {
|
|
312
|
-
"original": "boolean",
|
|
313
|
-
"resolved": "boolean",
|
|
314
|
-
"references": {}
|
|
315
|
-
},
|
|
316
|
-
"required": false,
|
|
317
|
-
"optional": false,
|
|
318
|
-
"docs": {
|
|
319
|
-
"tags": [],
|
|
320
|
-
"text": "Whether the popup is modal (blocks interaction with page behind)"
|
|
321
|
-
},
|
|
322
|
-
"getter": false,
|
|
323
|
-
"setter": false,
|
|
324
|
-
"reflect": false,
|
|
325
|
-
"attribute": "modal",
|
|
326
|
-
"defaultValue": "true"
|
|
327
|
-
},
|
|
328
|
-
"position": {
|
|
329
|
-
"type": "string",
|
|
330
|
-
"mutable": false,
|
|
331
|
-
"complexType": {
|
|
332
|
-
"original": "PopupPosition",
|
|
333
|
-
"resolved": "\"bottom\" | \"bottom-left\" | \"bottom-right\" | \"center\" | \"top\" | \"top-left\" | \"top-right\"",
|
|
334
|
-
"references": {
|
|
335
|
-
"PopupPosition": {
|
|
336
|
-
"location": "local",
|
|
337
|
-
"path": "/Users/andreylechev/Projects/le-kit/src/components/le-popup/le-popup.tsx",
|
|
338
|
-
"id": "src/components/le-popup/le-popup.tsx::PopupPosition"
|
|
339
|
-
}
|
|
340
|
-
}
|
|
341
|
-
},
|
|
342
|
-
"required": false,
|
|
343
|
-
"optional": false,
|
|
344
|
-
"docs": {
|
|
345
|
-
"tags": [],
|
|
346
|
-
"text": "Position of the popup on screen"
|
|
347
|
-
},
|
|
348
|
-
"getter": false,
|
|
349
|
-
"setter": false,
|
|
350
|
-
"reflect": false,
|
|
351
|
-
"attribute": "position",
|
|
352
|
-
"defaultValue": "'center'"
|
|
353
|
-
},
|
|
354
|
-
"confirmText": {
|
|
355
|
-
"type": "string",
|
|
356
|
-
"mutable": false,
|
|
357
|
-
"complexType": {
|
|
358
|
-
"original": "string",
|
|
359
|
-
"resolved": "string",
|
|
360
|
-
"references": {}
|
|
361
|
-
},
|
|
362
|
-
"required": false,
|
|
363
|
-
"optional": false,
|
|
364
|
-
"docs": {
|
|
365
|
-
"tags": [],
|
|
366
|
-
"text": "Text for the confirm/OK button"
|
|
367
|
-
},
|
|
368
|
-
"getter": false,
|
|
369
|
-
"setter": false,
|
|
370
|
-
"reflect": false,
|
|
371
|
-
"attribute": "confirm-text",
|
|
372
|
-
"defaultValue": "'OK'"
|
|
373
|
-
},
|
|
374
|
-
"cancelText": {
|
|
375
|
-
"type": "string",
|
|
376
|
-
"mutable": false,
|
|
377
|
-
"complexType": {
|
|
378
|
-
"original": "string",
|
|
379
|
-
"resolved": "string",
|
|
380
|
-
"references": {}
|
|
381
|
-
},
|
|
382
|
-
"required": false,
|
|
383
|
-
"optional": false,
|
|
384
|
-
"docs": {
|
|
385
|
-
"tags": [],
|
|
386
|
-
"text": "Text for the cancel button"
|
|
387
|
-
},
|
|
388
|
-
"getter": false,
|
|
389
|
-
"setter": false,
|
|
390
|
-
"reflect": false,
|
|
391
|
-
"attribute": "cancel-text",
|
|
392
|
-
"defaultValue": "'Cancel'"
|
|
393
|
-
},
|
|
394
|
-
"placeholder": {
|
|
395
|
-
"type": "string",
|
|
396
|
-
"mutable": false,
|
|
397
|
-
"complexType": {
|
|
398
|
-
"original": "string",
|
|
399
|
-
"resolved": "string",
|
|
400
|
-
"references": {}
|
|
401
|
-
},
|
|
402
|
-
"required": false,
|
|
403
|
-
"optional": false,
|
|
404
|
-
"docs": {
|
|
405
|
-
"tags": [],
|
|
406
|
-
"text": "Placeholder text for prompt input"
|
|
407
|
-
},
|
|
408
|
-
"getter": false,
|
|
409
|
-
"setter": false,
|
|
410
|
-
"reflect": false,
|
|
411
|
-
"attribute": "placeholder",
|
|
412
|
-
"defaultValue": "''"
|
|
413
|
-
},
|
|
414
|
-
"defaultValue": {
|
|
415
|
-
"type": "string",
|
|
416
|
-
"mutable": false,
|
|
417
|
-
"complexType": {
|
|
418
|
-
"original": "string",
|
|
419
|
-
"resolved": "string",
|
|
420
|
-
"references": {}
|
|
421
|
-
},
|
|
422
|
-
"required": false,
|
|
423
|
-
"optional": false,
|
|
424
|
-
"docs": {
|
|
425
|
-
"tags": [],
|
|
426
|
-
"text": "Default value for prompt input"
|
|
427
|
-
},
|
|
428
|
-
"getter": false,
|
|
429
|
-
"setter": false,
|
|
430
|
-
"reflect": false,
|
|
431
|
-
"attribute": "default-value",
|
|
432
|
-
"defaultValue": "''"
|
|
433
|
-
},
|
|
434
|
-
"closeOnBackdrop": {
|
|
435
|
-
"type": "boolean",
|
|
436
|
-
"mutable": false,
|
|
437
|
-
"complexType": {
|
|
438
|
-
"original": "boolean",
|
|
439
|
-
"resolved": "boolean",
|
|
440
|
-
"references": {}
|
|
441
|
-
},
|
|
442
|
-
"required": false,
|
|
443
|
-
"optional": false,
|
|
444
|
-
"docs": {
|
|
445
|
-
"tags": [],
|
|
446
|
-
"text": "Whether clicking the backdrop closes the popup (modal only)"
|
|
447
|
-
},
|
|
448
|
-
"getter": false,
|
|
449
|
-
"setter": false,
|
|
450
|
-
"reflect": false,
|
|
451
|
-
"attribute": "close-on-backdrop",
|
|
452
|
-
"defaultValue": "true"
|
|
453
|
-
}
|
|
454
|
-
};
|
|
455
|
-
}
|
|
456
|
-
static get states() {
|
|
457
|
-
return {
|
|
458
|
-
"inputValue": {}
|
|
459
|
-
};
|
|
460
|
-
}
|
|
461
|
-
static get events() {
|
|
462
|
-
return [{
|
|
463
|
-
"method": "leConfirm",
|
|
464
|
-
"name": "leConfirm",
|
|
465
|
-
"bubbles": true,
|
|
466
|
-
"cancelable": true,
|
|
467
|
-
"composed": true,
|
|
468
|
-
"docs": {
|
|
469
|
-
"tags": [],
|
|
470
|
-
"text": "Emitted when the popup is confirmed (OK clicked)"
|
|
471
|
-
},
|
|
472
|
-
"complexType": {
|
|
473
|
-
"original": "PopupResult",
|
|
474
|
-
"resolved": "PopupResult",
|
|
475
|
-
"references": {
|
|
476
|
-
"PopupResult": {
|
|
477
|
-
"location": "local",
|
|
478
|
-
"path": "/Users/andreylechev/Projects/le-kit/src/components/le-popup/le-popup.tsx",
|
|
479
|
-
"id": "src/components/le-popup/le-popup.tsx::PopupResult"
|
|
480
|
-
}
|
|
481
|
-
}
|
|
482
|
-
}
|
|
483
|
-
}, {
|
|
484
|
-
"method": "leCancel",
|
|
485
|
-
"name": "leCancel",
|
|
486
|
-
"bubbles": true,
|
|
487
|
-
"cancelable": true,
|
|
488
|
-
"composed": true,
|
|
489
|
-
"docs": {
|
|
490
|
-
"tags": [],
|
|
491
|
-
"text": "Emitted when the popup is cancelled (Cancel clicked or dismissed)"
|
|
492
|
-
},
|
|
493
|
-
"complexType": {
|
|
494
|
-
"original": "PopupResult",
|
|
495
|
-
"resolved": "PopupResult",
|
|
496
|
-
"references": {
|
|
497
|
-
"PopupResult": {
|
|
498
|
-
"location": "local",
|
|
499
|
-
"path": "/Users/andreylechev/Projects/le-kit/src/components/le-popup/le-popup.tsx",
|
|
500
|
-
"id": "src/components/le-popup/le-popup.tsx::PopupResult"
|
|
501
|
-
}
|
|
502
|
-
}
|
|
503
|
-
}
|
|
504
|
-
}, {
|
|
505
|
-
"method": "leOpen",
|
|
506
|
-
"name": "leOpen",
|
|
507
|
-
"bubbles": true,
|
|
508
|
-
"cancelable": true,
|
|
509
|
-
"composed": true,
|
|
510
|
-
"docs": {
|
|
511
|
-
"tags": [],
|
|
512
|
-
"text": "Emitted when the popup opens"
|
|
513
|
-
},
|
|
514
|
-
"complexType": {
|
|
515
|
-
"original": "void",
|
|
516
|
-
"resolved": "void",
|
|
517
|
-
"references": {}
|
|
518
|
-
}
|
|
519
|
-
}, {
|
|
520
|
-
"method": "leClose",
|
|
521
|
-
"name": "leClose",
|
|
522
|
-
"bubbles": true,
|
|
523
|
-
"cancelable": true,
|
|
524
|
-
"composed": true,
|
|
525
|
-
"docs": {
|
|
526
|
-
"tags": [],
|
|
527
|
-
"text": "Emitted when the popup closes"
|
|
528
|
-
},
|
|
529
|
-
"complexType": {
|
|
530
|
-
"original": "PopupResult",
|
|
531
|
-
"resolved": "PopupResult",
|
|
532
|
-
"references": {
|
|
533
|
-
"PopupResult": {
|
|
534
|
-
"location": "local",
|
|
535
|
-
"path": "/Users/andreylechev/Projects/le-kit/src/components/le-popup/le-popup.tsx",
|
|
536
|
-
"id": "src/components/le-popup/le-popup.tsx::PopupResult"
|
|
537
|
-
}
|
|
538
|
-
}
|
|
539
|
-
}
|
|
540
|
-
}];
|
|
541
|
-
}
|
|
542
|
-
static get methods() {
|
|
543
|
-
return {
|
|
544
|
-
"show": {
|
|
545
|
-
"complexType": {
|
|
546
|
-
"signature": "() => Promise<PopupResult>",
|
|
547
|
-
"parameters": [],
|
|
548
|
-
"references": {
|
|
549
|
-
"Promise": {
|
|
550
|
-
"location": "global",
|
|
551
|
-
"id": "global::Promise"
|
|
552
|
-
},
|
|
553
|
-
"PopupResult": {
|
|
554
|
-
"location": "local",
|
|
555
|
-
"path": "/Users/andreylechev/Projects/le-kit/src/components/le-popup/le-popup.tsx",
|
|
556
|
-
"id": "src/components/le-popup/le-popup.tsx::PopupResult"
|
|
557
|
-
}
|
|
558
|
-
},
|
|
559
|
-
"return": "Promise<PopupResult>"
|
|
560
|
-
},
|
|
561
|
-
"docs": {
|
|
562
|
-
"text": "Opens the popup and returns a promise that resolves when closed",
|
|
563
|
-
"tags": []
|
|
564
|
-
}
|
|
565
|
-
},
|
|
566
|
-
"hide": {
|
|
567
|
-
"complexType": {
|
|
568
|
-
"signature": "(confirmed?: boolean) => Promise<void>",
|
|
569
|
-
"parameters": [{
|
|
570
|
-
"name": "confirmed",
|
|
571
|
-
"type": "boolean",
|
|
572
|
-
"docs": ""
|
|
573
|
-
}],
|
|
574
|
-
"references": {
|
|
575
|
-
"Promise": {
|
|
576
|
-
"location": "global",
|
|
577
|
-
"id": "global::Promise"
|
|
578
|
-
},
|
|
579
|
-
"PopupResult": {
|
|
580
|
-
"location": "local",
|
|
581
|
-
"path": "/Users/andreylechev/Projects/le-kit/src/components/le-popup/le-popup.tsx",
|
|
582
|
-
"id": "src/components/le-popup/le-popup.tsx::PopupResult"
|
|
583
|
-
}
|
|
584
|
-
},
|
|
585
|
-
"return": "Promise<void>"
|
|
586
|
-
},
|
|
587
|
-
"docs": {
|
|
588
|
-
"text": "Closes the popup with a result",
|
|
589
|
-
"tags": []
|
|
590
|
-
}
|
|
591
|
-
}
|
|
592
|
-
};
|
|
593
|
-
}
|
|
594
|
-
static get elementRef() { return "el"; }
|
|
595
|
-
}
|
|
596
|
-
//# sourceMappingURL=le-popup.js.map
|
|
@@ -1 +0,0 @@
|
|
|
1
|
-
{"version":3,"file":"le-popup.js","sourceRoot":"","sources":["../../../src/components/le-popup/le-popup.tsx"],"names":[],"mappings":"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","sourcesContent":["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"]}
|
|
@@ -1,34 +0,0 @@
|
|
|
1
|
-
.round-progress--container {
|
|
2
|
-
position: relative;
|
|
3
|
-
}
|
|
4
|
-
|
|
5
|
-
.round-progress {
|
|
6
|
-
position: absolute;
|
|
7
|
-
top: 0;
|
|
8
|
-
left: 0;
|
|
9
|
-
right: 0;
|
|
10
|
-
bottom: 0;
|
|
11
|
-
display: block;
|
|
12
|
-
}
|
|
13
|
-
|
|
14
|
-
.round-progress--progress {
|
|
15
|
-
filter: drop-shadow(var(--progress-shadow));
|
|
16
|
-
}
|
|
17
|
-
|
|
18
|
-
.round-progress--circle {
|
|
19
|
-
fill: none;
|
|
20
|
-
stroke: var(--progress-color, #999);
|
|
21
|
-
stroke-width: var(--progress-width, 4);
|
|
22
|
-
stroke-linecap: var(--progress-linecap, round);
|
|
23
|
-
animation: progress--circle 0.5s ease-out forwards;
|
|
24
|
-
transition: stroke-dasharray 0.5s ease-out;
|
|
25
|
-
}
|
|
26
|
-
|
|
27
|
-
@keyframes progress--circle {
|
|
28
|
-
0% { stroke-dasharray: 0 1000; }
|
|
29
|
-
}
|
|
30
|
-
|
|
31
|
-
.round-progress--path {
|
|
32
|
-
fill: none;
|
|
33
|
-
stroke-linecap: round;
|
|
34
|
-
}
|