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,143 +0,0 @@
|
|
|
1
|
-
/* ============================================
|
|
2
|
-
le-popover.css
|
|
3
|
-
Popover using native HTML Popover API
|
|
4
|
-
============================================ */
|
|
5
|
-
|
|
6
|
-
:host {
|
|
7
|
-
display: inline-block;
|
|
8
|
-
position: relative;
|
|
9
|
-
}
|
|
10
|
-
|
|
11
|
-
/* ============================================
|
|
12
|
-
Trigger
|
|
13
|
-
============================================ */
|
|
14
|
-
|
|
15
|
-
.le-popover-trigger {
|
|
16
|
-
display: inline-flex;
|
|
17
|
-
cursor: pointer;
|
|
18
|
-
}
|
|
19
|
-
|
|
20
|
-
.le-popover-default-trigger {
|
|
21
|
-
display: flex;
|
|
22
|
-
align-items: center;
|
|
23
|
-
justify-content: center;
|
|
24
|
-
width: 28px;
|
|
25
|
-
height: 28px;
|
|
26
|
-
padding: 0;
|
|
27
|
-
border: 1px solid var(--le-color-border, #e0e0e0);
|
|
28
|
-
border-radius: var(--le-radius-md, 6px);
|
|
29
|
-
background: var(--le-color-surface, #fff);
|
|
30
|
-
color: var(--le-color-text-secondary, #666);
|
|
31
|
-
font-size: 16px;
|
|
32
|
-
cursor: pointer;
|
|
33
|
-
transition: all var(--le-transition-fast, 0.15s ease);
|
|
34
|
-
}
|
|
35
|
-
|
|
36
|
-
.le-popover-default-trigger:hover {
|
|
37
|
-
border-color: var(--le-color-primary, #2196f3);
|
|
38
|
-
color: var(--le-color-primary, #2196f3);
|
|
39
|
-
background: var(--le-color-primary-light, rgba(33, 150, 243, 0.1));
|
|
40
|
-
}
|
|
41
|
-
|
|
42
|
-
/* ============================================
|
|
43
|
-
Popover Content (native popover)
|
|
44
|
-
============================================ */
|
|
45
|
-
|
|
46
|
-
.le-popover-content {
|
|
47
|
-
/* Reset native popover defaults */
|
|
48
|
-
margin: 0;
|
|
49
|
-
padding: 0;
|
|
50
|
-
border: none;
|
|
51
|
-
background: transparent;
|
|
52
|
-
|
|
53
|
-
/* Positioning - will be set via JS */
|
|
54
|
-
position: fixed;
|
|
55
|
-
inset: unset;
|
|
56
|
-
|
|
57
|
-
/* Styling */
|
|
58
|
-
background: var(--le-color-surface, #ffffff);
|
|
59
|
-
border: 1px solid var(--le-color-border, #e0e0e0);
|
|
60
|
-
border-radius: var(--le-radius-lg, 8px);
|
|
61
|
-
box-shadow: var(--le-shadow-lg, 0 4px 12px rgba(0, 0, 0, 0.15));
|
|
62
|
-
overflow: hidden;
|
|
63
|
-
font-family: var(--le-font-family, system-ui, -apple-system, sans-serif);
|
|
64
|
-
font-size: var(--le-font-size-sm, 0.875rem);
|
|
65
|
-
color: var(--le-color-text, #333);
|
|
66
|
-
|
|
67
|
-
/* Animation */
|
|
68
|
-
opacity: 0;
|
|
69
|
-
transform: scale(0.95);
|
|
70
|
-
transition: opacity 0.15s ease, transform 0.15s ease, display 0.15s ease allow-discrete;
|
|
71
|
-
}
|
|
72
|
-
|
|
73
|
-
/* When popover is open */
|
|
74
|
-
.le-popover-content:popover-open {
|
|
75
|
-
opacity: 1;
|
|
76
|
-
transform: scale(1);
|
|
77
|
-
}
|
|
78
|
-
|
|
79
|
-
/* Starting style for animation (CSS Anchor Positioning spec) */
|
|
80
|
-
@starting-style {
|
|
81
|
-
.le-popover-content:popover-open {
|
|
82
|
-
opacity: 0;
|
|
83
|
-
transform: scale(0.95);
|
|
84
|
-
}
|
|
85
|
-
}
|
|
86
|
-
|
|
87
|
-
/* ============================================
|
|
88
|
-
Header
|
|
89
|
-
============================================ */
|
|
90
|
-
|
|
91
|
-
.le-popover-header {
|
|
92
|
-
display: flex;
|
|
93
|
-
align-items: center;
|
|
94
|
-
justify-content: space-between;
|
|
95
|
-
padding: var(--le-space-xs, 4px) var(--le-space-xs, 4px) var(--le-space-xs, 4px) var(--le-space-sm, 8px);
|
|
96
|
-
border-bottom: 1px solid var(--le-color-border, #e0e0e0);
|
|
97
|
-
background: var(--le-color-surface-alt, #f9f9f9);
|
|
98
|
-
min-height: 32px;
|
|
99
|
-
}
|
|
100
|
-
|
|
101
|
-
.le-popover-title {
|
|
102
|
-
font-weight: var(--le-font-weight-semibold, 600);
|
|
103
|
-
font-size: var(--le-font-size-sm, 0.875rem);
|
|
104
|
-
color: var(--le-color-text, #333);
|
|
105
|
-
}
|
|
106
|
-
|
|
107
|
-
.le-popover-close {
|
|
108
|
-
display: flex;
|
|
109
|
-
align-items: center;
|
|
110
|
-
justify-content: center;
|
|
111
|
-
width: 24px;
|
|
112
|
-
height: 24px;
|
|
113
|
-
padding: 0;
|
|
114
|
-
border: none;
|
|
115
|
-
background: transparent;
|
|
116
|
-
color: var(--le-color-text-secondary, #666);
|
|
117
|
-
font-size: 18px;
|
|
118
|
-
line-height: 1;
|
|
119
|
-
cursor: pointer;
|
|
120
|
-
border-radius: var(--le-radius-sm, 4px);
|
|
121
|
-
transition: background-color 0.15s, color 0.15s;
|
|
122
|
-
}
|
|
123
|
-
|
|
124
|
-
.le-popover-close:hover {
|
|
125
|
-
background: var(--le-color-surface-hover, rgba(0, 0, 0, 0.05));
|
|
126
|
-
color: var(--le-color-text, #333);
|
|
127
|
-
}
|
|
128
|
-
|
|
129
|
-
/* ============================================
|
|
130
|
-
Body
|
|
131
|
-
============================================ */
|
|
132
|
-
|
|
133
|
-
.le-popover-body {
|
|
134
|
-
padding: var(--le-space-md, 12px);
|
|
135
|
-
}
|
|
136
|
-
|
|
137
|
-
/* ============================================
|
|
138
|
-
Scrollable content
|
|
139
|
-
============================================ */
|
|
140
|
-
|
|
141
|
-
.le-popover-content[style*="overflow-y: auto"] .le-popover-body {
|
|
142
|
-
overflow-y: auto;
|
|
143
|
-
}
|
|
@@ -1 +0,0 @@
|
|
|
1
|
-
{"version":3,"file":"le-popover.js","sourceRoot":"","sources":["../../../src/components/le-popover/le-popover.tsx"],"names":[],"mappings":"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","sourcesContent":["import { Component, Prop, Method, Event, EventEmitter, State, h, Element } from '@stencil/core';\n\n/**\n * A popover component for displaying floating content.\n * \n * Uses the native HTML Popover API for proper layering with dialogs\n * and other top-layer elements. Falls back gracefully in older browsers.\n *\n * @slot - Content to display inside the popover\n * @slot trigger - Element that triggers the popover (optional)\n * \n * @cmsInternal true\n * @cmsCategory System\n */\n@Component({\n tag: 'le-popover',\n styleUrl: 'le-popover.css',\n shadow: true,\n})\nexport class LePopover {\n @Element() el: HTMLElement;\n\n /**\n * Mode of the popover should be 'default' for internal use\n */\n @Prop({ mutable: true, reflect: true }) mode: 'default' | 'admin';\n\n /**\n * Whether the popover is currently open\n */\n @Prop({ mutable: true, reflect: true }) open: boolean = false;\n\n /**\n * Position of the popover relative to its trigger\n */\n @Prop() position: 'top' | 'bottom' | 'left' | 'right' | 'auto' = 'bottom';\n\n /**\n * Alignment of the popover\n */\n @Prop() align: 'start' | 'center' | 'end' = 'start';\n\n /**\n * Optional title for the popover header\n */\n @Prop() popoverTitle?: string;\n\n /**\n * Whether to show a close button in the header\n */\n @Prop() showClose: boolean = true;\n\n /**\n * Whether clicking outside closes the popover\n */\n @Prop() closeOnClickOutside: boolean = true;\n\n /**\n * Whether pressing Escape closes the popover\n */\n @Prop() closeOnEscape: boolean = true;\n\n /**\n * Offset from the trigger element (in pixels)\n */\n @Prop() offset: number = 8;\n\n /**\n * Fixed width for the popover (e.g., '300px', '20rem')\n */\n @Prop() width?: string;\n\n /**\n * Minimum width for the popover (e.g., '200px', '15rem')\n */\n @Prop() minWidth?: string = '200px';\n\n /**\n * Maximum width for the popover (e.g., '400px', '25rem')\n */\n @Prop() maxWidth?: string;\n\n /**\n * Emitted when the popover opens\n */\n @Event() lePopoverOpen: EventEmitter<void>;\n\n /**\n * Emitted when the popover closes\n */\n @Event() lePopoverClose: EventEmitter<void>;\n\n @State() private isPositioned: boolean = false;\n\n private triggerEl?: HTMLElement;\n private popoverEl?: HTMLElement;\n private uniqueId: string = `le-popover-${Math.random().toString(36).substr(2, 9)}`;\n private scrollParents: Element[] = [];\n\n componentDidLoad() {\n // Listen for toggle events from the native popover API\n this.popoverEl?.addEventListener('toggle', this.handlePopoverToggle as EventListener);\n \n // Listen for other popovers opening to close this one\n document.addEventListener('le-popover-will-open', this.handleOtherPopoverOpen);\n }\n\n disconnectedCallback() {\n this.popoverEl?.removeEventListener('toggle', this.handlePopoverToggle as EventListener);\n document.removeEventListener('le-popover-will-open', this.handleOtherPopoverOpen);\n this.removeScrollListeners();\n }\n\n /**\n * Find all scrollable parent elements\n */\n private getScrollParents(element: Element): Element[] {\n const scrollParents: Element[] = [];\n let parent = element.parentElement;\n \n while (parent) {\n const style = getComputedStyle(parent);\n const overflow = style.overflow + style.overflowY + style.overflowX;\n if (/(auto|scroll)/.test(overflow)) {\n scrollParents.push(parent);\n }\n parent = parent.parentElement;\n }\n \n // Always include window for page scroll\n return scrollParents;\n }\n\n /**\n * Add scroll listeners to all scrollable parents\n */\n private addScrollListeners() {\n if (!this.triggerEl) return;\n \n this.scrollParents = this.getScrollParents(this.triggerEl);\n \n // Listen to each scroll parent\n this.scrollParents.forEach(parent => {\n parent.addEventListener('scroll', this.handleScroll, { passive: true });\n });\n \n // Also listen to window scroll and resize\n window.addEventListener('scroll', this.handleScroll, { passive: true });\n window.addEventListener('resize', this.handleScroll, { passive: true });\n }\n\n /**\n * Remove scroll listeners\n */\n private removeScrollListeners() {\n this.scrollParents.forEach(parent => {\n parent.removeEventListener('scroll', this.handleScroll);\n });\n window.removeEventListener('scroll', this.handleScroll);\n window.removeEventListener('resize', this.handleScroll);\n this.scrollParents = [];\n }\n\n private handleScroll = () => {\n if (this.open) {\n this.updatePosition();\n }\n };\n\n private handlePopoverToggle = (event: ToggleEvent) => {\n if (event.newState === 'open') {\n this.open = true;\n this.addScrollListeners();\n this.updatePosition();\n this.lePopoverOpen.emit();\n } else {\n this.open = false;\n this.isPositioned = false;\n this.removeScrollListeners();\n this.lePopoverClose.emit();\n }\n };\n\n private handleOtherPopoverOpen = (event: Event) => {\n const customEvent = event as CustomEvent;\n if (customEvent.detail?.popover === this.el) return;\n \n if (this.open) {\n this.hide();\n }\n };\n\n /**\n * Opens the popover\n */\n @Method()\n async show() {\n document.dispatchEvent(new CustomEvent('le-popover-will-open', {\n detail: { popover: this.el }\n }));\n \n this.popoverEl?.showPopover();\n }\n\n /**\n * Closes the popover\n */\n @Method()\n async hide() {\n this.popoverEl?.hidePopover();\n }\n\n /**\n * Toggles the popover\n */\n @Method()\n async toggle() {\n if (this.open) {\n await this.hide();\n } else {\n await this.show();\n }\n }\n\n private handleTriggerClick = (event: MouseEvent) => {\n event.stopPropagation();\n this.toggle();\n };\n\n private updatePosition() {\n if (!this.triggerEl || !this.popoverEl) return;\n\n const triggerRect = this.triggerEl.getBoundingClientRect();\n const popoverRect = this.popoverEl.getBoundingClientRect();\n const viewportWidth = window.innerWidth;\n const viewportHeight = window.innerHeight;\n const viewportPadding = 8;\n\n let position = this.position;\n let align = this.align;\n\n // Auto-position logic\n const spaceBelow = viewportHeight - triggerRect.bottom - viewportPadding;\n const spaceAbove = triggerRect.top - viewportPadding;\n const spaceRight = viewportWidth - triggerRect.right - viewportPadding;\n const spaceLeft = triggerRect.left - viewportPadding;\n\n if (position === 'auto') {\n if (spaceBelow >= popoverRect.height + this.offset) {\n position = 'bottom';\n } else if (spaceAbove >= popoverRect.height + this.offset) {\n position = 'top';\n } else if (spaceRight >= popoverRect.width + this.offset) {\n position = 'right';\n } else if (spaceLeft >= popoverRect.width + this.offset) {\n position = 'left';\n } else {\n const maxSpace = Math.max(spaceBelow, spaceAbove, spaceRight, spaceLeft);\n if (maxSpace === spaceBelow) position = 'bottom';\n else if (maxSpace === spaceAbove) position = 'top';\n else if (maxSpace === spaceRight) position = 'right';\n else position = 'left';\n }\n }\n\n // Adjust alignment for horizontal overflow\n if (position === 'top' || position === 'bottom') {\n if (align === 'start' && triggerRect.left + popoverRect.width > viewportWidth - viewportPadding) {\n align = 'end';\n } else if (align === 'end' && triggerRect.right - popoverRect.width < viewportPadding) {\n align = 'start';\n } else if (align === 'center') {\n const triggerCenter = triggerRect.left + triggerRect.width / 2;\n if (triggerCenter - popoverRect.width / 2 < viewportPadding) {\n align = 'start';\n } else if (triggerCenter + popoverRect.width / 2 > viewportWidth - viewportPadding) {\n align = 'end';\n }\n }\n }\n\n // Calculate position\n let top: number = 0;\n let left: number = 0;\n let maxHeight: number | null = null;\n\n switch (position) {\n case 'top':\n top = triggerRect.top - popoverRect.height - this.offset;\n if (top < viewportPadding) {\n maxHeight = triggerRect.top - this.offset - viewportPadding * 2;\n top = viewportPadding;\n }\n break;\n case 'bottom':\n top = triggerRect.bottom + this.offset;\n if (top + popoverRect.height > viewportHeight - viewportPadding) {\n maxHeight = viewportHeight - top - viewportPadding;\n }\n break;\n case 'left':\n left = triggerRect.left - popoverRect.width - this.offset;\n top = triggerRect.top;\n if (left < viewportPadding) left = viewportPadding;\n break;\n case 'right':\n left = triggerRect.right + this.offset;\n top = triggerRect.top;\n if (left + popoverRect.width > viewportWidth - viewportPadding) {\n left = viewportWidth - popoverRect.width - viewportPadding;\n }\n break;\n }\n\n // Calculate horizontal alignment for top/bottom\n if (position === 'top' || position === 'bottom') {\n switch (align) {\n case 'start':\n left = triggerRect.left;\n break;\n case 'center':\n left = triggerRect.left + triggerRect.width / 2 - popoverRect.width / 2;\n break;\n case 'end':\n left = triggerRect.right - popoverRect.width;\n break;\n }\n \n // Constrain to viewport\n if (left < viewportPadding) {\n left = viewportPadding;\n } else if (left + popoverRect.width > viewportWidth - viewportPadding) {\n left = viewportWidth - popoverRect.width - viewportPadding;\n }\n }\n\n // Calculate vertical alignment for left/right\n if (position === 'left' || position === 'right') {\n switch (align) {\n case 'start':\n top = triggerRect.top;\n break;\n case 'center':\n top = triggerRect.top + triggerRect.height / 2 - popoverRect.height / 2;\n break;\n case 'end':\n top = triggerRect.bottom - popoverRect.height;\n break;\n }\n \n if (top < viewportPadding) top = viewportPadding;\n if (top + popoverRect.height > viewportHeight - viewportPadding) {\n maxHeight = viewportHeight - top - viewportPadding;\n }\n }\n\n // Apply styles\n this.popoverEl.style.top = `${top}px`;\n this.popoverEl.style.left = `${left}px`;\n \n if (maxHeight !== null && maxHeight > 100) {\n this.popoverEl.style.maxHeight = `${maxHeight}px`;\n this.popoverEl.style.overflowY = 'auto';\n } else {\n this.popoverEl.style.maxHeight = '';\n this.popoverEl.style.overflowY = '';\n }\n\n this.isPositioned = true;\n }\n\n render() {\n const popoverStyles: Record<string, string> = {\n visibility: this.isPositioned ? 'visible' : 'hidden',\n };\n \n if (this.width) popoverStyles.width = this.width;\n if (this.minWidth) popoverStyles.minWidth = this.minWidth;\n if (this.maxWidth) popoverStyles.maxWidth = this.maxWidth;\n\n return [\n <div \n class=\"le-popover-trigger\" \n ref={(el) => (this.triggerEl = el)}\n onClick={this.handleTriggerClick}\n >\n <slot name=\"trigger\">\n <button type=\"button\" class=\"le-popover-default-trigger\">\n <span>⊕</span>\n </button>\n </slot>\n </div>,\n \n <div\n id={this.uniqueId}\n class=\"le-popover-content\"\n popover={this.closeOnClickOutside ? 'auto' : 'manual'}\n ref={(el) => (this.popoverEl = el)}\n style={popoverStyles}\n >\n {(this.popoverTitle || this.showClose) && (\n <div class=\"le-popover-header\">\n {this.popoverTitle && <span class=\"le-popover-title\">{this.popoverTitle}</span>}\n {this.showClose && (\n <button \n type=\"button\" \n class=\"le-popover-close\"\n onClick={() => this.hide()}\n aria-label=\"Close\"\n >\n ×\n </button>\n )}\n </div>\n )}\n <div class=\"le-popover-body\">\n <slot></slot>\n </div>\n </div>\n ];\n }\n}\n"]}
|
|
@@ -1,101 +0,0 @@
|
|
|
1
|
-
/**
|
|
2
|
-
* Programmatic API for le-popup component
|
|
3
|
-
*
|
|
4
|
-
* These functions allow you to show popups without manually creating elements.
|
|
5
|
-
*
|
|
6
|
-
* @example
|
|
7
|
-
* // Alert
|
|
8
|
-
* await leAlert('Something happened!');
|
|
9
|
-
*
|
|
10
|
-
* // Confirm
|
|
11
|
-
* const confirmed = await leConfirm('Are you sure?');
|
|
12
|
-
* if (confirmed) { ... }
|
|
13
|
-
*
|
|
14
|
-
* // Prompt
|
|
15
|
-
* const name = await lePrompt('What is your name?');
|
|
16
|
-
* if (name !== null) { ... }
|
|
17
|
-
*/
|
|
18
|
-
/**
|
|
19
|
-
* Show an alert popup with a message
|
|
20
|
-
* @param message - The message to display
|
|
21
|
-
* @param options - Optional configuration
|
|
22
|
-
* @returns Promise that resolves when closed
|
|
23
|
-
*
|
|
24
|
-
* @example
|
|
25
|
-
* await leAlert('File saved successfully!');
|
|
26
|
-
* await leAlert('Error occurred', { title: 'Error', theme: 'dark' });
|
|
27
|
-
*/
|
|
28
|
-
export async function leAlert(message, options = {}) {
|
|
29
|
-
const popup = createPopupElement(message, { ...options, type: 'alert' });
|
|
30
|
-
document.body.appendChild(popup);
|
|
31
|
-
await popup.show();
|
|
32
|
-
popup.remove();
|
|
33
|
-
}
|
|
34
|
-
/**
|
|
35
|
-
* Show a confirm popup with OK/Cancel buttons
|
|
36
|
-
* @param message - The message to display
|
|
37
|
-
* @param options - Optional configuration
|
|
38
|
-
* @returns Promise that resolves to true (confirmed) or false (cancelled)
|
|
39
|
-
*
|
|
40
|
-
* @example
|
|
41
|
-
* const confirmed = await leConfirm('Delete this item?');
|
|
42
|
-
* if (confirmed) {
|
|
43
|
-
* deleteItem();
|
|
44
|
-
* }
|
|
45
|
-
*/
|
|
46
|
-
export async function leConfirm(message, options = {}) {
|
|
47
|
-
const popup = createPopupElement(message, { ...options, type: 'confirm' });
|
|
48
|
-
document.body.appendChild(popup);
|
|
49
|
-
const result = await popup.show();
|
|
50
|
-
popup.remove();
|
|
51
|
-
return result.confirmed;
|
|
52
|
-
}
|
|
53
|
-
/**
|
|
54
|
-
* Show a prompt popup with an input field
|
|
55
|
-
* @param message - The message to display
|
|
56
|
-
* @param options - Optional configuration (including defaultValue, placeholder)
|
|
57
|
-
* @returns Promise that resolves to the input value or null if cancelled
|
|
58
|
-
*
|
|
59
|
-
* @example
|
|
60
|
-
* const name = await lePrompt('Enter your name:', {
|
|
61
|
-
* title: 'Welcome',
|
|
62
|
-
* placeholder: 'John Doe',
|
|
63
|
-
* defaultValue: 'Guest'
|
|
64
|
-
* });
|
|
65
|
-
* if (name !== null) {
|
|
66
|
-
* greetUser(name);
|
|
67
|
-
* }
|
|
68
|
-
*/
|
|
69
|
-
export async function lePrompt(message, options = {}) {
|
|
70
|
-
const popup = createPopupElement(message, { ...options, type: 'prompt' });
|
|
71
|
-
document.body.appendChild(popup);
|
|
72
|
-
const result = await popup.show();
|
|
73
|
-
popup.remove();
|
|
74
|
-
return result.confirmed ? (result.value ?? '') : null;
|
|
75
|
-
}
|
|
76
|
-
/**
|
|
77
|
-
* Create a popup element with the given configuration
|
|
78
|
-
*/
|
|
79
|
-
function createPopupElement(message, options) {
|
|
80
|
-
const popup = document.createElement('le-popup');
|
|
81
|
-
popup.message = message;
|
|
82
|
-
popup.type = options.type || 'alert';
|
|
83
|
-
if (options.title)
|
|
84
|
-
popup.popupTitle = options.title;
|
|
85
|
-
if (options.modal !== undefined)
|
|
86
|
-
popup.modal = options.modal;
|
|
87
|
-
if (options.position)
|
|
88
|
-
popup.position = options.position;
|
|
89
|
-
if (options.confirmText)
|
|
90
|
-
popup.confirmText = options.confirmText;
|
|
91
|
-
if (options.cancelText)
|
|
92
|
-
popup.cancelText = options.cancelText;
|
|
93
|
-
if (options.placeholder)
|
|
94
|
-
popup.placeholder = options.placeholder;
|
|
95
|
-
if (options.defaultValue)
|
|
96
|
-
popup.defaultValue = options.defaultValue;
|
|
97
|
-
if (options.theme)
|
|
98
|
-
popup.setAttribute('theme', options.theme);
|
|
99
|
-
return popup;
|
|
100
|
-
}
|
|
101
|
-
//# sourceMappingURL=le-popup.api.js.map
|
|
@@ -1 +0,0 @@
|
|
|
1
|
-
{"version":3,"file":"le-popup.api.js","sourceRoot":"","sources":["../../../src/components/le-popup/le-popup.api.ts"],"names":[],"mappings":"AAAA;;;;;;;;;;;;;;;;GAgBG;AAqCH;;;;;;;;;GASG;AACH,MAAM,CAAC,KAAK,UAAU,OAAO,CAAC,OAAe,EAAE,UAAwB,EAAE;IACvE,MAAM,KAAK,GAAG,kBAAkB,CAAC,OAAO,EAAE,EAAE,GAAG,OAAO,EAAE,IAAI,EAAE,OAAO,EAAE,CAAC,CAAC;IACzE,QAAQ,CAAC,IAAI,CAAC,WAAW,CAAC,KAAK,CAAC,CAAC;IAEjC,MAAM,KAAK,CAAC,IAAI,EAAE,CAAC;IACnB,KAAK,CAAC,MAAM,EAAE,CAAC;AACjB,CAAC;AAED;;;;;;;;;;;GAWG;AACH,MAAM,CAAC,KAAK,UAAU,SAAS,CAAC,OAAe,EAAE,UAAwB,EAAE;IACzE,MAAM,KAAK,GAAG,kBAAkB,CAAC,OAAO,EAAE,EAAE,GAAG,OAAO,EAAE,IAAI,EAAE,SAAS,EAAE,CAAC,CAAC;IAC3E,QAAQ,CAAC,IAAI,CAAC,WAAW,CAAC,KAAK,CAAC,CAAC;IAEjC,MAAM,MAAM,GAAG,MAAM,KAAK,CAAC,IAAI,EAAE,CAAC;IAClC,KAAK,CAAC,MAAM,EAAE,CAAC;IAEf,OAAO,MAAM,CAAC,SAAS,CAAC;AAC1B,CAAC;AAED;;;;;;;;;;;;;;;GAeG;AACH,MAAM,CAAC,KAAK,UAAU,QAAQ,CAAC,OAAe,EAAE,UAAwB,EAAE;IACxE,MAAM,KAAK,GAAG,kBAAkB,CAAC,OAAO,EAAE,EAAE,GAAG,OAAO,EAAE,IAAI,EAAE,QAAQ,EAAE,CAAC,CAAC;IAC1E,QAAQ,CAAC,IAAI,CAAC,WAAW,CAAC,KAAK,CAAC,CAAC;IAEjC,MAAM,MAAM,GAAG,MAAM,KAAK,CAAC,IAAI,EAAE,CAAC;IAClC,KAAK,CAAC,MAAM,EAAE,CAAC;IAEf,OAAO,MAAM,CAAC,SAAS,CAAC,CAAC,CAAC,CAAC,MAAM,CAAC,KAAK,IAAI,EAAE,CAAC,CAAC,CAAC,CAAC,IAAI,CAAC;AACxD,CAAC;AAED;;GAEG;AACH,SAAS,kBAAkB,CAAC,OAAe,EAAE,OAAqB;IAChE,MAAM,KAAK,GAAG,QAAQ,CAAC,aAAa,CAAC,UAAU,CAAuB,CAAC;IAEvE,KAAK,CAAC,OAAO,GAAG,OAAO,CAAC;IACxB,KAAK,CAAC,IAAI,GAAG,OAAO,CAAC,IAAI,IAAI,OAAO,CAAC;IAErC,IAAI,OAAO,CAAC,KAAK;QAAE,KAAK,CAAC,UAAU,GAAG,OAAO,CAAC,KAAK,CAAC;IACpD,IAAI,OAAO,CAAC,KAAK,KAAK,SAAS;QAAE,KAAK,CAAC,KAAK,GAAG,OAAO,CAAC,KAAK,CAAC;IAC7D,IAAI,OAAO,CAAC,QAAQ;QAAE,KAAK,CAAC,QAAQ,GAAG,OAAO,CAAC,QAAQ,CAAC;IACxD,IAAI,OAAO,CAAC,WAAW;QAAE,KAAK,CAAC,WAAW,GAAG,OAAO,CAAC,WAAW,CAAC;IACjE,IAAI,OAAO,CAAC,UAAU;QAAE,KAAK,CAAC,UAAU,GAAG,OAAO,CAAC,UAAU,CAAC;IAC9D,IAAI,OAAO,CAAC,WAAW;QAAE,KAAK,CAAC,WAAW,GAAG,OAAO,CAAC,WAAW,CAAC;IACjE,IAAI,OAAO,CAAC,YAAY;QAAE,KAAK,CAAC,YAAY,GAAG,OAAO,CAAC,YAAY,CAAC;IACpE,IAAI,OAAO,CAAC,KAAK;QAAE,KAAK,CAAC,YAAY,CAAC,OAAO,EAAE,OAAO,CAAC,KAAK,CAAC,CAAC;IAE9D,OAAO,KAAK,CAAC;AACf,CAAC","sourcesContent":["/**\n * Programmatic API for le-popup component\n * \n * These functions allow you to show popups without manually creating elements.\n * \n * @example\n * // Alert\n * await leAlert('Something happened!');\n * \n * // Confirm\n * const confirmed = await leConfirm('Are you sure?');\n * if (confirmed) { ... }\n * \n * // Prompt\n * const name = await lePrompt('What is your name?');\n * if (name !== null) { ... }\n */\n\nimport type { PopupType, PopupPosition, PopupResult } from './le-popup';\n\n/**\n * Options for programmatic popup functions\n */\nexport interface PopupOptions {\n title?: string;\n type?: PopupType;\n modal?: boolean;\n position?: PopupPosition;\n confirmText?: string;\n cancelText?: string;\n placeholder?: string;\n defaultValue?: string;\n theme?: string;\n}\n\n/**\n * Interface for the le-popup custom element\n */\ninterface HTMLLePopupElement extends HTMLElement {\n open: boolean;\n type: PopupType;\n popupTitle?: string;\n message?: string;\n modal: boolean;\n position: PopupPosition;\n confirmText: string;\n cancelText: string;\n placeholder: string;\n defaultValue: string;\n show(): Promise<PopupResult>;\n hide(confirmed?: boolean): Promise<void>;\n}\n\n/**\n * Show an alert popup with a message\n * @param message - The message to display\n * @param options - Optional configuration\n * @returns Promise that resolves when closed\n * \n * @example\n * await leAlert('File saved successfully!');\n * await leAlert('Error occurred', { title: 'Error', theme: 'dark' });\n */\nexport async function leAlert(message: string, options: PopupOptions = {}): Promise<void> {\n const popup = createPopupElement(message, { ...options, type: 'alert' });\n document.body.appendChild(popup);\n \n await popup.show();\n popup.remove();\n}\n\n/**\n * Show a confirm popup with OK/Cancel buttons\n * @param message - The message to display\n * @param options - Optional configuration\n * @returns Promise that resolves to true (confirmed) or false (cancelled)\n * \n * @example\n * const confirmed = await leConfirm('Delete this item?');\n * if (confirmed) {\n * deleteItem();\n * }\n */\nexport async function leConfirm(message: string, options: PopupOptions = {}): Promise<boolean> {\n const popup = createPopupElement(message, { ...options, type: 'confirm' });\n document.body.appendChild(popup);\n \n const result = await popup.show();\n popup.remove();\n \n return result.confirmed;\n}\n\n/**\n * Show a prompt popup with an input field\n * @param message - The message to display\n * @param options - Optional configuration (including defaultValue, placeholder)\n * @returns Promise that resolves to the input value or null if cancelled\n * \n * @example\n * const name = await lePrompt('Enter your name:', { \n * title: 'Welcome',\n * placeholder: 'John Doe',\n * defaultValue: 'Guest'\n * });\n * if (name !== null) {\n * greetUser(name);\n * }\n */\nexport async function lePrompt(message: string, options: PopupOptions = {}): Promise<string | null> {\n const popup = createPopupElement(message, { ...options, type: 'prompt' });\n document.body.appendChild(popup);\n \n const result = await popup.show();\n popup.remove();\n \n return result.confirmed ? (result.value ?? '') : null;\n}\n\n/**\n * Create a popup element with the given configuration\n */\nfunction createPopupElement(message: string, options: PopupOptions): HTMLLePopupElement {\n const popup = document.createElement('le-popup') as HTMLLePopupElement;\n \n popup.message = message;\n popup.type = options.type || 'alert';\n \n if (options.title) popup.popupTitle = options.title;\n if (options.modal !== undefined) popup.modal = options.modal;\n if (options.position) popup.position = options.position;\n if (options.confirmText) popup.confirmText = options.confirmText;\n if (options.cancelText) popup.cancelText = options.cancelText;\n if (options.placeholder) popup.placeholder = options.placeholder;\n if (options.defaultValue) popup.defaultValue = options.defaultValue;\n if (options.theme) popup.setAttribute('theme', options.theme);\n \n return popup;\n}\n"]}
|
|
@@ -1,222 +0,0 @@
|
|
|
1
|
-
/* ============================================
|
|
2
|
-
le-popup.css
|
|
3
|
-
Popup/Dialog component using native <dialog>
|
|
4
|
-
Uses CSS variables for easy theming
|
|
5
|
-
============================================ */
|
|
6
|
-
|
|
7
|
-
:host {
|
|
8
|
-
display: contents;
|
|
9
|
-
}
|
|
10
|
-
|
|
11
|
-
/* ============================================
|
|
12
|
-
Native Dialog Element
|
|
13
|
-
============================================ */
|
|
14
|
-
|
|
15
|
-
.le-popup-dialog {
|
|
16
|
-
/* Reset default dialog styles */
|
|
17
|
-
position: fixed;
|
|
18
|
-
z-index: 100;
|
|
19
|
-
top: 0;
|
|
20
|
-
right: 0;
|
|
21
|
-
bottom: 0;
|
|
22
|
-
left: 0;
|
|
23
|
-
padding: 0;
|
|
24
|
-
border: none;
|
|
25
|
-
background: transparent;
|
|
26
|
-
max-width: none;
|
|
27
|
-
max-height: none;
|
|
28
|
-
overflow: visible;
|
|
29
|
-
|
|
30
|
-
/* Sizing variables */
|
|
31
|
-
--_popup-min-width: var(--le-popup-min-width, 320px);
|
|
32
|
-
--_popup-max-width: var(--le-popup-max-width, min(500px, 90vw));
|
|
33
|
-
--_popup-min-height: var(--le-popup-min-height, auto);
|
|
34
|
-
}
|
|
35
|
-
|
|
36
|
-
/* Backdrop styling (native ::backdrop pseudo-element) */
|
|
37
|
-
.le-popup-dialog::backdrop {
|
|
38
|
-
background: var(--le-popup-backdrop-color, rgba(0, 0, 0, 0.5));
|
|
39
|
-
animation: le-popup-backdrop-fade 0.2s ease-out;
|
|
40
|
-
}
|
|
41
|
-
|
|
42
|
-
@keyframes le-popup-backdrop-fade {
|
|
43
|
-
from { opacity: 0; }
|
|
44
|
-
to { opacity: 1; }
|
|
45
|
-
}
|
|
46
|
-
|
|
47
|
-
/* ============================================
|
|
48
|
-
Position Variants
|
|
49
|
-
Using margin to position within viewport
|
|
50
|
-
============================================ */
|
|
51
|
-
|
|
52
|
-
/* Center (default) */
|
|
53
|
-
.le-popup-position-center {
|
|
54
|
-
margin: auto;
|
|
55
|
-
}
|
|
56
|
-
|
|
57
|
-
/* Top positions */
|
|
58
|
-
.le-popup-position-top {
|
|
59
|
-
margin: var(--le-space-2xl, 48px) auto auto auto;
|
|
60
|
-
}
|
|
61
|
-
|
|
62
|
-
.le-popup-position-top-left {
|
|
63
|
-
margin: var(--le-space-lg, 24px) auto auto var(--le-space-lg, 24px);
|
|
64
|
-
}
|
|
65
|
-
|
|
66
|
-
.le-popup-position-top-right {
|
|
67
|
-
margin: var(--le-space-lg, 24px) var(--le-space-lg, 24px) auto auto;
|
|
68
|
-
}
|
|
69
|
-
|
|
70
|
-
/* Bottom positions */
|
|
71
|
-
.le-popup-position-bottom {
|
|
72
|
-
margin: auto auto var(--le-space-2xl, 48px) auto;
|
|
73
|
-
}
|
|
74
|
-
|
|
75
|
-
.le-popup-position-bottom-left {
|
|
76
|
-
margin: auto auto var(--le-space-lg, 24px) var(--le-space-lg, 24px);
|
|
77
|
-
}
|
|
78
|
-
|
|
79
|
-
.le-popup-position-bottom-right {
|
|
80
|
-
margin: auto var(--le-space-lg, 24px) var(--le-space-lg, 24px) auto;
|
|
81
|
-
}
|
|
82
|
-
|
|
83
|
-
/* ============================================
|
|
84
|
-
Container (the visible dialog box)
|
|
85
|
-
============================================ */
|
|
86
|
-
|
|
87
|
-
.le-popup-container {
|
|
88
|
-
display: flex;
|
|
89
|
-
flex-direction: column;
|
|
90
|
-
min-width: var(--_popup-min-width);
|
|
91
|
-
max-width: var(--_popup-max-width);
|
|
92
|
-
min-height: var(--_popup-min-height);
|
|
93
|
-
max-height: calc(100vh - var(--le-space-2xl, 48px) * 2);
|
|
94
|
-
background: var(--le-color-surface, #ffffff);
|
|
95
|
-
border: 1px solid var(--le-color-border, #e0e0e0);
|
|
96
|
-
border-radius: var(--le-radius-lg, 12px);
|
|
97
|
-
box-shadow: var(--le-shadow-xl, 0 8px 32px rgba(0, 0, 0, 0.15));
|
|
98
|
-
overflow: hidden;
|
|
99
|
-
font-family: var(--le-font-family, system-ui, -apple-system, sans-serif);
|
|
100
|
-
color: var(--le-color-text, #333);
|
|
101
|
-
|
|
102
|
-
/* Animation */
|
|
103
|
-
animation: le-popup-appear 0.2s ease-out;
|
|
104
|
-
}
|
|
105
|
-
|
|
106
|
-
@keyframes le-popup-appear {
|
|
107
|
-
from {
|
|
108
|
-
opacity: 0;
|
|
109
|
-
transform: scale(0.95) translateY(-10px);
|
|
110
|
-
}
|
|
111
|
-
to {
|
|
112
|
-
opacity: 1;
|
|
113
|
-
transform: scale(1) translateY(0);
|
|
114
|
-
}
|
|
115
|
-
}
|
|
116
|
-
|
|
117
|
-
/* ============================================
|
|
118
|
-
Header
|
|
119
|
-
============================================ */
|
|
120
|
-
|
|
121
|
-
.le-popup-header {
|
|
122
|
-
flex-shrink: 0;
|
|
123
|
-
padding: var(--le-space-md, 16px) var(--le-space-lg, 24px);
|
|
124
|
-
border-bottom: 1px solid var(--le-color-border, #e0e0e0);
|
|
125
|
-
background: var(--le-color-surface-alt, #f9f9f9);
|
|
126
|
-
font-size: var(--le-font-size-lg, 1.125rem);
|
|
127
|
-
font-weight: var(--le-font-weight-semibold, 600);
|
|
128
|
-
color: var(--le-color-text, #333);
|
|
129
|
-
}
|
|
130
|
-
|
|
131
|
-
/* ============================================
|
|
132
|
-
Body
|
|
133
|
-
============================================ */
|
|
134
|
-
|
|
135
|
-
.le-popup-body {
|
|
136
|
-
flex: 1;
|
|
137
|
-
padding: var(--le-space-lg, 24px);
|
|
138
|
-
overflow-y: auto;
|
|
139
|
-
}
|
|
140
|
-
|
|
141
|
-
.le-popup-message {
|
|
142
|
-
margin: 0;
|
|
143
|
-
font-size: var(--le-font-size-md, 1rem);
|
|
144
|
-
line-height: var(--le-line-height-relaxed, 1.6);
|
|
145
|
-
color: var(--le-color-text, #333);
|
|
146
|
-
}
|
|
147
|
-
|
|
148
|
-
/* When there's both message and slot content */
|
|
149
|
-
.le-popup-message + ::slotted(*) {
|
|
150
|
-
margin-top: var(--le-space-md, 16px);
|
|
151
|
-
}
|
|
152
|
-
|
|
153
|
-
/* ============================================
|
|
154
|
-
Input (for prompt type)
|
|
155
|
-
============================================ */
|
|
156
|
-
|
|
157
|
-
.le-popup-input {
|
|
158
|
-
display: block;
|
|
159
|
-
width: 100%;
|
|
160
|
-
margin-top: var(--le-space-md, 16px);
|
|
161
|
-
padding: var(--le-space-sm, 8px) var(--le-space-md, 16px);
|
|
162
|
-
font-family: inherit;
|
|
163
|
-
font-size: var(--le-font-size-md, 1rem);
|
|
164
|
-
color: var(--le-color-text, #333);
|
|
165
|
-
background: var(--le-color-background, #fff);
|
|
166
|
-
border: 1px solid var(--le-color-border, #e0e0e0);
|
|
167
|
-
border-radius: var(--le-radius-md, 8px);
|
|
168
|
-
outline: none;
|
|
169
|
-
transition: border-color var(--le-transition-fast, 0.15s ease),
|
|
170
|
-
box-shadow var(--le-transition-fast, 0.15s ease);
|
|
171
|
-
box-sizing: border-box;
|
|
172
|
-
}
|
|
173
|
-
|
|
174
|
-
.le-popup-input:focus {
|
|
175
|
-
border-color: var(--le-color-primary, #2196f3);
|
|
176
|
-
box-shadow: 0 0 0 3px var(--le-color-primary-light, rgba(33, 150, 243, 0.2));
|
|
177
|
-
}
|
|
178
|
-
|
|
179
|
-
.le-popup-input::placeholder {
|
|
180
|
-
color: var(--le-color-text-muted, #999);
|
|
181
|
-
}
|
|
182
|
-
|
|
183
|
-
/* ============================================
|
|
184
|
-
Footer (buttons)
|
|
185
|
-
============================================ */
|
|
186
|
-
|
|
187
|
-
.le-popup-footer {
|
|
188
|
-
flex-shrink: 0;
|
|
189
|
-
display: flex;
|
|
190
|
-
justify-content: flex-end;
|
|
191
|
-
gap: var(--le-space-sm, 8px);
|
|
192
|
-
padding: var(--le-space-md, 16px) var(--le-space-lg, 24px);
|
|
193
|
-
border-top: 1px solid var(--le-color-border, #e0e0e0);
|
|
194
|
-
background: var(--le-color-surface-alt, #f9f9f9);
|
|
195
|
-
}
|
|
196
|
-
|
|
197
|
-
/* ============================================
|
|
198
|
-
Buttons
|
|
199
|
-
============================================ */
|
|
200
|
-
|
|
201
|
-
.le-popup-btn {
|
|
202
|
-
min-width: 80px;
|
|
203
|
-
}
|
|
204
|
-
|
|
205
|
-
/* ============================================
|
|
206
|
-
Responsive adjustments
|
|
207
|
-
============================================ */
|
|
208
|
-
|
|
209
|
-
@media (max-width: 480px) {
|
|
210
|
-
.le-popup-container {
|
|
211
|
-
min-width: calc(100vw - var(--le-space-md, 16px) * 2);
|
|
212
|
-
max-width: calc(100vw - var(--le-space-md, 16px) * 2);
|
|
213
|
-
}
|
|
214
|
-
|
|
215
|
-
.le-popup-footer {
|
|
216
|
-
flex-direction: column-reverse;
|
|
217
|
-
}
|
|
218
|
-
|
|
219
|
-
.le-popup-btn {
|
|
220
|
-
width: 100%;
|
|
221
|
-
}
|
|
222
|
-
}
|