@oiz/stzh-components 2.6.0-beta → 2.7.0-alpha
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/dist/cjs/{app-globals-b9f31c77.js → app-globals-5dfa53d1.js} +2 -2
- package/dist/cjs/{app-globals-b9f31c77.js.map → app-globals-5dfa53d1.js.map} +1 -1
- package/dist/cjs/index.cjs.js.map +1 -1
- package/dist/cjs/loader.cjs.js +2 -2
- package/dist/cjs/stzh-actions.cjs.entry.js +1 -5
- package/dist/cjs/stzh-actions.cjs.entry.js.map +1 -1
- package/dist/cjs/stzh-actionset.cjs.entry.js +2 -2
- package/dist/cjs/stzh-actionset.cjs.entry.js.map +1 -1
- package/dist/cjs/stzh-amount.cjs.entry.js +50 -69
- package/dist/cjs/stzh-amount.cjs.entry.js.map +1 -1
- package/dist/cjs/stzh-badge_3.cjs.entry.js +2 -2
- package/dist/cjs/stzh-badge_3.cjs.entry.js.map +1 -1
- package/dist/cjs/stzh-checkbox.cjs.entry.js.map +1 -1
- package/dist/cjs/stzh-checkboxgroup.cjs.entry.js.map +1 -1
- package/dist/cjs/stzh-components.cjs.js +2 -2
- package/dist/cjs/stzh-datepicker_3.cjs.entry.js.map +1 -1
- package/dist/cjs/stzh-dropdown.cjs.entry.js +60 -25
- package/dist/cjs/stzh-dropdown.cjs.entry.js.map +1 -1
- package/dist/cjs/stzh-ghettobox_2.cjs.entry.js +1 -1
- package/dist/cjs/stzh-ghettobox_2.cjs.entry.js.map +1 -1
- package/dist/cjs/stzh-input.cjs.entry.js.map +1 -1
- package/dist/cjs/stzh-invert.cjs.entry.js +1 -1
- package/dist/cjs/stzh-invert.cjs.entry.js.map +1 -1
- package/dist/cjs/stzh-monthyearpicker.cjs.entry.js +191 -0
- package/dist/cjs/stzh-monthyearpicker.cjs.entry.js.map +1 -0
- package/dist/cjs/stzh-skin-portal-mitwirken.cjs.entry.js +1 -1
- package/dist/cjs/stzh-skin-portal-mitwirken.cjs.entry.js.map +1 -1
- package/dist/cjs/stzh-timepicker.cjs.entry.js +82 -0
- package/dist/cjs/stzh-timepicker.cjs.entry.js.map +1 -0
- package/dist/cjs/stzh-toggle.cjs.entry.js.map +1 -1
- package/dist/cjs/stzh-upload.cjs.entry.js +19 -7
- package/dist/cjs/stzh-upload.cjs.entry.js.map +1 -1
- package/dist/cjs/translation-utils-73073e44.js.map +1 -1
- package/dist/collection/assets/i18n/de.json +10 -7
- package/dist/collection/assets/i18n/en.json +8 -5
- package/dist/collection/collection-manifest.json +2 -0
- package/dist/collection/components/stzh-actions/stzh-actions.js +1 -5
- package/dist/collection/components/stzh-actions/stzh-actions.js.map +1 -1
- package/dist/collection/components/stzh-actionset/stzh-actionset.js +2 -2
- package/dist/collection/components/stzh-actionset/stzh-actionset.js.map +1 -1
- package/dist/collection/components/stzh-amount/stzh-amount.css +1 -0
- package/dist/collection/components/stzh-amount/stzh-amount.js +84 -85
- package/dist/collection/components/stzh-amount/stzh-amount.js.map +1 -1
- package/dist/collection/components/stzh-amount/stzh-amount.localization.js.map +1 -1
- package/dist/collection/components/stzh-amount/stzh-amount.stories.js +14 -0
- package/dist/collection/components/stzh-button/stzh-button.css +2 -2
- package/dist/collection/components/stzh-button/stzh-button.js +1 -1
- package/dist/collection/components/stzh-button/stzh-button.js.map +1 -1
- package/dist/collection/components/stzh-checkbox/stzh-checkbox.js +1 -1
- package/dist/collection/components/stzh-checkbox/stzh-checkbox.js.map +1 -1
- package/dist/collection/components/stzh-checkboxgroup/stzh-checkboxgroup.js +1 -1
- package/dist/collection/components/stzh-checkboxgroup/stzh-checkboxgroup.js.map +1 -1
- package/dist/collection/components/stzh-datepicker/stzh-datepicker.js +2 -2
- package/dist/collection/components/stzh-datepicker/stzh-datepicker.js.map +1 -1
- package/dist/collection/components/stzh-datepicker/stzh-datepicker.stories.js +3 -0
- package/dist/collection/components/stzh-dropdown/stzh-dropdown.css +32 -20
- package/dist/collection/components/stzh-dropdown/stzh-dropdown.js +40 -9
- package/dist/collection/components/stzh-dropdown/stzh-dropdown.js.map +1 -1
- package/dist/collection/components/stzh-ghettobox/stzh-ghettobox.css +4 -4
- package/dist/collection/components/stzh-input/stzh-input.js +1 -1
- package/dist/collection/components/stzh-input/stzh-input.js.map +1 -1
- package/dist/collection/components/stzh-invert/stzh-invert.css +2 -2
- package/dist/collection/components/stzh-monthyearpicker/stzh-monthyearpicker.css +123 -0
- package/dist/collection/components/stzh-monthyearpicker/stzh-monthyearpicker.js +724 -0
- package/dist/collection/components/stzh-monthyearpicker/stzh-monthyearpicker.js.map +1 -0
- package/dist/collection/components/stzh-monthyearpicker/stzh-monthyearpicker.localization.js +2 -0
- package/dist/collection/components/stzh-monthyearpicker/stzh-monthyearpicker.localization.js.map +1 -0
- package/dist/collection/components/stzh-monthyearpicker/stzh-monthyearpicker.stories.js +61 -0
- package/dist/collection/components/stzh-radio/stzh-radio.js +1 -1
- package/dist/collection/components/stzh-radio/stzh-radio.js.map +1 -1
- package/dist/collection/components/stzh-radiogroup/stzh-radiogroup.js +1 -1
- package/dist/collection/components/stzh-radiogroup/stzh-radiogroup.js.map +1 -1
- package/dist/collection/components/stzh-skin-portal-mitwirken/stzh-skin-portal-mitwirken.css +1 -1
- package/dist/collection/components/stzh-timepicker/stzh-timepicker.css +109 -0
- package/dist/collection/components/stzh-timepicker/stzh-timepicker.js +438 -0
- package/dist/collection/components/stzh-timepicker/stzh-timepicker.js.map +1 -0
- package/dist/collection/components/stzh-timepicker/stzh-timepicker.localization.js +2 -0
- package/dist/collection/components/stzh-timepicker/stzh-timepicker.localization.js.map +1 -0
- package/dist/collection/components/stzh-timepicker/stzh-timepicker.stories.js +45 -0
- package/dist/collection/components/stzh-toggle/stzh-toggle.js +1 -1
- package/dist/collection/components/stzh-toggle/stzh-toggle.js.map +1 -1
- package/dist/collection/components/stzh-upload/stzh-upload.js +53 -3
- package/dist/collection/components/stzh-upload/stzh-upload.js.map +1 -1
- package/dist/collection/index.js.map +1 -1
- package/dist/collection/libraries/dropzone/dropzone-amd-module.js +11 -5
- package/dist/collection/libraries/dropzone/dropzone.js +11 -5
- package/dist/collection/libraries/dropzone/min/dropzone-amd-module.min.js +1 -1
- package/dist/collection/libraries/dropzone/min/dropzone.min.js +1 -1
- package/dist/collection/libraries/tom-select/cjs/tom-select.complete.js +47 -18
- package/dist/collection/libraries/tom-select/cjs/tom-select.js +47 -18
- package/dist/collection/libraries/tom-select/cjs/tom-select.popular.js +47 -18
- package/dist/collection/libraries/tom-select/esm/tom-select.complete.js +47 -18
- package/dist/collection/libraries/tom-select/esm/tom-select.js +47 -18
- package/dist/collection/libraries/tom-select/esm/tom-select.popular.js +47 -18
- package/dist/collection/libraries/tom-select/js/tom-select.base.js +47 -18
- package/dist/collection/libraries/tom-select/js/tom-select.base.min.js +16 -17
- package/dist/collection/libraries/tom-select/js/tom-select.complete.js +47 -18
- package/dist/collection/libraries/tom-select/js/tom-select.complete.min.js +12 -13
- package/dist/collection/libraries/tom-select/js/tom-select.popular.js +47 -18
- package/dist/collection/libraries/tom-select/js/tom-select.popular.min.js +21 -22
- package/dist/collection/utils/translation-utils.js.map +1 -1
- package/dist/components/index.js +1 -1
- package/dist/components/index2.js.map +1 -1
- package/dist/components/stzh-actions.js +1 -5
- package/dist/components/stzh-actions.js.map +1 -1
- package/dist/components/stzh-actionset2.js +2 -2
- package/dist/components/stzh-actionset2.js.map +1 -1
- package/dist/components/stzh-amount.js +69 -82
- package/dist/components/stzh-amount.js.map +1 -1
- package/dist/components/stzh-button2.js +2 -2
- package/dist/components/stzh-button2.js.map +1 -1
- package/dist/components/stzh-buttongroup.js +1 -31
- package/dist/components/stzh-buttongroup.js.map +1 -1
- package/dist/components/stzh-buttongroup2.js +35 -0
- package/dist/components/stzh-buttongroup2.js.map +1 -0
- package/dist/components/stzh-checkbox.js.map +1 -1
- package/dist/components/stzh-checkboxgroup.js.map +1 -1
- package/dist/components/stzh-datepicker2.js.map +1 -1
- package/dist/components/stzh-dropdown2.js +61 -25
- package/dist/components/stzh-dropdown2.js.map +1 -1
- package/dist/components/stzh-ghettobox2.js +1 -1
- package/dist/components/stzh-ghettobox2.js.map +1 -1
- package/dist/components/stzh-input2.js.map +1 -1
- package/dist/components/stzh-invert.js +1 -1
- package/dist/components/stzh-invert.js.map +1 -1
- package/dist/components/stzh-monthyearpicker.d.ts +11 -0
- package/dist/components/stzh-monthyearpicker.js +251 -0
- package/dist/components/stzh-monthyearpicker.js.map +1 -0
- package/dist/components/stzh-radio2.js.map +1 -1
- package/dist/components/stzh-radiogroup2.js.map +1 -1
- package/dist/components/stzh-skin-portal-mitwirken.js +1 -1
- package/dist/components/stzh-skin-portal-mitwirken.js.map +1 -1
- package/dist/components/stzh-timepicker.d.ts +11 -0
- package/dist/components/stzh-timepicker.js +132 -0
- package/dist/components/stzh-timepicker.js.map +1 -0
- package/dist/components/stzh-toggle.js.map +1 -1
- package/dist/components/stzh-upload.js +22 -8
- package/dist/components/stzh-upload.js.map +1 -1
- package/dist/components/translation-utils.js.map +1 -1
- package/dist/esm/{app-globals-0c7feedc.js → app-globals-862dc6d0.js} +2 -2
- package/dist/esm/{app-globals-0c7feedc.js.map → app-globals-862dc6d0.js.map} +1 -1
- package/dist/esm/index.js.map +1 -1
- package/dist/esm/loader.js +2 -2
- package/dist/esm/stzh-actions.entry.js +1 -5
- package/dist/esm/stzh-actions.entry.js.map +1 -1
- package/dist/esm/stzh-actionset.entry.js +2 -2
- package/dist/esm/stzh-actionset.entry.js.map +1 -1
- package/dist/esm/stzh-amount.entry.js +51 -70
- package/dist/esm/stzh-amount.entry.js.map +1 -1
- package/dist/esm/stzh-badge_3.entry.js +2 -2
- package/dist/esm/stzh-badge_3.entry.js.map +1 -1
- package/dist/esm/stzh-checkbox.entry.js.map +1 -1
- package/dist/esm/stzh-checkboxgroup.entry.js.map +1 -1
- package/dist/esm/stzh-components.js +2 -2
- package/dist/esm/stzh-datepicker_3.entry.js.map +1 -1
- package/dist/esm/stzh-dropdown.entry.js +60 -25
- package/dist/esm/stzh-dropdown.entry.js.map +1 -1
- package/dist/esm/stzh-ghettobox_2.entry.js +1 -1
- package/dist/esm/stzh-ghettobox_2.entry.js.map +1 -1
- package/dist/esm/stzh-input.entry.js.map +1 -1
- package/dist/esm/stzh-invert.entry.js +1 -1
- package/dist/esm/stzh-invert.entry.js.map +1 -1
- package/dist/esm/stzh-monthyearpicker.entry.js +187 -0
- package/dist/esm/stzh-monthyearpicker.entry.js.map +1 -0
- package/dist/esm/stzh-skin-portal-mitwirken.entry.js +1 -1
- package/dist/esm/stzh-skin-portal-mitwirken.entry.js.map +1 -1
- package/dist/esm/stzh-timepicker.entry.js +78 -0
- package/dist/esm/stzh-timepicker.entry.js.map +1 -0
- package/dist/esm/stzh-toggle.entry.js.map +1 -1
- package/dist/esm/stzh-upload.entry.js +19 -7
- package/dist/esm/stzh-upload.entry.js.map +1 -1
- package/dist/esm/translation-utils-2623783f.js.map +1 -1
- package/dist/esm-es5/{app-globals-0c7feedc.js → app-globals-862dc6d0.js} +2 -2
- package/dist/esm-es5/{app-globals-0c7feedc.js.map → app-globals-862dc6d0.js.map} +1 -1
- package/dist/esm-es5/index.js.map +1 -1
- package/dist/esm-es5/loader.js +1 -1
- package/dist/esm-es5/loader.js.map +1 -1
- package/dist/esm-es5/stzh-actions.entry.js +1 -1
- package/dist/esm-es5/stzh-actions.entry.js.map +1 -1
- package/dist/esm-es5/stzh-actionset.entry.js +1 -1
- package/dist/esm-es5/stzh-actionset.entry.js.map +1 -1
- package/dist/esm-es5/stzh-amount.entry.js +1 -1
- package/dist/esm-es5/stzh-amount.entry.js.map +1 -1
- package/dist/esm-es5/stzh-badge_3.entry.js +1 -1
- package/dist/esm-es5/stzh-badge_3.entry.js.map +1 -1
- package/dist/esm-es5/stzh-checkbox.entry.js.map +1 -1
- package/dist/esm-es5/stzh-checkboxgroup.entry.js.map +1 -1
- package/dist/esm-es5/stzh-components.js +1 -1
- package/dist/esm-es5/stzh-components.js.map +1 -1
- package/dist/esm-es5/stzh-datepicker_3.entry.js.map +1 -1
- package/dist/esm-es5/stzh-dropdown.entry.js +2 -2
- package/dist/esm-es5/stzh-dropdown.entry.js.map +1 -1
- package/dist/esm-es5/stzh-ghettobox_2.entry.js +1 -1
- package/dist/esm-es5/stzh-ghettobox_2.entry.js.map +1 -1
- package/dist/esm-es5/stzh-input.entry.js.map +1 -1
- package/dist/esm-es5/stzh-invert.entry.js +1 -1
- package/dist/esm-es5/stzh-invert.entry.js.map +1 -1
- package/dist/esm-es5/stzh-monthyearpicker.entry.js +2 -0
- package/dist/esm-es5/stzh-monthyearpicker.entry.js.map +1 -0
- package/dist/esm-es5/stzh-skin-portal-mitwirken.entry.js +1 -1
- package/dist/esm-es5/stzh-skin-portal-mitwirken.entry.js.map +1 -1
- package/dist/esm-es5/stzh-timepicker.entry.js +2 -0
- package/dist/esm-es5/stzh-timepicker.entry.js.map +1 -0
- package/dist/esm-es5/stzh-toggle.entry.js.map +1 -1
- package/dist/esm-es5/stzh-upload.entry.js +1 -1
- package/dist/esm-es5/stzh-upload.entry.js.map +1 -1
- package/dist/esm-es5/translation-utils-2623783f.js.map +1 -1
- package/dist/stzh-components/assets/i18n/de.json +10 -7
- package/dist/stzh-components/assets/i18n/en.json +8 -5
- package/dist/stzh-components/index.esm.js.map +1 -1
- package/dist/stzh-components/{p-8228cd4c.system.entry.js → p-09191103.system.entry.js} +2 -2
- package/dist/stzh-components/{p-8228cd4c.system.entry.js.map → p-09191103.system.entry.js.map} +1 -1
- package/dist/stzh-components/p-0f328a2d.system.entry.js +2 -0
- package/dist/stzh-components/{p-12964da2.system.entry.js.map → p-0f328a2d.system.entry.js.map} +1 -1
- package/dist/stzh-components/p-14e782cb.entry.js +2 -0
- package/dist/stzh-components/{p-85504842.entry.js.map → p-14e782cb.entry.js.map} +1 -1
- package/dist/stzh-components/p-1678e09c.system.js +2 -0
- package/dist/stzh-components/{p-8ebb6058.system.js.map → p-1678e09c.system.js.map} +1 -1
- package/dist/stzh-components/p-25a09313.js.map +1 -1
- package/dist/stzh-components/p-2615433f.system.entry.js +2 -0
- package/dist/stzh-components/p-2615433f.system.entry.js.map +1 -0
- package/dist/stzh-components/p-2907f1b5.entry.js +2 -0
- package/dist/stzh-components/{p-72da8eba.entry.js.map → p-2907f1b5.entry.js.map} +1 -1
- package/dist/stzh-components/{p-728cc738.entry.js → p-2d25bcc8.entry.js} +2 -2
- package/dist/stzh-components/p-2d25bcc8.entry.js.map +1 -0
- package/dist/stzh-components/p-2f3add2f.system.entry.js +2 -0
- package/dist/stzh-components/{p-0fa1dc9b.system.entry.js.map → p-2f3add2f.system.entry.js.map} +1 -1
- package/dist/stzh-components/p-39a4904e.system.entry.js.map +1 -1
- package/dist/stzh-components/p-3aa5623c.entry.js.map +1 -1
- package/dist/stzh-components/{p-37cfb2b2.system.js → p-3b4833a0.system.js} +2 -2
- package/dist/stzh-components/{p-37cfb2b2.system.js.map → p-3b4833a0.system.js.map} +1 -1
- package/dist/stzh-components/p-3cb43903.entry.js.map +1 -1
- package/dist/stzh-components/p-49a0420a.entry.js +2 -0
- package/dist/stzh-components/{p-8bbb27f2.entry.js.map → p-49a0420a.entry.js.map} +1 -1
- package/dist/stzh-components/p-51f1714c.system.entry.js +2 -0
- package/dist/stzh-components/p-51f1714c.system.entry.js.map +1 -0
- package/dist/stzh-components/p-5aa96b49.system.entry.js +2 -0
- package/dist/stzh-components/p-5aa96b49.system.entry.js.map +1 -0
- package/dist/stzh-components/p-5d8ad1f4.system.entry.js.map +1 -1
- package/dist/stzh-components/{p-6ee544b4.entry.js → p-62188444.entry.js} +2 -2
- package/dist/stzh-components/{p-6ee544b4.entry.js.map → p-62188444.entry.js.map} +1 -1
- package/dist/stzh-components/{p-e683abe3.system.entry.js → p-6d097e82.system.entry.js} +2 -2
- package/dist/stzh-components/p-6d097e82.system.entry.js.map +1 -0
- package/dist/stzh-components/p-82e886d4.entry.js.map +1 -1
- package/dist/stzh-components/{p-d69b11ec.system.entry.js → p-94a5e295.system.entry.js} +2 -2
- package/dist/stzh-components/p-94a5e295.system.entry.js.map +1 -0
- package/dist/stzh-components/p-9b7d4e8d.entry.js.map +1 -1
- package/dist/stzh-components/p-9d46101e.entry.js +2 -0
- package/dist/stzh-components/p-9d46101e.entry.js.map +1 -0
- package/dist/stzh-components/p-9f31cf7d.entry.js +2 -0
- package/dist/stzh-components/p-9f31cf7d.entry.js.map +1 -0
- package/dist/stzh-components/p-9fe69be8.system.entry.js +2 -0
- package/dist/stzh-components/{p-479a02fb.system.entry.js.map → p-9fe69be8.system.entry.js.map} +1 -1
- package/dist/stzh-components/p-a408bfba.system.js.map +1 -1
- package/dist/stzh-components/p-ad33db31.entry.js +2 -0
- package/dist/stzh-components/p-ad33db31.entry.js.map +1 -0
- package/dist/stzh-components/p-b05c240b.system.entry.js.map +1 -1
- package/dist/stzh-components/p-b5cda655.entry.js +2 -0
- package/dist/stzh-components/p-b5cda655.entry.js.map +1 -0
- package/dist/stzh-components/p-b8ad5f47.system.entry.js.map +1 -1
- package/dist/stzh-components/{p-a226d634.js → p-bc82ed48.js} +2 -2
- package/dist/stzh-components/{p-a226d634.js.map → p-bc82ed48.js.map} +1 -1
- package/dist/stzh-components/{p-5e09547b.entry.js → p-bcd5b20e.entry.js} +2 -2
- package/dist/stzh-components/p-bcd5b20e.entry.js.map +1 -0
- package/dist/stzh-components/p-c0f971f2.entry.js +9 -0
- package/dist/stzh-components/p-c0f971f2.entry.js.map +1 -0
- package/dist/stzh-components/p-c901fe72.system.entry.js +9 -0
- package/dist/stzh-components/p-c901fe72.system.entry.js.map +1 -0
- package/dist/stzh-components/p-cc35e963.entry.js.map +1 -1
- package/dist/stzh-components/p-e8545386.system.entry.js +2 -0
- package/dist/stzh-components/p-e8545386.system.entry.js.map +1 -0
- package/dist/stzh-components/p-eaa65f52.system.js.map +1 -1
- package/dist/stzh-components/p-f2d74491.system.entry.js.map +1 -1
- package/dist/stzh-components/stzh-components.css +1 -1
- package/dist/stzh-components/stzh-components.esm.js +1 -1
- package/dist/stzh-components/stzh-components.esm.js.map +1 -1
- package/dist/stzh-components/stzh-components.js +1 -1
- package/dist/types/components/stzh-amount/stzh-amount.localization.d.ts +0 -2
- package/dist/types/components/stzh-monthyearpicker/stzh-monthyearpicker.localization.d.ts +5 -0
- package/dist/types/components/stzh-timepicker/stzh-timepicker.localization.d.ts +2 -0
- package/dist/types/components.d.ts +454 -22
- package/dist/types/index.d.ts +19 -0
- package/dist/types/utils/translation-utils.d.ts +1 -0
- package/dist/vscode-data.json +282 -8
- package/package.json +1 -1
- package/dist/stzh-components/p-09a8bcde.system.entry.js +0 -9
- package/dist/stzh-components/p-09a8bcde.system.entry.js.map +0 -1
- package/dist/stzh-components/p-0fa1dc9b.system.entry.js +0 -2
- package/dist/stzh-components/p-12964da2.system.entry.js +0 -2
- package/dist/stzh-components/p-2ee0d173.system.entry.js +0 -2
- package/dist/stzh-components/p-2ee0d173.system.entry.js.map +0 -1
- package/dist/stzh-components/p-30e04d53.entry.js +0 -2
- package/dist/stzh-components/p-30e04d53.entry.js.map +0 -1
- package/dist/stzh-components/p-427461c5.system.entry.js +0 -2
- package/dist/stzh-components/p-427461c5.system.entry.js.map +0 -1
- package/dist/stzh-components/p-479a02fb.system.entry.js +0 -2
- package/dist/stzh-components/p-5e09547b.entry.js.map +0 -1
- package/dist/stzh-components/p-66c1942a.entry.js +0 -2
- package/dist/stzh-components/p-66c1942a.entry.js.map +0 -1
- package/dist/stzh-components/p-728cc738.entry.js.map +0 -1
- package/dist/stzh-components/p-72da8eba.entry.js +0 -2
- package/dist/stzh-components/p-85504842.entry.js +0 -2
- package/dist/stzh-components/p-8bbb27f2.entry.js +0 -2
- package/dist/stzh-components/p-8ebb6058.system.js +0 -2
- package/dist/stzh-components/p-c4503250.entry.js +0 -9
- package/dist/stzh-components/p-c4503250.entry.js.map +0 -1
- package/dist/stzh-components/p-d69b11ec.system.entry.js.map +0 -1
- package/dist/stzh-components/p-e683abe3.system.entry.js.map +0 -1
|
@@ -2132,17 +2132,24 @@
|
|
|
2132
2132
|
const query = "label[for='" + escapeQuery(self.inputId) + "']";
|
|
2133
2133
|
const label = document.querySelector(query);
|
|
2134
2134
|
const label_click = self.focus.bind(self);
|
|
2135
|
+
const labelled_by = input.getAttribute('aria-labelledby');
|
|
2135
2136
|
if (label) {
|
|
2136
2137
|
addEvent(label, 'click', label_click);
|
|
2137
2138
|
setAttr(label, {
|
|
2138
2139
|
for: control_id
|
|
2139
2140
|
});
|
|
2140
|
-
|
|
2141
|
+
|
|
2142
|
+
// const label_id = getId(label,self.inputId+'-ts-label');
|
|
2143
|
+
// setAttr(focus_node,{'aria-labelledby':label_id});
|
|
2144
|
+
// setAttr(dropdown_content,{'aria-labelledby':label_id});
|
|
2145
|
+
}
|
|
2146
|
+
|
|
2147
|
+
if (labelled_by) {
|
|
2141
2148
|
setAttr(focus_node, {
|
|
2142
|
-
'aria-labelledby':
|
|
2149
|
+
'aria-labelledby': labelled_by
|
|
2143
2150
|
});
|
|
2144
2151
|
setAttr(dropdown_content, {
|
|
2145
|
-
'aria-labelledby':
|
|
2152
|
+
'aria-labelledby': labelled_by
|
|
2146
2153
|
});
|
|
2147
2154
|
}
|
|
2148
2155
|
wrapper.style.width = input.style.width;
|
|
@@ -2150,10 +2157,15 @@
|
|
|
2150
2157
|
const classes_plugins = 'plugin-' + self.plugins.names.join(' plugin-');
|
|
2151
2158
|
addClasses([wrapper, dropdown], classes_plugins);
|
|
2152
2159
|
}
|
|
2153
|
-
if (
|
|
2154
|
-
setAttr(
|
|
2155
|
-
|
|
2160
|
+
if (settings.mode === 'multi') {
|
|
2161
|
+
setAttr(dropdown_content, {
|
|
2162
|
+
'aria-multiselectable': 'true'
|
|
2156
2163
|
});
|
|
2164
|
+
if (self.is_select_tag) {
|
|
2165
|
+
setAttr(input, {
|
|
2166
|
+
multiple: 'multiple'
|
|
2167
|
+
});
|
|
2168
|
+
}
|
|
2157
2169
|
}
|
|
2158
2170
|
if (settings.placeholder) {
|
|
2159
2171
|
setAttr(control_input, {
|
|
@@ -2809,7 +2821,7 @@
|
|
|
2809
2821
|
*
|
|
2810
2822
|
*/
|
|
2811
2823
|
getValue() {
|
|
2812
|
-
if (this.
|
|
2824
|
+
if (this.settings.mode === 'multi' && this.is_select_tag) {
|
|
2813
2825
|
return this.items;
|
|
2814
2826
|
}
|
|
2815
2827
|
return this.items.join(this.settings.delimiter);
|
|
@@ -2942,9 +2954,11 @@
|
|
|
2942
2954
|
setAttr(this.focus_node, {
|
|
2943
2955
|
'aria-activedescendant': option.getAttribute('id')
|
|
2944
2956
|
});
|
|
2945
|
-
|
|
2946
|
-
|
|
2947
|
-
|
|
2957
|
+
if (this.settings.mode === 'single' || this.settings.hideSelected) {
|
|
2958
|
+
setAttr(option, {
|
|
2959
|
+
'aria-selected': 'true'
|
|
2960
|
+
});
|
|
2961
|
+
}
|
|
2948
2962
|
addClasses(option, 'active');
|
|
2949
2963
|
if (scroll) this.scrollToOption(option);
|
|
2950
2964
|
}
|
|
@@ -2987,9 +3001,11 @@
|
|
|
2987
3001
|
clearActiveOption() {
|
|
2988
3002
|
if (this.activeOption) {
|
|
2989
3003
|
removeClasses(this.activeOption, 'active');
|
|
2990
|
-
|
|
2991
|
-
|
|
2992
|
-
|
|
3004
|
+
if (this.settings.mode === 'single' || this.settings.hideSelected) {
|
|
3005
|
+
setAttr(this.activeOption, {
|
|
3006
|
+
'aria-selected': null
|
|
3007
|
+
});
|
|
3008
|
+
}
|
|
2993
3009
|
}
|
|
2994
3010
|
this.activeOption = null;
|
|
2995
3011
|
setAttr(this.focus_node, {
|
|
@@ -3204,10 +3220,16 @@
|
|
|
3204
3220
|
if (option === undefined) continue;
|
|
3205
3221
|
let opt_hash = get_hash(opt_value);
|
|
3206
3222
|
let option_el = self.getOption(opt_hash, true);
|
|
3223
|
+
const option_selected = self.items.includes(opt_hash);
|
|
3207
3224
|
|
|
3208
3225
|
// toggle 'selected' class
|
|
3209
3226
|
if (!self.settings.hideSelected) {
|
|
3210
|
-
option_el.classList.toggle('selected',
|
|
3227
|
+
option_el.classList.toggle('selected', option_selected);
|
|
3228
|
+
if (this.settings.mode === 'multi') {
|
|
3229
|
+
setAttr(option_el, {
|
|
3230
|
+
'aria-selected': option_selected ? 'true' : 'false'
|
|
3231
|
+
});
|
|
3232
|
+
}
|
|
3211
3233
|
}
|
|
3212
3234
|
optgroup = option[self.settings.optgroupField] || '';
|
|
3213
3235
|
optgroups = Array.isArray(optgroup) ? optgroup : [optgroup];
|
|
@@ -3225,10 +3247,17 @@
|
|
|
3225
3247
|
// nodes can only have one parent, so if the option is in mutple groups, we need a clone
|
|
3226
3248
|
if (j > 0) {
|
|
3227
3249
|
option_el = option_el.cloneNode(true);
|
|
3228
|
-
|
|
3229
|
-
|
|
3230
|
-
|
|
3231
|
-
|
|
3250
|
+
if (this.settings.mode === 'multi' && !self.settings.hideSelected) {
|
|
3251
|
+
setAttr(option_el, {
|
|
3252
|
+
id: option.$id + '-clone-' + j,
|
|
3253
|
+
'aria-selected': option_selected ? 'true' : 'false'
|
|
3254
|
+
});
|
|
3255
|
+
} else {
|
|
3256
|
+
setAttr(option_el, {
|
|
3257
|
+
id: option.$id + '-clone-' + j,
|
|
3258
|
+
'aria-selected': null
|
|
3259
|
+
});
|
|
3260
|
+
}
|
|
3232
3261
|
option_el.classList.add('ts-cloned');
|
|
3233
3262
|
removeClasses(option_el, 'active');
|
|
3234
3263
|
|
|
@@ -22,12 +22,12 @@ let p,h
|
|
|
22
22
|
const g={},f={"/":"⁄∕",0:"߀",a:"ⱥɐɑ",aa:"ꜳ",ae:"æǽǣ",ao:"ꜵ",au:"ꜷ",av:"ꜹꜻ",ay:"ꜽ",b:"ƀɓƃ",c:"ꜿƈȼↄ",d:"đɗɖᴅƌꮷԁɦ",e:"ɛǝᴇɇ",f:"ꝼƒ",g:"ǥɠꞡᵹꝿɢ",h:"ħⱨⱶɥ",i:"ɨı",j:"ɉȷ",k:"ƙⱪꝁꝃꝅꞣ",l:"łƚɫⱡꝉꝇꞁɭ",m:"ɱɯϻ",n:"ꞥƞɲꞑᴎлԉ",o:"øǿɔɵꝋꝍᴑ",oe:"œ",oi:"ƣ",oo:"ꝏ",ou:"ȣ",p:"ƥᵽꝑꝓꝕρ",q:"ꝗꝙɋ",r:"ɍɽꝛꞧꞃ",s:"ßȿꞩꞅʂ",t:"ŧƭʈⱦꞇ",th:"þ",tz:"ꜩ",u:"ʉ",v:"ʋꝟʌ",vy:"ꝡ",w:"ⱳ",y:"ƴɏỿ",z:"ƶȥɀⱬꝣ",hv:"ƕ"}
|
|
23
23
|
for(let t in f){let e=f[t]||""
|
|
24
24
|
for(let i=0;i<e.length;i++){let s=e.substring(i,i+1)
|
|
25
|
-
g[s]=t}}const v=new RegExp(Object.keys(g).join("|")+"|[̀-ͯ·ʾʼ]","gu"),m=(t,e="NFKD")=>t.normalize(e),y=t=>c(t).reduce(((t,e)=>t+
|
|
26
|
-
const
|
|
25
|
+
g[s]=t}}const v=new RegExp(Object.keys(g).join("|")+"|[̀-ͯ·ʾʼ]","gu"),m=(t,e="NFKD")=>t.normalize(e),y=t=>c(t).reduce(((t,e)=>t+b(e)),""),b=t=>(t=m(t).toLowerCase().replace(v,(t=>g[t]||"")),m(t,"NFC"))
|
|
26
|
+
const O=t=>{const e={},i=(t,i)=>{const s=e[t]||new Set,o=new RegExp("^"+n(s)+"$","iu")
|
|
27
27
|
i.match(o)||(s.add(r(i)),e[t]=s)}
|
|
28
28
|
for(let e of function*(t){for(const[e,i]of t)for(let t=e;t<=i;t++){let e=String.fromCharCode(t),i=y(e)
|
|
29
29
|
i!=e.toLowerCase()&&(i.length>3||0!=i.length&&(yield{folded:i,composed:e,code_point:t}))}}(t))i(e.folded,e.folded),i(e.folded,e.composed)
|
|
30
|
-
return e},w=t=>{const e=
|
|
30
|
+
return e},w=t=>{const e=O(t),s={}
|
|
31
31
|
let o=[]
|
|
32
32
|
for(let t in e){let i=e[t]
|
|
33
33
|
i&&(s[t]=n(i)),t.length>1&&o.push(r(t))}o.sort(((t,e)=>e.length-t.length))
|
|
@@ -169,18 +169,16 @@ if(N(r,n.wrapperClass,d,u),N(l,n.controlClass),lt(r,l),N(a,n.dropdownClass,u),n.
|
|
|
169
169
|
E(["autocorrect","autocapitalize","autocomplete"],(t=>{s.getAttribute(t)&&Q(p,{[t]:s.getAttribute(t)})})),p.tabIndex=-1,l.appendChild(p),this.focus_node=p}else n.controlInput?(p=V(n.controlInput),this.focus_node=p):(p=V("<input/>"),this.focus_node=l)
|
|
170
170
|
this.wrapper=r,this.dropdown=a,this.dropdown_content=c,this.control=l,this.control_input=p,this.setup()}setup(){const t=this,e=t.settings,i=t.control_input,s=t.dropdown,n=t.dropdown_content,o=t.wrapper,l=t.control,a=t.input,c=t.focus_node,d={passive:!0},u=t.inputId+"-ts-dropdown"
|
|
171
171
|
Q(n,{id:u}),Q(c,{role:"combobox","aria-haspopup":"listbox","aria-expanded":"false","aria-controls":u})
|
|
172
|
-
const p=ot(c,t.inputId+"-ts-control"),h="label[for='"+(t=>t.replace(/['"\\]/g,"\\$&"))(t.inputId)+"']",g=document.querySelector(h),f=t.focus.bind(t)
|
|
173
|
-
if(g
|
|
174
|
-
|
|
175
|
-
Q(c,{"aria-labelledby":e}),Q(n,{"aria-labelledby":e})}if(o.style.width=a.style.width,t.plugins.names.length){const e="plugin-"+t.plugins.names.join(" plugin-")
|
|
176
|
-
N([o,s],e)}(null===e.maxItems||e.maxItems>1)&&t.is_select_tag&&Q(a,{multiple:"multiple"}),e.placeholder&&Q(i,{placeholder:e.placeholder}),!e.splitOn&&e.delimiter&&(e.splitOn=new RegExp("\\s*"+r(e.delimiter)+"+\\s*")),e.load&&e.loadThrottle&&(e.load=tt(e.load,e.loadThrottle)),t.control_input.type=a.type,st(s,"mousemove",(()=>{t.ignoreHover=!1})),st(s,"mouseenter",(e=>{var i=z(e.target,"[data-selectable]",s)
|
|
172
|
+
const p=ot(c,t.inputId+"-ts-control"),h="label[for='"+(t=>t.replace(/['"\\]/g,"\\$&"))(t.inputId)+"']",g=document.querySelector(h),f=t.focus.bind(t),v=a.getAttribute("aria-labelledby")
|
|
173
|
+
if(g&&(st(g,"click",f),Q(g,{for:p})),v&&(Q(c,{"aria-labelledby":v}),Q(n,{"aria-labelledby":v})),o.style.width=a.style.width,t.plugins.names.length){const e="plugin-"+t.plugins.names.join(" plugin-")
|
|
174
|
+
N([o,s],e)}"multi"===e.mode&&(Q(n,{"aria-multiselectable":"true"}),t.is_select_tag&&Q(a,{multiple:"multiple"})),e.placeholder&&Q(i,{placeholder:e.placeholder}),!e.splitOn&&e.delimiter&&(e.splitOn=new RegExp("\\s*"+r(e.delimiter)+"+\\s*")),e.load&&e.loadThrottle&&(e.load=tt(e.load,e.loadThrottle)),t.control_input.type=a.type,st(s,"mousemove",(()=>{t.ignoreHover=!1})),st(s,"mouseenter",(e=>{var i=z(e.target,"[data-selectable]",s)
|
|
177
175
|
i&&t.onOptionHover(e,i)}),{capture:!0}),st(s,"click",(e=>{const i=z(e.target,"[data-selectable]")
|
|
178
176
|
i&&(t.onOptionSelect(e,i),it(e,!0))})),st(l,"click",(e=>{var s=z(e.target,"[data-ts-item]",l)
|
|
179
177
|
s&&t.onItemSelect(e,s)?it(e,!0):""==i.value&&(t.onClick(),it(e,!0))})),st(c,"keydown",(e=>t.onKeyDown(e))),st(i,"keypress",(e=>t.onKeyPress(e))),st(i,"input",(e=>t.onInput(e))),st(c,"blur",(e=>t.onBlur(e))),st(c,"focus",(e=>t.onFocus(e))),st(i,"paste",(e=>t.onPaste(e)))
|
|
180
|
-
const
|
|
178
|
+
const m=e=>{const n=e.composedPath()[0]
|
|
181
179
|
if(!o.contains(n)&&!s.contains(n))return t.isFocused&&t.blur(),void t.inputState()
|
|
182
|
-
n==i&&t.isOpen?e.stopPropagation():it(e,!0)},
|
|
183
|
-
st(document,"mousedown",
|
|
180
|
+
n==i&&t.isOpen?e.stopPropagation():it(e,!0)},y=()=>{t.isOpen&&t.positionDropdown()}
|
|
181
|
+
st(document,"mousedown",m),st(window,"scroll",y,d),st(window,"resize",y,d),this._destroy=()=>{document.removeEventListener("mousedown",m),window.removeEventListener("scroll",y),window.removeEventListener("resize",y),g&&g.removeEventListener("click",f)},this.revertSettings={innerHTML:a.innerHTML,tabIndex:a.tabIndex},a.tabIndex=-1,a.insertAdjacentElement("afterend",t.wrapper),t.sync(!1),e.items=[],delete e.optgroups,delete e.options,st(a,"invalid",(()=>{t.isValid&&(t.isValid=!1,t.isInvalid=!0,t.refreshState())})),t.updateOriginalInput(),t.refreshItems(),t.close(!1),t.inputState(),t.isSetup=!0,a.disabled?t.disable():t.enable(),t.on("change",this.onChange),N(a,"tomselected","ts-hidden-accessible"),t.trigger("initialize"),!0===e.preload&&t.preload()}setupOptions(t=[],e=[]){this.addOptions(t),E(e,(t=>{this.registerOptionGroup(t)}))}setupTemplates(){var t=this,e=t.settings.labelField,i=t.settings.optgroupLabelField,s={optgroup:t=>{let e=document.createElement("div")
|
|
184
182
|
return e.className="optgroup",e.appendChild(t.options),e},optgroup_header:(t,e)=>'<div class="optgroup-header">'+e(t[i])+"</div>",option:(t,i)=>"<div>"+i(t[e])+"</div>",item:(t,i)=>"<div>"+i(t[e])+"</div>",option_create:(t,e)=>'<div class="create">Add <strong>'+e(t.input)+"</strong>…</div>",no_results:()=>'<div class="no-results">No results found</div>',loading:()=>'<div class="spinner"></div>',not_loading:()=>{},dropdown:()=>"<div></div>"}
|
|
185
183
|
t.settings.render=Object.assign({},s,t.settings.render)}setupCallbacks(){var t,e,i={initialize:"onInitialize",change:"onChange",item_add:"onItemAdd",item_remove:"onItemRemove",item_select:"onItemSelect",clear:"onClear",option_add:"onOptionAdd",option_remove:"onOptionRemove",option_clear:"onOptionClear",optgroup_add:"onOptionGroupAdd",optgroup_remove:"onOptionGroupRemove",optgroup_clear:"onOptionGroupClear",dropdown_open:"onDropdownOpen",dropdown_close:"onDropdownClose",type:"onType",load:"onLoad",focus:"onFocus",blur:"onBlur"}
|
|
186
184
|
for(t in i)(e=this.settings[i[t]])&&this.on(t,e)}sync(t=!0){const e=this,i=t?at(e.input,{delimiter:e.settings.delimiter}):e.settings
|
|
@@ -221,16 +219,16 @@ const i=e.loadCallback.bind(e)
|
|
|
221
219
|
e.settings.load.call(e,t,i)}loadCallback(t,e){const i=this
|
|
222
220
|
i.loading=Math.max(i.loading-1,0),i.lastQuery=null,i.clearActiveOption(),i.setupOptions(t,e),i.refreshOptions(i.isFocused&&!i.isInputHidden),i.loading||H(i.wrapper,i.settings.loadingClass),i.trigger("load",t,e)}preload(){var t=this.wrapper.classList
|
|
223
221
|
t.contains("preloaded")||(t.add("preloaded"),this.load(""))}setTextboxValue(t=""){var e=this.control_input
|
|
224
|
-
e.value!==t&&(e.value=t,q(e,"update"),this.lastValue=t)}getValue(){return
|
|
222
|
+
e.value!==t&&(e.value=t,q(e,"update"),this.lastValue=t)}getValue(){return"multi"===this.settings.mode&&this.is_select_tag?this.items:this.items.join(this.settings.delimiter)}setValue(t,e){et(this,e?[]:["change"],(()=>{this.clear(e),this.addItems(t,e)}))}setMaxItems(t){0===t&&(t=null),this.settings.maxItems=t,this.refreshState()}setActiveItem(t,e){var i,s,n,o,r,l,a=this
|
|
225
223
|
if("single"!==a.settings.mode){if(!t)return a.clearActiveItems(),void(a.isFocused&&a.showInput())
|
|
226
224
|
if("click"===(i=e&&e.type.toLowerCase())&&nt("shiftKey",e)&&a.activeItems.length){for(l=a.getLastActive(),(n=Array.prototype.indexOf.call(a.control.children,l))>(o=Array.prototype.indexOf.call(a.control.children,t))&&(r=n,n=o,o=r),s=n;s<=o;s++)t=a.control.children[s],-1===a.activeItems.indexOf(t)&&a.setActiveItemClass(t)
|
|
227
225
|
it(e)}else"click"===i&&nt(U,e)||"keydown"===i&&nt("shiftKey",e)?t.classList.contains("active")?a.removeActiveItem(t):a.setActiveItemClass(t):(a.clearActiveItems(),a.setActiveItemClass(t))
|
|
228
226
|
a.hideInput(),a.isFocused||a.focus()}}setActiveItemClass(t){const e=this,i=e.control.querySelector(".last-active")
|
|
229
227
|
i&&H(i,"last-active"),N(t,"active last-active"),e.trigger("item_select",t),-1==e.activeItems.indexOf(t)&&e.activeItems.push(t)}removeActiveItem(t){var e=this.activeItems.indexOf(t)
|
|
230
|
-
this.activeItems.splice(e,1),H(t,"active")}clearActiveItems(){H(this.activeItems,"active"),this.activeItems=[]}setActiveOption(t,e=!0){t!==this.activeOption&&(this.clearActiveOption(),t&&(this.activeOption=t,Q(this.focus_node,{"aria-activedescendant":t.getAttribute("id")}),Q(t,{"aria-selected":"true"}),N(t,"active"),e&&this.scrollToOption(t)))}scrollToOption(t,e){if(!t)return
|
|
228
|
+
this.activeItems.splice(e,1),H(t,"active")}clearActiveItems(){H(this.activeItems,"active"),this.activeItems=[]}setActiveOption(t,e=!0){t!==this.activeOption&&(this.clearActiveOption(),t&&(this.activeOption=t,Q(this.focus_node,{"aria-activedescendant":t.getAttribute("id")}),("single"===this.settings.mode||this.settings.hideSelected)&&Q(t,{"aria-selected":"true"}),N(t,"active"),e&&this.scrollToOption(t)))}scrollToOption(t,e){if(!t)return
|
|
231
229
|
const i=this.dropdown_content,s=i.clientHeight,n=i.scrollTop||0,o=t.offsetHeight,r=t.getBoundingClientRect().top-i.getBoundingClientRect().top+n
|
|
232
230
|
r+o>s+n?this.scroll(r-s+o,e):r<n&&this.scroll(r,e)}scroll(t,e){const i=this.dropdown_content
|
|
233
|
-
e&&(i.style.scrollBehavior=e),i.scrollTop=t,i.style.scrollBehavior=""}clearActiveOption(){this.activeOption&&(H(this.activeOption,"active"),Q(this.activeOption,{"aria-selected":null})),this.activeOption=null,Q(this.focus_node,{"aria-activedescendant":null})}selectAll(){const t=this
|
|
231
|
+
e&&(i.style.scrollBehavior=e),i.scrollTop=t,i.style.scrollBehavior=""}clearActiveOption(){this.activeOption&&(H(this.activeOption,"active"),("single"===this.settings.mode||this.settings.hideSelected)&&Q(this.activeOption,{"aria-selected":null})),this.activeOption=null,Q(this.focus_node,{"aria-activedescendant":null})}selectAll(){const t=this
|
|
234
232
|
if("single"===t.settings.mode)return
|
|
235
233
|
const e=t.controlChildren()
|
|
236
234
|
e.length&&(t.hideInput(),t.close(),t.activeItems=e,E(e,(e=>{t.setActiveItemClass(e)})))}inputState(){var t=this
|
|
@@ -243,26 +241,27 @@ return!(e&&-1!==s.items.indexOf(e))}))),e}refreshOptions(t=!0){var e,i,s,n,o,r,l
|
|
|
243
241
|
const u={},p=[]
|
|
244
242
|
var h=this,g=h.inputValue()
|
|
245
243
|
const f=g===h.lastQuery||""==g&&null==h.lastQuery
|
|
246
|
-
var v,m=h.search(g),y=null,
|
|
247
|
-
for(f&&(y=h.activeOption)&&(c=y.closest("[data-group]")),n=m.items.length,"number"==typeof h.settings.maxOptions&&(n=Math.min(n,h.settings.maxOptions)),n>0&&(
|
|
244
|
+
var v,m=h.search(g),y=null,b=h.settings.shouldOpen||!1,O=h.dropdown_content
|
|
245
|
+
for(f&&(y=h.activeOption)&&(c=y.closest("[data-group]")),n=m.items.length,"number"==typeof h.settings.maxOptions&&(n=Math.min(n,h.settings.maxOptions)),n>0&&(b=!0),e=0;e<n;e++){let t=m.items[e]
|
|
248
246
|
if(!t)continue
|
|
249
247
|
let n=t.id,l=h.options[n]
|
|
250
248
|
if(void 0===l)continue
|
|
251
249
|
let a=Y(n),d=h.getOption(a,!0)
|
|
252
|
-
|
|
250
|
+
const g=h.items.includes(a)
|
|
251
|
+
for(h.settings.hideSelected||(d.classList.toggle("selected",g),"multi"===this.settings.mode&&Q(d,{"aria-selected":g?"true":"false"})),o=l[h.settings.optgroupField]||"",i=0,s=(r=Array.isArray(o)?o:[o])&&r.length;i<s;i++){o=r[i],h.optgroups.hasOwnProperty(o)||(o="")
|
|
253
252
|
let t=u[o]
|
|
254
|
-
void 0===t&&(t=document.createDocumentFragment(),p.push(o)),i>0&&(d=d.cloneNode(!0),Q(d,{id:l.$id+"-clone-"+i,"aria-selected":null}),d.classList.add("ts-cloned"),H(d,"active"),h.activeOption&&h.activeOption.dataset.value==n&&c&&c.dataset.group===o.toString()&&(y=d)),t.appendChild(d),u[o]=t}}h.settings.lockOptgroupOrder&&p.sort(((t,e)=>{const i=h.optgroups[t],s=h.optgroups[e]
|
|
253
|
+
void 0===t&&(t=document.createDocumentFragment(),p.push(o)),i>0&&(d=d.cloneNode(!0),"multi"!==this.settings.mode||h.settings.hideSelected?Q(d,{id:l.$id+"-clone-"+i,"aria-selected":null}):Q(d,{id:l.$id+"-clone-"+i,"aria-selected":g?"true":"false"}),d.classList.add("ts-cloned"),H(d,"active"),h.activeOption&&h.activeOption.dataset.value==n&&c&&c.dataset.group===o.toString()&&(y=d)),t.appendChild(d),u[o]=t}}h.settings.lockOptgroupOrder&&p.sort(((t,e)=>{const i=h.optgroups[t],s=h.optgroups[e]
|
|
255
254
|
return(i&&i.$order||0)-(s&&s.$order||0)})),l=document.createDocumentFragment(),E(p,(t=>{let e=u[t]
|
|
256
255
|
if(!e||!e.children.length)return
|
|
257
256
|
let i=h.optgroups[t]
|
|
258
257
|
if(void 0!==i){let t=document.createDocumentFragment(),s=h.render("optgroup_header",i)
|
|
259
258
|
lt(t,s),lt(t,e)
|
|
260
259
|
let n=h.render("optgroup",{group:i,options:t})
|
|
261
|
-
lt(l,n)}else lt(l,e)})),
|
|
262
|
-
e.replaceChild(t.firstChild,t),e.normalize()})),m.query.length&&m.tokens.length&&E(m.tokens,(t=>{J(
|
|
260
|
+
lt(l,n)}else lt(l,e)})),O.innerHTML="",lt(O,l),h.settings.highlight&&(v=O.querySelectorAll("span.highlight"),Array.prototype.forEach.call(v,(function(t){var e=t.parentNode
|
|
261
|
+
e.replaceChild(t.firstChild,t),e.normalize()})),m.query.length&&m.tokens.length&&E(m.tokens,(t=>{J(O,t.regex)})))
|
|
263
262
|
var w=t=>{let e=h.render(t,{input:g})
|
|
264
|
-
return e&&(
|
|
265
|
-
if(h.loading?w("loading"):h.settings.shouldLoad.call(h,g)?0===m.items.length&&w("no_results"):w("not_loading"),(a=h.canCreate(g))&&(d=w("option_create")),h.hasOptions=m.items.length>0||a,
|
|
263
|
+
return e&&(b=!0,O.insertBefore(e,O.firstChild)),e}
|
|
264
|
+
if(h.loading?w("loading"):h.settings.shouldLoad.call(h,g)?0===m.items.length&&w("no_results"):w("not_loading"),(a=h.canCreate(g))&&(d=w("option_create")),h.hasOptions=m.items.length>0||a,b){if(m.items.length>0){if(y||"single"!==h.settings.mode||null==h.items[0]||(y=h.getOption(h.items[0])),!O.contains(y)){let t=0
|
|
266
265
|
d&&!h.settings.addPrecedence&&(t=1),y=h.selectable()[t]}}else d&&(y=d)
|
|
267
266
|
t&&!h.isOpen&&(h.open(),h.scrollToOption(y,"auto")),h.setActiveOption(y)}else h.clearActiveOption(),t&&h.isOpen&&h.close(!1)}selectable(){return this.dropdown_content.querySelectorAll("[data-selectable]")}addOption(t,e=!1){const i=this
|
|
268
267
|
if(Array.isArray(t))return i.addOptions(t,e),!1
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"translation-utils.js","sourceRoot":"","sources":["../../src/utils/translation-utils.ts"],"names":[],"mappings":"AAKA,MAAM,OAAO,GAAG,IAAI,CAAC;AACrB,MAAM,OAAO,GAAG,IAAI,CAAC;AACrB,MAAM,YAAY,GAAG,OAAO,CAAC;AAE7B,MAAM,CAAC,MAAM,mBAAmB,GAAG;EACjC,OAAO;EACP,OAAO;CACR,CAAC;
|
|
1
|
+
{"version":3,"file":"translation-utils.js","sourceRoot":"","sources":["../../src/utils/translation-utils.ts"],"names":[],"mappings":"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","sourcesContent":["import {\n StzhDateFormat,\n StzhDateParse\n} from \"./date-adapter\";\n\nconst LANG_DE = \"de\";\nconst LANG_EN = \"en\";\nconst LANG_DEFAULT = LANG_DE;\n\nexport const SUPPORTED_LANGUAGES = [\n LANG_DE,\n LANG_EN\n];\n\nexport type StzhLocaleFormats = {\n inputdate: {\n format: string | StzhDateFormat,\n parse: string | StzhDateParse\n },\n date: {\n format: string | StzhDateFormat\n },\n dateRange: string,\n timeRange: string,\n timePostfix: string,\n time: {\n format: string | StzhDateFormat\n }\n}\n\ntype MonthsNames = [string, string, string, string, string, string, string, string, string, string, string, string]\ntype DayNames = [string, string, string, string, string, string, string]\n\nexport type StzhLocaleGlobals = {\n externalLinkLabel: string\n downloadLinkLabel: string\n requiredFieldMarker: string\n requiredFieldText: string\n optionalFieldMarker: string\n optionalFieldText: string\n invalidFieldText: string\n clearButtonLabel: string\n moreInfoButtonLabel: string\n dayNames: DayNames\n monthNames: MonthsNames\n monthNamesShort: MonthsNames\n}\n\nexport type StzhLocaleComponent = {\n $locale: typeof LANG_DE | typeof LANG_EN,\n $formats: StzhLocaleFormats,\n $globals: StzhLocaleGlobals\n}\n\nfunction getLocale(element: HTMLElement) {\n const closestElement = element.closest(\"[lang]\") as HTMLElement;\n const locale = closestElement && closestElement.lang.split(\"-\")[0];\n\n if (SUPPORTED_LANGUAGES.indexOf(locale) === -1 || !locale) {\n return LANG_DEFAULT;\n } else {\n return locale;\n }\n}\n\nexport function tc(translation: string, count: number): string {\n if (!translation) {\n return \"\";\n }\n\n const parts = translation.split('|');\n let part = parts[0].trim();\n\n if (parts.length === 3 && count === 1) {\n part = parts[1].trim();\n } else if (parts.length === 3 && count > 1) {\n part = parts[2].trim();\n }\n\n if (parts.length === 2 && count !== 1) {\n part = parts[1].trim();\n }\n\n return part.replace(/\\{n\\}/ig, count.toString());\n}\n\nexport async function fetchTranslations(host: HTMLElement, component: string) {\n const locale = getLocale(host);\n const existingTranslations = JSON.parse(sessionStorage.getItem(`stzhComponents.v${window.stzhComponents.version}.i18n.${locale}`));\n\n if (\n window.stzhComponents.cacheTranslations\n && window.stzhComponents.version.match(/-dev-snapshot/i) === null\n && existingTranslations\n && Object.keys(existingTranslations).length > 0\n ) {\n return {\n ...existingTranslations[component] || {},\n $globals: existingTranslations.$globals,\n $locale: existingTranslations.$code,\n $formats: existingTranslations.$formats\n };\n }\n\n try {\n const result = await fetch(\n `${window.stzhComponents.pathTranslations}/${locale}.json`\n );\n\n if (result.ok) {\n const data = await result.json();\n sessionStorage.setItem(`stzhComponents.v${window.stzhComponents.version}.i18n.${locale}`, JSON.stringify(data));\n return {\n ...data[component] || {},\n $globals: data.$globals,\n $locale: data.$code,\n $formats: data.$formats\n };\n }\n\n } catch (exception) {\n console.error(`Error loading locale: ${locale}`, exception);\n }\n}\n"]}
|
package/dist/components/index.js
CHANGED
|
@@ -835,7 +835,7 @@ function _classCallCheck(instance, Constructor) { if (!(instance instanceof Cons
|
|
|
835
835
|
})();
|
|
836
836
|
|
|
837
837
|
const name = "@oiz/stzh-components";
|
|
838
|
-
const version = "2.
|
|
838
|
+
const version = "2.7.0-alpha";
|
|
839
839
|
|
|
840
840
|
const packageName = name.substring(name.indexOf('/')+1);
|
|
841
841
|
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"file":"index2.js","mappings":"AAAA;AACA;AACA;IAu+BiB,IAoMhB;AApMD,WAAiB,GAAG;EACL,oBAAgB,GAAG,QAAQ,CAAC;EAE5B,kBAAc,GAAG,QAAQ,CAAC;EAC1B,2BAAuB,GAAG,sBAAsB,CAAC;EAEjD,sBAAkB,GAAG,YAAY,CAAC;EAClC,2BAAuB,GAAG,GAAG,CAAC;EAC9B,4BAAwB,GAAG,GAAG,CAAC;EAC/B,sBAAkB,GAAG,GAAG,CAAC;EACzB,qBAAiB,GAAG,GAAG,CAAC;EACxB,mBAAe,GAAG,GAAG,CAAC;AAyLrC,CAAC,EApMgB,GAAG,KAAH,GAAG;;;;","names":[],"sources":["./src/index.ts"],"sourcesContent":["// ---\n// Global window types\n// ---\n\nimport {\n StzhLocaleFormats\n} from './utils/translation-utils';\n\nexport type WindowStzhComponents = {\n version: string\n locale: string\n pathMedia: string\n pathTranslations: string\n cacheTranslations: boolean\n formats: StzhLocaleFormats\n labels: \"flyout\" | \"fixed\"\n}\n\ndeclare global {\n interface Window {\n stzhComponents: WindowStzhComponents\n Dropzone: any\n // readspeaker lib APIs\n ReadSpeaker: any\n rspkr: any\n proj4: any\n }\n}\n\n// ---\n// Event Types\n// ---\n\n/* Sortable */\n\nexport type StzhSortableUpdateEvent = {\n component: \"stzh-sortable\"\n data: string[]\n item: HTMLElement\n newIndex: number\n oldIndex: number\n}\n\nexport type StzhSortableDisableEvent = {\n component: \"stzh-sortable\"\n disabled: boolean\n}\n\n/* Olmap */\n\nexport type OlmapLayer = {\n title?: string,\n thumbnailUrl: string,\n options: {\n url: string,\n layer: string,\n matrixSet: string,\n origin: number[],\n extent: number[]\n }\n}\n\nexport type StzhOlmapInitializedEvent = {\n component: \"stzh-olmap\"\n}\n\nexport type StzhOlmapPostRenderEvent = {\n component: \"stzh-olmap\"\n}\n\nexport type StzhOlmapMoveStartEvent = {\n component: \"stzh-olmap\"\n}\n\nexport type StzhOlmapMoveEndEvent = {\n component: \"stzh-olmap\"\n}\n\n/* Sticky */\n\nexport type StzhStickyStuckTopEvent = {\n component: \"stzh-sticky\"\n sticky: boolean\n}\n\nexport type StzhStickyStuckBottomEvent = {\n component: \"stzh-sticky\"\n sticky: boolean\n}\n\n/* Anchornav */\n\nexport type StzhAnchornavItem = {\n label: string\n href?: string\n icon?: string\n}\n\nexport type StzhAnchornavItemClickEvent = {\n component: \"stzh-anchornav\"\n item: StzhAnchornavItem\n originalEvent: MouseEvent\n}\n\n/* Actionset */\n\nexport type StzhActionsetItem = {\n id: string\n label?: string\n icon?: string\n iconPosition?: \"left\" | \"right\"\n iconOnly?: boolean\n badge?: string\n badgeEmpty?: boolean\n badgeType?: \"default\" | \"success\" | \"warning\" | \"error\" | \"info\"\n variant?: \"default\" | \"secondary\" | \"input\" | \"tertiary\"\n size?: \"default\" | \"small\" | \"tiny\"\n badgePosition?: \"icon\" | \"button\"\n tooltipContent?: string\n}\n\nexport type StzhActionsetItemClickEvent = {\n component: \"stzh-actionset\"\n action: StzhActionsetItem\n originalEvent: MouseEvent\n}\n\n/* Audio */\n\nexport type StzhAudioPlayEvent = {\n component: \"stzh-audio\"\n}\n\nexport type StzhAudioPlayingEvent = {\n component: \"stzh-audio\"\n}\n\nexport type StzhAudioPauseEvent = {\n component: \"stzh-audio\"\n}\n\nexport type StzhAudioReplayEvent = {\n component: \"stzh-audio\"\n}\n\nexport type StzhAudioEndEvent = {\n component: \"stzh-audio\"\n}\n\nexport type StzhAudioEndedEvent = {\n component: \"stzh-audio\"\n}\n\nexport type StzhAudioErrorEvent = {\n component: \"stzh-audio\"\n originalEvent: ErrorEvent\n}\n\n/* Share */\n\nexport type ShareService = \"facebook\" | \"twitter\" | \"linkedin\" | \"xing\" | \"mail\";\n\n/* Card */\n\nexport type StzhCardHeaderAction = {\n id: string\n label?: string\n icon?: string\n badge?: string\n badgeEmpty?: boolean\n badgeType?: \"default\" | \"success\" | \"warning\" | \"error\" | \"info\"\n onlyCollapseText?: boolean\n}\n\nexport type StzhCardSubtitleClickEvent = {\n component: \"stzh-card\"\n}\n\nexport type StzhCardCollapseEvent = {\n component: \"stzh-card\"\n collapsed: boolean\n}\n\nexport type StzhCardClickEvent = {\n component: \"stzh-card\"\n originalEvent: MouseEvent\n}\n\nexport type StzhCardStarClickEvent = {\n component: \"stzh-card\"\n starred: boolean\n}\n\nexport type StzhCardHeaderActionClickEvent = {\n component: \"stzh-card\"\n action: StzhCardHeaderAction\n}\n\n/* Microsite Teaserlist */\n\nexport type StzhMicrositeTeaserlistTag = {\n id: string\n name: string\n}\n\nexport type StzhMicrositeTeaserlistItem = {\n title?: string\n description?: string\n image?: string\n link: string\n tags: string[]\n teaserid: string\n}\n\n/* Card List */\n\nexport type StzhCardListCollapseAllEvent = {\n component: \"stzh-card-list\"\n allCollapsed: boolean\n}\n\n/* Calendar */\n\nexport type StzhCalendarChangeEvent = {\n component: \"stzh-calendar\"\n valueAsDate: Date\n value: string\n}\n\n/* Datepicker */\n\nexport type StzhDatepickerChangeEvent = {\n component: \"stzh-datepicker\"\n value: string,\n valueAsDate: Date\n}\n\n/* Appointments */\n\nexport type StzhAppointmentsChangeEvent = {\n component: \"stzh-appointments\"\n value: string\n}\n\n/* Checkbox */\n\nexport type StzhCheckboxChangeEvent = {\n component: \"stzh-checkbox\"\n originalEvent: InputEvent\n value: string\n checked: boolean\n}\n\nexport type StzhCheckboxFocusEvent = {\n component: \"stzh-checkbox\"\n originalEvent: FocusEvent\n}\n\nexport type StzhCheckboxBlurEvent = {\n component: \"stzh-checkbox\"\n originalEvent: FocusEvent\n}\n\n/* Toggle */\n\nexport type StzhToggleChangeEvent = {\n component: \"stzh-toggle\"\n originalEvent: InputEvent\n value: string\n checked: boolean\n}\n\nexport type StzhToggleFocusEvent = {\n component: \"stzh-toggle\"\n originalEvent: FocusEvent\n}\n\nexport type StzhToggleBlurEvent = {\n component: \"stzh-toggle\"\n originalEvent: FocusEvent\n}\n\n/* Button */\n\nexport type StzhButtonFocusEvent = {\n component: \"stzh-button\"\n originalEvent: FocusEvent\n}\n\nexport type StzhButtonBlurEvent = {\n component: \"stzh-button\"\n originalEvent: FocusEvent\n}\n\nexport type StzhButtonChangeEvent = {\n component: \"stzh-button\"\n originalEvent: InputEvent\n value: string\n checked: boolean\n}\n\n/* Link */\n\nexport type StzhLinkFocusEvent = {\n component: \"stzh-link\"\n originalEvent: FocusEvent\n}\n\nexport type StzhLinkBlurEvent = {\n component: \"stzh-link\"\n originalEvent: FocusEvent\n}\n\n/* Menu Item */\n\nexport type StzhMenuItemFocusEvent = {\n component: \"stzh-menu-item\"\n originalEvent: FocusEvent\n}\n\nexport type StzhMenuItemBlurEvent = {\n component: \"stzh-menu-item\"\n originalEvent: FocusEvent\n}\n\n/* Carousel */\n\nexport type StzhCarouselSlideStartEvent = {\n component: \"stzh-carousel\"\n index: number\n}\n\nexport type StzhCarouselSlidePassedEvent = {\n component: \"stzh-carousel\"\n index: number\n}\n\nexport type StzhCarouselSlideEndEvent = {\n component: \"stzh-carousel\"\n index: number\n}\n\n/* Chip Select */\n\nexport type StzhChipSelectChangeEvent = {\n component: \"stzh-chip-select\"\n value: string\n}\n\n/* Datalist */\n\nexport type StzhDatalistItemEntry = {\n value: string\n leadingIcon?: string\n label?: string\n meta?: string\n icon?: string\n iconLabel?: string\n iconTooltip?: string\n href?: string\n rel?: string\n target?: string\n items?: StzhDatalistItemEntry[]\n}\n\nexport type StzhDatalistDirectionChangeEvent = {\n component: \"stzh-datalist\"\n value: \"vertical\" | \"horizontal\"\n}\n\nexport type StzhDatalistHideBorderChangeEvent = {\n component: \"stzh-datalist\"\n value: boolean\n}\n\n/* Datalist Item */\n\nexport type StzhDatalistItemActionClickEvent = {\n component: \"stzh-datalist-item\"\n originalEvent: MouseEvent\n}\n\n/* Datamessagelist */\n\nexport type StzhDatamessagelistItemEntryMeta = {\n label: string\n value: string\n}\n\nexport type StzhDatamessagelistItemEntryAction = {\n id: string | number\n icon: string\n label: string,\n badge?: string\n}\n\nexport type StzhDatamessagelistItemEntryTag = {\n icon: string\n label: string\n type: \"default\" | \"important\"\n}\n\nexport type StzhDatamessagelistItemEntryLoadingStatus = {\n percent: number\n label: string\n type: \"default\" | \"success\" | \"warning\" | \"error\"\n}\n\nexport type StzhDatamessagelistItemClickEvent = {\n component: \"stzh-datamessagelist-item\",\n originalEvent: MouseEvent\n}\n\nexport type StzhDatamessagelistItemActionClickEvent = {\n component: \"stzh-datamessagelist-item\",\n action: StzhDatamessagelistItemEntryAction,\n originalEvent: MouseEvent\n}\n\n/* Chip */\n\nexport type StzhChipSelectItem = {\n label: string\n value: string\n disabled?: boolean\n variant?: \"tag\" | \"filter\" | \"input\"\n type?: \"default\" | \"secondary\"\n counter?: string\n icon?: string\n size?: \"default\" | \"small\"\n}\n\nexport type StzhChipClickEvent = {\n component: \"stzh-chip\",\n originalEvent: MouseEvent\n}\n\nexport type StzhChipRemoveEvent = {\n component: \"stzh-chip\",\n originalEvent: MouseEvent\n}\n\nexport type StzhChipFocusEvent = {\n component: \"stzh-chip\"\n originalEvent: FocusEvent\n}\n\nexport type StzhChipBlurEvent = {\n component: \"stzh-chip\"\n originalEvent: FocusEvent\n}\n\n/* VBZ Major Ticker */\n\nexport type StzhVbzMajortickerDisturbance = {\n id: string\n head: string\n text: string\n startDate: Date\n endDate: Date\n altStart: string\n altEnd: string\n infoUrl?: VbzTickerInfoUrl\n};\n\nexport type StzhVbzMajortickerDisturbanceFetchedEvent = {\n component: \"stzh-vbz-majorticker\"\n disturbance: StzhVbzMajortickerDisturbance | null\n}\n\n/* VBZ Ticker */\n\nexport type VbzTickerInfoUrl = {\n name: string\n url: string\n};\n\nexport type VbzTickerDisturbance = {\n id: string\n head: string\n startDate: Date\n endDate: Date\n altStart: string\n altEnd: string\n baseType?: string\n infoUrl?: VbzTickerInfoUrl\n category:\n | typeof VBZ.DISTURBANCE_INFORMATION\n | typeof VBZ.DISTURBANCE_CONSTRUCTION\n | typeof VBZ.DISTURBANCE_NORMAL\n | typeof VBZ.DISTURBANCE_EVENT\n | typeof VBZ.DISTURBANCE_BUS\n};\n\nexport type VbzTickerLine = {\n line: VBZ.Lines\n name: string\n disturbances: VbzTickerDisturbance[]\n // whether normal or big disturbance for this line exist\n alert: boolean\n // 2 = Fernverkehr / 16 = Schiff / 32 = S-Bahn/Reg / 64 = Bus / 128 = Bergbahn / 256 = Nachtnetz / 512 = Tram\n category: \"2\" | \"16\" | \"32\" | \"64\" | \"128\" | \"256\" | \"512\"\n};\n\n/* VBZ Line Chip */\n\nexport type StzhVbzLinechipLine = {\n color: string\n background: string\n comment?: string\n}\n\nexport type StzhVbzLinechipFocusEvent = {\n component: \"stzh-vbz-linechip\"\n originalEvent: FocusEvent\n}\n\nexport type StzhVbzLinechipBlurEvent = {\n component: \"stzh-vbz-linechip\"\n originalEvent: FocusEvent\n}\n\n/* Clamp */\n\nexport type StzhClampClampEvent = {\n component: \"stzh-clamp\"\n clamped: boolean\n}\n\nexport type StzhClampExpandEvent = {\n component: \"stzh-clamp\"\n expanded: boolean\n}\n\n/* Dialog */\n\nexport type StzhDialogOpenEvent = {\n component: \"stzh-dialog\"\n}\n\nexport type StzhDialogCloseEvent = {\n component: \"stzh-dialog\"\n}\n\n/* Contact */\n\nexport type ContactNumber = {\n type: \"tel\" | \"fax\"\n label: string\n number: string\n analyticsId?: string\n}\n\nexport type StzhContactAvailabilityItem = {\n weekday: string\n hours: string[]\n}\n\n/* Overlay */\n\nexport type StzhOverlayOpenEvent = {\n component: \"stzh-overlay\"\n}\n\nexport type StzhOverlayCloseEvent = {\n component: \"stzh-overlay\"\n}\n\n/* Message */\n\nexport type StzhMessageOpenEvent = {\n component: \"stzh-message\"\n}\n\nexport type StzhMessageCloseEvent = {\n component: \"stzh-message\"\n}\n\n/* Ghettobox */\n\nexport type StzhGhettoboxOpenEvent = {\n component: \"stzh-ghettobox\"\n}\n\nexport type StzhGhettoboxCloseEvent = {\n component: \"stzh-ghettobox\"\n}\n\n/* Input */\n\nexport type StzhInputChangeEvent = {\n component: \"stzh-input\"\n originalEvent: InputEvent | MouseEvent\n value: string\n}\n\nexport type StzhInputFocusEvent = {\n component: \"stzh-input\"\n originalEvent: FocusEvent\n}\n\nexport type StzhInputBlurEvent = {\n component: \"stzh-input\"\n originalEvent: FocusEvent\n}\n\n/* Popover */\n\nexport type StzhPopoverOpenEvent = {\n component: \"stzh-popover\"\n}\n\nexport type StzhPopoverOpenedEvent = {\n component: \"stzh-popover\"\n}\n\nexport type StzhPopoverCloseEvent = {\n component: \"stzh-popover\"\n}\n\nexport type StzhPopoverClosedEvent = {\n component: \"stzh-popover\"\n}\n\n/* Accordion */\n\nexport type StzhAccordionItemOpenEvent = {\n component: \"stzh-accordion-item\"\n}\n\nexport type StzhAccordionItemOpenedEvent = {\n component: \"stzh-accordion-item\"\n}\n\nexport type StzhAccordionItemCloseEvent = {\n component: \"stzh-accordion-item\"\n}\n\nexport type StzhAccordionItemClosedEvent = {\n component: \"stzh-accordion-item\"\n}\n\nexport type StzhAccordionItemFocusEvent = {\n component: \"stzh-accordion-item\"\n originalEvent: FocusEvent\n}\n\nexport type StzhAccordionItemBlurEvent = {\n component: \"stzh-accordion-item\"\n originalEvent: FocusEvent\n}\n\n/* Tooltip */\n\nexport type StzhTooltipOpenEvent = {\n component: \"stzh-tooltip\"\n}\n\nexport type StzhTooltipOpenedEvent = {\n component: \"stzh-tooltip\"\n}\n\nexport type StzhTooltipCloseEvent = {\n component: \"stzh-tooltip\"\n}\n\nexport type StzhTooltipClosedEvent = {\n component: \"stzh-tooltip\"\n}\n\n/* Radio */\n\nexport type StzhRadioChangeEvent = {\n component: \"stzh-radio\"\n originalEvent: InputEvent\n value: string\n checked: boolean\n}\n\nexport type StzhRadioFocusEvent = {\n component: \"stzh-radio\"\n originalEvent: FocusEvent\n}\n\nexport type StzhRadioBlurEvent = {\n component: \"stzh-radio\"\n originalEvent: FocusEvent\n}\n\n/* Langnav */\n\nexport type StzhLangnavChangeEvent = {\n component: \"stzh-langnav\",\n value: string\n}\n\n/* Dropdown */\n\nexport type StzhDropdownChangeEvent = {\n component: \"stzh-dropdown\",\n value: string\n}\n\nexport type StzhDropdownItemAddEvent = {\n component: \"stzh-dropdown\",\n value: string\n}\n\nexport type StzhDropdownItemRemoveEvent = {\n component: \"stzh-dropdown\",\n value: string\n}\n\nexport type StzhDropdownOptionAddEvent = {\n component: \"stzh-dropdown\",\n value: string\n}\n\nexport type StzhDropdownOptionRemoveEvent = {\n component: \"stzh-dropdown\",\n value: string\n}\n\nexport type StzhDropdownOpenEvent = {\n component: \"stzh-dropdown\"\n}\n\nexport type StzhDropdowCloseEvent = {\n component: \"stzh-dropdown\"\n}\n\nexport type StzhDropdownFocusEvent = {\n component: \"stzh-dropdown\"\n originalEvent: {\n target: Element\n }\n}\n\nexport type StzhDropdownBlurEvent = {\n component: \"stzh-dropdown\"\n}\n\nexport type StzhDropdowInitEvent = {\n component: \"stzh-dropdown\"\n}\n\n/** Progressbar */\n\nexport type StzhProgressbarDataItem = {\n label: string\n icon?: string\n disabled?: boolean\n analyticsId?: string\n}\n\n/* Progressbar Item */\n\nexport type StzhProgressbarItemClickEvent = {\n component: \"stzh-progressbar-item\",\n originalEvent: MouseEvent\n}\n\nexport type StzhProgressbarItemDottedClickEvent = {\n component: \"stzh-progressbar-item\",\n originalEvent: MouseEvent\n}\n\n/* Upload */\n\nexport type StzhUploadFilesItem = {\n name: string\n size: number\n [key: string]: any\n}\n\nexport type StzhUploadFile = File & {\n xhr: XMLHttpRequest,\n status: string\n upload: any\n accepted: boolean\n previewElement: HTMLElement\n}\n\nexport type StzhUploadFileAddedEvent = {\n component: \"stzh-upload\",\n file: StzhUploadFile\n}\n\nexport type StzhUploadFilesAddedEvent = {\n component: \"stzh-upload\",\n files: StzhUploadFile[]\n}\n\nexport type StzhUploadFileRemoveEvent = {\n component: \"stzh-upload\",\n file: StzhUploadFile\n}\n\nexport type StzhUploadFileRemovedEvent = {\n component: \"stzh-upload\",\n file: StzhUploadFile\n}\n\nexport type StzhUploadSendingEvent = {\n component: \"stzh-upload\",\n file: StzhUploadFile,\n xhr: XMLHttpRequest,\n formData: FormData\n}\n\nexport type StzhUploadSendingMultipleEvent = {\n component: \"stzh-upload\",\n files: StzhUploadFile[],\n xhr: XMLHttpRequest,\n formData: FormData\n}\n\nexport type StzhUploadProcessingEvent = {\n component: \"stzh-upload\",\n file: StzhUploadFile\n}\n\nexport type StzhUploadProcessingMultipleEvent = {\n component: \"stzh-upload\",\n files: StzhUploadFile[]\n}\n\nexport type StzhUploadProgressEvent = {\n component: \"stzh-upload\",\n file: StzhUploadFile,\n progress: number,\n bytesSent: number\n}\n\nexport type StzhUploadProgressTotalEvent = {\n component: \"stzh-upload\",\n totalUploadProgress: number,\n totalBytes: number,\n totalBytesSent: number\n}\n\nexport type StzhUploadErrorEvent = {\n component: \"stzh-upload\",\n file: StzhUploadFile,\n message: string,\n xhr: XMLHttpRequest\n}\n\nexport type StzhUploadErrorMultipleEvent = {\n component: \"stzh-upload\",\n files: StzhUploadFile[],\n message: string,\n xhr: XMLHttpRequest\n}\n\nexport type StzhUploadSuccessEvent = {\n component: \"stzh-upload\",\n file: StzhUploadFile,\n responseText: string,\n event: ProgressEvent\n}\n\nexport type StzhUploadSuccessMultipleEvent = {\n component: \"stzh-upload\",\n files: StzhUploadFile[],\n responseText: string,\n event: ProgressEvent\n}\n\nexport type StzhUploadCanceledEvent = {\n component: \"stzh-upload\",\n file: StzhUploadFile\n}\n\nexport type StzhUploadCanceledMultipleEvent = {\n component: \"stzh-upload\",\n files: StzhUploadFile[]\n}\n\nexport type StzhUploadCompleteEvent = {\n component: \"stzh-upload\",\n file: StzhUploadFile\n}\n\nexport type StzhUploadCompleteMultipleEvent = {\n component: \"stzh-upload\",\n files: StzhUploadFile[]\n}\n\n// Merged Types\n\nexport type StzhFocusEvent =\n | StzhAccordionItemFocusEvent\n | StzhButtonFocusEvent\n | StzhCheckboxFocusEvent\n | StzhChipFocusEvent\n | StzhDropdownFocusEvent\n | StzhInputFocusEvent\n | StzhLinkFocusEvent\n | StzhMenuItemFocusEvent\n | StzhRadioFocusEvent\n | StzhToggleFocusEvent\n | StzhVbzLinechipFocusEvent\n\n// ---\n// Prop Types\n// ---\n\nexport type StzhCalendarDateDisabledPredicate = (date: Date) => boolean\n\nexport namespace Layout {\n export type Justify =\n | \"start\"\n | \"end\"\n | \"center\"\n | \"between\"\n | \"around\"\n | \"evenly\";\n\n export type Items =\n | \"start\"\n | \"end\"\n | \"center\"\n | \"baseline\"\n | \"stretch\";\n\n export type JustifySelf =\n | \"auto\"\n | Justify;\n\n export type AlignSelf =\n | \"auto\"\n | Items;\n}\n\nexport namespace Space {\n export type Sizes =\n | \"xxxsmall\"\n | \"xxsmall\"\n | \"xsmall\"\n | \"small\"\n | \"medium\"\n | \"large\"\n | \"xlarge\"\n | \"xxlarge\"\n | \"xxxlarge\"\n | \"xxxxlarge\"\n | \"big\"\n | \"xbig\"\n | \"huge\"\n | \"xhuge\"\n | \"none\"\n | \"inherit\";\n\n export type Curves =\n | \"tiny\"\n | \"small\"\n | \"regular\"\n | \"medium\"\n | \"large\"\n | \"big\"\n | \"huge\"\n | \"none\";\n}\n\nexport namespace Font {\n export type Fonts =\n | \"light\"\n | \"regular\"\n | \"medium\"\n | \"heavy\"\n | \"default\";\n\n export type Sizes =\n | \"pico\"\n | \"nano\"\n | \"micro\"\n | \"milli\"\n | \"centi\"\n | \"deci\"\n | \"regular\"\n | \"deca\"\n | \"hecto\"\n | \"kilo\"\n | \"mega\"\n | \"giga\"\n | \"hero\"\n | \"inherit\";\n\n export type Curves =\n | \"p1\"\n | \"p2\"\n | \"caption\"\n | \"h4\"\n | \"h3\"\n | \"h2\"\n | \"h1\"\n | \"hero\"\n | \"default\";\n}\n\nexport namespace VBZ {\n export const BASE_TYPE_GLOBAL = \"GLOBAL\";\n\n export const CHANNEL_TICKER = \"ticker\";\n export const CHANNEL_INFO_URL_FILTER = \"stadt-zuerich.ch/vbz\";\n\n export const DISTURBANCE_GLOBAL = \"__global__\";\n export const DISTURBANCE_INFORMATION = \"0\";\n export const DISTURBANCE_CONSTRUCTION = \"1\";\n export const DISTURBANCE_NORMAL = \"2\";\n export const DISTURBANCE_EVENT = \"4\";\n export const DISTURBANCE_BUS = \"5\";\n\n export type Lines =\n | \"2\"\n | \"3\"\n | \"4\"\n | \"5\"\n | \"6\"\n | \"7\"\n | \"8\"\n | \"9\"\n | \"10\"\n | \"11\"\n | \"12\"\n | \"13\"\n | \"14\"\n | \"15\"\n | \"16\"\n | \"17\"\n | \"19\"\n | \"20\"\n | \"21\"\n | \"23\"\n | \"24\"\n | \"25\"\n | \"29\"\n | \"31\"\n | \"32\"\n | \"33\"\n | \"34\"\n | \"35\"\n | \"36\"\n | \"37\"\n | \"38\"\n | \"39\"\n | \"40\"\n | \"45\"\n | \"46\"\n | \"54\"\n | \"61\"\n | \"62\"\n | \"63\"\n | \"64\"\n | \"66\"\n | \"67\"\n | \"69\"\n | \"70\"\n | \"72\"\n | \"73\"\n | \"75\"\n | \"76\"\n | \"77\"\n | \"78\"\n | \"79\"\n | \"80\"\n | \"83\"\n | \"89\"\n | \"91\"\n | \"94\"\n | \"95\"\n | \"99\"\n | \"151\"\n | \"152\"\n | \"153\"\n | \"156\"\n | \"161\"\n | \"162\"\n | \"163\"\n | \"165\"\n | \"184\"\n | \"185\"\n | \"200\"\n | \"201\"\n | \"215\"\n | \"220\"\n | \"235\"\n | \"236\"\n | \"245\"\n | \"301\"\n | \"302\"\n | \"303\"\n | \"304\"\n | \"305\"\n | \"306\"\n | \"307\"\n | \"308\"\n | \"309\"\n | \"311\"\n | \"314\"\n | \"315\"\n | \"317\"\n | \"321\"\n | \"323\"\n | \"325\"\n | \"350\"\n | \"444\"\n | \"445\"\n | \"701\"\n | \"702\"\n | \"703\"\n | \"704\"\n | \"705\"\n | \"720\"\n | \"721\"\n | \"725\"\n | \"726\"\n | \"727\"\n | \"742\"\n | \"743\"\n | \"744\"\n | \"745\"\n | \"747\"\n | \"748\"\n | \"751\"\n | \"752\"\n | \"753\"\n | \"754\"\n | \"759\"\n | \"760\"\n | \"765\"\n | \"768\"\n | \"781\"\n | \"786\"\n | \"787\"\n | \"910\"\n | \"912\"\n | \"916\"\n | \"917\"\n | \"918\"\n | \"919\"\n | \"E\"\n | \"N\"\n | \"N1\"\n | \"N2\"\n | \"N4\"\n | \"N5\"\n | \"N6\"\n | \"N7\"\n | \"N8\"\n | \"N9\"\n | \"N10\"\n | \"N11\"\n | \"N12\"\n | \"N13\"\n | \"N14\"\n | \"N15\"\n | \"N16\"\n | \"N17\"\n | \"N18\"\n | \"N19\"\n | \"N30\"\n | \"N31\"\n | \"N32\"\n | \"N33\"\n | \"N34\"\n | \"N45\"\n | \"N72\"\n | \"N78\"\n | \"SN1\"\n | \"SN4\"\n | \"SN5\"\n | \"SN6\"\n | \"SN7\"\n | \"SN8\"\n | \"SN9\"\n | \"S2\"\n | \"S3\"\n | \"S4\"\n | \"S5\"\n | \"S6\"\n | \"S7\"\n | \"S8\"\n | \"S9\"\n | \"S10\"\n | \"S11\"\n | \"S14\"\n | \"S15\"\n | \"S16\"\n | \"S18\"\n | \"S19\"\n | \"S20\"\n | \"S21\"\n | \"S23\"\n | \"S24\"\n | \"S25\"\n}\n\n// ---\n// Stencil component types\n// ---\n\nexport * from './components';\n"],"version":3}
|
|
1
|
+
{"file":"index2.js","mappings":"AAAA;AACA;AACA;IAogCiB,IAoMhB;AApMD,WAAiB,GAAG;EACL,oBAAgB,GAAG,QAAQ,CAAC;EAE5B,kBAAc,GAAG,QAAQ,CAAC;EAC1B,2BAAuB,GAAG,sBAAsB,CAAC;EAEjD,sBAAkB,GAAG,YAAY,CAAC;EAClC,2BAAuB,GAAG,GAAG,CAAC;EAC9B,4BAAwB,GAAG,GAAG,CAAC;EAC/B,sBAAkB,GAAG,GAAG,CAAC;EACzB,qBAAiB,GAAG,GAAG,CAAC;EACxB,mBAAe,GAAG,GAAG,CAAC;AAyLrC,CAAC,EApMgB,GAAG,KAAH,GAAG;;;;","names":[],"sources":["./src/index.ts"],"sourcesContent":["// ---\n// Global window types\n// ---\n\nimport {\n StzhLocaleFormats\n} from './utils/translation-utils';\n\nexport type WindowStzhComponents = {\n version: string\n locale: string\n pathMedia: string\n pathTranslations: string\n cacheTranslations: boolean\n formats: StzhLocaleFormats\n labels: \"flyout\" | \"fixed\"\n}\n\ndeclare global {\n interface Window {\n stzhComponents: WindowStzhComponents\n Dropzone: any\n // readspeaker lib APIs\n ReadSpeaker: any\n rspkr: any\n proj4: any\n }\n}\n\n// ---\n// Event Types\n// ---\n\n/* Sortable */\n\nexport type StzhSortableUpdateEvent = {\n component: \"stzh-sortable\"\n data: string[]\n item: HTMLElement\n newIndex: number\n oldIndex: number\n}\n\nexport type StzhSortableDisableEvent = {\n component: \"stzh-sortable\"\n disabled: boolean\n}\n\n/* Olmap */\n\nexport type OlmapLayer = {\n title?: string,\n thumbnailUrl: string,\n options: {\n url: string,\n layer: string,\n matrixSet: string,\n origin: number[],\n extent: number[]\n }\n}\n\nexport type StzhOlmapInitializedEvent = {\n component: \"stzh-olmap\"\n}\n\nexport type StzhOlmapPostRenderEvent = {\n component: \"stzh-olmap\"\n}\n\nexport type StzhOlmapMoveStartEvent = {\n component: \"stzh-olmap\"\n}\n\nexport type StzhOlmapMoveEndEvent = {\n component: \"stzh-olmap\"\n}\n\n/* Sticky */\n\nexport type StzhStickyStuckTopEvent = {\n component: \"stzh-sticky\"\n sticky: boolean\n}\n\nexport type StzhStickyStuckBottomEvent = {\n component: \"stzh-sticky\"\n sticky: boolean\n}\n\n/* Anchornav */\n\nexport type StzhAnchornavItem = {\n label: string\n href?: string\n icon?: string\n}\n\nexport type StzhAnchornavItemClickEvent = {\n component: \"stzh-anchornav\"\n item: StzhAnchornavItem\n originalEvent: MouseEvent\n}\n\n/* Actionset */\n\nexport type StzhActionsetItem = {\n id: string\n label?: string\n icon?: string\n iconPosition?: \"left\" | \"right\"\n iconOnly?: boolean\n badge?: string\n badgeEmpty?: boolean\n badgeType?: \"default\" | \"success\" | \"warning\" | \"error\" | \"info\"\n variant?: \"default\" | \"secondary\" | \"input\" | \"tertiary\"\n size?: \"default\" | \"small\" | \"tiny\"\n badgePosition?: \"icon\" | \"button\"\n tooltipContent?: string\n}\n\nexport type StzhActionsetItemClickEvent = {\n component: \"stzh-actionset\"\n action: StzhActionsetItem\n originalEvent: MouseEvent\n}\n\n/* Audio */\n\nexport type StzhAudioPlayEvent = {\n component: \"stzh-audio\"\n}\n\nexport type StzhAudioPlayingEvent = {\n component: \"stzh-audio\"\n}\n\nexport type StzhAudioPauseEvent = {\n component: \"stzh-audio\"\n}\n\nexport type StzhAudioReplayEvent = {\n component: \"stzh-audio\"\n}\n\nexport type StzhAudioEndEvent = {\n component: \"stzh-audio\"\n}\n\nexport type StzhAudioEndedEvent = {\n component: \"stzh-audio\"\n}\n\nexport type StzhAudioErrorEvent = {\n component: \"stzh-audio\"\n originalEvent: ErrorEvent\n}\n\n/* Share */\n\nexport type ShareService = \"facebook\" | \"twitter\" | \"linkedin\" | \"xing\" | \"mail\";\n\n/* Card */\n\nexport type StzhCardHeaderAction = {\n id: string\n label?: string\n icon?: string\n badge?: string\n badgeEmpty?: boolean\n badgeType?: \"default\" | \"success\" | \"warning\" | \"error\" | \"info\"\n onlyCollapseText?: boolean\n}\n\nexport type StzhCardSubtitleClickEvent = {\n component: \"stzh-card\"\n}\n\nexport type StzhCardCollapseEvent = {\n component: \"stzh-card\"\n collapsed: boolean\n}\n\nexport type StzhCardClickEvent = {\n component: \"stzh-card\"\n originalEvent: MouseEvent\n}\n\nexport type StzhCardStarClickEvent = {\n component: \"stzh-card\"\n starred: boolean\n}\n\nexport type StzhCardHeaderActionClickEvent = {\n component: \"stzh-card\"\n action: StzhCardHeaderAction\n}\n\n/* Microsite Teaserlist */\n\nexport type StzhMicrositeTeaserlistTag = {\n id: string\n name: string\n}\n\nexport type StzhMicrositeTeaserlistItem = {\n title?: string\n description?: string\n image?: string\n link: string\n tags: string[]\n teaserid: string\n}\n\n/* Card List */\n\nexport type StzhCardListCollapseAllEvent = {\n component: \"stzh-card-list\"\n allCollapsed: boolean\n}\n\n/* Calendar */\n\nexport type StzhCalendarChangeEvent = {\n component: \"stzh-calendar\"\n valueAsDate: Date\n value: string\n}\n\n/* Datepicker */\n\nexport type StzhDatepickerChangeEvent = {\n component: \"stzh-datepicker\"\n value: string,\n valueAsDate: Date\n}\n\n/* Timepicker */\n\nexport type StzhTimepickerChangeEvent = {\n component: \"stzh-timepicker\"\n value: string\n}\n\n/* Monthyearpicker */\n\nexport type StzhMonthyearpickerChangeEvent = {\n component: \"stzh-monthyearpicker\"\n value: string\n valueMonth: string\n valueYear: string\n}\n\n/* Amount */\n\nexport type StzhAmountChangeEvent = {\n component: \"stzh-amount\"\n value: string\n}\n\n/* Appointments */\n\nexport type StzhAppointmentsChangeEvent = {\n component: \"stzh-appointments\"\n value: string\n}\n\n/* Checkbox */\n\nexport type StzhCheckboxChangeEvent = {\n component: \"stzh-checkbox\"\n originalEvent: InputEvent\n value: string\n checked: boolean\n}\n\nexport type StzhCheckboxFocusEvent = {\n component: \"stzh-checkbox\"\n originalEvent: FocusEvent\n}\n\nexport type StzhCheckboxBlurEvent = {\n component: \"stzh-checkbox\"\n originalEvent: FocusEvent\n}\n\n/* Toggle */\n\nexport type StzhToggleChangeEvent = {\n component: \"stzh-toggle\"\n originalEvent: InputEvent\n value: string\n checked: boolean\n}\n\nexport type StzhToggleFocusEvent = {\n component: \"stzh-toggle\"\n originalEvent: FocusEvent\n}\n\nexport type StzhToggleBlurEvent = {\n component: \"stzh-toggle\"\n originalEvent: FocusEvent\n}\n\n/* Button */\n\nexport type StzhButtonFocusEvent = {\n component: \"stzh-button\"\n originalEvent: FocusEvent\n}\n\nexport type StzhButtonBlurEvent = {\n component: \"stzh-button\"\n originalEvent: FocusEvent\n}\n\nexport type StzhButtonChangeEvent = {\n component: \"stzh-button\"\n originalEvent: InputEvent\n value: string\n checked: boolean\n}\n\n/* Link */\n\nexport type StzhLinkFocusEvent = {\n component: \"stzh-link\"\n originalEvent: FocusEvent\n}\n\nexport type StzhLinkBlurEvent = {\n component: \"stzh-link\"\n originalEvent: FocusEvent\n}\n\n/* Menu Item */\n\nexport type StzhMenuItemFocusEvent = {\n component: \"stzh-menu-item\"\n originalEvent: FocusEvent\n}\n\nexport type StzhMenuItemBlurEvent = {\n component: \"stzh-menu-item\"\n originalEvent: FocusEvent\n}\n\n/* Carousel */\n\nexport type StzhCarouselSlideStartEvent = {\n component: \"stzh-carousel\"\n index: number\n}\n\nexport type StzhCarouselSlidePassedEvent = {\n component: \"stzh-carousel\"\n index: number\n}\n\nexport type StzhCarouselSlideEndEvent = {\n component: \"stzh-carousel\"\n index: number\n}\n\n/* Chip Select */\n\nexport type StzhChipSelectChangeEvent = {\n component: \"stzh-chip-select\"\n value: string\n}\n\n/* Datalist */\n\nexport type StzhDatalistItemEntry = {\n value: string\n leadingIcon?: string\n label?: string\n meta?: string\n icon?: string\n iconLabel?: string\n iconTooltip?: string\n href?: string\n rel?: string\n target?: string\n items?: StzhDatalistItemEntry[]\n}\n\nexport type StzhDatalistDirectionChangeEvent = {\n component: \"stzh-datalist\"\n value: \"vertical\" | \"horizontal\"\n}\n\nexport type StzhDatalistHideBorderChangeEvent = {\n component: \"stzh-datalist\"\n value: boolean\n}\n\n/* Datalist Item */\n\nexport type StzhDatalistItemActionClickEvent = {\n component: \"stzh-datalist-item\"\n originalEvent: MouseEvent\n}\n\n/* Datamessagelist */\n\nexport type StzhDatamessagelistItemEntryMeta = {\n label: string\n value: string\n}\n\nexport type StzhDatamessagelistItemEntryAction = {\n id: string | number\n icon: string\n label: string,\n badge?: string\n}\n\nexport type StzhDatamessagelistItemEntryTag = {\n icon: string\n label: string\n type: \"default\" | \"important\"\n}\n\nexport type StzhDatamessagelistItemEntryLoadingStatus = {\n percent: number\n label: string\n type: \"default\" | \"success\" | \"warning\" | \"error\"\n}\n\nexport type StzhDatamessagelistItemClickEvent = {\n component: \"stzh-datamessagelist-item\",\n originalEvent: MouseEvent\n}\n\nexport type StzhDatamessagelistItemActionClickEvent = {\n component: \"stzh-datamessagelist-item\",\n action: StzhDatamessagelistItemEntryAction,\n originalEvent: MouseEvent\n}\n\n/* Chip */\n\nexport type StzhChipSelectItem = {\n label: string\n value: string\n disabled?: boolean\n variant?: \"tag\" | \"filter\" | \"input\"\n type?: \"default\" | \"secondary\"\n counter?: string\n icon?: string\n size?: \"default\" | \"small\"\n}\n\nexport type StzhChipClickEvent = {\n component: \"stzh-chip\",\n originalEvent: MouseEvent\n}\n\nexport type StzhChipRemoveEvent = {\n component: \"stzh-chip\",\n originalEvent: MouseEvent\n}\n\nexport type StzhChipFocusEvent = {\n component: \"stzh-chip\"\n originalEvent: FocusEvent\n}\n\nexport type StzhChipBlurEvent = {\n component: \"stzh-chip\"\n originalEvent: FocusEvent\n}\n\n/* VBZ Major Ticker */\n\nexport type StzhVbzMajortickerDisturbance = {\n id: string\n head: string\n text: string\n startDate: Date\n endDate: Date\n altStart: string\n altEnd: string\n infoUrl?: VbzTickerInfoUrl\n};\n\nexport type StzhVbzMajortickerDisturbanceFetchedEvent = {\n component: \"stzh-vbz-majorticker\"\n disturbance: StzhVbzMajortickerDisturbance | null\n}\n\n/* VBZ Ticker */\n\nexport type VbzTickerInfoUrl = {\n name: string\n url: string\n};\n\nexport type VbzTickerDisturbance = {\n id: string\n head: string\n startDate: Date\n endDate: Date\n altStart: string\n altEnd: string\n baseType?: string\n infoUrl?: VbzTickerInfoUrl\n category:\n | typeof VBZ.DISTURBANCE_INFORMATION\n | typeof VBZ.DISTURBANCE_CONSTRUCTION\n | typeof VBZ.DISTURBANCE_NORMAL\n | typeof VBZ.DISTURBANCE_EVENT\n | typeof VBZ.DISTURBANCE_BUS\n};\n\nexport type VbzTickerLine = {\n line: VBZ.Lines\n name: string\n disturbances: VbzTickerDisturbance[]\n // whether normal or big disturbance for this line exist\n alert: boolean\n // 2 = Fernverkehr / 16 = Schiff / 32 = S-Bahn/Reg / 64 = Bus / 128 = Bergbahn / 256 = Nachtnetz / 512 = Tram\n category: \"2\" | \"16\" | \"32\" | \"64\" | \"128\" | \"256\" | \"512\"\n};\n\n/* VBZ Line Chip */\n\nexport type StzhVbzLinechipLine = {\n color: string\n background: string\n comment?: string\n}\n\nexport type StzhVbzLinechipFocusEvent = {\n component: \"stzh-vbz-linechip\"\n originalEvent: FocusEvent\n}\n\nexport type StzhVbzLinechipBlurEvent = {\n component: \"stzh-vbz-linechip\"\n originalEvent: FocusEvent\n}\n\n/* Clamp */\n\nexport type StzhClampClampEvent = {\n component: \"stzh-clamp\"\n clamped: boolean\n}\n\nexport type StzhClampExpandEvent = {\n component: \"stzh-clamp\"\n expanded: boolean\n}\n\n/* Dialog */\n\nexport type StzhDialogOpenEvent = {\n component: \"stzh-dialog\"\n}\n\nexport type StzhDialogCloseEvent = {\n component: \"stzh-dialog\"\n}\n\n/* Contact */\n\nexport type ContactNumber = {\n type: \"tel\" | \"fax\"\n label: string\n number: string\n analyticsId?: string\n}\n\nexport type StzhContactAvailabilityItem = {\n weekday: string\n hours: string[]\n}\n\n/* Overlay */\n\nexport type StzhOverlayOpenEvent = {\n component: \"stzh-overlay\"\n}\n\nexport type StzhOverlayCloseEvent = {\n component: \"stzh-overlay\"\n}\n\n/* Message */\n\nexport type StzhMessageOpenEvent = {\n component: \"stzh-message\"\n}\n\nexport type StzhMessageCloseEvent = {\n component: \"stzh-message\"\n}\n\n/* Ghettobox */\n\nexport type StzhGhettoboxOpenEvent = {\n component: \"stzh-ghettobox\"\n}\n\nexport type StzhGhettoboxCloseEvent = {\n component: \"stzh-ghettobox\"\n}\n\n/* Input */\n\nexport type StzhInputChangeEvent = {\n component: \"stzh-input\"\n originalEvent: InputEvent | MouseEvent\n value: string\n}\n\nexport type StzhInputFocusEvent = {\n component: \"stzh-input\"\n originalEvent: FocusEvent\n}\n\nexport type StzhInputBlurEvent = {\n component: \"stzh-input\"\n originalEvent: FocusEvent\n}\n\n/* Popover */\n\nexport type StzhPopoverOpenEvent = {\n component: \"stzh-popover\"\n}\n\nexport type StzhPopoverOpenedEvent = {\n component: \"stzh-popover\"\n}\n\nexport type StzhPopoverCloseEvent = {\n component: \"stzh-popover\"\n}\n\nexport type StzhPopoverClosedEvent = {\n component: \"stzh-popover\"\n}\n\n/* Accordion */\n\nexport type StzhAccordionItemOpenEvent = {\n component: \"stzh-accordion-item\"\n}\n\nexport type StzhAccordionItemOpenedEvent = {\n component: \"stzh-accordion-item\"\n}\n\nexport type StzhAccordionItemCloseEvent = {\n component: \"stzh-accordion-item\"\n}\n\nexport type StzhAccordionItemClosedEvent = {\n component: \"stzh-accordion-item\"\n}\n\nexport type StzhAccordionItemFocusEvent = {\n component: \"stzh-accordion-item\"\n originalEvent: FocusEvent\n}\n\nexport type StzhAccordionItemBlurEvent = {\n component: \"stzh-accordion-item\"\n originalEvent: FocusEvent\n}\n\n/* Tooltip */\n\nexport type StzhTooltipOpenEvent = {\n component: \"stzh-tooltip\"\n}\n\nexport type StzhTooltipOpenedEvent = {\n component: \"stzh-tooltip\"\n}\n\nexport type StzhTooltipCloseEvent = {\n component: \"stzh-tooltip\"\n}\n\nexport type StzhTooltipClosedEvent = {\n component: \"stzh-tooltip\"\n}\n\n/* Radio */\n\nexport type StzhRadioChangeEvent = {\n component: \"stzh-radio\"\n originalEvent: InputEvent\n value: string\n checked: boolean\n}\n\nexport type StzhRadioFocusEvent = {\n component: \"stzh-radio\"\n originalEvent: FocusEvent\n}\n\nexport type StzhRadioBlurEvent = {\n component: \"stzh-radio\"\n originalEvent: FocusEvent\n}\n\n/* Langnav */\n\nexport type StzhLangnavChangeEvent = {\n component: \"stzh-langnav\",\n value: string\n}\n\n/* Dropdown */\n\nexport type StzhDropdownOption = {\n text: string,\n value: string\n}\n\nexport type StzhDropdownChangeEvent = {\n component: \"stzh-dropdown\",\n value: string\n}\n\nexport type StzhDropdownItemAddEvent = {\n component: \"stzh-dropdown\",\n value: string\n}\n\nexport type StzhDropdownItemRemoveEvent = {\n component: \"stzh-dropdown\",\n value: string\n}\n\nexport type StzhDropdownOptionAddEvent = {\n component: \"stzh-dropdown\",\n value: string\n}\n\nexport type StzhDropdownOptionRemoveEvent = {\n component: \"stzh-dropdown\",\n value: string\n}\n\nexport type StzhDropdownOpenEvent = {\n component: \"stzh-dropdown\"\n}\n\nexport type StzhDropdowCloseEvent = {\n component: \"stzh-dropdown\"\n}\n\nexport type StzhDropdownFocusEvent = {\n component: \"stzh-dropdown\"\n originalEvent: {\n target: Element\n }\n}\n\nexport type StzhDropdownBlurEvent = {\n component: \"stzh-dropdown\"\n}\n\nexport type StzhDropdowInitEvent = {\n component: \"stzh-dropdown\"\n}\n\n/** Progressbar */\n\nexport type StzhProgressbarDataItem = {\n label: string\n icon?: string\n disabled?: boolean\n analyticsId?: string\n}\n\n/* Progressbar Item */\n\nexport type StzhProgressbarItemClickEvent = {\n component: \"stzh-progressbar-item\",\n originalEvent: MouseEvent\n}\n\nexport type StzhProgressbarItemDottedClickEvent = {\n component: \"stzh-progressbar-item\",\n originalEvent: MouseEvent\n}\n\n/* Upload */\n\nexport type StzhUploadFilesItem = {\n name: string\n size: number\n [key: string]: any\n}\n\nexport type StzhUploadFile = File & {\n xhr: XMLHttpRequest,\n status: string\n upload: any\n accepted: boolean\n previewElement: HTMLElement\n}\n\nexport type StzhUploadFileAddedEvent = {\n component: \"stzh-upload\",\n file: StzhUploadFile\n}\n\nexport type StzhUploadFilesAddedEvent = {\n component: \"stzh-upload\",\n files: StzhUploadFile[]\n}\n\nexport type StzhUploadFileRemoveEvent = {\n component: \"stzh-upload\",\n file: StzhUploadFile\n}\n\nexport type StzhUploadFileRemovedEvent = {\n component: \"stzh-upload\",\n file: StzhUploadFile\n force: boolean\n}\n\nexport type StzhUploadSendingEvent = {\n component: \"stzh-upload\",\n file: StzhUploadFile,\n xhr: XMLHttpRequest,\n formData: FormData\n}\n\nexport type StzhUploadSendingMultipleEvent = {\n component: \"stzh-upload\",\n files: StzhUploadFile[],\n xhr: XMLHttpRequest,\n formData: FormData\n}\n\nexport type StzhUploadProcessingEvent = {\n component: \"stzh-upload\",\n file: StzhUploadFile\n}\n\nexport type StzhUploadProcessingMultipleEvent = {\n component: \"stzh-upload\",\n files: StzhUploadFile[]\n}\n\nexport type StzhUploadProgressEvent = {\n component: \"stzh-upload\",\n file: StzhUploadFile,\n progress: number,\n bytesSent: number\n}\n\nexport type StzhUploadProgressTotalEvent = {\n component: \"stzh-upload\",\n totalUploadProgress: number,\n totalBytes: number,\n totalBytesSent: number\n}\n\nexport type StzhUploadErrorEvent = {\n component: \"stzh-upload\",\n file: StzhUploadFile,\n message: string,\n xhr: XMLHttpRequest\n}\n\nexport type StzhUploadErrorMultipleEvent = {\n component: \"stzh-upload\",\n files: StzhUploadFile[],\n message: string,\n xhr: XMLHttpRequest\n}\n\nexport type StzhUploadSuccessEvent = {\n component: \"stzh-upload\",\n file: StzhUploadFile,\n responseText: string,\n event: ProgressEvent\n}\n\nexport type StzhUploadSuccessMultipleEvent = {\n component: \"stzh-upload\",\n files: StzhUploadFile[],\n responseText: string,\n event: ProgressEvent\n}\n\nexport type StzhUploadCanceledEvent = {\n component: \"stzh-upload\",\n file: StzhUploadFile\n}\n\nexport type StzhUploadCanceledMultipleEvent = {\n component: \"stzh-upload\",\n files: StzhUploadFile[]\n}\n\nexport type StzhUploadCompleteEvent = {\n component: \"stzh-upload\",\n file: StzhUploadFile\n}\n\nexport type StzhUploadCompleteMultipleEvent = {\n component: \"stzh-upload\",\n files: StzhUploadFile[]\n}\n\n// Merged Types\n\nexport type StzhFocusEvent =\n | StzhAccordionItemFocusEvent\n | StzhButtonFocusEvent\n | StzhCheckboxFocusEvent\n | StzhChipFocusEvent\n | StzhDropdownFocusEvent\n | StzhInputFocusEvent\n | StzhLinkFocusEvent\n | StzhMenuItemFocusEvent\n | StzhRadioFocusEvent\n | StzhToggleFocusEvent\n | StzhVbzLinechipFocusEvent\n\n// ---\n// Prop Types\n// ---\n\nexport type StzhCalendarDateDisabledPredicate = (date: Date) => boolean\n\nexport namespace Layout {\n export type Justify =\n | \"start\"\n | \"end\"\n | \"center\"\n | \"between\"\n | \"around\"\n | \"evenly\";\n\n export type Items =\n | \"start\"\n | \"end\"\n | \"center\"\n | \"baseline\"\n | \"stretch\";\n\n export type JustifySelf =\n | \"auto\"\n | Justify;\n\n export type AlignSelf =\n | \"auto\"\n | Items;\n}\n\nexport namespace Space {\n export type Sizes =\n | \"xxxsmall\"\n | \"xxsmall\"\n | \"xsmall\"\n | \"small\"\n | \"medium\"\n | \"large\"\n | \"xlarge\"\n | \"xxlarge\"\n | \"xxxlarge\"\n | \"xxxxlarge\"\n | \"big\"\n | \"xbig\"\n | \"huge\"\n | \"xhuge\"\n | \"none\"\n | \"inherit\";\n\n export type Curves =\n | \"tiny\"\n | \"small\"\n | \"regular\"\n | \"medium\"\n | \"large\"\n | \"big\"\n | \"huge\"\n | \"none\";\n}\n\nexport namespace Font {\n export type Fonts =\n | \"light\"\n | \"regular\"\n | \"medium\"\n | \"heavy\"\n | \"default\";\n\n export type Sizes =\n | \"pico\"\n | \"nano\"\n | \"micro\"\n | \"milli\"\n | \"centi\"\n | \"deci\"\n | \"regular\"\n | \"deca\"\n | \"hecto\"\n | \"kilo\"\n | \"mega\"\n | \"giga\"\n | \"hero\"\n | \"inherit\";\n\n export type Curves =\n | \"p1\"\n | \"p2\"\n | \"caption\"\n | \"h4\"\n | \"h3\"\n | \"h2\"\n | \"h1\"\n | \"hero\"\n | \"default\";\n}\n\nexport namespace VBZ {\n export const BASE_TYPE_GLOBAL = \"GLOBAL\";\n\n export const CHANNEL_TICKER = \"ticker\";\n export const CHANNEL_INFO_URL_FILTER = \"stadt-zuerich.ch/vbz\";\n\n export const DISTURBANCE_GLOBAL = \"__global__\";\n export const DISTURBANCE_INFORMATION = \"0\";\n export const DISTURBANCE_CONSTRUCTION = \"1\";\n export const DISTURBANCE_NORMAL = \"2\";\n export const DISTURBANCE_EVENT = \"4\";\n export const DISTURBANCE_BUS = \"5\";\n\n export type Lines =\n | \"2\"\n | \"3\"\n | \"4\"\n | \"5\"\n | \"6\"\n | \"7\"\n | \"8\"\n | \"9\"\n | \"10\"\n | \"11\"\n | \"12\"\n | \"13\"\n | \"14\"\n | \"15\"\n | \"16\"\n | \"17\"\n | \"19\"\n | \"20\"\n | \"21\"\n | \"23\"\n | \"24\"\n | \"25\"\n | \"29\"\n | \"31\"\n | \"32\"\n | \"33\"\n | \"34\"\n | \"35\"\n | \"36\"\n | \"37\"\n | \"38\"\n | \"39\"\n | \"40\"\n | \"45\"\n | \"46\"\n | \"54\"\n | \"61\"\n | \"62\"\n | \"63\"\n | \"64\"\n | \"66\"\n | \"67\"\n | \"69\"\n | \"70\"\n | \"72\"\n | \"73\"\n | \"75\"\n | \"76\"\n | \"77\"\n | \"78\"\n | \"79\"\n | \"80\"\n | \"83\"\n | \"89\"\n | \"91\"\n | \"94\"\n | \"95\"\n | \"99\"\n | \"151\"\n | \"152\"\n | \"153\"\n | \"156\"\n | \"161\"\n | \"162\"\n | \"163\"\n | \"165\"\n | \"184\"\n | \"185\"\n | \"200\"\n | \"201\"\n | \"215\"\n | \"220\"\n | \"235\"\n | \"236\"\n | \"245\"\n | \"301\"\n | \"302\"\n | \"303\"\n | \"304\"\n | \"305\"\n | \"306\"\n | \"307\"\n | \"308\"\n | \"309\"\n | \"311\"\n | \"314\"\n | \"315\"\n | \"317\"\n | \"321\"\n | \"323\"\n | \"325\"\n | \"350\"\n | \"444\"\n | \"445\"\n | \"701\"\n | \"702\"\n | \"703\"\n | \"704\"\n | \"705\"\n | \"720\"\n | \"721\"\n | \"725\"\n | \"726\"\n | \"727\"\n | \"742\"\n | \"743\"\n | \"744\"\n | \"745\"\n | \"747\"\n | \"748\"\n | \"751\"\n | \"752\"\n | \"753\"\n | \"754\"\n | \"759\"\n | \"760\"\n | \"765\"\n | \"768\"\n | \"781\"\n | \"786\"\n | \"787\"\n | \"910\"\n | \"912\"\n | \"916\"\n | \"917\"\n | \"918\"\n | \"919\"\n | \"E\"\n | \"N\"\n | \"N1\"\n | \"N2\"\n | \"N4\"\n | \"N5\"\n | \"N6\"\n | \"N7\"\n | \"N8\"\n | \"N9\"\n | \"N10\"\n | \"N11\"\n | \"N12\"\n | \"N13\"\n | \"N14\"\n | \"N15\"\n | \"N16\"\n | \"N17\"\n | \"N18\"\n | \"N19\"\n | \"N30\"\n | \"N31\"\n | \"N32\"\n | \"N33\"\n | \"N34\"\n | \"N45\"\n | \"N72\"\n | \"N78\"\n | \"SN1\"\n | \"SN4\"\n | \"SN5\"\n | \"SN6\"\n | \"SN7\"\n | \"SN8\"\n | \"SN9\"\n | \"S2\"\n | \"S3\"\n | \"S4\"\n | \"S5\"\n | \"S6\"\n | \"S7\"\n | \"S8\"\n | \"S9\"\n | \"S10\"\n | \"S11\"\n | \"S14\"\n | \"S15\"\n | \"S16\"\n | \"S18\"\n | \"S19\"\n | \"S20\"\n | \"S21\"\n | \"S23\"\n | \"S24\"\n | \"S25\"\n}\n\n// ---\n// Stencil component types\n// ---\n\nexport * from './components';\n"],"version":3}
|
|
@@ -9,15 +9,11 @@ const StzhActions$1 = /*@__PURE__*/ proxyCustomElement(class StzhActions extends
|
|
|
9
9
|
this.__registerHost();
|
|
10
10
|
this.init = () => {
|
|
11
11
|
const secondaryButtons = this.element.querySelectorAll('stzh-button[slot="secondary"], [slot="secondary"] stzh-button');
|
|
12
|
-
const buttons = this.element.querySelectorAll('stzh-button');
|
|
13
12
|
secondaryButtons.forEach((button) => {
|
|
14
13
|
setPropsIfNull(button, {
|
|
15
14
|
variant: "secondary"
|
|
16
15
|
});
|
|
17
16
|
});
|
|
18
|
-
buttons.forEach((button) => {
|
|
19
|
-
button.setAttribute("role", "listitem");
|
|
20
|
-
});
|
|
21
17
|
};
|
|
22
18
|
this.variant = "form";
|
|
23
19
|
this.withBorder = false;
|
|
@@ -41,7 +37,7 @@ const StzhActions$1 = /*@__PURE__*/ proxyCustomElement(class StzhActions extends
|
|
|
41
37
|
"stzh-actions--has-border": this.withBorder,
|
|
42
38
|
[`stzh-actions--${this.variant}`]: !!this.variant
|
|
43
39
|
};
|
|
44
|
-
return (h(Host, null, h("div", { class: classes }, h("div", { class: "stzh-actions__actions", role: "
|
|
40
|
+
return (h(Host, null, h("div", { class: classes }, h("div", { class: "stzh-actions__actions", role: "group" }, h("div", { class: "stzh-actions__secondary-actions" }, h("slot", { name: "secondary" })), h("div", { class: "stzh-actions__primary-actions" }, h("slot", { name: "primary" }))))));
|
|
45
41
|
}
|
|
46
42
|
get element() { return this; }
|
|
47
43
|
static get style() { return stzhActionsCss; }
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"file":"stzh-actions.js","mappings":";;;AAAA,MAAM,cAAc,GAAG,2qDAA2qD;;MCmBrrDA,aAAW;;;;IAWd,SAAI,GAAG;MACb,MAAM,gBAAgB,GAAG,IAAI,CAAC,OAAO,CAAC,gBAAgB,CACpD,+DAA+D,CAChE,CAAC;MAEF,
|
|
1
|
+
{"file":"stzh-actions.js","mappings":";;;AAAA,MAAM,cAAc,GAAG,2qDAA2qD;;MCmBrrDA,aAAW;;;;IAWd,SAAI,GAAG;MACb,MAAM,gBAAgB,GAAG,IAAI,CAAC,OAAO,CAAC,gBAAgB,CACpD,+DAA+D,CAChE,CAAC;MAEF,gBAAgB,CAAC,OAAO,CAAC,CAAC,MAAM;QAC9B,cAAc,CAAC,MAAM,EAAE;UACrB,OAAO,EAAE,WAAW;SACI,CAAC,CAAA;OAC5B,CAAC,CAAC;KAEJ,CAAA;mBApByE,MAAM;sBAGjC,KAAK;;EAmBpD,iBAAiB;IACf,IAAI,CAAC,IAAI,EAAE,CAAC;IAEZ,IAAI,CAAC,QAAQ,GAAG,IAAI,gBAAgB,CAAC,IAAI,CAAC,IAAI,CAAC,CAAC;IAChD,IAAI,CAAC,QAAQ,CAAC,OAAO,CAAC,IAAI,CAAC,OAAO,EAAE;MAClC,SAAS,EAAE,IAAI;MACf,OAAO,EAAE,IAAI;KACd,CAAC,CAAC;GACJ;EAED,oBAAoB;IAClB,IAAI,IAAI,CAAC,QAAQ,EAAE;MACjB,IAAI,CAAC,QAAQ,CAAC,UAAU,EAAE,CAAC;KAC5B;GACF;EAED,MAAM;IACJ,MAAM,OAAO,GAAG;MACd,cAAc,EAAE,IAAI;MACpB,0BAA0B,EAAE,IAAI,CAAC,UAAU;MAC3C,CAAC,iBAAiB,IAAI,CAAC,OAAO,EAAE,GAAG,CAAC,CAAC,IAAI,CAAC,OAAO;KAClD,CAAC;IAEF,QACE,EAAC,IAAI,QACH,WAAK,KAAK,EAAE,OAAO,IACjB,WAAK,KAAK,EAAC,uBAAuB,EAAC,IAAI,EAAC,OAAO,IAC7C,WAAK,KAAK,EAAC,iCAAiC,IAC1C,YAAM,IAAI,EAAC,WAAW,GAAQ,CAC1B,EACN,WAAK,KAAK,EAAC,+BAA+B,IACxC,YAAM,IAAI,EAAC,SAAS,GAAQ,CACxB,CACF,CACF,CACD,EACP;GACH;;;;;;;;;;;;;;;;;;;;;;;;;;","names":["StzhActions"],"sources":["./src/components/stzh-actions/stzh-actions.scss?tag=stzh-actions&encapsulation=scoped","./src/components/stzh-actions/stzh-actions.tsx"],"sourcesContent":[":host {\n ::slotted([slot=\"primary\"]),\n ::slotted([slot=\"secondary\"]) {\n flex-grow: 1;\n margin: space('xxsmall');\n }\n\n &[variant=\"cta\"] ::slotted([slot=\"primary\"]),\n &[variant=\"cta\"] ::slotted([slot=\"secondary\"]) {\n flex-grow: 0;\n }\n}\n\n.stzh-actions {\n &__actions {\n display: flex;\n flex-direction: column;\n margin: calc(#{space('xxsmall')} * -1);\n\n @include mq($from: small) {\n flex-direction: row;\n }\n }\n\n &__primary-actions,\n &__secondary-actions {\n display: flex;\n }\n\n &--dialog &__actions {\n justify-content: flex-end;\n }\n\n &--process &__actions {\n justify-content: space-between;\n }\n\n &--has-border {\n padding-top: space('medium');\n border-top: 1px solid $baseBorderColor;\n }\n}\n","import {\n Component,\n Host,\n Prop,\n h,\n Element\n} from \"@stencil/core\";\n\nimport { setPropsIfNull } from \"../../utils/utils\";\n\n/**\n * @slot primary - Slot for primary button\n * @slot secondary - Slot for secondary button\n */\n@Component({\n tag: \"stzh-actions\",\n styleUrl: \"stzh-actions.scss\",\n scoped: true\n})\nexport class StzhActions {\n /** Variant determining what position the action buttons are */\n @Prop({ reflect: true }) variant: \"form\" | \"dialog\" | \"process\" | \"cta\" = \"form\";\n\n /** With border separator */\n @Prop({ reflect: true }) withBorder: boolean = false;\n\n @Element() element: HTMLStzhActionsElement;\n\n private observer: MutationObserver;\n\n private init = () => {\n const secondaryButtons = this.element.querySelectorAll(\n 'stzh-button[slot=\"secondary\"], [slot=\"secondary\"] stzh-button'\n );\n\n secondaryButtons.forEach((button) => {\n setPropsIfNull(button, {\n variant: \"secondary\"\n } as HTMLStzhButtonElement)\n });\n\n }\n\n connectedCallback() {\n this.init();\n\n this.observer = new MutationObserver(this.init);\n this.observer.observe(this.element, {\n childList: true,\n subtree: true\n });\n }\n\n disconnectedCallback() {\n if (this.observer) {\n this.observer.disconnect();\n }\n }\n\n render() {\n const classes = {\n \"stzh-actions\": true,\n \"stzh-actions--has-border\": this.withBorder,\n [`stzh-actions--${this.variant}`]: !!this.variant\n };\n\n return (\n <Host>\n <div class={classes}>\n <div class=\"stzh-actions__actions\" role=\"group\">\n <div class=\"stzh-actions__secondary-actions\">\n <slot name=\"secondary\"></slot>\n </div>\n <div class=\"stzh-actions__primary-actions\">\n <slot name=\"primary\"></slot>\n </div>\n </div>\n </div>\n </Host>\n );\n }\n}\n"],"version":3}
|
|
@@ -136,7 +136,7 @@ const StzhActionset = /*@__PURE__*/ proxyCustomElement(class StzhActionset exten
|
|
|
136
136
|
// "show-medium": !action.onlyCollapseText,
|
|
137
137
|
// "hide-when-collapsed": !action.onlyCollapseText,
|
|
138
138
|
// "hide-text-when-collapsed": action.onlyCollapseText
|
|
139
|
-
},
|
|
139
|
+
}, icon: action.icon, iconPosition: action.iconPosition, iconOnly: action.iconOnly, badge: action.badge, variant: action.variant
|
|
140
140
|
? action.variant
|
|
141
141
|
: (this.variant === "stack" ? "secondary" : "tertiary"), size: action.size
|
|
142
142
|
? action.size
|
|
@@ -144,7 +144,7 @@ const StzhActionset = /*@__PURE__*/ proxyCustomElement(class StzhActionset exten
|
|
|
144
144
|
// "show-medium": action.onlyCollapseText,
|
|
145
145
|
// "hide-when-collapsed": action.onlyCollapseText
|
|
146
146
|
} }, action.label)));
|
|
147
|
-
return (h(Host, { "has-collapsed-items": this.actionsCollapsed.length > 0 }, h("div", { class: classes }, h("div", { class: "stzh-actionset__actions", role: "
|
|
147
|
+
return (h(Host, { "has-collapsed-items": this.actionsCollapsed.length > 0 }, h("div", { class: classes }, h("div", { class: "stzh-actionset__actions", role: "group" }, h("div", { ref: (el) => (this.actionsElement = el), class: "stzh-actionset__actions-wrapper" }, this._actions.map(action => ((this.dynamicActions
|
|
148
148
|
|| (!this.dynamicActions &&
|
|
149
149
|
this.actionsCollapsed.indexOf(action) === -1))
|
|
150
150
|
&&
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"file":"stzh-actionset2.js","mappings":";;;;;;;;;;;AAAA,MAAM,gBAAgB,GAAG,m2EAAm2E;;MCqC/2E,aAAa;;;;;IAsBhB,aAAQ,GAAwB,EAAE,CAAC;IAyBnC,gBAAW,GAAG,CAAC,MAAyB,EAAE,aAAyB;MACzE,IAAI,CAAC,eAAe,CAAC,IAAI,CAAC;QACxB,SAAS,EAAE,gBAAgB;QAC3B,MAAM;QACN,aAAa;OACd,CAAC,CAAC;KACJ,CAAA;IAEO,WAAM,GAAG;MACf,IAAI,CAAC,OAAO,GAAG,KAAK,CAAC,OAAO,CAAC,CAAC,OAAO,CAAC;MACtC,IAAI,CAAC,QAAQ,GAAG,KAAK,CAAC,QAAQ,CAAC,CAAC,OAAO,CAAC;MAExC,IAAI,CAAC,IAAI,CAAC,cAAc,EAAE;QACxB,OAAO;OACR;MAED,MAAM,CAAC,MAAM,CAAC,IAAI,CAAC,cAAc,CAAC,KAAK,EAAE;QACvC,KAAK,EAAE,IAAI;QACX,MAAM,EAAE,IAAI;OACb,CAAC,CAAC;MAEH,IAAI,iBAAiB,GAAG,CAAC,CAAC;MAE1B,IACE,IAAI,CAAC,OAAO,KAAK,UAAU,IAAI,IAAI,CAAC,QAAQ;WACzC,IAAI,CAAC,OAAO,KAAK,OAAO,IAAI,IAAI,CAAC,OAAO,EAC3C;QACA,IAAI,CAAC,cAAc,GAAG,IAAI,CAAC;QAE3B,IAAI,gBAAgB,GAAG,CAAC,CAAC;QACzB,IAAI,eAAe,GAAG,CAAC,CAAC;;QAGxB,KAAK,CAAC,IAAI,CAAC,IAAI,CAAC,cAAc,CAAC,QAAQ,CAAC,CAAC,OAAO,CAAC,CAAC,KAAkB;;UAElE,IAAI,KAAK,CAAC,SAAS,KAAK,CAAC,EAAE;YACzB,iBAAiB,EAAE,CAAC;YAEpB,MAAM,KAAK,GAAG,gBAAgB,CAAC,KAAK,CAAC,CAAC;YACtC,MAAM,UAAU,GAAG,QAAQ,CAAC,KAAK,CAAC,UAAU,CAAC,CAAC;YAC9C,MAAM,WAAW,GAAG,QAAQ,CAAC,KAAK,CAAC,WAAW,CAAC,CAAC;YAChD,MAAM,SAAS,GAAG,QAAQ,CAAC,KAAK,CAAC,SAAS,CAAC,CAAC;YAC5C,MAAM,YAAY,GAAG,QAAQ,CAAC,KAAK,CAAC,YAAY,CAAC,CAAC;YAElD,MAAM,UAAU,GAAG,KAAK,CAAC,WAAW,GAAG,UAAU,GAAG,WAAW,CAAC;YAChE,MAAM,WAAW,GAAG,KAAK,CAAC,YAAY,GAAG,SAAS,GAAG,YAAY,CAAC;YAElE,IAAI,gBAAgB,GAAG,WAAW,EAAE;cAClC,gBAAgB,GAAG,WAAW,CAAC;aAChC;YAED,eAAe,GAAG,eAAe,GAAG,UAAU,GAAG,CAAC,CAAC;WACpD;SACF,CAAC,CAAC;QAEH,MAAM,CAAC,MAAM,CAAC,IAAI,CAAC,cAAc,CAAC,KAAK,EAAE;UACvC,KAAK,EAAE,GAAG,eAAe,IAAI;UAC7B,MAAM,EAAE,GAAG,gBAAgB,IAAI;SAChC,CAAC,CAAC;OACJ;WAAM;QACL,IAAI,CAAC,cAAc,GAAG,KAAK,CAAC;QAE5B,IAAI,IAAI,CAAC,OAAO,KAAK,UAAU,EAAE;UAC/B,iBAAiB,GAAG,CAAC,CAAC;SACvB;aAAM,IAAI,IAAI,CAAC,OAAO,KAAK,OAAO,EAAE;UACnC,iBAAiB,GAAG,IAAI,CAAC,QAAQ,CAAC,MAAM,IAAI,CAAC,GAAG,IAAI,CAAC,QAAQ,CAAC,MAAM,GAAG,CAAC,CAAC;SAC1E;OACF;MAED,IAAI,CAAC,gBAAgB,GAAG,IAAI,CAAC,QAAQ,CAAC,KAAK,CAAC,iBAAiB,CAAC,CAAC;KAChE,CAAA;IAEO,iBAAY,GAAG;MACrB,IAAI,IAAI,CAAC,cAAc,EAAE;QACvB,MAAM,CAAC,oBAAoB,CAAC,IAAI,CAAC,cAAc,CAAC,CAAC;OAClD;MAED,IAAI,CAAC,cAAc,GAAG,qBAAqB,CAAC,IAAI,CAAC,MAAM,CAAC,CAAC;KAC1D,CAAA;IAEO,uBAAkB,GAAG;MAC3B,IAAI,CAAC,gBAAgB,GAAG,EAAE,CAAC;MAC3B,qBAAqB,CAAC,IAAI,CAAC,MAAM,CAAC,CAAC;KACpC,CAAA;;mBA7HwD,OAAO;gCAGqC,EAAE;6BAGvB,EAAE;4BAG3B,YAAY;mBAOnB,EAAE;4BAiBD,EAAE;;;;;EARnD,cAAc,CAAC,QAAsC;IACnD,IAAI,OAAO,QAAQ,KAAK,QAAQ,EAAE;MAChC,IAAI,CAAC,QAAQ,GAAG,IAAI,CAAC,KAAK,CAAC,QAAQ,CAAC,CAAC;KACtC;SAAM;MACL,IAAI,CAAC,QAAQ,GAAG,QAAQ,CAAC;KAC1B;GACF;EAgGD,MAAM,iBAAiB;IACrB,IAAI,CAAC,cAAc,CAAC,IAAI,CAAC,OAAO,CAAC,CAAC;IAElC,IAAI,CAAC,IAAI,CAAC,YAAY,EAAE;MACtB,IAAI,CAAC,YAAY,GAAG,MAAM,iBAAiB,CAAC,IAAI,CAAC,OAAO,EAAE,WAAW,CAAC,CAAC;KACxE;GACF;EAED,iBAAiB;IACf,sBAAsB,CAAC,IAAI,CAAC,kBAAkB,CAAC,CAAC;IAEhD,IAAI,CAAC,cAAc,GAAG,IAAI,cAAc,CAAC,IAAI,CAAC,YAAY,CAAC,CAAC;IAC5D,IAAI,CAAC,cAAc,CAAC,OAAO,CAAC,IAAI,CAAC,OAAO,CAAC,CAAC;GAC3C;EAED,oBAAoB;IAClB,yBAAyB,CAAC,IAAI,CAAC,kBAAkB,CAAC,CAAC;IAEnD,IAAI,IAAI,CAAC,cAAc,EAAE;MACvB,IAAI,CAAC,cAAc,CAAC,UAAU,EAAE,CAAC;KAClC;GACF;EAED,gBAAgB;IACd,IAAI,CAAC,MAAM,EAAE,CAAC;GACf;EAED,MAAM;IACJ,MAAM,OAAO,GAAG;MACd,gBAAgB,EAAE,IAAI;;MAEtB,qCAAqC,EAAE,IAAI,CAAC,gBAAgB,CAAC,MAAM,GAAG,CAAC;MACvE,CAAC,mBAAmB,IAAI,CAAC,OAAO,EAAE,GAAG,CAAC,CAAC,IAAI,CAAC,OAAO;KACpD,CAAC;IAEF,MAAM,MAAM,GAAG,CAAC,MAAyB,MACvC,mBACE,KAAK,EAAE;QACL,wBAAwB,EAAE,IAAI;QAC9B,WAAW,EAAE,IAAI;;;;OAIlB,EACD,IAAI,EAAC,UAAU,EACf,IAAI,EAAE,MAAM,CAAC,IAAI,EACjB,YAAY,EAAE,MAAM,CAAC,YAAY,EACjC,QAAQ,EAAE,MAAM,CAAC,QAAQ,EACzB,KAAK,EAAE,MAAM,CAAC,KAAK,EACnB,OAAO,EAAE,MAAM,CAAC,OAAO;UACnB,MAAM,CAAC,OAAO;WACb,IAAI,CAAC,OAAO,KAAK,OAAO,GAAG,WAAW,GAAG,UAAU,CAAC,EACzD,IAAI,EAAE,MAAM,CAAC,IAAI;UACb,MAAM,CAAC,IAAI;WACV,IAAI,CAAC,OAAO,KAAK,OAAO,GAAG,SAAS,GAAG,MAAM,CAAC,EACnD,aAAa,EAAC,MAAM,EACpB,OAAO,EAAE,CAAC,CAAC,OAAO,IAAI,CAAC,WAAW,CAAC,MAAM,EAAE,CAAC,CAAC,CAAA,EAAE,IAE/C,YACE,KAAK,EAAE;;;OAGN,IAEA,MAAM,CAAC,KAAK,CACR,CACK,CACf,CAAC;IAEF,QACE,EAAC,IAAI,2BAAsB,IAAI,CAAC,gBAAgB,CAAC,MAAM,GAAG,CAAC,IACzD,WAAK,KAAK,EAAE,OAAO,IACjB,WAAK,KAAK,EAAC,yBAAyB,EAAC,IAAI,EAAC,MAAM,IAC9C,WACE,GAAG,EAAE,CAAC,EAAE,MAAM,IAAI,CAAC,cAAc,GAAG,EAAiB,CAAC,EACtD,KAAK,EAAC,iCAAiC,IAEtC,IAAI,CAAC,QAAQ,CAAC,GAAG,CAAC,MAAM,KACvB,CAAC,IAAI,CAAC,cAAc;UACd,CAAC,IAAI,CAAC,cAAc;QACtB,IAAI,CAAC,gBAAgB,CAAC,OAAO,CAAC,MAAM,CAAC,KAAK,CAAC,CAAC,CAAC;;SAE9C,MAAM,CAAC,cAAc;;YAEpB,oBACE,QAAQ,EAAC,OAAO,EAChB,OAAO,EAAE,MAAM,CAAC,cAAc,IAE7B,MAAM,CAAC,MAAM,CAAC,CACF;;YAEf,MAAM,CAAC,MAAM,CAAC,CAAC,CACpB,CAAC,CACE,EAEN,oBACE,KAAK,EAAE,IAAI,CAAC,OAAO,KAAK,OAAO;UAC3B,IAAI,CAAC,YAAY,CAAC,cAAc;WAC/B,CAAC,IAAI,CAAC,QAAQ,GAAG,IAAI,CAAC,YAAY,CAAC,OAAO,GAAG,EAAE,CAAC,EACrD,QAAQ,EAAC,OAAO,EAChB,SAAS,EAAE,IAAI,CAAC,gBAAgB,EAChC,KAAK,EAAC,gCAAgC,IAEtC,mBACE,SAAS,QACT,QAAQ,EAAE,IAAI,CAAC,gBAAgB,CAAC,MAAM,KAAK,CAAC,EAC5C,KAAK,EAAC,mCAAmC,EACzC,OAAO,EAAE,IAAI,CAAC,oBAAoB,KAAK,EAAE;UACrC,IAAI,CAAC,oBAAoB;WACxB,IAAI,CAAC,OAAO,KAAK,OAAO,GAAG,WAAW,GAAG,UAAU,CAAC,EACzD,IAAI,EAAE,IAAI,CAAC,iBAAiB,KAAK,EAAE;UACjC,IAAI,CAAC,iBAAiB;WACrB,IAAI,CAAC,OAAO,KAAK,OAAO,GAAG,SAAS,GAAG,MAAM,CAAC,EACjD,IAAI,EAAE,IAAI,CAAC,OAAO,KAAK,OAAO,GAAG,YAAY,GAAG,eAAe,EAC/D,QAAQ,EAAE,IAAI,CAAC,OAAO,KAAK,UAAU,IAAI,IAAI,CAAC,QAAQ,EACtD,YAAY,EAAC,OAAO,EACpB,KAAK,EAAE,IAAI,CAAC,OAAO,KAAK,OAAO;UAC3B,IAAI,CAAC,YAAY,CAAC,cAAc;WAC/B,CAAC,IAAI,CAAC,QAAQ,GAAG,IAAI,CAAC,YAAY,CAAC,OAAO,GAAG,EAAE,CAAC,GACxC,EACf,iBAAW,IAAI,EAAC,SAAS,IACtB,IAAI,CAAC,gBAAgB,CAAC,GAAG,CAAC,MAAM,KAC/B;;MAEE,IAAI,EAAE,MAAM,CAAC,IAAI,EACjB,KAAK,EAAE,MAAM,CAAC,KAAK,EACnB,UAAU,EAAE,MAAM,CAAC,UAAU,EAC7B,SAAS,EAAE,MAAM,CAAC,SAAS,EAC3B,OAAO,EAAE,CAAC,CAAC,OAAO,IAAI,CAAC,WAAW,CAAC,MAAM,EAAE,CAAC,CAAC,CAAA,EAAE;OAE9C,MAAM,CAAC,KAAK,CACE,CAClB,CAAC,CACQ,CACC,CACX,CACF,CACD,EACP;GACH;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;","names":[],"sources":["./src/components/stzh-actionset/stzh-actionset.scss?tag=stzh-actionset&encapsulation=scoped","./src/components/stzh-actionset/stzh-actionset.tsx"],"sourcesContent":[":host {\n\n}\n\n.stzh-actionset {\n &__actions {\n display: flex;\n align-items: center;\n }\n\n &__actions-wrapper {\n position: relative;\n display: flex;\n flex-wrap: wrap;\n overflow: hidden;\n }\n\n &__action {\n &:not(:last-child) {\n margin-right: space('xsmall');\n }\n }\n\n &__action-popover {\n opacity: 0;\n }\n\n &--has-collapsed-items &__action-popover {\n --width: auto;\n opacity: 1;\n }\n\n /* Overflow variant */\n\n &--overflow &__action {\n @include mq($from: medium) {\n --white-space: nowrap;\n }\n }\n\n /* Stack variant */\n\n &--stack &__actions {\n @include mq($to: small) {\n flex-direction: column;\n align-items: stretch;\n }\n }\n\n &--stack &__actions-wrapper { \n @include mq($to: small) {\n flex-direction: column;\n align-items: stretch;\n }\n }\n\n &--stack &__action {\n @include mq($from: small) {\n --white-space: nowrap;\n }\n\n &:not(:last-child) {\n @include mq($to: small) {\n margin-bottom: space('xsmall');\n margin-right: 0;\n }\n }\n }\n\n &--stack &__action-popover {\n @include mq($to: small) {\n margin-top: space('xsmall');\n }\n }\n\n // Hide more action popover on small if it has no collapsed items\n\n &--stack:not(#{&}--has-collapsed-items) &__action-popover {\n @include mq($to: small) {\n display: none;\n }\n }\n}\n","import {\n Component,\n Host,\n Prop,\n h,\n Element,\n Watch,\n Event,\n EventEmitter,\n State\n} from \"@stencil/core\";\n\nimport {\n StzhActionsetItem,\n StzhActionsetItemClickEvent\n} from \"../../index\";\n\nimport { fetchTranslations } from \"../../utils/translation-utils\";\nimport { StzhActionsetLocalizedText } from './stzh-actionset.localization';\n\nimport {\n media,\n addMediaChangeListener,\n removeMediaChangeListener\n} from '../../utils/media-utils';\n\nimport {\n Placement,\n} from \"@floating-ui/dom\";\n\n/**\n */\n@Component({\n tag: \"stzh-actionset\",\n styleUrl: \"stzh-actionset.scss\",\n scoped: true\n})\nexport class StzhActionset {\n /** Translation strings */\n @Prop() localization: StzhActionsetLocalizedText;\n\n /** Variant determining what position the action buttons are */\n @Prop({ reflect: true }) variant: \"stack\" | \"overflow\" = \"stack\";\n\n /** Button variant of popover button (button thats holds collapsed actions) */\n @Prop({ reflect: true }) popoverButtonVariant: \"\" | \"default\" | \"secondary\" | \"input\" | \"tertiary\" = \"\";\n\n /** Button size of popover button (button that holds collapsed actions) */\n @Prop({ reflect: true }) popoverButtonSize: \"\" | \"default\" | \"small\" | \"tiny\" = \"\";\n\n /** Popover placement of button that holds collapsed actions */\n @Prop({ reflect: true }) popoverPlacement: Placement = \"bottom-end\";\n\n /**\n * Card header actions.\n * Array of objects that can include the button attributes `id`, `variant`, `icon`, `size`, `iconPosition`, `iconOnly`, `label` or `badge`:\n * `[{\"id\":\"action-1\", \"icon\": \"alarm-bell\", \"label\": \"Lorem\"}, {\"id\":\"action-2\", \"icon\": \"mail\", \"label\": \"Lorem\"}]`\n */\n @Prop() actions: StzhActionsetItem[] | string = [];\n private _actions: StzhActionsetItem[] = [];\n\n /** Header action click event */\n @Event() stzhActionClick: EventEmitter<StzhActionsetItemClickEvent>;\n\n @Element() element: HTMLStzhActionsetElement;\n\n @Watch(\"actions\")\n actionsWatcher(newValue: StzhActionsetItem[] | string) {\n if (typeof newValue === \"string\") {\n this._actions = JSON.parse(newValue);\n } else {\n this._actions = newValue;\n }\n }\n\n @State() actionsCollapsed: StzhActionsetItem[] = [];\n @State() dynamicActions: boolean;\n @State() isSmall: boolean;\n @State() isMedium: boolean;\n\n private actionsElement: HTMLElement;\n private debounceResize: number;\n private resizeObserver: ResizeObserver;\n\n private actionClick = (action: StzhActionsetItem, originalEvent: MouseEvent) => {\n this.stzhActionClick.emit({\n component: \"stzh-actionset\",\n action,\n originalEvent\n });\n }\n\n private update = () => {\n this.isSmall = media(\"small\").matches;\n this.isMedium = media(\"medium\").matches;\n\n if (!this.actionsElement) {\n return;\n }\n\n Object.assign(this.actionsElement.style, {\n width: null,\n height: null\n });\n\n let newActionsVisible = 0;\n\n if (\n this.variant === \"overflow\" && this.isMedium\n || this.variant === \"stack\" && this.isSmall\n ) {\n this.dynamicActions = true;\n\n let newActionsHeight = 0;\n let newActionsWidth = 0;\n\n // update height and width\n Array.from(this.actionsElement.children).forEach((child: HTMLElement) => {\n // check which item is visible and\n if (child.offsetTop === 0) {\n newActionsVisible++;\n\n const style = getComputedStyle(child);\n const marginLeft = parseInt(style.marginLeft);\n const marginRight = parseInt(style.marginRight);\n const marginTop = parseInt(style.marginTop);\n const marginBottom = parseInt(style.marginBottom);\n\n const childWidth = child.offsetWidth + marginLeft + marginRight;\n const childHeight = child.offsetHeight + marginTop + marginBottom;\n\n if (newActionsHeight < childHeight) {\n newActionsHeight = childHeight;\n }\n\n newActionsWidth = newActionsWidth + childWidth + 1;\n }\n });\n\n Object.assign(this.actionsElement.style, {\n width: `${newActionsWidth}px`,\n height: `${newActionsHeight}px`\n });\n } else {\n this.dynamicActions = false;\n\n if (this.variant === \"overflow\") {\n newActionsVisible = 0;\n } else if (this.variant === \"stack\") {\n newActionsVisible = this._actions.length <= 3 ? this._actions.length : 2;\n }\n }\n\n this.actionsCollapsed = this._actions.slice(newActionsVisible);\n }\n\n private handleResize = () => {\n if (this.debounceResize) {\n window.cancelAnimationFrame(this.debounceResize);\n }\n\n this.debounceResize = requestAnimationFrame(this.update);\n }\n\n private mediaChangeHandler = () => {\n this.actionsCollapsed = [];\n requestAnimationFrame(this.update);\n }\n\n async componentWillLoad() {\n this.actionsWatcher(this.actions);\n\n if (!this.localization) {\n this.localization = await fetchTranslations(this.element, \"actionset\");\n }\n }\n\n connectedCallback() {\n addMediaChangeListener(this.mediaChangeHandler);\n\n this.resizeObserver = new ResizeObserver(this.handleResize);\n this.resizeObserver.observe(this.element);\n }\n\n disconnectedCallback() {\n removeMediaChangeListener(this.mediaChangeHandler);\n\n if (this.resizeObserver) {\n this.resizeObserver.disconnect();\n }\n }\n\n componentDidLoad() {\n this.update();\n }\n\n render() {\n const classes = {\n \"stzh-actionset\": true,\n // \"stzh-actionset--has-dynamic-actions\": this.dynamicActions,\n \"stzh-actionset--has-collapsed-items\": this.actionsCollapsed.length > 0,\n [`stzh-actionset--${this.variant}`]: !!this.variant\n };\n\n const Action = (action: StzhActionsetItem) => (\n <stzh-button\n class={{\n \"stzh-actionset__action\": true,\n \"is-button\": true,\n // \"show-medium\": !action.onlyCollapseText,\n // \"hide-when-collapsed\": !action.onlyCollapseText,\n // \"hide-text-when-collapsed\": action.onlyCollapseText\n }}\n role=\"listitem\"\n icon={action.icon}\n iconPosition={action.iconPosition}\n iconOnly={action.iconOnly}\n badge={action.badge}\n variant={action.variant\n ? action.variant\n : (this.variant === \"stack\" ? \"secondary\" : \"tertiary\")}\n size={action.size\n ? action.size\n : (this.variant === \"stack\" ? \"default\" : \"tiny\")}\n badgePosition=\"icon\"\n onClick={(e) => { this.actionClick(action, e) }}\n >\n <span\n class={{\n // \"show-medium\": action.onlyCollapseText,\n // \"hide-when-collapsed\": action.onlyCollapseText\n }}\n >\n {action.label}\n </span>\n </stzh-button>\n );\n\n return (\n <Host has-collapsed-items={this.actionsCollapsed.length > 0}>\n <div class={classes}>\n <div class=\"stzh-actionset__actions\" role=\"list\">\n <div\n ref={(el) => (this.actionsElement = el as HTMLElement)}\n class=\"stzh-actionset__actions-wrapper\"\n >\n {this._actions.map(action => (\n (this.dynamicActions\n || (!this.dynamicActions &&\n this.actionsCollapsed.indexOf(action) === -1))\n &&\n (action.tooltipContent\n ?\n <stzh-tooltip\n strategy=\"fixed\"\n content={action.tooltipContent}\n >\n {Action(action)}\n </stzh-tooltip>\n :\n Action(action))\n ))}\n </div>\n\n <stzh-popover\n label={this.variant === \"stack\"\n ? this.localization.furtherActions\n : (!this.isMedium ? this.localization.actions : \"\")}\n strategy=\"fixed\"\n placement={this.popoverPlacement}\n class=\"stzh-actionset__action-popover\"\n >\n <stzh-button\n fullwidth\n disabled={this.actionsCollapsed.length === 0}\n class=\"stzh-actionset__action is-further\"\n variant={this.popoverButtonVariant !== \"\"\n ? this.popoverButtonVariant\n : (this.variant === \"stack\" ? \"secondary\" : \"tertiary\")}\n size={this.popoverButtonSize !== \"\"\n ? this.popoverButtonSize\n : (this.variant === \"stack\" ? \"default\" : \"tiny\")}\n icon={this.variant === \"stack\" ? \"angle-down\" : \"more-vertical\"}\n iconOnly={this.variant === \"overflow\" && this.isMedium}\n iconPosition=\"right\"\n label={this.variant === \"stack\"\n ? this.localization.furtherActions\n : (!this.isMedium ? this.localization.actions : \"\")}\n ></stzh-button>\n <stzh-menu slot=\"content\">\n {this.actionsCollapsed.map(action => (\n <stzh-menu-item\n // class=\"hide-medium show-when-collapsed\"\n icon={action.icon}\n badge={action.badge}\n badgeEmpty={action.badgeEmpty}\n badgeType={action.badgeType}\n onClick={(e) => { this.actionClick(action, e) }}\n >\n {action.label}\n </stzh-menu-item>\n ))}\n </stzh-menu>\n </stzh-popover>\n </div>\n </div>\n </Host>\n );\n }\n}\n"],"version":3}
|
|
1
|
+
{"file":"stzh-actionset2.js","mappings":"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","names":[],"sources":["./src/components/stzh-actionset/stzh-actionset.scss?tag=stzh-actionset&encapsulation=scoped","./src/components/stzh-actionset/stzh-actionset.tsx"],"sourcesContent":[":host {\n\n}\n\n.stzh-actionset {\n &__actions {\n display: flex;\n align-items: center;\n }\n\n &__actions-wrapper {\n position: relative;\n display: flex;\n flex-wrap: wrap;\n overflow: hidden;\n }\n\n &__action {\n &:not(:last-child) {\n margin-right: space('xsmall');\n }\n }\n\n &__action-popover {\n opacity: 0;\n }\n\n &--has-collapsed-items &__action-popover {\n --width: auto;\n opacity: 1;\n }\n\n /* Overflow variant */\n\n &--overflow &__action {\n @include mq($from: medium) {\n --white-space: nowrap;\n }\n }\n\n /* Stack variant */\n\n &--stack &__actions {\n @include mq($to: small) {\n flex-direction: column;\n align-items: stretch;\n }\n }\n\n &--stack &__actions-wrapper { \n @include mq($to: small) {\n flex-direction: column;\n align-items: stretch;\n }\n }\n\n &--stack &__action {\n @include mq($from: small) {\n --white-space: nowrap;\n }\n\n &:not(:last-child) {\n @include mq($to: small) {\n margin-bottom: space('xsmall');\n margin-right: 0;\n }\n }\n }\n\n &--stack &__action-popover {\n @include mq($to: small) {\n margin-top: space('xsmall');\n }\n }\n\n // Hide more action popover on small if it has no collapsed items\n\n &--stack:not(#{&}--has-collapsed-items) &__action-popover {\n @include mq($to: small) {\n display: none;\n }\n }\n}\n","import {\n Component,\n Host,\n Prop,\n h,\n Element,\n Watch,\n Event,\n EventEmitter,\n State\n} from \"@stencil/core\";\n\nimport {\n StzhActionsetItem,\n StzhActionsetItemClickEvent\n} from \"../../index\";\n\nimport { fetchTranslations } from \"../../utils/translation-utils\";\nimport { StzhActionsetLocalizedText } from './stzh-actionset.localization';\n\nimport {\n media,\n addMediaChangeListener,\n removeMediaChangeListener\n} from '../../utils/media-utils';\n\nimport {\n Placement,\n} from \"@floating-ui/dom\";\n\n/**\n */\n@Component({\n tag: \"stzh-actionset\",\n styleUrl: \"stzh-actionset.scss\",\n scoped: true\n})\nexport class StzhActionset {\n /** Translation strings */\n @Prop() localization: StzhActionsetLocalizedText;\n\n /** Variant determining what position the action buttons are */\n @Prop({ reflect: true }) variant: \"stack\" | \"overflow\" = \"stack\";\n\n /** Button variant of popover button (button thats holds collapsed actions) */\n @Prop({ reflect: true }) popoverButtonVariant: \"\" | \"default\" | \"secondary\" | \"input\" | \"tertiary\" = \"\";\n\n /** Button size of popover button (button that holds collapsed actions) */\n @Prop({ reflect: true }) popoverButtonSize: \"\" | \"default\" | \"small\" | \"tiny\" = \"\";\n\n /** Popover placement of button that holds collapsed actions */\n @Prop({ reflect: true }) popoverPlacement: Placement = \"bottom-end\";\n\n /**\n * Card header actions.\n * Array of objects that can include the button attributes `id`, `variant`, `icon`, `size`, `iconPosition`, `iconOnly`, `label` or `badge`:\n * `[{\"id\":\"action-1\", \"icon\": \"alarm-bell\", \"label\": \"Lorem\"}, {\"id\":\"action-2\", \"icon\": \"mail\", \"label\": \"Lorem\"}]`\n */\n @Prop() actions: StzhActionsetItem[] | string = [];\n private _actions: StzhActionsetItem[] = [];\n\n /** Header action click event */\n @Event() stzhActionClick: EventEmitter<StzhActionsetItemClickEvent>;\n\n @Element() element: HTMLStzhActionsetElement;\n\n @Watch(\"actions\")\n actionsWatcher(newValue: StzhActionsetItem[] | string) {\n if (typeof newValue === \"string\") {\n this._actions = JSON.parse(newValue);\n } else {\n this._actions = newValue;\n }\n }\n\n @State() actionsCollapsed: StzhActionsetItem[] = [];\n @State() dynamicActions: boolean;\n @State() isSmall: boolean;\n @State() isMedium: boolean;\n\n private actionsElement: HTMLElement;\n private debounceResize: number;\n private resizeObserver: ResizeObserver;\n\n private actionClick = (action: StzhActionsetItem, originalEvent: MouseEvent) => {\n this.stzhActionClick.emit({\n component: \"stzh-actionset\",\n action,\n originalEvent\n });\n }\n\n private update = () => {\n this.isSmall = media(\"small\").matches;\n this.isMedium = media(\"medium\").matches;\n\n if (!this.actionsElement) {\n return;\n }\n\n Object.assign(this.actionsElement.style, {\n width: null,\n height: null\n });\n\n let newActionsVisible = 0;\n\n if (\n this.variant === \"overflow\" && this.isMedium\n || this.variant === \"stack\" && this.isSmall\n ) {\n this.dynamicActions = true;\n\n let newActionsHeight = 0;\n let newActionsWidth = 0;\n\n // update height and width\n Array.from(this.actionsElement.children).forEach((child: HTMLElement) => {\n // check which item is visible and\n if (child.offsetTop === 0) {\n newActionsVisible++;\n\n const style = getComputedStyle(child);\n const marginLeft = parseInt(style.marginLeft);\n const marginRight = parseInt(style.marginRight);\n const marginTop = parseInt(style.marginTop);\n const marginBottom = parseInt(style.marginBottom);\n\n const childWidth = child.offsetWidth + marginLeft + marginRight;\n const childHeight = child.offsetHeight + marginTop + marginBottom;\n\n if (newActionsHeight < childHeight) {\n newActionsHeight = childHeight;\n }\n\n newActionsWidth = newActionsWidth + childWidth + 1;\n }\n });\n\n Object.assign(this.actionsElement.style, {\n width: `${newActionsWidth}px`,\n height: `${newActionsHeight}px`\n });\n } else {\n this.dynamicActions = false;\n\n if (this.variant === \"overflow\") {\n newActionsVisible = 0;\n } else if (this.variant === \"stack\") {\n newActionsVisible = this._actions.length <= 3 ? this._actions.length : 2;\n }\n }\n\n this.actionsCollapsed = this._actions.slice(newActionsVisible);\n }\n\n private handleResize = () => {\n if (this.debounceResize) {\n window.cancelAnimationFrame(this.debounceResize);\n }\n\n this.debounceResize = requestAnimationFrame(this.update);\n }\n\n private mediaChangeHandler = () => {\n this.actionsCollapsed = [];\n requestAnimationFrame(this.update);\n }\n\n async componentWillLoad() {\n this.actionsWatcher(this.actions);\n\n if (!this.localization) {\n this.localization = await fetchTranslations(this.element, \"actionset\");\n }\n }\n\n connectedCallback() {\n addMediaChangeListener(this.mediaChangeHandler);\n\n this.resizeObserver = new ResizeObserver(this.handleResize);\n this.resizeObserver.observe(this.element);\n }\n\n disconnectedCallback() {\n removeMediaChangeListener(this.mediaChangeHandler);\n\n if (this.resizeObserver) {\n this.resizeObserver.disconnect();\n }\n }\n\n componentDidLoad() {\n this.update();\n }\n\n render() {\n const classes = {\n \"stzh-actionset\": true,\n // \"stzh-actionset--has-dynamic-actions\": this.dynamicActions,\n \"stzh-actionset--has-collapsed-items\": this.actionsCollapsed.length > 0,\n [`stzh-actionset--${this.variant}`]: !!this.variant\n };\n\n const Action = (action: StzhActionsetItem) => (\n <stzh-button\n class={{\n \"stzh-actionset__action\": true,\n \"is-button\": true,\n // \"show-medium\": !action.onlyCollapseText,\n // \"hide-when-collapsed\": !action.onlyCollapseText,\n // \"hide-text-when-collapsed\": action.onlyCollapseText\n }}\n icon={action.icon}\n iconPosition={action.iconPosition}\n iconOnly={action.iconOnly}\n badge={action.badge}\n variant={action.variant\n ? action.variant\n : (this.variant === \"stack\" ? \"secondary\" : \"tertiary\")}\n size={action.size\n ? action.size\n : (this.variant === \"stack\" ? \"default\" : \"tiny\")}\n badgePosition=\"icon\"\n onClick={(e) => { this.actionClick(action, e) }}\n >\n <span\n class={{\n // \"show-medium\": action.onlyCollapseText,\n // \"hide-when-collapsed\": action.onlyCollapseText\n }}\n >\n {action.label}\n </span>\n </stzh-button>\n );\n\n return (\n <Host has-collapsed-items={this.actionsCollapsed.length > 0}>\n <div class={classes}>\n <div class=\"stzh-actionset__actions\" role=\"group\">\n <div\n ref={(el) => (this.actionsElement = el as HTMLElement)}\n class=\"stzh-actionset__actions-wrapper\"\n >\n {this._actions.map(action => (\n (this.dynamicActions\n || (!this.dynamicActions &&\n this.actionsCollapsed.indexOf(action) === -1))\n &&\n (action.tooltipContent\n ?\n <stzh-tooltip\n strategy=\"fixed\"\n content={action.tooltipContent}\n >\n {Action(action)}\n </stzh-tooltip>\n :\n Action(action))\n ))}\n </div>\n\n <stzh-popover\n label={this.variant === \"stack\"\n ? this.localization.furtherActions\n : (!this.isMedium ? this.localization.actions : \"\")}\n strategy=\"fixed\"\n placement={this.popoverPlacement}\n class=\"stzh-actionset__action-popover\"\n >\n <stzh-button\n fullwidth\n disabled={this.actionsCollapsed.length === 0}\n class=\"stzh-actionset__action is-further\"\n variant={this.popoverButtonVariant !== \"\"\n ? this.popoverButtonVariant\n : (this.variant === \"stack\" ? \"secondary\" : \"tertiary\")}\n size={this.popoverButtonSize !== \"\"\n ? this.popoverButtonSize\n : (this.variant === \"stack\" ? \"default\" : \"tiny\")}\n icon={this.variant === \"stack\" ? \"angle-down\" : \"more-vertical\"}\n iconOnly={this.variant === \"overflow\" && this.isMedium}\n iconPosition=\"right\"\n label={this.variant === \"stack\"\n ? this.localization.furtherActions\n : (!this.isMedium ? this.localization.actions : \"\")}\n ></stzh-button>\n <stzh-menu slot=\"content\">\n {this.actionsCollapsed.map(action => (\n <stzh-menu-item\n // class=\"hide-medium show-when-collapsed\"\n icon={action.icon}\n badge={action.badge}\n badgeEmpty={action.badgeEmpty}\n badgeType={action.badgeType}\n onClick={(e) => { this.actionClick(action, e) }}\n >\n {action.label}\n </stzh-menu-item>\n ))}\n </stzh-menu>\n </stzh-popover>\n </div>\n </div>\n </Host>\n );\n }\n}\n"],"version":3}
|