@zanichelli/albe-web-components 15.0.1-RC → 15.0.2
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/CHANGELOG.md +5 -1
- package/dist/cjs/index-5dc4a8de.js +10 -2
- package/dist/cjs/loader.cjs.js +1 -1
- package/dist/cjs/{utils-f5f944ed.js → utils-2b313a8e.js} +1 -1
- package/dist/cjs/{utils-f5f944ed.js.map → utils-2b313a8e.js.map} +1 -1
- package/dist/cjs/web-components-library.cjs.js +1 -1
- package/dist/cjs/{z-app-header_15.cjs.entry.js → z-app-header_12.cjs.entry.js} +21 -1240
- package/dist/cjs/z-app-header_12.cjs.entry.js.map +1 -0
- package/dist/cjs/z-book-card.cjs.entry.js +1 -1
- package/dist/cjs/z-book-card.cjs.entry.js.map +1 -1
- package/dist/cjs/z-card.cjs.entry.js +1 -1
- package/dist/cjs/z-card.cjs.entry.js.map +1 -1
- package/dist/cjs/z-date-picker.cjs.entry.js +1 -1
- package/dist/cjs/z-dragdrop-area_2.cjs.entry.js +1033 -0
- package/dist/cjs/z-dragdrop-area_2.cjs.entry.js.map +1 -0
- package/dist/cjs/z-file-upload.cjs.entry.js +215 -0
- package/dist/cjs/z-file-upload.cjs.entry.js.map +1 -0
- package/dist/cjs/z-myz-card-list.cjs.entry.js +1 -1
- package/dist/cjs/z-myz-card-list.cjs.entry.js.map +1 -1
- package/dist/cjs/z-navigation-tabs.cjs.entry.js +1 -1
- package/dist/cjs/z-navigation-tabs.cjs.entry.js.map +1 -1
- package/dist/cjs/z-notification.cjs.entry.js +1 -1
- package/dist/cjs/z-notification.cjs.entry.js.map +1 -1
- package/dist/cjs/z-otp.cjs.entry.js +1 -1
- package/dist/cjs/z-otp.cjs.entry.js.map +1 -1
- package/dist/cjs/z-range-picker.cjs.entry.js +1 -1
- package/dist/cjs/z-slideshow.cjs.entry.js +1 -1
- package/dist/cjs/z-slideshow.cjs.entry.js.map +1 -1
- package/dist/cjs/z-stepper.cjs.entry.js +1 -1
- package/dist/cjs/z-stepper.cjs.entry.js.map +1 -1
- package/dist/cjs/z-toast-notification.cjs.entry.js +1 -1
- package/dist/cjs/z-toast-notification.cjs.entry.js.map +1 -1
- package/dist/collection/components/file-upload/z-file-upload/index.js +1 -1
- package/dist/collection/components/file-upload/z-file-upload/index.js.map +1 -1
- package/dist/collection/components/file-upload/z-file-upload/index.spec.js +3 -3
- package/dist/collection/components/file-upload/z-file-upload/index.spec.js.map +1 -1
- package/dist/collection/components/file-upload/z-file-upload/styles.css +5 -0
- package/dist/collection/components/z-app-header/styles.css +5 -0
- package/dist/collection/components/z-book-card/styles.css +10 -0
- package/dist/collection/components/z-card/styles.css +15 -0
- package/dist/collection/components/z-input/styles-checkbox-radio.css +8 -1
- package/dist/collection/components/z-input/styles-general.css +1 -1
- package/dist/collection/components/z-input/styles-text.css +5 -0
- package/dist/collection/components/z-modal/index.js +13 -4
- package/dist/collection/components/z-modal/index.js.map +1 -1
- package/dist/collection/components/z-modal/styles.css +18 -19
- package/dist/collection/components/z-navigation-tabs/styles.css +1 -1
- package/dist/collection/components/z-notification/styles.css +6 -1
- package/dist/collection/components/z-searchbar/styles.css +5 -0
- package/dist/collection/components/z-stepper/index.js +2 -2
- package/dist/collection/components/z-stepper/index.js.map +1 -1
- package/dist/collection/components/z-stepper/index.stories.js +44 -3
- package/dist/collection/components/z-stepper/index.stories.js.map +1 -1
- package/dist/collection/components/z-stepper-item/index.stories.js +44 -19
- package/dist/collection/components/z-stepper-item/index.stories.js.map +1 -1
- package/dist/collection/components/z-tag/index.stories.js +11 -7
- package/dist/collection/components/z-tag/index.stories.js.map +1 -1
- package/dist/collection/components/z-toast-notification/styles.css +12 -0
- package/dist/collection/snowflakes/myz/card/z-myz-card-list/styles.css +5 -0
- package/dist/collection/snowflakes/myz/z-otp/styles.css +5 -0
- package/dist/collection/snowflakes/myz/z-slideshow/styles.css +7 -0
- package/dist/components/index10.js +3 -3
- package/dist/components/index10.js.map +1 -1
- package/dist/components/index15.js +14 -5
- package/dist/components/index15.js.map +1 -1
- package/dist/components/index26.js +1 -1
- package/dist/components/index26.js.map +1 -1
- package/dist/components/z-app-header.js +1 -1
- package/dist/components/z-app-header.js.map +1 -1
- package/dist/components/z-book-card.js +1 -1
- package/dist/components/z-book-card.js.map +1 -1
- package/dist/components/z-card.js +1 -1
- package/dist/components/z-card.js.map +1 -1
- package/dist/components/z-file-upload.js +2 -2
- package/dist/components/z-file-upload.js.map +1 -1
- package/dist/components/z-myz-card-list.js +1 -1
- package/dist/components/z-myz-card-list.js.map +1 -1
- package/dist/components/z-navigation-tabs.js +1 -1
- package/dist/components/z-navigation-tabs.js.map +1 -1
- package/dist/components/z-notification.js +1 -1
- package/dist/components/z-notification.js.map +1 -1
- package/dist/components/z-otp.js +1 -1
- package/dist/components/z-otp.js.map +1 -1
- package/dist/components/z-slideshow.js +1 -1
- package/dist/components/z-slideshow.js.map +1 -1
- package/dist/components/z-stepper.js +1 -1
- package/dist/components/z-stepper.js.map +1 -1
- package/dist/components/z-toast-notification.js +1 -1
- package/dist/components/z-toast-notification.js.map +1 -1
- package/dist/esm/index-ab5f1eaa.js +10 -2
- package/dist/esm/loader.js +1 -1
- package/dist/esm/{utils-ba4f0770.js → utils-cd008fbc.js} +1 -1
- package/dist/esm/{utils-ba4f0770.js.map → utils-cd008fbc.js.map} +1 -1
- package/dist/esm/web-components-library.js +1 -1
- package/dist/esm/{z-app-header_15.entry.js → z-app-header_12.entry.js} +24 -1240
- package/dist/esm/z-app-header_12.entry.js.map +1 -0
- package/dist/esm/z-book-card.entry.js +1 -1
- package/dist/esm/z-book-card.entry.js.map +1 -1
- package/dist/esm/z-card.entry.js +1 -1
- package/dist/esm/z-card.entry.js.map +1 -1
- package/dist/esm/z-date-picker.entry.js +1 -1
- package/dist/esm/z-dragdrop-area_2.entry.js +1028 -0
- package/dist/esm/z-dragdrop-area_2.entry.js.map +1 -0
- package/dist/esm/z-file-upload.entry.js +211 -0
- package/dist/esm/z-file-upload.entry.js.map +1 -0
- package/dist/esm/z-myz-card-list.entry.js +1 -1
- package/dist/esm/z-myz-card-list.entry.js.map +1 -1
- package/dist/esm/z-navigation-tabs.entry.js +1 -1
- package/dist/esm/z-navigation-tabs.entry.js.map +1 -1
- package/dist/esm/z-notification.entry.js +1 -1
- package/dist/esm/z-notification.entry.js.map +1 -1
- package/dist/esm/z-otp.entry.js +1 -1
- package/dist/esm/z-otp.entry.js.map +1 -1
- package/dist/esm/z-range-picker.entry.js +1 -1
- package/dist/esm/z-slideshow.entry.js +1 -1
- package/dist/esm/z-slideshow.entry.js.map +1 -1
- package/dist/esm/z-stepper.entry.js +1 -1
- package/dist/esm/z-stepper.entry.js.map +1 -1
- package/dist/esm/z-toast-notification.entry.js +1 -1
- package/dist/esm/z-toast-notification.entry.js.map +1 -1
- package/dist/esm-es5/index-ab5f1eaa.js +1 -1
- package/dist/esm-es5/index-ab5f1eaa.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/{utils-ba4f0770.js → utils-cd008fbc.js} +1 -1
- package/dist/esm-es5/web-components-library.js +1 -1
- package/dist/esm-es5/web-components-library.js.map +1 -1
- package/dist/esm-es5/z-app-header_12.entry.js +2 -0
- package/dist/esm-es5/z-app-header_12.entry.js.map +1 -0
- package/dist/esm-es5/z-book-card.entry.js +1 -1
- package/dist/esm-es5/z-book-card.entry.js.map +1 -1
- package/dist/esm-es5/z-card.entry.js +1 -1
- package/dist/esm-es5/z-card.entry.js.map +1 -1
- package/dist/esm-es5/z-date-picker.entry.js +1 -1
- package/dist/esm-es5/z-dragdrop-area_2.entry.js +2 -0
- package/dist/esm-es5/z-dragdrop-area_2.entry.js.map +1 -0
- package/dist/esm-es5/z-file-upload.entry.js +2 -0
- package/dist/esm-es5/z-file-upload.entry.js.map +1 -0
- package/dist/esm-es5/z-myz-card-list.entry.js +1 -1
- package/dist/esm-es5/z-myz-card-list.entry.js.map +1 -1
- package/dist/esm-es5/z-navigation-tabs.entry.js +1 -1
- package/dist/esm-es5/z-navigation-tabs.entry.js.map +1 -1
- package/dist/esm-es5/z-notification.entry.js +1 -1
- package/dist/esm-es5/z-notification.entry.js.map +1 -1
- package/dist/esm-es5/z-otp.entry.js +1 -1
- package/dist/esm-es5/z-otp.entry.js.map +1 -1
- package/dist/esm-es5/z-range-picker.entry.js +1 -1
- package/dist/esm-es5/z-slideshow.entry.js +1 -1
- package/dist/esm-es5/z-slideshow.entry.js.map +1 -1
- package/dist/esm-es5/z-stepper.entry.js +1 -1
- package/dist/esm-es5/z-stepper.entry.js.map +1 -1
- package/dist/esm-es5/z-toast-notification.entry.js +1 -1
- package/dist/esm-es5/z-toast-notification.entry.js.map +1 -1
- package/dist/types/components/z-modal/index.d.ts +1 -0
- package/dist/types/components/z-stepper/index.d.ts +1 -1
- package/dist/types/components/z-stepper/index.stories.d.ts +6 -0
- package/dist/types/components/z-stepper-item/index.stories.d.ts +22 -9
- package/dist/types/components/z-tag/index.stories.d.ts +6 -2
- package/dist/web-components-library/p-0108191f.system.entry.js +2 -0
- package/dist/web-components-library/{p-ffee2568.system.entry.js.map → p-0108191f.system.entry.js.map} +1 -1
- package/dist/web-components-library/p-05827ca5.entry.js +2 -0
- package/dist/web-components-library/{p-8f28871c.entry.js.map → p-05827ca5.entry.js.map} +1 -1
- package/dist/web-components-library/p-0a6424ef.entry.js +2 -0
- package/dist/web-components-library/p-0a6424ef.entry.js.map +1 -0
- package/dist/web-components-library/p-0bde1f0e.entry.js +2 -0
- package/dist/web-components-library/{p-df6ef4b4.entry.js.map → p-0bde1f0e.entry.js.map} +1 -1
- package/{www/build/p-3b801ea6.entry.js → dist/web-components-library/p-0e342fa3.entry.js} +2 -2
- package/dist/web-components-library/{p-fb6c02f1.entry.js → p-114088a1.entry.js} +2 -2
- package/dist/web-components-library/p-12008903.system.entry.js +2 -0
- package/dist/web-components-library/p-12008903.system.entry.js.map +1 -0
- package/dist/web-components-library/p-16b1b35a.entry.js +2 -0
- package/dist/web-components-library/p-16b1b35a.entry.js.map +1 -0
- package/dist/web-components-library/p-21941767.entry.js +2 -0
- package/dist/web-components-library/p-21941767.entry.js.map +1 -0
- package/dist/web-components-library/p-22d9f9c3.entry.js +2 -0
- package/dist/web-components-library/p-22d9f9c3.entry.js.map +1 -0
- package/dist/web-components-library/p-23975a98.system.entry.js +2 -0
- package/dist/web-components-library/p-23975a98.system.entry.js.map +1 -0
- package/dist/web-components-library/p-25872e04.system.entry.js +2 -0
- package/dist/web-components-library/p-25872e04.system.entry.js.map +1 -0
- package/{www/build/p-7519c72d.system.entry.js → dist/web-components-library/p-2dd2d037.system.entry.js} +2 -2
- package/dist/web-components-library/p-2df54d7d.entry.js +2 -0
- package/dist/web-components-library/p-2df54d7d.entry.js.map +1 -0
- package/dist/web-components-library/p-33368291.system.entry.js +2 -0
- package/dist/web-components-library/p-33368291.system.entry.js.map +1 -0
- package/dist/web-components-library/p-49256720.system.entry.js +2 -0
- package/dist/web-components-library/p-49256720.system.entry.js.map +1 -0
- package/{www/build/p-662c8342.js → dist/web-components-library/p-49a35cf0.js} +1 -1
- package/dist/web-components-library/p-4d0200ca.system.entry.js +2 -0
- package/dist/web-components-library/p-4d0200ca.system.entry.js.map +1 -0
- package/dist/web-components-library/p-5a6d6203.system.entry.js +2 -0
- package/dist/web-components-library/p-5a6d6203.system.entry.js.map +1 -0
- package/dist/web-components-library/{p-22610d00.entry.js → p-6830461d.entry.js} +2 -2
- package/dist/web-components-library/p-6830461d.entry.js.map +1 -0
- package/{www/build/p-461cf578.system.entry.js → dist/web-components-library/p-751c58e2.system.entry.js} +2 -2
- package/dist/web-components-library/{p-dead4830.system.js → p-7dd29d4d.system.js} +1 -1
- package/dist/web-components-library/p-7e5ae5bd.entry.js +2 -0
- package/dist/web-components-library/p-7e5ae5bd.entry.js.map +1 -0
- package/dist/web-components-library/p-8078896f.system.entry.js +2 -0
- package/dist/web-components-library/p-8078896f.system.entry.js.map +1 -0
- package/dist/web-components-library/p-9450cc97.system.entry.js +2 -0
- package/dist/web-components-library/p-9450cc97.system.entry.js.map +1 -0
- package/dist/web-components-library/{p-eea9f7fd.system.entry.js → p-9551ea7a.system.entry.js} +2 -2
- package/dist/web-components-library/{p-eea9f7fd.system.entry.js.map → p-9551ea7a.system.entry.js.map} +1 -1
- package/dist/web-components-library/p-a5f739b0.entry.js +2 -0
- package/dist/web-components-library/p-a5f739b0.entry.js.map +1 -0
- package/dist/web-components-library/p-d2a11d41.system.entry.js +2 -0
- package/dist/web-components-library/p-d2a11d41.system.entry.js.map +1 -0
- package/dist/web-components-library/p-f3ef3a26.entry.js +2 -0
- package/dist/web-components-library/p-f3ef3a26.entry.js.map +1 -0
- package/dist/web-components-library/p-f530271b.system.js +1 -1
- package/dist/web-components-library/p-f530271b.system.js.map +1 -1
- package/dist/web-components-library/p-ff54b247.entry.js +2 -0
- package/dist/web-components-library/p-ff54b247.entry.js.map +1 -0
- package/dist/web-components-library/web-components-library.css +4 -3
- package/dist/web-components-library/web-components-library.esm.js +1 -1
- package/dist/web-components-library/web-components-library.esm.js.map +1 -1
- package/package.json +2 -2
- package/www/build/p-0108191f.system.entry.js +2 -0
- package/www/build/{p-ffee2568.system.entry.js.map → p-0108191f.system.entry.js.map} +1 -1
- package/www/build/p-05827ca5.entry.js +2 -0
- package/www/build/{p-8f28871c.entry.js.map → p-05827ca5.entry.js.map} +1 -1
- package/www/build/p-0a6424ef.entry.js +2 -0
- package/www/build/p-0a6424ef.entry.js.map +1 -0
- package/www/build/p-0bde1f0e.entry.js +2 -0
- package/www/build/{p-df6ef4b4.entry.js.map → p-0bde1f0e.entry.js.map} +1 -1
- package/{dist/web-components-library/p-3b801ea6.entry.js → www/build/p-0e342fa3.entry.js} +2 -2
- package/www/build/{p-fb6c02f1.entry.js → p-114088a1.entry.js} +2 -2
- package/www/build/p-12008903.system.entry.js +2 -0
- package/www/build/p-12008903.system.entry.js.map +1 -0
- package/www/build/p-16b1b35a.entry.js +2 -0
- package/www/build/p-16b1b35a.entry.js.map +1 -0
- package/www/build/p-21941767.entry.js +2 -0
- package/www/build/p-21941767.entry.js.map +1 -0
- package/www/build/p-22d9f9c3.entry.js +2 -0
- package/www/build/p-22d9f9c3.entry.js.map +1 -0
- package/www/build/p-23975a98.system.entry.js +2 -0
- package/www/build/p-23975a98.system.entry.js.map +1 -0
- package/www/build/p-25872e04.system.entry.js +2 -0
- package/www/build/p-25872e04.system.entry.js.map +1 -0
- package/{dist/web-components-library/p-7519c72d.system.entry.js → www/build/p-2dd2d037.system.entry.js} +2 -2
- package/www/build/p-2df54d7d.entry.js +2 -0
- package/www/build/p-2df54d7d.entry.js.map +1 -0
- package/www/build/p-33368291.system.entry.js +2 -0
- package/www/build/p-33368291.system.entry.js.map +1 -0
- package/www/build/p-49256720.system.entry.js +2 -0
- package/www/build/p-49256720.system.entry.js.map +1 -0
- package/{dist/web-components-library/p-662c8342.js → www/build/p-49a35cf0.js} +1 -1
- package/www/build/p-4d0200ca.system.entry.js +2 -0
- package/www/build/p-4d0200ca.system.entry.js.map +1 -0
- package/www/build/p-5a6d6203.system.entry.js +2 -0
- package/www/build/p-5a6d6203.system.entry.js.map +1 -0
- package/www/build/{p-22610d00.entry.js → p-6830461d.entry.js} +2 -2
- package/www/build/p-6830461d.entry.js.map +1 -0
- package/{dist/web-components-library/p-461cf578.system.entry.js → www/build/p-751c58e2.system.entry.js} +2 -2
- package/www/build/p-751c7014.css +4 -0
- package/www/build/{p-dead4830.system.js → p-7dd29d4d.system.js} +1 -1
- package/www/build/p-7e5ae5bd.entry.js +2 -0
- package/www/build/p-7e5ae5bd.entry.js.map +1 -0
- package/www/build/p-8078896f.system.entry.js +2 -0
- package/www/build/p-8078896f.system.entry.js.map +1 -0
- package/www/build/p-9450cc97.system.entry.js +2 -0
- package/www/build/p-9450cc97.system.entry.js.map +1 -0
- package/www/build/{p-eea9f7fd.system.entry.js → p-9551ea7a.system.entry.js} +2 -2
- package/www/build/{p-eea9f7fd.system.entry.js.map → p-9551ea7a.system.entry.js.map} +1 -1
- package/www/build/p-a5f739b0.entry.js +2 -0
- package/www/build/p-a5f739b0.entry.js.map +1 -0
- package/www/build/p-d2a11d41.system.entry.js +2 -0
- package/www/build/p-d2a11d41.system.entry.js.map +1 -0
- package/www/build/p-e65aa787.js +2 -0
- package/www/build/p-f3ef3a26.entry.js +2 -0
- package/www/build/p-f3ef3a26.entry.js.map +1 -0
- package/www/build/p-f530271b.system.js +1 -1
- package/www/build/p-f530271b.system.js.map +1 -1
- package/www/build/p-ff54b247.entry.js +2 -0
- package/www/build/p-ff54b247.entry.js.map +1 -0
- package/www/build/web-components-library.css +4 -3
- package/www/build/web-components-library.esm.js +1 -1
- package/www/build/web-components-library.esm.js.map +1 -1
- package/www/index.html +1 -11
- package/dist/cjs/z-app-header_15.cjs.entry.js.map +0 -1
- package/dist/esm/z-app-header_15.entry.js.map +0 -1
- package/dist/esm-es5/z-app-header_15.entry.js +0 -2
- package/dist/esm-es5/z-app-header_15.entry.js.map +0 -1
- package/dist/web-components-library/p-22610d00.entry.js.map +0 -1
- package/dist/web-components-library/p-353c9666.entry.js +0 -2
- package/dist/web-components-library/p-353c9666.entry.js.map +0 -1
- package/dist/web-components-library/p-3970d479.entry.js +0 -2
- package/dist/web-components-library/p-3970d479.entry.js.map +0 -1
- package/dist/web-components-library/p-3cd2a911.system.entry.js +0 -2
- package/dist/web-components-library/p-3cd2a911.system.entry.js.map +0 -1
- package/dist/web-components-library/p-5d0fd3e4.system.entry.js +0 -2
- package/dist/web-components-library/p-5d0fd3e4.system.entry.js.map +0 -1
- package/dist/web-components-library/p-8f28871c.entry.js +0 -2
- package/dist/web-components-library/p-93f6a3ca.system.entry.js +0 -2
- package/dist/web-components-library/p-93f6a3ca.system.entry.js.map +0 -1
- package/dist/web-components-library/p-94bfd79b.system.entry.js +0 -2
- package/dist/web-components-library/p-94bfd79b.system.entry.js.map +0 -1
- package/dist/web-components-library/p-9bae8b1c.system.entry.js +0 -2
- package/dist/web-components-library/p-9bae8b1c.system.entry.js.map +0 -1
- package/dist/web-components-library/p-a0893037.entry.js +0 -2
- package/dist/web-components-library/p-a0893037.entry.js.map +0 -1
- package/dist/web-components-library/p-a8d78db5.system.entry.js +0 -2
- package/dist/web-components-library/p-a8d78db5.system.entry.js.map +0 -1
- package/dist/web-components-library/p-b6aa9719.entry.js +0 -2
- package/dist/web-components-library/p-b6aa9719.entry.js.map +0 -1
- package/dist/web-components-library/p-c012f19c.entry.js +0 -2
- package/dist/web-components-library/p-c012f19c.entry.js.map +0 -1
- package/dist/web-components-library/p-df6ef4b4.entry.js +0 -2
- package/dist/web-components-library/p-efda4ff7.system.entry.js +0 -2
- package/dist/web-components-library/p-efda4ff7.system.entry.js.map +0 -1
- package/dist/web-components-library/p-fc1e9ce0.entry.js +0 -2
- package/dist/web-components-library/p-fc1e9ce0.entry.js.map +0 -1
- package/dist/web-components-library/p-ffcf7250.entry.js +0 -2
- package/dist/web-components-library/p-ffcf7250.entry.js.map +0 -1
- package/dist/web-components-library/p-ffeb3d1b.system.entry.js +0 -2
- package/dist/web-components-library/p-ffeb3d1b.system.entry.js.map +0 -1
- package/dist/web-components-library/p-ffee2568.system.entry.js +0 -2
- package/www/build/p-22610d00.entry.js.map +0 -1
- package/www/build/p-353c9666.entry.js +0 -2
- package/www/build/p-353c9666.entry.js.map +0 -1
- package/www/build/p-3970d479.entry.js +0 -2
- package/www/build/p-3970d479.entry.js.map +0 -1
- package/www/build/p-3cd2a911.system.entry.js +0 -2
- package/www/build/p-3cd2a911.system.entry.js.map +0 -1
- package/www/build/p-5d0fd3e4.system.entry.js +0 -2
- package/www/build/p-5d0fd3e4.system.entry.js.map +0 -1
- package/www/build/p-6232f1d4.css +0 -3
- package/www/build/p-8f28871c.entry.js +0 -2
- package/www/build/p-93f6a3ca.system.entry.js +0 -2
- package/www/build/p-93f6a3ca.system.entry.js.map +0 -1
- package/www/build/p-94bfd79b.system.entry.js +0 -2
- package/www/build/p-94bfd79b.system.entry.js.map +0 -1
- package/www/build/p-9bae8b1c.system.entry.js +0 -2
- package/www/build/p-9bae8b1c.system.entry.js.map +0 -1
- package/www/build/p-a0893037.entry.js +0 -2
- package/www/build/p-a0893037.entry.js.map +0 -1
- package/www/build/p-a8d78db5.system.entry.js +0 -2
- package/www/build/p-a8d78db5.system.entry.js.map +0 -1
- package/www/build/p-b6aa9719.entry.js +0 -2
- package/www/build/p-b6aa9719.entry.js.map +0 -1
- package/www/build/p-c012f19c.entry.js +0 -2
- package/www/build/p-c012f19c.entry.js.map +0 -1
- package/www/build/p-c94a3f4f.js +0 -2
- package/www/build/p-df6ef4b4.entry.js +0 -2
- package/www/build/p-efda4ff7.system.entry.js +0 -2
- package/www/build/p-efda4ff7.system.entry.js.map +0 -1
- package/www/build/p-fc1e9ce0.entry.js +0 -2
- package/www/build/p-fc1e9ce0.entry.js.map +0 -1
- package/www/build/p-ffcf7250.entry.js +0 -2
- package/www/build/p-ffcf7250.entry.js.map +0 -1
- package/www/build/p-ffeb3d1b.system.entry.js +0 -2
- package/www/build/p-ffeb3d1b.system.entry.js.map +0 -1
- package/www/build/p-ffee2568.system.entry.js +0 -2
- /package/dist/esm-es5/{utils-ba4f0770.js.map → utils-cd008fbc.js.map} +0 -0
- /package/dist/types/home/{veronica/zanichelli/ds → runner/work/design-system}/design-system/.stencil/.storybook/elements/args-controls.d.ts +0 -0
- /package/dist/types/home/{veronica/zanichelli/ds → runner/work/design-system}/design-system/.stencil/.storybook/elements/docs-template.d.ts +0 -0
- /package/dist/types/home/{veronica/zanichelli/ds → runner/work/design-system}/design-system/.stencil/docs/grid/index.stories.d.ts +0 -0
- /package/dist/types/home/{veronica/zanichelli/ds → runner/work/design-system}/design-system/.stencil/docs/iconset/index.stories.d.ts +0 -0
- /package/dist/types/home/{veronica/zanichelli/ds → runner/work/design-system}/design-system/.stencil/docs/themes/index.stories.d.ts +0 -0
- /package/dist/web-components-library/{p-3b801ea6.entry.js.map → p-0e342fa3.entry.js.map} +0 -0
- /package/dist/web-components-library/{p-fb6c02f1.entry.js.map → p-114088a1.entry.js.map} +0 -0
- /package/dist/web-components-library/{p-7519c72d.system.entry.js.map → p-2dd2d037.system.entry.js.map} +0 -0
- /package/dist/web-components-library/{p-662c8342.js.map → p-49a35cf0.js.map} +0 -0
- /package/dist/web-components-library/{p-461cf578.system.entry.js.map → p-751c58e2.system.entry.js.map} +0 -0
- /package/dist/web-components-library/{p-dead4830.system.js.map → p-7dd29d4d.system.js.map} +0 -0
- /package/www/build/{p-3b801ea6.entry.js.map → p-0e342fa3.entry.js.map} +0 -0
- /package/www/build/{p-fb6c02f1.entry.js.map → p-114088a1.entry.js.map} +0 -0
- /package/www/build/{p-7519c72d.system.entry.js.map → p-2dd2d037.system.entry.js.map} +0 -0
- /package/www/build/{p-662c8342.js.map → p-49a35cf0.js.map} +0 -0
- /package/www/build/{p-461cf578.system.entry.js.map → p-751c58e2.system.entry.js.map} +0 -0
- /package/www/build/{p-dead4830.system.js.map → p-7dd29d4d.system.js.map} +0 -0
|
@@ -7,8 +7,8 @@ const index$1 = require('./index-39ce4edf.js');
|
|
|
7
7
|
const utils = require('./utils-d0b10736.js');
|
|
8
8
|
require('./breakpoints-5c22092a.js');
|
|
9
9
|
|
|
10
|
-
const stylesCss$d = ":host{--app-header-typography-1-size:24px;--app-header-typography-2-size:28px;--app-header-typography-3-size:32px;--app-header-typography-4-size:36px;--app-header-typography-5-size:42px;--app-header-typography-6-size:48px;--app-header-typography-7-size:54px;--app-header-typography-8-size:60px;--app-header-typography-9-size:68px;--app-header-typography-10-size:76px;--app-header-typography-11-size:84px;--app-header-typography-12-size:92px;--app-header-typography-1-lineheight:1.33;--app-header-typography-2-lineheight:1.29;--app-header-typography-3-lineheight:1.25;--app-header-typography-4-lineheight:1.24;--app-header-typography-5-lineheight:1.24;--app-header-typography-6-lineheight:1.25;--app-header-typography-7-lineheight:1.2;--app-header-typography-8-lineheight:1.26;--app-header-typography-9-lineheight:1.24;--app-header-typography-10-lineheight:1.26;--app-header-typography-11-lineheight:1.2;--app-header-typography-12-lineheight:1.2;--app-header-typography-1-tracking:calc(-0.2 / 1em);--app-header-typography-2-tracking:calc(-0.4 / 1em);--app-header-typography-3-tracking:calc(-0.6 / 1em);--app-header-typography-4-tracking:calc(-0.8 / 1em);--app-header-typography-5-tracking:calc(-1 / 1em);--app-header-typography-6-tracking:calc(-1.2 / 1em);--app-header-typography-7-tracking:calc(-1.4 / 1em);--app-header-typography-8-tracking:calc(-1.6 / 1em);--app-header-typography-9-tracking:calc(-1.8 / 1em);--app-header-typography-10-tracking:calc(-2 / 1em);--app-header-typography-11-tracking:calc(-2.2 / 1em);--app-header-typography-12-tracking:calc(-2.4 / 1em);--app-header-content-max-width:100%;--app-header-height:auto;--app-header-top-offset:48px;--app-header-drawer-trigger-size:calc(var(--space-unit) * 4);--app-header-bg:var(--color-surface01);--app-header-stucked-bg:var(--color-surface01);--app-header-text-color:var(--color-default-text);--app-header-title-font-size:var(--app-header-typography-3-size);--app-header-title-lineheight:var(--app-header-typography-3-lineheight);--app-header-title-letter-spacing:var(--app-header-typography-3-tracking);--app-header-stucked-text-color:var(--color-default-text);position:relative;display:block;height:var(--app-header-height);color:var(--app-header-text-color)}:host,*{-webkit-box-sizing:border-box;box-sizing:border-box}.heading-panel{position:relative;display:-ms-flexbox;display:flex;width:100%;max-width:var(--app-header-content-max-width);-ms-flex-direction:column;flex-direction:column;-ms-flex-positive:0;flex-grow:0;-ms-flex-negative:0;flex-shrink:0;-ms-flex-align:baseline;align-items:baseline;padding:var(--grid-margin);margin:0 auto;background:var(--app-header-bg);gap:calc(var(--space-unit) * 2) calc(var(--space-unit) * 5)}.hero-container+.heading-panel{background:transparent}:host(:empty) .heading-panel{padding:0}.heading-container{position:relative;z-index:1;display:-ms-flexbox;display:flex;width:100%;max-width:100%;-ms-flex:1 auto;flex:1 auto;-ms-flex-direction:column;flex-direction:column;-ms-flex-pack:start;justify-content:flex-start}.heading-title{display:-ms-flexbox;display:flex;max-width:100%;-ms-flex-direction:row;flex-direction:row;-ms-flex-align:start;align-items:flex-start;-webkit-column-gap:calc(var(--space-unit) * 2);-moz-column-gap:calc(var(--space-unit) * 2);column-gap:calc(var(--space-unit) * 2)}::slotted([slot=\"title\"]),.heading-stuck .heading-title>*,::slotted([slot=\"stucked-title\"]){margin:0;font-family:\"IBM Plex Serif\", serif;font-weight:var(--font-bd)}::slotted([slot=\"title\"]){font-size:var(--app-header-title-font-size);letter-spacing:var(--app-header-title-letter-spacing);line-height:var(--app-header-title-lineheight)}.heading-stuck .heading-title>*,::slotted([slot=\"stucked-title\"]){font-size:var(--app-header-typography-3-size);letter-spacing:var(--app-header-typography-3-tracking);line-height:var(--app-header-typography-3-lineheight)}:host(:not([menu-length=\"0\"])) .heading-subtitle{padding-left:calc(var(--app-header-drawer-trigger-size) + (var(--space-unit) * 2))}::slotted([slot=\"top-subtitle\"]),::slotted([slot=\"subtitle\"]){margin:0;font-family:var(--font-family-sans);font-size:20px;font-style:italic;line-height:26px}::slotted([slot=\"subtitle\"]){font-weight:500}::slotted([slot=\"top-subtitle\"]){font-weight:400}.menu-container{display:-ms-flexbox;display:flex;width:100%;-ms-flex:1 auto;flex:1 auto;-ms-flex-flow:row wrap;flex-flow:row wrap}:host([menu-length=\"0\"]:not([enable-search])) .menu-container,.menu-container:empty{display:none}.menu-container ::slotted([open]){position:relative;z-index:3}z-searchbar{z-index:0;display:-ms-flexbox;display:flex;width:auto;min-width:calc(var(--space-unit) * 32);-ms-flex:1 auto;flex:1 auto;-ms-flex-align:center;align-items:center;margin-left:auto}.heading-stuck{position:fixed;z-index:20;top:var(--app-header-top-offset);left:0;width:100%;max-width:100%;-webkit-animation:slide-stuck-heading-in 250ms ease-out;animation:slide-stuck-heading-in 250ms ease-out;background:var(--app-header-stucked-bg);-webkit-box-shadow:var(--shadow-2);box-shadow:var(--shadow-2);color:var(--app-header-stucked-text-color)}.heading-stuck-content{display:-ms-flexbox;display:flex;max-width:var(--app-header-content-max-width);-ms-flex-align:center;align-items:center;padding:var(--space-unit) var(--grid-margin);margin:0 auto;-webkit-column-gap:calc(var(--space-unit) * 2);-moz-column-gap:calc(var(--space-unit) * 2);column-gap:calc(var(--space-unit) * 2)}.heading-stuck .heading-title{overflow:hidden}.heading-stuck .heading-title>*,.heading-stuck .heading-title ::slotted([slot=\"stucked-title\"]){display:block;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.heading-stuck-content z-button{margin-left:auto}.drawer-trigger{padding:0;border:0;margin:0;-webkit-appearance:none;-moz-appearance:none;appearance:none;background:none;border-radius:0;color:inherit;cursor:pointer}.drawer-trigger z-icon{--z-icon-width:var(--app-header-drawer-trigger-size);--z-icon-height:var(--app-header-drawer-trigger-size);fill:currentcolor}.heading-container :is(.drawer-trigger,z-button.search-page-button){display:-ms-flexbox;display:flex;height:calc(var(--app-header-title-font-size) * var(--app-header-title-lineheight));-ms-flex-align:center;align-items:center}.heading-container z-button.search-page-button{margin-left:auto}.drawer-content{display:none}z-offcanvas[open] .drawer-content{display:-ms-flexbox;display:flex;width:100%;-ms-flex:1 auto;flex:1 auto;-ms-flex-direction:column;flex-direction:column;row-gap:calc(var(--space-unit) * 2.5)}z-offcanvas[open] .drawer-content ::slotted(z-menu){width:100%}.drawer-close{--z-icon-width:var(--app-header-drawer-trigger-size);--z-icon-height:var(--app-header-drawer-trigger-size);padding:0;border:0;margin:var(--space-unit) 0 calc(var(--space-unit) * 2.5);-webkit-appearance:none;-moz-appearance:none;appearance:none;background:transparent;border-radius:0;color:inherit;cursor:pointer;fill:currentcolor;font-size:inherit;outline:none}.drawer-close:focus-visible{-webkit-box-shadow:var(--shadow-focus-primary);box-shadow:var(--shadow-focus-primary)}.hero-container{position:absolute;z-index:0;top:0;left:0;width:100%;height:100%}:host([overlay]) .heading-panel .drawer-trigger z-icon,:host([overlay]) .heading-panel .heading-container,:host([overlay]) .heading-panel .menu-container{color:var(--color-white);fill:var(--color-white)}:host([overlay]) .heading-panel .menu-container ::slotted(z-menu){--z-menu-label-color:var(--color-white)}:host([overlay]) .hero-container::after{position:absolute;z-index:0;top:0;left:0;width:100%;height:100%;background:var(--color-black);content:\"\";opacity:0.5}.hero-container img,.hero-container ::slotted(*){position:absolute;top:0;left:0;width:100%;height:100%;-o-object-fit:cover;object-fit:cover;-o-object-position:top center;object-position:top center;-webkit-user-drag:none}@media (min-width: 768px){:host{--app-header-title-font-size:var(--app-header-typography-6-size);--app-header-title-lineheight:var(--app-header-typography-6-lineheight);--app-header-title-letter-spacing:var(--app-header-typography-6-tracking)}.heading-panel{-ms-flex-flow:row wrap;flex-flow:row wrap;-ms-flex-align:center;align-items:center;padding-bottom:calc(var(--space-unit) * 2)}.heading-container{margin-right:auto}:host(:is([flow=\"offcanvas\"],[menu-length=\"0\"])) :is(.heading-container,.menu-container){width:auto}:host(:not([flow=\"offcanvas\"])) .heading-subtitle{padding-left:0}.menu-container{-ms-flex:initial;flex:initial;-ms-flex-align:center;align-items:center}:host([menu-length=\"0\"]) .menu-container:not(:empty){height:calc(var(--app-header-title-font-size) * var(--app-header-title-lineheight))}:host(:not([flow=\"offcanvas\"])) .menu-container{gap:var(--space-unit) calc(var(--space-unit) * 5)}:host(:not([flow=\"offcanvas\"])) .heading-container .drawer-trigger{display:none}}@media (min-width: 1152px){:host{--app-header-title-font-size:var(--app-header-typography-7-size);--app-header-title-lineheight:var(--app-header-typography-7-lineheight);--app-header-title-letter-spacing:var(--app-header-typography-7-tracking)}.heading-panel{-ms-flex-pack:start;justify-content:flex-start;padding-bottom:calc(var(--space-unit) * 3)}.heading-container,.menu-container{width:auto}:host([flow=\"stack\"]) .heading-panel{-ms-flex-flow:column;flex-flow:column;-ms-flex-align:start;align-items:flex-start}:host([flow=\"stack\"]) .menu-container{width:100%}:host(:not([flow=\"offcanvas\"],[menu-length=\"0\"])) .heading-panel{row-gap:calc(var(--space-unit) * 3)}z-searchbar{min-width:calc(var(--space-unit) * 45);-ms-flex:initial;flex:initial}}@media (min-width: 1366px){:host{--app-header-title-font-size:var(--app-header-typography-9-size);--app-header-title-lineheight:var(--app-header-typography-9-lineheight);--app-header-title-letter-spacing:var(--app-header-typography-9-tracking)}}@-webkit-keyframes slide-stuck-heading-in{0%{-webkit-transform:translate3d(0, -100%, 0);transform:translate3d(0, -100%, 0)}100%{-webkit-transform:none;transform:none}}@keyframes slide-stuck-heading-in{0%{-webkit-transform:translate3d(0, -100%, 0);transform:translate3d(0, -100%, 0)}100%{-webkit-transform:none;transform:none}}";
|
|
11
|
-
const ZAppHeaderStyle0 = stylesCss$
|
|
10
|
+
const stylesCss$a = ":host{--app-header-typography-1-size:24px;--app-header-typography-2-size:28px;--app-header-typography-3-size:32px;--app-header-typography-4-size:36px;--app-header-typography-5-size:42px;--app-header-typography-6-size:48px;--app-header-typography-7-size:54px;--app-header-typography-8-size:60px;--app-header-typography-9-size:68px;--app-header-typography-10-size:76px;--app-header-typography-11-size:84px;--app-header-typography-12-size:92px;--app-header-typography-1-lineheight:1.33;--app-header-typography-2-lineheight:1.29;--app-header-typography-3-lineheight:1.25;--app-header-typography-4-lineheight:1.24;--app-header-typography-5-lineheight:1.24;--app-header-typography-6-lineheight:1.25;--app-header-typography-7-lineheight:1.2;--app-header-typography-8-lineheight:1.26;--app-header-typography-9-lineheight:1.24;--app-header-typography-10-lineheight:1.26;--app-header-typography-11-lineheight:1.2;--app-header-typography-12-lineheight:1.2;--app-header-typography-1-tracking:calc(-0.2 / 1em);--app-header-typography-2-tracking:calc(-0.4 / 1em);--app-header-typography-3-tracking:calc(-0.6 / 1em);--app-header-typography-4-tracking:calc(-0.8 / 1em);--app-header-typography-5-tracking:calc(-1 / 1em);--app-header-typography-6-tracking:calc(-1.2 / 1em);--app-header-typography-7-tracking:calc(-1.4 / 1em);--app-header-typography-8-tracking:calc(-1.6 / 1em);--app-header-typography-9-tracking:calc(-1.8 / 1em);--app-header-typography-10-tracking:calc(-2 / 1em);--app-header-typography-11-tracking:calc(-2.2 / 1em);--app-header-typography-12-tracking:calc(-2.4 / 1em);--app-header-content-max-width:100%;--app-header-height:auto;--app-header-top-offset:48px;--app-header-drawer-trigger-size:calc(var(--space-unit) * 4);--app-header-bg:var(--color-surface01);--app-header-stucked-bg:var(--color-surface01);--app-header-text-color:var(--color-default-text);--app-header-title-font-size:var(--app-header-typography-3-size);--app-header-title-lineheight:var(--app-header-typography-3-lineheight);--app-header-title-letter-spacing:var(--app-header-typography-3-tracking);--app-header-stucked-text-color:var(--color-default-text);position:relative;display:block;height:var(--app-header-height);color:var(--app-header-text-color)}:host,*{-webkit-box-sizing:border-box;box-sizing:border-box}.heading-panel{position:relative;display:-ms-flexbox;display:flex;width:100%;max-width:var(--app-header-content-max-width);-ms-flex-direction:column;flex-direction:column;-ms-flex-positive:0;flex-grow:0;-ms-flex-negative:0;flex-shrink:0;-ms-flex-align:baseline;align-items:baseline;padding:var(--grid-margin);margin:0 auto;background:var(--app-header-bg);gap:calc(var(--space-unit) * 2) calc(var(--space-unit) * 5)}.hero-container+.heading-panel{background:transparent}:host(:empty) .heading-panel{padding:0}.heading-container{position:relative;z-index:1;display:-ms-flexbox;display:flex;width:100%;max-width:100%;-ms-flex:1 auto;flex:1 auto;-ms-flex-direction:column;flex-direction:column;-ms-flex-pack:start;justify-content:flex-start}.heading-title{display:-ms-flexbox;display:flex;max-width:100%;-ms-flex-direction:row;flex-direction:row;-ms-flex-align:start;align-items:flex-start;-webkit-column-gap:calc(var(--space-unit) * 2);-moz-column-gap:calc(var(--space-unit) * 2);column-gap:calc(var(--space-unit) * 2)}::slotted([slot=\"title\"]),.heading-stuck .heading-title>*,::slotted([slot=\"stucked-title\"]){margin:0;font-family:\"IBM Plex Serif\", serif;font-weight:var(--font-bd)}::slotted([slot=\"title\"]){font-size:var(--app-header-title-font-size);letter-spacing:var(--app-header-title-letter-spacing);line-height:var(--app-header-title-lineheight)}.heading-stuck .heading-title>*,::slotted([slot=\"stucked-title\"]){font-size:var(--app-header-typography-3-size);letter-spacing:var(--app-header-typography-3-tracking);line-height:var(--app-header-typography-3-lineheight)}:host(:not([menu-length=\"0\"])) .heading-subtitle{padding-left:calc(var(--app-header-drawer-trigger-size) + (var(--space-unit) * 2))}::slotted([slot=\"top-subtitle\"]),::slotted([slot=\"subtitle\"]){margin:0;font-family:var(--font-family-sans);font-size:20px;font-style:italic;line-height:26px}::slotted([slot=\"subtitle\"]){font-weight:500}::slotted([slot=\"top-subtitle\"]){font-weight:400}.menu-container{display:-ms-flexbox;display:flex;width:100%;-ms-flex:1 auto;flex:1 auto;-ms-flex-flow:row wrap;flex-flow:row wrap}:host([menu-length=\"0\"]:not([enable-search])) .menu-container,.menu-container:empty{display:none}.menu-container ::slotted([open]){position:relative;z-index:3}z-searchbar{z-index:0;display:-ms-flexbox;display:flex;width:auto;min-width:calc(var(--space-unit) * 32);-ms-flex:1 auto;flex:1 auto;-ms-flex-align:center;align-items:center;margin-left:auto}.heading-stuck{position:fixed;z-index:20;top:var(--app-header-top-offset);left:0;width:100%;max-width:100%;-webkit-animation:slide-stuck-heading-in 250ms ease-out;animation:slide-stuck-heading-in 250ms ease-out;background:var(--app-header-stucked-bg);-webkit-box-shadow:var(--shadow-2);box-shadow:var(--shadow-2);color:var(--app-header-stucked-text-color)}.heading-stuck-content{display:-ms-flexbox;display:flex;max-width:var(--app-header-content-max-width);-ms-flex-align:center;align-items:center;padding:var(--space-unit) var(--grid-margin);margin:0 auto;-webkit-column-gap:calc(var(--space-unit) * 2);-moz-column-gap:calc(var(--space-unit) * 2);column-gap:calc(var(--space-unit) * 2)}.heading-stuck .heading-title{overflow:hidden}.heading-stuck .heading-title>*,.heading-stuck .heading-title ::slotted([slot=\"stucked-title\"]){display:block;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.heading-stuck-content z-button{margin-left:auto}.drawer-trigger{padding:0;border:0;margin:0;-webkit-appearance:none;-moz-appearance:none;appearance:none;background:none;border-radius:0;color:inherit;cursor:pointer}.drawer-trigger:focus-visible{-webkit-box-shadow:var(--shadow-focus-primary);box-shadow:var(--shadow-focus-primary);outline:none !important}.drawer-trigger z-icon{--z-icon-width:var(--app-header-drawer-trigger-size);--z-icon-height:var(--app-header-drawer-trigger-size);fill:currentcolor}.heading-container :is(.drawer-trigger,z-button.search-page-button){display:-ms-flexbox;display:flex;height:calc(var(--app-header-title-font-size) * var(--app-header-title-lineheight));-ms-flex-align:center;align-items:center}.heading-container z-button.search-page-button{margin-left:auto}.drawer-content{display:none}z-offcanvas[open] .drawer-content{display:-ms-flexbox;display:flex;width:100%;-ms-flex:1 auto;flex:1 auto;-ms-flex-direction:column;flex-direction:column;row-gap:calc(var(--space-unit) * 2.5)}z-offcanvas[open] .drawer-content ::slotted(z-menu){width:100%}.drawer-close{--z-icon-width:var(--app-header-drawer-trigger-size);--z-icon-height:var(--app-header-drawer-trigger-size);padding:0;border:0;margin:var(--space-unit) 0 calc(var(--space-unit) * 2.5);-webkit-appearance:none;-moz-appearance:none;appearance:none;background:transparent;border-radius:0;color:inherit;cursor:pointer;fill:currentcolor;font-size:inherit;outline:none}.drawer-close:focus-visible{-webkit-box-shadow:var(--shadow-focus-primary);box-shadow:var(--shadow-focus-primary)}.hero-container{position:absolute;z-index:0;top:0;left:0;width:100%;height:100%}:host([overlay]) .heading-panel .drawer-trigger z-icon,:host([overlay]) .heading-panel .heading-container,:host([overlay]) .heading-panel .menu-container{color:var(--color-white);fill:var(--color-white)}:host([overlay]) .heading-panel .menu-container ::slotted(z-menu){--z-menu-label-color:var(--color-white)}:host([overlay]) .hero-container::after{position:absolute;z-index:0;top:0;left:0;width:100%;height:100%;background:var(--color-black);content:\"\";opacity:0.5}.hero-container img,.hero-container ::slotted(*){position:absolute;top:0;left:0;width:100%;height:100%;-o-object-fit:cover;object-fit:cover;-o-object-position:top center;object-position:top center;-webkit-user-drag:none}@media (min-width: 768px){:host{--app-header-title-font-size:var(--app-header-typography-6-size);--app-header-title-lineheight:var(--app-header-typography-6-lineheight);--app-header-title-letter-spacing:var(--app-header-typography-6-tracking)}.heading-panel{-ms-flex-flow:row wrap;flex-flow:row wrap;-ms-flex-align:center;align-items:center;padding-bottom:calc(var(--space-unit) * 2)}.heading-container{margin-right:auto}:host(:is([flow=\"offcanvas\"],[menu-length=\"0\"])) :is(.heading-container,.menu-container){width:auto}:host(:not([flow=\"offcanvas\"])) .heading-subtitle{padding-left:0}.menu-container{-ms-flex:initial;flex:initial;-ms-flex-align:center;align-items:center}:host([menu-length=\"0\"]) .menu-container:not(:empty){height:calc(var(--app-header-title-font-size) * var(--app-header-title-lineheight))}:host(:not([flow=\"offcanvas\"])) .menu-container{gap:var(--space-unit) calc(var(--space-unit) * 5)}:host(:not([flow=\"offcanvas\"])) .heading-container .drawer-trigger{display:none}}@media (min-width: 1152px){:host{--app-header-title-font-size:var(--app-header-typography-7-size);--app-header-title-lineheight:var(--app-header-typography-7-lineheight);--app-header-title-letter-spacing:var(--app-header-typography-7-tracking)}.heading-panel{-ms-flex-pack:start;justify-content:flex-start;padding-bottom:calc(var(--space-unit) * 3)}.heading-container,.menu-container{width:auto}:host([flow=\"stack\"]) .heading-panel{-ms-flex-flow:column;flex-flow:column;-ms-flex-align:start;align-items:flex-start}:host([flow=\"stack\"]) .menu-container{width:100%}:host(:not([flow=\"offcanvas\"],[menu-length=\"0\"])) .heading-panel{row-gap:calc(var(--space-unit) * 3)}z-searchbar{min-width:calc(var(--space-unit) * 45);-ms-flex:initial;flex:initial}}@media (min-width: 1366px){:host{--app-header-title-font-size:var(--app-header-typography-9-size);--app-header-title-lineheight:var(--app-header-typography-9-lineheight);--app-header-title-letter-spacing:var(--app-header-typography-9-tracking)}}@-webkit-keyframes slide-stuck-heading-in{0%{-webkit-transform:translate3d(0, -100%, 0);transform:translate3d(0, -100%, 0)}100%{-webkit-transform:none;transform:none}}@keyframes slide-stuck-heading-in{0%{-webkit-transform:translate3d(0, -100%, 0);transform:translate3d(0, -100%, 0)}100%{-webkit-transform:none;transform:none}}";
|
|
11
|
+
const ZAppHeaderStyle0 = stylesCss$a;
|
|
12
12
|
|
|
13
13
|
const SUPPORT_INTERSECTION_OBSERVER = typeof IntersectionObserver !== "undefined";
|
|
14
14
|
const ZAppHeader = class {
|
|
@@ -155,8 +155,8 @@ const ZAppHeader = class {
|
|
|
155
155
|
};
|
|
156
156
|
ZAppHeader.style = ZAppHeaderStyle0;
|
|
157
157
|
|
|
158
|
-
const stylesCss$
|
|
159
|
-
const ZButtonStyle0 = stylesCss$
|
|
158
|
+
const stylesCss$9 = ".sc-z-button-h{display:inline-block;--z-icon-width:16px;--z-icon-height:16px;--z-icon-right-margin:0}[disabled].sc-z-button-h:not([disabled=\"false\"]){pointer-events:none}.sc-z-button-h .z-button--container.sc-z-button{display:-ms-inline-flexbox;display:inline-flex;width:100%;-webkit-box-sizing:border-box;box-sizing:border-box;-ms-flex-align:center;align-items:center;-ms-flex-pack:center;justify-content:center;padding:0;border-width:var(--border-size-medium);border-style:solid;border-radius:var(--border-radius);cursor:pointer;fill:currentcolor;font-family:var(--font-family-sans);font-size:14px;font-weight:var(--font-sb);letter-spacing:0.3px;line-height:1;outline:none;text-decoration:none;text-transform:uppercase;white-space:nowrap}.sc-z-button-h .z-button--container.sc-z-button:focus:focus-visible{-webkit-box-shadow:var(--shadow-focus-primary);box-shadow:var(--shadow-focus-primary)}.sc-z-button-h .z-button--container.z-button--has-text.sc-z-button{min-width:calc(var(--space-unit) * 8);padding:0 calc(var(--space-unit) * 2)}.sc-z-button-h .z-button--container.z-button--has-text.sc-z-button z-icon.sc-z-button{--z-icon-right-margin:var(--space-unit)}[size=\"big\"].sc-z-button-h .z-button--container.sc-z-button{min-width:44px;height:44px}[size=\"small\"].sc-z-button-h .z-button--container.sc-z-button{min-width:36px;height:36px}[size=\"x-small\"].sc-z-button-h .z-button--container.sc-z-button{min-width:32px;height:32px}[variant=\"primary\"].sc-z-button-h .z-button--container.sc-z-button{border-color:var(--color-primary01);background-color:var(--color-primary01);color:var(--color-text-inverse)}@media (hover: hover){[variant=\"primary\"].sc-z-button-h .z-button--container.sc-z-button:hover{border-color:var(--color-hover-primary);background-color:var(--color-hover-primary);color:var(--color-text-inverse)}}[variant=\"primary\"].sc-z-button-h .z-button--container.sc-z-button:active{border-color:var(--color-pressed-primary);background-color:var(--color-pressed-primary);-webkit-box-shadow:var(--shadow-2);box-shadow:var(--shadow-2);color:var(--color-text-inverse)}[variant=\"primary\"][disabled].sc-z-button-h:not([disabled=\"false\"]) .z-button--container.sc-z-button{border-color:var(--color-disabled01);background-color:var(--color-disabled01);color:var(--color-disabled03)}[variant=\"secondary\"].sc-z-button-h .z-button--container.sc-z-button{border-color:var(--color-primary01);background-color:var(--color-surface01);color:var(--color-primary01)}@media (hover: hover){[variant=\"secondary\"].sc-z-button-h .z-button--container.sc-z-button:hover{border-color:var(--color-hover-primary);background-color:var(--color-surface01);color:var(--color-hover-primary)}}[variant=\"secondary\"].sc-z-button-h .z-button--container.sc-z-button:active{border-color:var(--color-pressed-primary);background-color:var(--color-surface01);-webkit-box-shadow:var(--shadow-2);box-shadow:var(--shadow-2);color:var(--color-pressed-primary)}[variant=\"secondary\"][disabled].sc-z-button-h:not([disabled=\"false\"]) .z-button--container.sc-z-button{border-color:var(--color-disabled01);background-color:var(--color-surface01);color:var(--color-disabled03)}[variant=\"tertiary\"].sc-z-button-h .z-button--container.sc-z-button{border-color:var(--color-primary02);background-color:var(--color-primary02);color:var(--color-primary01)}@media (hover: hover){[variant=\"tertiary\"].sc-z-button-h .z-button--container.sc-z-button:hover{border-color:var(--color-primary03);background-color:var(--color-primary03);color:var(--color-hover-primary)}}[variant=\"tertiary\"].sc-z-button-h .z-button--container.sc-z-button:focus:focus-visible{border-color:var(--color-primary02);background-color:var(--color-primary02);color:var(--color-primary01)}[variant=\"tertiary\"].sc-z-button-h .z-button--container.sc-z-button:active{border-color:var(--color-primary02);background-color:var(--color-primary02);-webkit-box-shadow:var(--shadow-2);box-shadow:var(--shadow-2);color:var(--color-primary01)}[variant=\"tertiary\"][disabled].sc-z-button-h:not([disabled=\"false\"]) .z-button--container.sc-z-button{border-color:var(--color-disabled01);background-color:var(--color-disabled01);color:var(--color-disabled03)}";
|
|
159
|
+
const ZButtonStyle0 = stylesCss$9;
|
|
160
160
|
|
|
161
161
|
const ZButton = class {
|
|
162
162
|
constructor(hostRef) {
|
|
@@ -192,8 +192,8 @@ const ZButton = class {
|
|
|
192
192
|
};
|
|
193
193
|
ZButton.style = ZButtonStyle0;
|
|
194
194
|
|
|
195
|
-
const stylesCss$
|
|
196
|
-
const ZDividerStyle0 = stylesCss$
|
|
195
|
+
const stylesCss$8 = ".sc-z-divider-h{display:block;padding:0;margin:0}.divider-horizontal.sc-z-divider-h{width:100%}.divider-vertical.sc-z-divider-h{height:100%}.divider-small.divider-horizontal.sc-z-divider-h{height:var(--border-size-small)}.divider-medium.divider-horizontal.sc-z-divider-h{height:var(--border-size-medium)}.divider-large.divider-horizontal.sc-z-divider-h{height:var(--border-size-large)}.divider-small.divider-vertical.sc-z-divider-h{width:var(--border-size-small)}.divider-medium.divider-vertical.sc-z-divider-h{width:var(--border-size-medium)}.divider-large.divider-vertical.sc-z-divider-h{width:var(--border-size-large)}";
|
|
196
|
+
const ZDividerStyle0 = stylesCss$8;
|
|
197
197
|
|
|
198
198
|
const ZDivider = class {
|
|
199
199
|
constructor(hostRef) {
|
|
@@ -208,241 +208,6 @@ const ZDivider = class {
|
|
|
208
208
|
};
|
|
209
209
|
ZDivider.style = ZDividerStyle0;
|
|
210
210
|
|
|
211
|
-
const stylesCss$a = ":host{font-family:var(--font-family-sans);font-weight:var(--font-rg)}:host>.dragdrop{position:relative;display:-ms-flexbox;display:flex;height:228px;-ms-flex-direction:column;flex-direction:column;padding:calc(var(--space-unit) * 2);border-color:var(--color-surface04);background-color:var(--color-surface02);background-image:url(\"data:image/svg+xml,%3csvg width='100%25' height='100%25' xmlns='http://www.w3.org/2000/svg'%3e%3crect width='100%25' height='100%25' fill='none' rx='2' ry='2' stroke='%23CACCCEFF' stroke-width='2' stroke-dasharray='15%2c 10%2c 14%2c 11' stroke-dashoffset='3' stroke-linecap='square'/%3e%3c/svg%3e\");border-radius:2px;color:var(--color-default-text)}:host>.dragdrop.dragover *{pointer-events:none}:host>.dragdrop .dragover-container{position:absolute;z-index:10;top:0;left:0;display:none;width:100%;height:100%;background-color:var(--color-primary03);-webkit-box-shadow:var(--shadow-focus-primary);box-shadow:var(--shadow-focus-primary)}:host>.dragdrop .dragover-container .dragover-message{padding:10px 28px;background-color:var(--color-link-primary);color:var(--color-text-inverse)}:host>.dragdrop.dragover .dragover-container{display:-ms-flexbox;display:flex;-ms-flex-align:center;align-items:center;-ms-flex-pack:center;justify-content:center}";
|
|
212
|
-
const ZDragdropAreaStyle0 = stylesCss$a;
|
|
213
|
-
|
|
214
|
-
const ZDragdropArea = class {
|
|
215
|
-
constructor(hostRef) {
|
|
216
|
-
index.registerInstance(this, hostRef);
|
|
217
|
-
this.fileDropped = index.createEvent(this, "fileDropped", 7);
|
|
218
|
-
this.dragAndDropLabel = undefined;
|
|
219
|
-
}
|
|
220
|
-
fileDroppedHandler(files) {
|
|
221
|
-
this.fileDropped.emit(files);
|
|
222
|
-
}
|
|
223
|
-
renderOnDragOverMessage() {
|
|
224
|
-
return (index.h("div", { class: "dragover-container" }, index.h("div", { class: "dragover-message" }, index.h("span", { class: "body-2-sb" }, this.dragAndDropLabel))));
|
|
225
|
-
}
|
|
226
|
-
render() {
|
|
227
|
-
return (index.h("div", { key: '41334ac77bca3fb0d30518480b702c815d95b125', tabIndex: 0, ref: (val) => (this.dragDropContainer = val), class: "dragdrop", onDragOver: (e) => {
|
|
228
|
-
e.preventDefault();
|
|
229
|
-
this.dragDropContainer.classList.add("dragover");
|
|
230
|
-
}, onDragLeave: () => {
|
|
231
|
-
this.dragDropContainer.classList.remove("dragover");
|
|
232
|
-
}, onDrop: (e) => {
|
|
233
|
-
e.preventDefault();
|
|
234
|
-
if (e.dataTransfer.files.length) {
|
|
235
|
-
this.dragDropContainer.classList.remove("dragover");
|
|
236
|
-
this.fileDroppedHandler(e.dataTransfer.files);
|
|
237
|
-
}
|
|
238
|
-
} }, this.renderOnDragOverMessage(), index.h("slot", { key: '83344ee14fcec799690b644fe0a56cc86e1b4476' })));
|
|
239
|
-
}
|
|
240
|
-
};
|
|
241
|
-
ZDragdropArea.style = ZDragdropAreaStyle0;
|
|
242
|
-
|
|
243
|
-
const stylesCss$9 = ":host{color:var(--color-default-text);font-family:var(--font-family-sans);font-weight:var(--font-rg)}:host>.container{display:-ms-flexbox;display:flex;-ms-flex-direction:column;flex-direction:column}:host .modal-wrapper{display:-ms-flexbox;display:flex;-ms-flex-align:center;align-items:center;-ms-flex-pack:center;justify-content:center;padding:calc(var(--space-unit) * 2)}:host .modal-wrapper>.files-wrapper{display:-ms-flexbox;display:flex;-ms-flex-direction:column;flex-direction:column;margin:calc(var(--space-unit) * 4);gap:var(--space-unit)}:host .text-container{display:-ms-flexbox;display:flex;-ms-flex-direction:column;flex-direction:column;margin:auto}:host .text-container .body-1{text-align:center}:host .text-container .upload-link{color:var(--color-link-primary);cursor:pointer}:host .text-container .upload-link-text{margin-bottom:var(--space-unit)}input#file-elem{display:none}#title{display:inline-block;margin:calc(var(--space-unit) * 2.5) 0 calc(var(--space-unit) * 4);font-size:calc(var(--space-unit) * 3);font-weight:var(--font-sb)}:host>.container>z-button{display:inline-block;margin-top:calc(var(--space-unit) * 3)}:host>.container>.files-container.hidden{display:none}:host>.container>.files-container>.heading-4-sb{display:inline-block;margin:calc(var(--space-unit) * 3) 0;font-size:calc(var(--space-unit) * 2);font-weight:var(--font-sb)}:host([type=\"dragdrop\"])>.container>.files-container>.heading-4-sb{margin-top:0;margin-bottom:calc(var(--space-unit) * 3)}:host>.container>.files-container>.files-wrapper{display:-ms-flexbox;display:flex;-ms-flex-wrap:wrap;flex-wrap:wrap;-webkit-column-gap:calc(var(--space-unit) * 2);-moz-column-gap:calc(var(--space-unit) * 2);column-gap:calc(var(--space-unit) * 2);row-gap:calc(var(--space-unit) * 2)}:host>.container>.files-container>z-divider{margin-top:calc(var(--space-unit) * 3);margin-bottom:0}:host([type=\"dragdrop\"])>.container>.files-container>z-divider{margin:calc(var(--space-unit) * 3) 0}:host .error-message{font-size:14px;font-weight:400;letter-spacing:0.16%;line-height:20px;text-align:left}:host .error-message>.file-name{font-weight:600}@media only screen and (min-width: 768px){:host>.container>z-button{-ms-flex-item-align:start;align-self:flex-start}:host .modal-wrapper{padding:calc(var(--space-unit) * 3)}}@media only screen and (min-width: 1152px){:host .modal-wrapper{padding:calc(var(--space-unit) * 4)}}";
|
|
244
|
-
const ZFileUploadStyle0 = stylesCss$9;
|
|
245
|
-
|
|
246
|
-
const ZFileUpload = class {
|
|
247
|
-
constructor(hostRef) {
|
|
248
|
-
index.registerInstance(this, hostRef);
|
|
249
|
-
this.fileInput = index.createEvent(this, "fileInput", 7);
|
|
250
|
-
this.inputAttributes = {
|
|
251
|
-
type: "file",
|
|
252
|
-
id: "file-elem",
|
|
253
|
-
multiple: true,
|
|
254
|
-
};
|
|
255
|
-
this.type = index$1.ZFileUploadType.DEFAULT;
|
|
256
|
-
this.buttonVariant = undefined;
|
|
257
|
-
this.acceptedFormat = undefined;
|
|
258
|
-
this.fileMaxSize = undefined;
|
|
259
|
-
this.mainTitle = undefined;
|
|
260
|
-
this.description = undefined;
|
|
261
|
-
this.files = [];
|
|
262
|
-
this.uploadBtnLabel = "allega";
|
|
263
|
-
this.dragAndDropLabel = "Rilascia i file in questa area per allegarli.";
|
|
264
|
-
this.allowedFilesMessage = undefined;
|
|
265
|
-
this.uploadClickableMessage = "Carica";
|
|
266
|
-
this.uploadMessage = "o trascina dal tuo computer";
|
|
267
|
-
this.errorModalTitle = "Errore di caricamento";
|
|
268
|
-
this.errorModalMessage = undefined;
|
|
269
|
-
this.uploadedFilesLabel = "File appena caricati";
|
|
270
|
-
this.hasFileSection = true;
|
|
271
|
-
this.invalidFiles = undefined;
|
|
272
|
-
}
|
|
273
|
-
/** Listen removeFile event sent from z-file component */
|
|
274
|
-
removeFileListener(e) {
|
|
275
|
-
this.removeFileHandler(e.detail);
|
|
276
|
-
}
|
|
277
|
-
/** Listen fileDropped event sent from z-dragdrop-area component */
|
|
278
|
-
fileDroppedListener(e) {
|
|
279
|
-
this.input.files = e.detail;
|
|
280
|
-
this.fileInputHandler();
|
|
281
|
-
}
|
|
282
|
-
componentDidUpdate() {
|
|
283
|
-
this.handleAccessibility();
|
|
284
|
-
this.invalidFiles.size && this.errorModal.focus();
|
|
285
|
-
}
|
|
286
|
-
componentWillLoad() {
|
|
287
|
-
this.invalidFiles = new Map();
|
|
288
|
-
}
|
|
289
|
-
fileInputHandler() {
|
|
290
|
-
if (this.input.files.length) {
|
|
291
|
-
this.invalidFiles = this.checkFiles(Array.from(this.input.files));
|
|
292
|
-
}
|
|
293
|
-
}
|
|
294
|
-
/** get array of uploaded files */
|
|
295
|
-
async getFiles() {
|
|
296
|
-
return this.files;
|
|
297
|
-
}
|
|
298
|
-
/** remove file from the array */
|
|
299
|
-
async removeFile(fileName) {
|
|
300
|
-
this.removeFileHandler(fileName);
|
|
301
|
-
}
|
|
302
|
-
removeFileHandler(fileName) {
|
|
303
|
-
const files = this.files;
|
|
304
|
-
const file = files.find((file) => file.name === fileName);
|
|
305
|
-
if (file) {
|
|
306
|
-
const index = files.indexOf(file);
|
|
307
|
-
if (index >= 0) {
|
|
308
|
-
files.splice(index, 1);
|
|
309
|
-
this.files = [...files];
|
|
310
|
-
}
|
|
311
|
-
}
|
|
312
|
-
}
|
|
313
|
-
getType() {
|
|
314
|
-
if (utils.getDevice() !== index$1.Device.DESKTOP && utils.getDevice() !== index$1.Device.DESKTOP_WIDE) {
|
|
315
|
-
return index$1.ZFileUploadType.DEFAULT;
|
|
316
|
-
}
|
|
317
|
-
return this.type;
|
|
318
|
-
}
|
|
319
|
-
handleAccessibility() {
|
|
320
|
-
const lastFile = this.el.querySelector("z-file:last-child z-chip button");
|
|
321
|
-
if (this.files.length > 0 && lastFile) {
|
|
322
|
-
lastFile.focus();
|
|
323
|
-
}
|
|
324
|
-
else {
|
|
325
|
-
this.getType() === index$1.ZFileUploadType.DEFAULT
|
|
326
|
-
? this.button.querySelector("button").focus()
|
|
327
|
-
: this.uploadLink.focus();
|
|
328
|
-
}
|
|
329
|
-
}
|
|
330
|
-
checkFiles(files) {
|
|
331
|
-
const errors = new Map();
|
|
332
|
-
const sizeErrorString = `supera il limite di ${this.fileMaxSize}MB`;
|
|
333
|
-
const formatErrorString = " ha un formato non supportato";
|
|
334
|
-
files.forEach((file) => {
|
|
335
|
-
const fileSize = file.size / 1024 / 1024;
|
|
336
|
-
const fileFormatOk = this.acceptedFormat
|
|
337
|
-
.split(",")
|
|
338
|
-
.some((ext) => file.name.toLowerCase().endsWith(ext.trim()));
|
|
339
|
-
const fileSizeOk = fileSize <= this.fileMaxSize;
|
|
340
|
-
if (fileSizeOk && fileFormatOk) {
|
|
341
|
-
if (!this.files.find((f) => f.name === file.name)) {
|
|
342
|
-
this.files.push(file);
|
|
343
|
-
this.fileInput.emit(file);
|
|
344
|
-
this.input.value = "";
|
|
345
|
-
}
|
|
346
|
-
return;
|
|
347
|
-
}
|
|
348
|
-
errors.set(file.name, []);
|
|
349
|
-
if (!fileSizeOk) {
|
|
350
|
-
errors.get(file.name).push(sizeErrorString);
|
|
351
|
-
}
|
|
352
|
-
if (!fileFormatOk) {
|
|
353
|
-
errors.get(file.name).push(formatErrorString);
|
|
354
|
-
}
|
|
355
|
-
});
|
|
356
|
-
return errors;
|
|
357
|
-
}
|
|
358
|
-
renderTitle() {
|
|
359
|
-
return index.h("span", { id: "title" }, this.mainTitle);
|
|
360
|
-
}
|
|
361
|
-
renderDescription(cssClass) {
|
|
362
|
-
return index.h("span", { class: cssClass }, this.description);
|
|
363
|
-
}
|
|
364
|
-
renderAllowedFileExtensions() {
|
|
365
|
-
let fileFormatString = "";
|
|
366
|
-
let fileWeightString = "";
|
|
367
|
-
if (this.acceptedFormat) {
|
|
368
|
-
const fileFormat = this.acceptedFormat
|
|
369
|
-
.split(", ")
|
|
370
|
-
.map((string) => string.substring(1).toUpperCase())
|
|
371
|
-
.join(", ");
|
|
372
|
-
fileFormatString = ` nei formati ${fileFormat}`;
|
|
373
|
-
}
|
|
374
|
-
if (this.fileMaxSize) {
|
|
375
|
-
fileWeightString = ` per un massimo di ${this.fileMaxSize}MB di peso`;
|
|
376
|
-
}
|
|
377
|
-
const finalString = `Puoi allegare file${fileFormatString}${fileWeightString}.`;
|
|
378
|
-
return (index.h("span", { class: "body-3" }, this.allowedFilesMessage
|
|
379
|
-
? this.allowedFilesMessage
|
|
380
|
-
: fileFormatString || fileWeightString
|
|
381
|
-
? finalString
|
|
382
|
-
: null));
|
|
383
|
-
}
|
|
384
|
-
renderFileSection() {
|
|
385
|
-
if (!this.hasFileSection) {
|
|
386
|
-
return;
|
|
387
|
-
}
|
|
388
|
-
return (index.h("section", { class: `files-container ${!this.files.length ? "hidden" : ""}` }, index.h("span", { class: "heading-4-sb" }, this.uploadedFilesLabel), index.h("div", { class: "files-wrapper" }, index.h("slot", { name: "files" })), index.h("z-divider", { size: index$1.DividerSize.MEDIUM })));
|
|
389
|
-
}
|
|
390
|
-
renderInput() {
|
|
391
|
-
return (index.h("input", Object.assign({}, this.inputAttributes, { onChange: () => this.fileInputHandler(), accept: this.acceptedFormat, ref: (val) => (this.input = val) })));
|
|
392
|
-
}
|
|
393
|
-
renderUploadButton() {
|
|
394
|
-
return [
|
|
395
|
-
this.renderInput(),
|
|
396
|
-
index.h("z-button", { onClick: () => this.input.click(), onKeyPress: (e) => {
|
|
397
|
-
if (e.code == "Space" || e.code == "Enter") {
|
|
398
|
-
e.preventDefault();
|
|
399
|
-
this.input.click();
|
|
400
|
-
}
|
|
401
|
-
}, id: "fileSelect", variant: this.buttonVariant, icon: "upload", ref: (val) => (this.button = val) }, this.uploadBtnLabel),
|
|
402
|
-
];
|
|
403
|
-
}
|
|
404
|
-
renderUploadLink() {
|
|
405
|
-
return [
|
|
406
|
-
this.renderInput(),
|
|
407
|
-
index.h("span", { class: "body-1 upload-link-text" }, index.h("span", { tabIndex: 0, class: "body-1-sb upload-link", onClick: () => this.input.click(), onKeyPress: (e) => {
|
|
408
|
-
if (e.code == "Space" || e.code == "Enter") {
|
|
409
|
-
e.preventDefault();
|
|
410
|
-
this.input.click();
|
|
411
|
-
}
|
|
412
|
-
}, ref: (val) => (this.uploadLink = val) }, this.uploadClickableMessage), " ", this.uploadMessage),
|
|
413
|
-
];
|
|
414
|
-
}
|
|
415
|
-
renderDefaultMode() {
|
|
416
|
-
return [
|
|
417
|
-
this.renderDescription("body-3-sb"),
|
|
418
|
-
this.renderAllowedFileExtensions(),
|
|
419
|
-
this.renderFileSection(),
|
|
420
|
-
this.renderUploadButton(),
|
|
421
|
-
];
|
|
422
|
-
}
|
|
423
|
-
renderDragDropMode() {
|
|
424
|
-
return [
|
|
425
|
-
this.renderFileSection(),
|
|
426
|
-
index.h("z-dragdrop-area", { "drag-and-drop-label": this.dragAndDropLabel }, index.h("div", { class: "text-container" }, this.renderDescription("body-1"), this.renderUploadLink(), this.renderAllowedFileExtensions())),
|
|
427
|
-
];
|
|
428
|
-
}
|
|
429
|
-
formatErrorString(key, value) {
|
|
430
|
-
var _a, _b;
|
|
431
|
-
const bothErrors = value[0] && value[1] ? " e " : "";
|
|
432
|
-
return (index.h("span", { class: "error-message" }, "Il file ", index.h("span", { class: "file-name" }, key), " ", (_a = value[1]) !== null && _a !== void 0 ? _a : "", bothErrors, (_b = value[0]) !== null && _b !== void 0 ? _b : "", "."));
|
|
433
|
-
}
|
|
434
|
-
handleErrorModalContent() {
|
|
435
|
-
return (index.h("div", { slot: "modalContent" }, index.h("div", { class: "modal-wrapper" }, index.h("div", { class: "files" }, this.errorModalMessage ? (index.h("span", { class: "body-3" }, this.errorModalMessage)) : (Array.from(this.invalidFiles).map(([key, value]) => {
|
|
436
|
-
return index.h("span", { class: "body-3" }, this.formatErrorString(key, value));
|
|
437
|
-
}))))));
|
|
438
|
-
}
|
|
439
|
-
render() {
|
|
440
|
-
return (index.h(index.Host, { key: '30d78f7ce88aa6e994de1355cf4bb8bbc79e6f85' }, index.h("div", { key: '95a606aeda5279d50acb1b127f2d4784ccd95411', tabIndex: 0, class: `container ${this.getType()}` }, this.mainTitle && this.renderTitle(), this.getType() == index$1.ZFileUploadType.DEFAULT ? this.renderDefaultMode() : this.renderDragDropMode()), !!this.invalidFiles.size && (index.h("z-modal", { key: '576e0e283b6fc92d6099a94178fde4c4eaa280b9', modalid: `file-upload-${this.type}-error-modal`, tabIndex: 0, ref: (val) => (this.errorModal = val), modaltitle: this.errorModalTitle, onModalClose: () => (this.invalidFiles = new Map()), onModalBackgroundClick: () => (this.invalidFiles = new Map()) }, this.handleErrorModalContent()))));
|
|
441
|
-
}
|
|
442
|
-
get el() { return index.getElement(this); }
|
|
443
|
-
};
|
|
444
|
-
ZFileUpload.style = ZFileUploadStyle0;
|
|
445
|
-
|
|
446
211
|
/**
|
|
447
212
|
* Object containing SVG d path of `stroke` icons.
|
|
448
213
|
*/
|
|
@@ -1316,8 +1081,8 @@ Object.assign(ICONS, LEGACY_ICONS);
|
|
|
1316
1081
|
Object.assign(ICONS, { "burger-menu": ICONS["burger-menu-mobile"] });
|
|
1317
1082
|
Object.assign(ICONS, { "burger-menu-filled": ICONS["burger-menu-mobile-filled"] });
|
|
1318
1083
|
|
|
1319
|
-
const stylesCss$
|
|
1320
|
-
const ZIconStyle0 = stylesCss$
|
|
1084
|
+
const stylesCss$7 = ":host{margin-right:var(--z-icon-right-margin, 0);margin-left:var(--z-icon-left-margin, 0);line-height:0;vertical-align:middle}:host svg:not([width]){width:var(--z-icon-width, 18px)}:host svg:not([height]){height:var(--z-icon-height, 18px)}";
|
|
1085
|
+
const ZIconStyle0 = stylesCss$7;
|
|
1321
1086
|
|
|
1322
1087
|
const ZIcon = class {
|
|
1323
1088
|
constructor(hostRef) {
|
|
@@ -1340,16 +1105,16 @@ const ZIcon = class {
|
|
|
1340
1105
|
};
|
|
1341
1106
|
ZIcon.style = ZIconStyle0;
|
|
1342
1107
|
|
|
1343
|
-
const stylesGeneralCss = ".sc-z-input-h{display:inline-block;width:inherit}input.sc-z-input::-ms-clear,input.sc-z-input::-ms-reveal{display:none}.sc-z-input-h input.sc-z-input::-ms-clear,.sc-z-input-h input.sc-z-input::-ms-reveal{display:none}input.sc-z-input,textarea.sc-z-input,.textarea-wrapper.sc-z-input{-webkit-box-sizing:border-box;box-sizing:border-box;border:var(--border-size-small) solid var(--gray700);background:var(--color-input-field01);border-radius:var(--border-radius-small);color:var(--gray900);fill:var(--gray900);font-family:var(--font-family-sans);font-size:var(--font-size-3);font-weight:var(--font-rg);outline:none}[size=\"small\"].sc-z-input-h input.sc-z-input,[size=\"small\"].sc-z-input-h textarea.sc-z-input,[size=\"small\"].sc-z-input-h .textarea-wrapper.sc-z-input,[size=\"x-small\"].sc-z-input-h input.sc-z-input,[size=\"x-small\"].sc-z-input-h textarea.sc-z-input,[size=\"x-small\"].sc-z-input-h .textarea-wrapper.sc-z-input{font-size:var(--font-size-2)}.cursor-select.sc-z-input-h input.sc-z-input{cursor:pointer}.sc-z-input-h:not(.active-select) input.sc-z-input:focus:focus-visible
|
|
1108
|
+
const stylesGeneralCss = ".sc-z-input-h{display:inline-block;width:inherit}input.sc-z-input::-ms-clear,input.sc-z-input::-ms-reveal{display:none}.sc-z-input-h input.sc-z-input::-ms-clear,.sc-z-input-h input.sc-z-input::-ms-reveal{display:none}input.sc-z-input,textarea.sc-z-input,.textarea-wrapper.sc-z-input{-webkit-box-sizing:border-box;box-sizing:border-box;border:var(--border-size-small) solid var(--gray700);background:var(--color-input-field01);border-radius:var(--border-radius-small);color:var(--gray900);fill:var(--gray900);font-family:var(--font-family-sans);font-size:var(--font-size-3);font-weight:var(--font-rg);outline:none}[size=\"small\"].sc-z-input-h input.sc-z-input,[size=\"small\"].sc-z-input-h textarea.sc-z-input,[size=\"small\"].sc-z-input-h .textarea-wrapper.sc-z-input,[size=\"x-small\"].sc-z-input-h input.sc-z-input,[size=\"x-small\"].sc-z-input-h textarea.sc-z-input,[size=\"x-small\"].sc-z-input-h .textarea-wrapper.sc-z-input{font-size:var(--font-size-2)}.cursor-select.sc-z-input-h input.sc-z-input{cursor:pointer}.sc-z-input-h:not(.active-select) input.sc-z-input:focus:focus-visible,.sc-z-input-h:not([readonly=\"true\"]) .textarea-wrapper.sc-z-input:focus-within{-webkit-box-shadow:var(--shadow-focus-primary);box-shadow:var(--shadow-focus-primary)}input.sc-z-input:focus:focus-visible,textarea.sc-z-input:focus:focus-visible{color:var(--color-input-field02)}.active-select.sc-z-input-h input.sc-z-input{border:var(--border-size-small) solid var(--color-primary01)}.cursor-select.sc-z-input-h input.sc-z-input:focus:focus-visible{-webkit-box-shadow:var(--shadow-focus-primary);box-shadow:var(--shadow-focus-primary)}.sc-z-input-h input[readonly].sc-z-input:focus:focus-visible{-webkit-box-shadow:none;box-shadow:none}.filled.sc-z-input{border-color:var(--color-surface05)}.input-success.sc-z-input{border-color:var(--color-success01);background:var(--color-success-inverse);fill:var(--color-success01)}.input-error.sc-z-input{border-color:var(--color-error01);background:var(--color-error-inverse);fill:var(--color-error01)}.input-warning.sc-z-input{border-color:var(--color-warning01);background:var(--color-warning-inverse);fill:var(--color-warning01)}input.sc-z-input:not([readonly]):hover,.textarea-wrapper.sc-z-input:hover{outline:var(--border-size-medium) solid var(--gray700);outline-offset:-2px}.sc-z-input-h:not(.active-select) input[readonly].sc-z-input,.readonly.sc-z-input{border-color:var(--color-disabled01);fill:var(--color-disabled01);pointer-events:none}[disabled].sc-z-input-h:not([disabled=\"false\"]) input.sc-z-input,[disabled].sc-z-input-h:not([disabled=\"false\"]) .textarea-wrapper.sc-z-input,[disabled].sc-z-input-h:not([disabled=\"false\"]) z-icon.sc-z-input{border-color:var(--color-disabled01);-webkit-box-shadow:none;box-shadow:none;color:var(--color-disabled03);fill:var(--color-disabled01);pointer-events:none}[disabled].sc-z-input-h:not([disabled=\"false\"]) input.sc-z-input:hover{border-width:var(--border-size-small)}input.sc-z-input::-webkit-input-placeholder,textarea.sc-z-input::-webkit-input-placeholder{color:var(--color-text05)}input.sc-z-input::-moz-placeholder,textarea.sc-z-input::-moz-placeholder{color:var(--color-text05)}input.sc-z-input:-ms-input-placeholder,textarea.sc-z-input:-ms-input-placeholder{color:var(--color-text05)}input.sc-z-input::-ms-input-placeholder,textarea.sc-z-input::-ms-input-placeholder{color:var(--color-text05)}input.sc-z-input::placeholder,textarea.sc-z-input::placeholder{color:var(--color-text05)}.sc-z-input::-webkit-textarea-placeholder{color:var(--color-text05)}.sc-z-input:-ms-textarea-placeholder{color:var(--color-text05)}.sc-z-input::-webkit-input-placeholder{color:var(--color-text05)}.sc-z-input::-moz-placeholder{color:var(--color-text05)}.sc-z-input:-ms-input-placeholder{color:var(--color-text05)}.sc-z-input::-ms-input-placeholder{color:var(--color-text05)}.sc-z-input::placeholder{color:var(--color-text05)}label.input-label.sc-z-input{display:block;padding-bottom:var(--space-unit);color:var(--color-default-text);font-family:var(--font-family-sans);font-size:var(--font-size-1);font-weight:var(--font-sb);text-align:left;text-transform:uppercase}[disabled].sc-z-input-h:not([disabled=\"false\"]) label.input-label.sc-z-input{color:var(--color-disabled03)}";
|
|
1344
1109
|
const ZInputStyle0 = stylesGeneralCss;
|
|
1345
1110
|
|
|
1346
|
-
const stylesTextCss = ".text-wrapper.sc-z-input>div.sc-z-input{position:relative;z-index:1;fill:var(--gray900)}.text-wrapper.sc-z-input>div.sc-z-input>input.sc-z-input{width:100%;height:calc(var(--space-unit) * 5.5);-webkit-box-sizing:border-box;box-sizing:border-box;padding:0 calc(var(--space-unit) * 1.5);margin:0}[size=\"small\"].sc-z-input-h .text-wrapper.sc-z-input>div.sc-z-input>input.sc-z-input{height:calc(var(--space-unit) * 4.5)}[size=\"x-small\"].sc-z-input-h .text-wrapper.sc-z-input>div.sc-z-input>input.sc-z-input{height:calc(var(--space-unit) * 4)}.text-wrapper.sc-z-input>div.sc-z-input>input.has-icon.sc-z-input,.text-wrapper.sc-z-input>div.sc-z-input>input.has-clear-icon.sc-z-input{padding-right:calc(var(--space-unit) * 5.25)}.text-wrapper.sc-z-input>div.sc-z-input>input.has-icon.has-clear-icon.sc-z-input{padding-right:calc(var(--space-unit) * 8)}.text-wrapper.sc-z-input .icons-wrapper.sc-z-input{position:absolute;z-index:2;top:50%;right:calc(var(--space-unit) * 1.5);display:-ms-flexbox;display:flex;pointer-events:none;-webkit-transform:translateY(-50%);transform:translateY(-50%)}.text-wrapper.sc-z-input .icons-wrapper.sc-z-input>button.icon-button.sc-z-input{padding:0;border:0;background:none;color:inherit;font:inherit;pointer-events:initial}.text-wrapper.sc-z-input .icons-wrapper.sc-z-input>button.icon-button.sc-z-input+button.icon-button.sc-z-input{margin-left:calc(var(--space-unit) * 0.5)}.text-wrapper.sc-z-input .icons-wrapper.sc-z-input>button.icon-button.hidden.sc-z-input{display:none}.text-wrapper.sc-z-input .icons-wrapper.sc-z-input>button.icon-button.reset-icon.sc-z-input,.text-wrapper.sc-z-input .icons-wrapper.sc-z-input>button.icon-button.toggle-password-icon.sc-z-input{cursor:pointer}.text-wrapper.sc-z-input .icons-wrapper.sc-z-input>button.icon-button.sc-z-input>z-icon.sc-z-input{--z-icon-width:18px;--z-icon-height:18px;display:block}.text-wrapper.sc-z-input .icons-wrapper.sc-z-input>button.icon-button.sc-z-input>z-icon.small.sc-z-input,.text-wrapper.sc-z-input .icons-wrapper.sc-z-input>button.icon-button.sc-z-input>z-icon.x-small.sc-z-input{--z-icon-width:16px;--z-icon-height:16px}.text-wrapper.sc-z-input>div.sc-z-input>input.sc-z-input:-webkit-autofill{-webkit-box-shadow:0 0 0 1000px #fff inset;-webkit-text-fill-color:currentcolor}";
|
|
1111
|
+
const stylesTextCss = ".text-wrapper.sc-z-input>div.sc-z-input{position:relative;z-index:1;fill:var(--gray900)}.text-wrapper.sc-z-input>div.sc-z-input>input.sc-z-input{width:100%;height:calc(var(--space-unit) * 5.5);-webkit-box-sizing:border-box;box-sizing:border-box;padding:0 calc(var(--space-unit) * 1.5);margin:0}[size=\"small\"].sc-z-input-h .text-wrapper.sc-z-input>div.sc-z-input>input.sc-z-input{height:calc(var(--space-unit) * 4.5)}[size=\"x-small\"].sc-z-input-h .text-wrapper.sc-z-input>div.sc-z-input>input.sc-z-input{height:calc(var(--space-unit) * 4)}.text-wrapper.sc-z-input>div.sc-z-input>input.has-icon.sc-z-input,.text-wrapper.sc-z-input>div.sc-z-input>input.has-clear-icon.sc-z-input{padding-right:calc(var(--space-unit) * 5.25)}.text-wrapper.sc-z-input>div.sc-z-input>input.has-icon.has-clear-icon.sc-z-input{padding-right:calc(var(--space-unit) * 8)}.text-wrapper.sc-z-input .icons-wrapper.sc-z-input{position:absolute;z-index:2;top:50%;right:calc(var(--space-unit) * 1.5);display:-ms-flexbox;display:flex;pointer-events:none;-webkit-transform:translateY(-50%);transform:translateY(-50%)}.text-wrapper.sc-z-input .icons-wrapper.sc-z-input>button.icon-button.sc-z-input{padding:0;border:0;background:none;color:inherit;font:inherit;pointer-events:initial}.text-wrapper.sc-z-input .icons-wrapper.sc-z-input>button.icon-button.sc-z-input+button.icon-button.sc-z-input{margin-left:calc(var(--space-unit) * 0.5)}.text-wrapper.sc-z-input .icons-wrapper.sc-z-input>button.icon-button.hidden.sc-z-input{display:none}.text-wrapper.sc-z-input .icons-wrapper.sc-z-input>button.icon-button.reset-icon.sc-z-input,.text-wrapper.sc-z-input .icons-wrapper.sc-z-input>button.icon-button.toggle-password-icon.sc-z-input{cursor:pointer}.text-wrapper.sc-z-input .icons-wrapper.sc-z-input>button.icon-button.sc-z-input>z-icon.sc-z-input{--z-icon-width:18px;--z-icon-height:18px;display:block}.text-wrapper.sc-z-input .icons-wrapper.sc-z-input>button.icon-button.sc-z-input>z-icon.small.sc-z-input,.text-wrapper.sc-z-input .icons-wrapper.sc-z-input>button.icon-button.sc-z-input>z-icon.x-small.sc-z-input{--z-icon-width:16px;--z-icon-height:16px}.text-wrapper.sc-z-input .icons-wrapper.sc-z-input>button.icon-button.sc-z-input:focus{-webkit-box-shadow:var(--shadow-focus-primary);box-shadow:var(--shadow-focus-primary);outline:none !important}.text-wrapper.sc-z-input>div.sc-z-input>input.sc-z-input:-webkit-autofill{-webkit-box-shadow:0 0 0 1000px #fff inset;-webkit-text-fill-color:currentcolor}";
|
|
1347
1112
|
const ZInputStyle1 = stylesTextCss;
|
|
1348
1113
|
|
|
1349
1114
|
const stylesTextareaCss = ".textarea-wrapper.sc-z-input{padding:calc(var(--space-unit) * 1.5);scrollbar-color:var(--color-primary01) transparent}textarea.sc-z-input::-webkit-scrollbar{width:10px;background:linear-gradient(to right, transparent 0 3px, var(--gray200) 3px 7px, transparent 7px 10px);border-radius:var(--border-radius)}textarea.sc-z-input::-webkit-scrollbar-track{background-color:transparent}textarea.sc-z-input::-webkit-scrollbar-thumb{width:10px;background-color:var(--color-primary01);border-radius:var(--border-radius)}textarea.sc-z-input::-webkit-scrollbar-thumb:hover{background-color:var(--color-hover-primary)}textarea.sc-z-input{width:100%;min-height:132px;padding:0;border:none;margin:0;resize:none}";
|
|
1350
1115
|
const ZInputStyle2 = stylesTextareaCss;
|
|
1351
1116
|
|
|
1352
|
-
const stylesCheckboxRadioCss = ".radio-wrapper.sc-z-input,.checkbox-wrapper.sc-z-input{position:relative;display:-ms-inline-flexbox;display:inline-flex;-ms-flex-direction:row;flex-direction:row;-ms-flex-align:center;align-items:center;color:var(--color-default-text);fill:var(--color-primary01);font-family:var(--font-family-sans)}.radio-wrapper.sc-z-input:hover,.checkbox-wrapper.sc-z-input:hover{color:var(--color-hover-primary);fill:currentcolor}.radio-wrapper.sc-z-input>input.sc-z-input,.checkbox-wrapper.sc-z-input>input.sc-z-input{position:absolute;z-index:-1;opacity:0;pointer-events:none}.radio-wrapper.sc-z-input .radio-label.sc-z-input,.checkbox-wrapper.sc-z-input .checkbox-label.sc-z-input{display:-ms-inline-flexbox;display:inline-flex;-ms-flex-align:center;align-items:center;margin:0;color:inherit;font-family:inherit;font-size:inherit;font-weight:inherit;line-height:1;text-transform:inherit}.radio-wrapper.sc-z-input input.sc-z-input:not(:disabled)+.radio-label.sc-z-input,.checkbox-wrapper.sc-z-input input.sc-z-input:not(:disabled)+.checkbox-label.sc-z-input{cursor:pointer}.radio-wrapper.sc-z-input .radio-label.sc-z-input z-icon.sc-z-input,.checkbox-wrapper.sc-z-input .checkbox-label.sc-z-input z-icon.sc-z-input{cursor:pointer;fill:inherit}[size=\"small\"].sc-z-input-h .radio-wrapper.sc-z-input .radio-label.sc-z-input z-icon.sc-z-input,[size=\"small\"].sc-z-input-h .checkbox-wrapper.sc-z-input .checkbox-label.sc-z-input z-icon.sc-z-input{--z-icon-width:16px;--z-icon-height:16px}[size=\"small\"].sc-z-input-h .radio-wrapper.sc-z-input .radio-label.sc-z-input,[size=\"small\"].sc-z-input-h .checkbox-wrapper.sc-z-input .checkbox-label.sc-z-input{font-size:var(--font-size-2)}[size=\"x-small\"].sc-z-input-h .radio-wrapper.sc-z-input .radio-label.sc-z-input z-icon.sc-z-input,[size=\"x-small\"].sc-z-input-h .checkbox-wrapper.sc-z-input .checkbox-label.sc-z-input z-icon.sc-z-input{--z-icon-width:14px;--z-icon-height:14px}[size=\"x-small\"].sc-z-input-h .radio-wrapper.sc-z-input .radio-label.sc-z-input,[size=\"x-small\"].sc-z-input-h .checkbox-wrapper.sc-z-input .checkbox-label.sc-z-input{font-size:var(--font-size-1)}.radio-wrapper.sc-z-input .radio-label.after.sc-z-input,.checkbox-wrapper.sc-z-input .checkbox-label.after.sc-z-input{-ms-flex-direction:row;flex-direction:row}.radio-wrapper.sc-z-input .radio-label.before.sc-z-input,.checkbox-wrapper.sc-z-input .checkbox-label.before.sc-z-input{-ms-flex-direction:row-reverse;flex-direction:row-reverse}.radio-wrapper.sc-z-input .radio-label.after.sc-z-input>span.sc-z-input,.checkbox-wrapper.sc-z-input .checkbox-label.after.sc-z-input>span.sc-z-input{margin-left:var(--space-unit)}.radio-wrapper.sc-z-input .radio-label.before.sc-z-input>span.sc-z-input,.checkbox-wrapper.sc-z-input .checkbox-label.before.sc-z-input>span.sc-z-input{margin-right:var(--space-unit)}[size=\"small\"].sc-z-input-h .radio-wrapper.sc-z-input .radio-label.after.sc-z-input>span.sc-z-input,[size=\"small\"].sc-z-input-h .checkbox-wrapper.sc-z-input .checkbox-label.after.sc-z-input>span.sc-z-input,[size=\"x-small\"].sc-z-input-h .radio-wrapper.sc-z-input .radio-label.after.sc-z-input>span.sc-z-input,[size=\"x-small\"].sc-z-input-h .checkbox-wrapper.sc-z-input .checkbox-label.after.sc-z-input>span.sc-z-input{margin-left:calc(var(--space-unit) * 0.5)}[size=\"small\"].sc-z-input-h .radio-wrapper.sc-z-input .radio-label.before.sc-z-input>span.sc-z-input,[size=\"small\"].sc-z-input-h .checkbox-wrapper.sc-z-input .checkbox-label.before.sc-z-input>span.sc-z-input,[size=\"x-small\"].sc-z-input-h .radio-wrapper.sc-z-input .radio-label.before.sc-z-input>span.sc-z-input,[size=\"x-small\"].sc-z-input-h .checkbox-wrapper.sc-z-input .checkbox-label.before.sc-z-input>span.sc-z-input{margin-right:calc(var(--space-unit) * 0.5)}.radio-wrapper.sc-z-input>input.sc-z-input:focus:focus-visible+.radio-label.sc-z-input>z-icon.sc-z-input
|
|
1117
|
+
const stylesCheckboxRadioCss = ".radio-wrapper.sc-z-input,.checkbox-wrapper.sc-z-input{position:relative;display:-ms-inline-flexbox;display:inline-flex;-ms-flex-direction:row;flex-direction:row;-ms-flex-align:center;align-items:center;color:var(--color-default-text);fill:var(--color-primary01);font-family:var(--font-family-sans)}.radio-wrapper.sc-z-input:hover,.checkbox-wrapper.sc-z-input:hover{color:var(--color-hover-primary);fill:currentcolor}.radio-wrapper.sc-z-input>input.sc-z-input,.checkbox-wrapper.sc-z-input>input.sc-z-input{position:absolute;z-index:-1;opacity:0;pointer-events:none}.radio-wrapper.sc-z-input .radio-label.sc-z-input,.checkbox-wrapper.sc-z-input .checkbox-label.sc-z-input{display:-ms-inline-flexbox;display:inline-flex;-ms-flex-align:center;align-items:center;margin:0;color:inherit;font-family:inherit;font-size:inherit;font-weight:inherit;line-height:1;text-transform:inherit}.radio-wrapper.sc-z-input input.sc-z-input:not(:disabled)+.radio-label.sc-z-input,.checkbox-wrapper.sc-z-input input.sc-z-input:not(:disabled)+.checkbox-label.sc-z-input{cursor:pointer}.radio-wrapper.sc-z-input .radio-label.sc-z-input z-icon.sc-z-input,.checkbox-wrapper.sc-z-input .checkbox-label.sc-z-input z-icon.sc-z-input{cursor:pointer;fill:inherit}[size=\"small\"].sc-z-input-h .radio-wrapper.sc-z-input .radio-label.sc-z-input z-icon.sc-z-input,[size=\"small\"].sc-z-input-h .checkbox-wrapper.sc-z-input .checkbox-label.sc-z-input z-icon.sc-z-input{--z-icon-width:16px;--z-icon-height:16px}[size=\"small\"].sc-z-input-h .radio-wrapper.sc-z-input .radio-label.sc-z-input,[size=\"small\"].sc-z-input-h .checkbox-wrapper.sc-z-input .checkbox-label.sc-z-input{font-size:var(--font-size-2)}[size=\"x-small\"].sc-z-input-h .radio-wrapper.sc-z-input .radio-label.sc-z-input z-icon.sc-z-input,[size=\"x-small\"].sc-z-input-h .checkbox-wrapper.sc-z-input .checkbox-label.sc-z-input z-icon.sc-z-input{--z-icon-width:14px;--z-icon-height:14px}[size=\"x-small\"].sc-z-input-h .radio-wrapper.sc-z-input .radio-label.sc-z-input,[size=\"x-small\"].sc-z-input-h .checkbox-wrapper.sc-z-input .checkbox-label.sc-z-input{font-size:var(--font-size-1)}.radio-wrapper.sc-z-input .radio-label.after.sc-z-input,.checkbox-wrapper.sc-z-input .checkbox-label.after.sc-z-input{-ms-flex-direction:row;flex-direction:row}.radio-wrapper.sc-z-input .radio-label.before.sc-z-input,.checkbox-wrapper.sc-z-input .checkbox-label.before.sc-z-input{-ms-flex-direction:row-reverse;flex-direction:row-reverse}.radio-wrapper.sc-z-input .radio-label.after.sc-z-input>span.sc-z-input,.checkbox-wrapper.sc-z-input .checkbox-label.after.sc-z-input>span.sc-z-input{margin-left:var(--space-unit)}.radio-wrapper.sc-z-input .radio-label.before.sc-z-input>span.sc-z-input,.checkbox-wrapper.sc-z-input .checkbox-label.before.sc-z-input>span.sc-z-input{margin-right:var(--space-unit)}[size=\"small\"].sc-z-input-h .radio-wrapper.sc-z-input .radio-label.after.sc-z-input>span.sc-z-input,[size=\"small\"].sc-z-input-h .checkbox-wrapper.sc-z-input .checkbox-label.after.sc-z-input>span.sc-z-input,[size=\"x-small\"].sc-z-input-h .radio-wrapper.sc-z-input .radio-label.after.sc-z-input>span.sc-z-input,[size=\"x-small\"].sc-z-input-h .checkbox-wrapper.sc-z-input .checkbox-label.after.sc-z-input>span.sc-z-input{margin-left:calc(var(--space-unit) * 0.5)}[size=\"small\"].sc-z-input-h .radio-wrapper.sc-z-input .radio-label.before.sc-z-input>span.sc-z-input,[size=\"small\"].sc-z-input-h .checkbox-wrapper.sc-z-input .checkbox-label.before.sc-z-input>span.sc-z-input,[size=\"x-small\"].sc-z-input-h .radio-wrapper.sc-z-input .radio-label.before.sc-z-input>span.sc-z-input,[size=\"x-small\"].sc-z-input-h .checkbox-wrapper.sc-z-input .checkbox-label.before.sc-z-input>span.sc-z-input{margin-right:calc(var(--space-unit) * 0.5)}.radio-wrapper.sc-z-input>input.sc-z-input:focus:focus-visible+.radio-label.sc-z-input>z-icon.sc-z-input{border-radius:50%}.checkbox-wrapper.sc-z-input>input.sc-z-input:focus:focus-visible+.checkbox-label.sc-z-input>z-icon.sc-z-input{border-radius:var(--border-radius-small)}.radio-wrapper.sc-z-input>input.sc-z-input:focus:focus-visible+.radio-label.sc-z-input>z-icon.sc-z-input,.checkbox-wrapper.sc-z-input>input.sc-z-input:focus:focus-visible+.checkbox-label.sc-z-input>z-icon.sc-z-input{-webkit-box-shadow:var(--shadow-focus-primary);box-shadow:var(--shadow-focus-primary)}.radio-wrapper.sc-z-input>input.sc-z-input:disabled+.radio-label.sc-z-input,.checkbox-wrapper.sc-z-input>input.sc-z-input:disabled+.checkbox-label.sc-z-input{color:var(--color-disabled03)}.radio-wrapper.sc-z-input>input.sc-z-input:disabled+.radio-label.sc-z-input>z-icon.sc-z-input,.checkbox-wrapper.sc-z-input>input.sc-z-input:disabled+.checkbox-label.sc-z-input>z-icon.sc-z-input{cursor:default;fill:var(--color-disabled01)}";
|
|
1353
1118
|
const ZInputStyle3 = stylesCheckboxRadioCss;
|
|
1354
1119
|
|
|
1355
1120
|
const ZInput = class {
|
|
@@ -1624,8 +1389,8 @@ const ZInput = class {
|
|
|
1624
1389
|
};
|
|
1625
1390
|
ZInput.style = ZInputStyle0 + (ZInputStyle1 + (ZInputStyle2 + ZInputStyle3));
|
|
1626
1391
|
|
|
1627
|
-
const stylesCss$
|
|
1628
|
-
const ZInputMessageStyle0 = stylesCss$
|
|
1392
|
+
const stylesCss$6 = ":host{display:-ms-flexbox;display:flex;min-height:calc(var(--space-unit) * 2.5);-ms-flex-align:start;align-items:start;margin-top:var(--space-unit);color:var(--color-text05);fill:currentcolor;font-family:var(--font-family-sans);font-size:var(--font-size-2);letter-spacing:0.16px}:host(.small),:host(.x-small){margin-top:calc(var(--space-unit) * 0.5);font-size:var(--font-size-1)}:host([status=\"success\"]){color:var(--color-text-success)}:host([status=\"error\"]){color:var(--color-text-error)}:host([status=\"warning\"]){color:var(--color-warning02)}:host(:focus){outline:none}:host>z-icon{--z-icon-width:calc(var(--space-unit) * 2);--z-icon-height:calc(var(--space-unit) * 2);--z-icon-right-margin:var(--space-unit);margin-top:calc(var(--space-unit) * 0.25)}:host(.small)>z-icon,:host(.x-small)>z-icon{--z-icon-width:14px;--z-icon-height:14px;--z-icon-right-margin:calc(var(--space-unit) * 0.5)}";
|
|
1393
|
+
const ZInputMessageStyle0 = stylesCss$6;
|
|
1629
1394
|
|
|
1630
1395
|
const ZInputMessage = class {
|
|
1631
1396
|
constructor(hostRef) {
|
|
@@ -1655,8 +1420,8 @@ const ZInputMessage = class {
|
|
|
1655
1420
|
};
|
|
1656
1421
|
ZInputMessage.style = ZInputMessageStyle0;
|
|
1657
1422
|
|
|
1658
|
-
const stylesCss$
|
|
1659
|
-
const ZListStyle0 = stylesCss$
|
|
1423
|
+
const stylesCss$5 = ":host{display:-ms-flexbox;display:flex;-ms-flex-direction:column;flex-direction:column;font-family:var(--font-family-sans);font-weight:var(--font-rg)}";
|
|
1424
|
+
const ZListStyle0 = stylesCss$5;
|
|
1660
1425
|
|
|
1661
1426
|
const ZList = class {
|
|
1662
1427
|
constructor(hostRef) {
|
|
@@ -1683,8 +1448,8 @@ const ZList = class {
|
|
|
1683
1448
|
};
|
|
1684
1449
|
ZList.style = ZListStyle0;
|
|
1685
1450
|
|
|
1686
|
-
const stylesCss$
|
|
1687
|
-
const ZListElementStyle0 = stylesCss$
|
|
1451
|
+
const stylesCss$4 = ":host{outline:none}:host>.container{--background-color-list-element:var(--color-surface01);--background-hover-color-list-element:var(--color-surface02);--background-active-color-list-element:var(--color-surface02);display:-ms-flexbox;display:flex;-webkit-box-sizing:border-box;box-sizing:border-box;-ms-flex-direction:column;flex-direction:column;-ms-flex-pack:center;justify-content:center;font-family:var(--font-family-sans);font-weight:var(--font-rg);outline:none}:host([size=\"small\"])>.container{min-height:calc(var(--space-unit) * 4);padding:calc(var(--space-unit) / 2) 0}:host([size=\"medium\"])>.container{min-height:calc(var(--space-unit) * 5);padding:var(--space-unit) 0}:host([size=\"large\"])>.container{min-height:calc(var(--space-unit) * 7);padding:calc(var(--space-unit) * 2) 0}:host([size=\"x-large\"])>.container{min-height:calc(var(--space-unit) * 9);padding:calc(var(--space-unit) * 3) 0}:host([expandable])>.container,:host([clickable])>.container{cursor:pointer}:host([expandable]:hover)>.container,:host([clickable]:hover)>.container{background-color:var(--background-hover-color-list-element)}:host([expandable]:focus:focus-visible)>.container,:host([clickable]:focus:focus-visible)>.container{-webkit-box-shadow:var(--shadow-focus-primary);box-shadow:var(--shadow-focus-primary)}:host([clickable]:not([expandable]))>.container.clicked{-webkit-box-shadow:var(--shadow-focus-primary);box-shadow:var(--shadow-focus-primary)}:host([expandable]:active)>.container,:host([clickable]:active)>.container{background-color:var(--background-active-color-list-element)}:host([align-button=\"left\"][expandable])>.container>.z-list-element-container{display:-ms-flexbox;display:flex}:host([align-button=\"right\"][expandable])>.container>.z-list-element-container{display:-ms-flexbox;display:flex;-ms-flex-direction:row-reverse;flex-direction:row-reverse;-ms-flex-pack:justify;justify-content:space-between}:host([align-button=\"left\"][expandable])>.container>.z-list-element-container>z-icon{margin-right:var(--space-unit)}:host([align-button=\"right\"][expandable])>.container>.z-list-element-container>z-icon{margin-left:var(--space-unit)}:host>.container>.z-list-element-inner-container{display:none}:host>.container>.z-list-element-inner-container.expanded{display:block}.z-list-content-container{display:-ms-flexbox;display:flex;-ms-flex-align:center;align-items:center}";
|
|
1452
|
+
const ZListElementStyle0 = stylesCss$4;
|
|
1688
1453
|
|
|
1689
1454
|
const ZListElement = class {
|
|
1690
1455
|
accessibleFocusHandler(e) {
|
|
@@ -1809,8 +1574,8 @@ const ZListElement = class {
|
|
|
1809
1574
|
};
|
|
1810
1575
|
ZListElement.style = ZListElementStyle0;
|
|
1811
1576
|
|
|
1812
|
-
const stylesCss$
|
|
1813
|
-
const ZListGroupStyle0 = stylesCss$
|
|
1577
|
+
const stylesCss$3 = ":host{font-family:var(--font-family-sans);font-weight:var(--font-rg)}:host>.z-list-group-header-container{color:var(--gray700);font-size:var(--font-size-2);font-weight:var(--font-sb) !important;letter-spacing:0.16px;line-height:1.4}:host>.z-list-group-header-container.has-header{padding-top:var(--space-unit);padding-bottom:var(--space-unit)}:host>.z-list-group-header-container.has-header>z-divider{margin-top:var(--space-unit)}";
|
|
1578
|
+
const ZListGroupStyle0 = stylesCss$3;
|
|
1814
1579
|
|
|
1815
1580
|
const ZListGroup = class {
|
|
1816
1581
|
constructor(hostRef) {
|
|
@@ -1847,987 +1612,6 @@ const ZListGroup = class {
|
|
|
1847
1612
|
};
|
|
1848
1613
|
ZListGroup.style = ZListGroupStyle0;
|
|
1849
1614
|
|
|
1850
|
-
// nb. This is for IE10 and lower _only_.
|
|
1851
|
-
var supportCustomEvent = window.CustomEvent;
|
|
1852
|
-
if (!supportCustomEvent || typeof supportCustomEvent === 'object') {
|
|
1853
|
-
supportCustomEvent = function CustomEvent(event, x) {
|
|
1854
|
-
x = x || {};
|
|
1855
|
-
var ev = document.createEvent('CustomEvent');
|
|
1856
|
-
ev.initCustomEvent(event, !!x.bubbles, !!x.cancelable, x.detail || null);
|
|
1857
|
-
return ev;
|
|
1858
|
-
};
|
|
1859
|
-
supportCustomEvent.prototype = window.Event.prototype;
|
|
1860
|
-
}
|
|
1861
|
-
|
|
1862
|
-
/**
|
|
1863
|
-
* Dispatches the passed event to both an "on<type>" handler as well as via the
|
|
1864
|
-
* normal dispatch operation. Does not bubble.
|
|
1865
|
-
*
|
|
1866
|
-
* @param {!EventTarget} target
|
|
1867
|
-
* @param {!Event} event
|
|
1868
|
-
* @return {boolean}
|
|
1869
|
-
*/
|
|
1870
|
-
function safeDispatchEvent(target, event) {
|
|
1871
|
-
var check = 'on' + event.type.toLowerCase();
|
|
1872
|
-
if (typeof target[check] === 'function') {
|
|
1873
|
-
target[check](event);
|
|
1874
|
-
}
|
|
1875
|
-
return target.dispatchEvent(event);
|
|
1876
|
-
}
|
|
1877
|
-
|
|
1878
|
-
/**
|
|
1879
|
-
* @param {Element} el to check for stacking context
|
|
1880
|
-
* @return {boolean} whether this el or its parents creates a stacking context
|
|
1881
|
-
*/
|
|
1882
|
-
function createsStackingContext(el) {
|
|
1883
|
-
while (el && el !== document.body) {
|
|
1884
|
-
var s = window.getComputedStyle(el);
|
|
1885
|
-
var invalid = function(k, ok) {
|
|
1886
|
-
return !(s[k] === undefined || s[k] === ok);
|
|
1887
|
-
};
|
|
1888
|
-
|
|
1889
|
-
if (s.opacity < 1 ||
|
|
1890
|
-
invalid('zIndex', 'auto') ||
|
|
1891
|
-
invalid('transform', 'none') ||
|
|
1892
|
-
invalid('mixBlendMode', 'normal') ||
|
|
1893
|
-
invalid('filter', 'none') ||
|
|
1894
|
-
invalid('perspective', 'none') ||
|
|
1895
|
-
s['isolation'] === 'isolate' ||
|
|
1896
|
-
s.position === 'fixed' ||
|
|
1897
|
-
s.webkitOverflowScrolling === 'touch') {
|
|
1898
|
-
return true;
|
|
1899
|
-
}
|
|
1900
|
-
el = el.parentElement;
|
|
1901
|
-
}
|
|
1902
|
-
return false;
|
|
1903
|
-
}
|
|
1904
|
-
|
|
1905
|
-
/**
|
|
1906
|
-
* Finds the nearest <dialog> from the passed element.
|
|
1907
|
-
*
|
|
1908
|
-
* @param {Element} el to search from
|
|
1909
|
-
* @return {HTMLDialogElement} dialog found
|
|
1910
|
-
*/
|
|
1911
|
-
function findNearestDialog(el) {
|
|
1912
|
-
while (el) {
|
|
1913
|
-
if (el.localName === 'dialog') {
|
|
1914
|
-
return /** @type {HTMLDialogElement} */ (el);
|
|
1915
|
-
}
|
|
1916
|
-
if (el.parentElement) {
|
|
1917
|
-
el = el.parentElement;
|
|
1918
|
-
} else if (el.parentNode) {
|
|
1919
|
-
el = el.parentNode.host;
|
|
1920
|
-
} else {
|
|
1921
|
-
el = null;
|
|
1922
|
-
}
|
|
1923
|
-
}
|
|
1924
|
-
return null;
|
|
1925
|
-
}
|
|
1926
|
-
|
|
1927
|
-
/**
|
|
1928
|
-
* Blur the specified element, as long as it's not the HTML body element.
|
|
1929
|
-
* This works around an IE9/10 bug - blurring the body causes Windows to
|
|
1930
|
-
* blur the whole application.
|
|
1931
|
-
*
|
|
1932
|
-
* @param {Element} el to blur
|
|
1933
|
-
*/
|
|
1934
|
-
function safeBlur(el) {
|
|
1935
|
-
// Find the actual focused element when the active element is inside a shadow root
|
|
1936
|
-
while (el && el.shadowRoot && el.shadowRoot.activeElement) {
|
|
1937
|
-
el = el.shadowRoot.activeElement;
|
|
1938
|
-
}
|
|
1939
|
-
|
|
1940
|
-
if (el && el.blur && el !== document.body) {
|
|
1941
|
-
el.blur();
|
|
1942
|
-
}
|
|
1943
|
-
}
|
|
1944
|
-
|
|
1945
|
-
/**
|
|
1946
|
-
* @param {!NodeList} nodeList to search
|
|
1947
|
-
* @param {Node} node to find
|
|
1948
|
-
* @return {boolean} whether node is inside nodeList
|
|
1949
|
-
*/
|
|
1950
|
-
function inNodeList(nodeList, node) {
|
|
1951
|
-
for (var i = 0; i < nodeList.length; ++i) {
|
|
1952
|
-
if (nodeList[i] === node) {
|
|
1953
|
-
return true;
|
|
1954
|
-
}
|
|
1955
|
-
}
|
|
1956
|
-
return false;
|
|
1957
|
-
}
|
|
1958
|
-
|
|
1959
|
-
/**
|
|
1960
|
-
* @param {HTMLFormElement} el to check
|
|
1961
|
-
* @return {boolean} whether this form has method="dialog"
|
|
1962
|
-
*/
|
|
1963
|
-
function isFormMethodDialog(el) {
|
|
1964
|
-
if (!el || !el.hasAttribute('method')) {
|
|
1965
|
-
return false;
|
|
1966
|
-
}
|
|
1967
|
-
return el.getAttribute('method').toLowerCase() === 'dialog';
|
|
1968
|
-
}
|
|
1969
|
-
|
|
1970
|
-
/**
|
|
1971
|
-
* @param {!DocumentFragment|!Element} hostElement
|
|
1972
|
-
* @return {?Element}
|
|
1973
|
-
*/
|
|
1974
|
-
function findFocusableElementWithin(hostElement) {
|
|
1975
|
-
// Note that this is 'any focusable area'. This list is probably not exhaustive, but the
|
|
1976
|
-
// alternative involves stepping through and trying to focus everything.
|
|
1977
|
-
var opts = ['button', 'input', 'keygen', 'select', 'textarea'];
|
|
1978
|
-
var query = opts.map(function(el) {
|
|
1979
|
-
return el + ':not([disabled])';
|
|
1980
|
-
});
|
|
1981
|
-
// TODO(samthor): tabindex values that are not numeric are not focusable.
|
|
1982
|
-
query.push('[tabindex]:not([disabled]):not([tabindex=""])'); // tabindex != "", not disabled
|
|
1983
|
-
var target = hostElement.querySelector(query.join(', '));
|
|
1984
|
-
|
|
1985
|
-
if (!target && 'attachShadow' in Element.prototype) {
|
|
1986
|
-
// If we haven't found a focusable target, see if the host element contains an element
|
|
1987
|
-
// which has a shadowRoot.
|
|
1988
|
-
// Recursively search for the first focusable item in shadow roots.
|
|
1989
|
-
var elems = hostElement.querySelectorAll('*');
|
|
1990
|
-
for (var i = 0; i < elems.length; i++) {
|
|
1991
|
-
if (elems[i].tagName && elems[i].shadowRoot) {
|
|
1992
|
-
target = findFocusableElementWithin(elems[i].shadowRoot);
|
|
1993
|
-
if (target) {
|
|
1994
|
-
break;
|
|
1995
|
-
}
|
|
1996
|
-
}
|
|
1997
|
-
}
|
|
1998
|
-
}
|
|
1999
|
-
return target;
|
|
2000
|
-
}
|
|
2001
|
-
|
|
2002
|
-
/**
|
|
2003
|
-
* Determines if an element is attached to the DOM.
|
|
2004
|
-
* @param {Element} element to check
|
|
2005
|
-
* @return {boolean} whether the element is in DOM
|
|
2006
|
-
*/
|
|
2007
|
-
function isConnected(element) {
|
|
2008
|
-
return element.isConnected || document.body.contains(element);
|
|
2009
|
-
}
|
|
2010
|
-
|
|
2011
|
-
/**
|
|
2012
|
-
* @param {!Event} event
|
|
2013
|
-
* @return {?Element}
|
|
2014
|
-
*/
|
|
2015
|
-
function findFormSubmitter(event) {
|
|
2016
|
-
if (event.submitter) {
|
|
2017
|
-
return event.submitter;
|
|
2018
|
-
}
|
|
2019
|
-
|
|
2020
|
-
var form = event.target;
|
|
2021
|
-
if (!(form instanceof HTMLFormElement)) {
|
|
2022
|
-
return null;
|
|
2023
|
-
}
|
|
2024
|
-
|
|
2025
|
-
var submitter = dialogPolyfill.formSubmitter;
|
|
2026
|
-
if (!submitter) {
|
|
2027
|
-
var target = event.target;
|
|
2028
|
-
var root = ('getRootNode' in target && target.getRootNode() || document);
|
|
2029
|
-
submitter = root.activeElement;
|
|
2030
|
-
}
|
|
2031
|
-
|
|
2032
|
-
if (!submitter || submitter.form !== form) {
|
|
2033
|
-
return null;
|
|
2034
|
-
}
|
|
2035
|
-
return submitter;
|
|
2036
|
-
}
|
|
2037
|
-
|
|
2038
|
-
/**
|
|
2039
|
-
* @param {!Event} event
|
|
2040
|
-
*/
|
|
2041
|
-
function maybeHandleSubmit(event) {
|
|
2042
|
-
if (event.defaultPrevented) {
|
|
2043
|
-
return;
|
|
2044
|
-
}
|
|
2045
|
-
var form = /** @type {!HTMLFormElement} */ (event.target);
|
|
2046
|
-
|
|
2047
|
-
// We'd have a value if we clicked on an imagemap.
|
|
2048
|
-
var value = dialogPolyfill.imagemapUseValue;
|
|
2049
|
-
var submitter = findFormSubmitter(event);
|
|
2050
|
-
if (value === null && submitter) {
|
|
2051
|
-
value = submitter.value;
|
|
2052
|
-
}
|
|
2053
|
-
|
|
2054
|
-
// There should always be a dialog as this handler is added specifically on them, but check just
|
|
2055
|
-
// in case.
|
|
2056
|
-
var dialog = findNearestDialog(form);
|
|
2057
|
-
if (!dialog) {
|
|
2058
|
-
return;
|
|
2059
|
-
}
|
|
2060
|
-
|
|
2061
|
-
// Prefer formmethod on the button.
|
|
2062
|
-
var formmethod = submitter && submitter.getAttribute('formmethod') || form.getAttribute('method');
|
|
2063
|
-
if (formmethod !== 'dialog') {
|
|
2064
|
-
return;
|
|
2065
|
-
}
|
|
2066
|
-
event.preventDefault();
|
|
2067
|
-
|
|
2068
|
-
if (value != null) {
|
|
2069
|
-
// nb. we explicitly check against null/undefined
|
|
2070
|
-
dialog.close(value);
|
|
2071
|
-
} else {
|
|
2072
|
-
dialog.close();
|
|
2073
|
-
}
|
|
2074
|
-
}
|
|
2075
|
-
|
|
2076
|
-
/**
|
|
2077
|
-
* @param {!HTMLDialogElement} dialog to upgrade
|
|
2078
|
-
* @constructor
|
|
2079
|
-
*/
|
|
2080
|
-
function dialogPolyfillInfo(dialog) {
|
|
2081
|
-
this.dialog_ = dialog;
|
|
2082
|
-
this.replacedStyleTop_ = false;
|
|
2083
|
-
this.openAsModal_ = false;
|
|
2084
|
-
|
|
2085
|
-
// Set a11y role. Browsers that support dialog implicitly know this already.
|
|
2086
|
-
if (!dialog.hasAttribute('role')) {
|
|
2087
|
-
dialog.setAttribute('role', 'dialog');
|
|
2088
|
-
}
|
|
2089
|
-
|
|
2090
|
-
dialog.show = this.show.bind(this);
|
|
2091
|
-
dialog.showModal = this.showModal.bind(this);
|
|
2092
|
-
dialog.close = this.close.bind(this);
|
|
2093
|
-
|
|
2094
|
-
dialog.addEventListener('submit', maybeHandleSubmit, false);
|
|
2095
|
-
|
|
2096
|
-
if (!('returnValue' in dialog)) {
|
|
2097
|
-
dialog.returnValue = '';
|
|
2098
|
-
}
|
|
2099
|
-
|
|
2100
|
-
if ('MutationObserver' in window) {
|
|
2101
|
-
var mo = new MutationObserver(this.maybeHideModal.bind(this));
|
|
2102
|
-
mo.observe(dialog, {attributes: true, attributeFilter: ['open']});
|
|
2103
|
-
} else {
|
|
2104
|
-
// IE10 and below support. Note that DOMNodeRemoved etc fire _before_ removal. They also
|
|
2105
|
-
// seem to fire even if the element was removed as part of a parent removal. Use the removed
|
|
2106
|
-
// events to force downgrade (useful if removed/immediately added).
|
|
2107
|
-
var removed = false;
|
|
2108
|
-
var cb = function() {
|
|
2109
|
-
removed ? this.downgradeModal() : this.maybeHideModal();
|
|
2110
|
-
removed = false;
|
|
2111
|
-
}.bind(this);
|
|
2112
|
-
var timeout;
|
|
2113
|
-
var delayModel = function(ev) {
|
|
2114
|
-
if (ev.target !== dialog) { return; } // not for a child element
|
|
2115
|
-
var cand = 'DOMNodeRemoved';
|
|
2116
|
-
removed |= (ev.type.substr(0, cand.length) === cand);
|
|
2117
|
-
window.clearTimeout(timeout);
|
|
2118
|
-
timeout = window.setTimeout(cb, 0);
|
|
2119
|
-
};
|
|
2120
|
-
['DOMAttrModified', 'DOMNodeRemoved', 'DOMNodeRemovedFromDocument'].forEach(function(name) {
|
|
2121
|
-
dialog.addEventListener(name, delayModel);
|
|
2122
|
-
});
|
|
2123
|
-
}
|
|
2124
|
-
// Note that the DOM is observed inside DialogManager while any dialog
|
|
2125
|
-
// is being displayed as a modal, to catch modal removal from the DOM.
|
|
2126
|
-
|
|
2127
|
-
Object.defineProperty(dialog, 'open', {
|
|
2128
|
-
set: this.setOpen.bind(this),
|
|
2129
|
-
get: dialog.hasAttribute.bind(dialog, 'open')
|
|
2130
|
-
});
|
|
2131
|
-
|
|
2132
|
-
this.backdrop_ = document.createElement('div');
|
|
2133
|
-
this.backdrop_.className = 'backdrop';
|
|
2134
|
-
this.backdrop_.addEventListener('mouseup' , this.backdropMouseEvent_.bind(this));
|
|
2135
|
-
this.backdrop_.addEventListener('mousedown', this.backdropMouseEvent_.bind(this));
|
|
2136
|
-
this.backdrop_.addEventListener('click' , this.backdropMouseEvent_.bind(this));
|
|
2137
|
-
}
|
|
2138
|
-
|
|
2139
|
-
dialogPolyfillInfo.prototype = /** @type {HTMLDialogElement.prototype} */ ({
|
|
2140
|
-
|
|
2141
|
-
get dialog() {
|
|
2142
|
-
return this.dialog_;
|
|
2143
|
-
},
|
|
2144
|
-
|
|
2145
|
-
/**
|
|
2146
|
-
* Maybe remove this dialog from the modal top layer. This is called when
|
|
2147
|
-
* a modal dialog may no longer be tenable, e.g., when the dialog is no
|
|
2148
|
-
* longer open or is no longer part of the DOM.
|
|
2149
|
-
*/
|
|
2150
|
-
maybeHideModal: function() {
|
|
2151
|
-
if (this.dialog_.hasAttribute('open') && isConnected(this.dialog_)) { return; }
|
|
2152
|
-
this.downgradeModal();
|
|
2153
|
-
},
|
|
2154
|
-
|
|
2155
|
-
/**
|
|
2156
|
-
* Remove this dialog from the modal top layer, leaving it as a non-modal.
|
|
2157
|
-
*/
|
|
2158
|
-
downgradeModal: function() {
|
|
2159
|
-
if (!this.openAsModal_) { return; }
|
|
2160
|
-
this.openAsModal_ = false;
|
|
2161
|
-
this.dialog_.style.zIndex = '';
|
|
2162
|
-
|
|
2163
|
-
// This won't match the native <dialog> exactly because if the user set top on a centered
|
|
2164
|
-
// polyfill dialog, that top gets thrown away when the dialog is closed. Not sure it's
|
|
2165
|
-
// possible to polyfill this perfectly.
|
|
2166
|
-
if (this.replacedStyleTop_) {
|
|
2167
|
-
this.dialog_.style.top = '';
|
|
2168
|
-
this.replacedStyleTop_ = false;
|
|
2169
|
-
}
|
|
2170
|
-
|
|
2171
|
-
// Clear the backdrop and remove from the manager.
|
|
2172
|
-
this.backdrop_.parentNode && this.backdrop_.parentNode.removeChild(this.backdrop_);
|
|
2173
|
-
dialogPolyfill.dm.removeDialog(this);
|
|
2174
|
-
},
|
|
2175
|
-
|
|
2176
|
-
/**
|
|
2177
|
-
* @param {boolean} value whether to open or close this dialog
|
|
2178
|
-
*/
|
|
2179
|
-
setOpen: function(value) {
|
|
2180
|
-
if (value) {
|
|
2181
|
-
this.dialog_.hasAttribute('open') || this.dialog_.setAttribute('open', '');
|
|
2182
|
-
} else {
|
|
2183
|
-
this.dialog_.removeAttribute('open');
|
|
2184
|
-
this.maybeHideModal(); // nb. redundant with MutationObserver
|
|
2185
|
-
}
|
|
2186
|
-
},
|
|
2187
|
-
|
|
2188
|
-
/**
|
|
2189
|
-
* Handles mouse events ('mouseup', 'mousedown', 'click') on the fake .backdrop element, redirecting them as if
|
|
2190
|
-
* they were on the dialog itself.
|
|
2191
|
-
*
|
|
2192
|
-
* @param {!Event} e to redirect
|
|
2193
|
-
*/
|
|
2194
|
-
backdropMouseEvent_: function(e) {
|
|
2195
|
-
if (!this.dialog_.hasAttribute('tabindex')) {
|
|
2196
|
-
// Clicking on the backdrop should move the implicit cursor, even if dialog cannot be
|
|
2197
|
-
// focused. Create a fake thing to focus on. If the backdrop was _before_ the dialog, this
|
|
2198
|
-
// would not be needed - clicks would move the implicit cursor there.
|
|
2199
|
-
var fake = document.createElement('div');
|
|
2200
|
-
this.dialog_.insertBefore(fake, this.dialog_.firstChild);
|
|
2201
|
-
fake.tabIndex = -1;
|
|
2202
|
-
fake.focus();
|
|
2203
|
-
this.dialog_.removeChild(fake);
|
|
2204
|
-
} else {
|
|
2205
|
-
this.dialog_.focus();
|
|
2206
|
-
}
|
|
2207
|
-
|
|
2208
|
-
var redirectedEvent = document.createEvent('MouseEvents');
|
|
2209
|
-
redirectedEvent.initMouseEvent(e.type, e.bubbles, e.cancelable, window,
|
|
2210
|
-
e.detail, e.screenX, e.screenY, e.clientX, e.clientY, e.ctrlKey,
|
|
2211
|
-
e.altKey, e.shiftKey, e.metaKey, e.button, e.relatedTarget);
|
|
2212
|
-
this.dialog_.dispatchEvent(redirectedEvent);
|
|
2213
|
-
e.stopPropagation();
|
|
2214
|
-
},
|
|
2215
|
-
|
|
2216
|
-
/**
|
|
2217
|
-
* Focuses on the first focusable element within the dialog. This will always blur the current
|
|
2218
|
-
* focus, even if nothing within the dialog is found.
|
|
2219
|
-
*/
|
|
2220
|
-
focus_: function() {
|
|
2221
|
-
// Find element with `autofocus` attribute, or fall back to the first form/tabindex control.
|
|
2222
|
-
var target = this.dialog_.querySelector('[autofocus]:not([disabled])');
|
|
2223
|
-
if (!target && this.dialog_.tabIndex >= 0) {
|
|
2224
|
-
target = this.dialog_;
|
|
2225
|
-
}
|
|
2226
|
-
if (!target) {
|
|
2227
|
-
target = findFocusableElementWithin(this.dialog_);
|
|
2228
|
-
}
|
|
2229
|
-
safeBlur(document.activeElement);
|
|
2230
|
-
target && target.focus();
|
|
2231
|
-
},
|
|
2232
|
-
|
|
2233
|
-
/**
|
|
2234
|
-
* Sets the zIndex for the backdrop and dialog.
|
|
2235
|
-
*
|
|
2236
|
-
* @param {number} dialogZ
|
|
2237
|
-
* @param {number} backdropZ
|
|
2238
|
-
*/
|
|
2239
|
-
updateZIndex: function(dialogZ, backdropZ) {
|
|
2240
|
-
if (dialogZ < backdropZ) {
|
|
2241
|
-
throw new Error('dialogZ should never be < backdropZ');
|
|
2242
|
-
}
|
|
2243
|
-
this.dialog_.style.zIndex = dialogZ;
|
|
2244
|
-
this.backdrop_.style.zIndex = backdropZ;
|
|
2245
|
-
},
|
|
2246
|
-
|
|
2247
|
-
/**
|
|
2248
|
-
* Shows the dialog. If the dialog is already open, this does nothing.
|
|
2249
|
-
*/
|
|
2250
|
-
show: function() {
|
|
2251
|
-
if (!this.dialog_.open) {
|
|
2252
|
-
this.setOpen(true);
|
|
2253
|
-
this.focus_();
|
|
2254
|
-
}
|
|
2255
|
-
},
|
|
2256
|
-
|
|
2257
|
-
/**
|
|
2258
|
-
* Show this dialog modally.
|
|
2259
|
-
*/
|
|
2260
|
-
showModal: function() {
|
|
2261
|
-
if (this.dialog_.hasAttribute('open')) {
|
|
2262
|
-
throw new Error('Failed to execute \'showModal\' on dialog: The element is already open, and therefore cannot be opened modally.');
|
|
2263
|
-
}
|
|
2264
|
-
if (!isConnected(this.dialog_)) {
|
|
2265
|
-
throw new Error('Failed to execute \'showModal\' on dialog: The element is not in a Document.');
|
|
2266
|
-
}
|
|
2267
|
-
if (!dialogPolyfill.dm.pushDialog(this)) {
|
|
2268
|
-
throw new Error('Failed to execute \'showModal\' on dialog: There are too many open modal dialogs.');
|
|
2269
|
-
}
|
|
2270
|
-
|
|
2271
|
-
if (createsStackingContext(this.dialog_.parentElement)) {
|
|
2272
|
-
console.warn('A dialog is being shown inside a stacking context. ' +
|
|
2273
|
-
'This may cause it to be unusable. For more information, see this link: ' +
|
|
2274
|
-
'https://github.com/GoogleChrome/dialog-polyfill/#stacking-context');
|
|
2275
|
-
}
|
|
2276
|
-
|
|
2277
|
-
this.setOpen(true);
|
|
2278
|
-
this.openAsModal_ = true;
|
|
2279
|
-
|
|
2280
|
-
// Optionally center vertically, relative to the current viewport.
|
|
2281
|
-
if (dialogPolyfill.needsCentering(this.dialog_)) {
|
|
2282
|
-
dialogPolyfill.reposition(this.dialog_);
|
|
2283
|
-
this.replacedStyleTop_ = true;
|
|
2284
|
-
} else {
|
|
2285
|
-
this.replacedStyleTop_ = false;
|
|
2286
|
-
}
|
|
2287
|
-
|
|
2288
|
-
// Insert backdrop.
|
|
2289
|
-
this.dialog_.parentNode.insertBefore(this.backdrop_, this.dialog_.nextSibling);
|
|
2290
|
-
|
|
2291
|
-
// Focus on whatever inside the dialog.
|
|
2292
|
-
this.focus_();
|
|
2293
|
-
},
|
|
2294
|
-
|
|
2295
|
-
/**
|
|
2296
|
-
* Closes this HTMLDialogElement. This is optional vs clearing the open
|
|
2297
|
-
* attribute, however this fires a 'close' event.
|
|
2298
|
-
*
|
|
2299
|
-
* @param {string=} opt_returnValue to use as the returnValue
|
|
2300
|
-
*/
|
|
2301
|
-
close: function(opt_returnValue) {
|
|
2302
|
-
if (!this.dialog_.hasAttribute('open')) {
|
|
2303
|
-
throw new Error('Failed to execute \'close\' on dialog: The element does not have an \'open\' attribute, and therefore cannot be closed.');
|
|
2304
|
-
}
|
|
2305
|
-
this.setOpen(false);
|
|
2306
|
-
|
|
2307
|
-
// Leave returnValue untouched in case it was set directly on the element
|
|
2308
|
-
if (opt_returnValue !== undefined) {
|
|
2309
|
-
this.dialog_.returnValue = opt_returnValue;
|
|
2310
|
-
}
|
|
2311
|
-
|
|
2312
|
-
// Triggering "close" event for any attached listeners on the <dialog>.
|
|
2313
|
-
var closeEvent = new supportCustomEvent('close', {
|
|
2314
|
-
bubbles: false,
|
|
2315
|
-
cancelable: false
|
|
2316
|
-
});
|
|
2317
|
-
safeDispatchEvent(this.dialog_, closeEvent);
|
|
2318
|
-
}
|
|
2319
|
-
|
|
2320
|
-
});
|
|
2321
|
-
|
|
2322
|
-
var dialogPolyfill = {};
|
|
2323
|
-
|
|
2324
|
-
dialogPolyfill.reposition = function(element) {
|
|
2325
|
-
var scrollTop = document.body.scrollTop || document.documentElement.scrollTop;
|
|
2326
|
-
var topValue = scrollTop + (window.innerHeight - element.offsetHeight) / 2;
|
|
2327
|
-
element.style.top = Math.max(scrollTop, topValue) + 'px';
|
|
2328
|
-
};
|
|
2329
|
-
|
|
2330
|
-
dialogPolyfill.isInlinePositionSetByStylesheet = function(element) {
|
|
2331
|
-
for (var i = 0; i < document.styleSheets.length; ++i) {
|
|
2332
|
-
var styleSheet = document.styleSheets[i];
|
|
2333
|
-
var cssRules = null;
|
|
2334
|
-
// Some browsers throw on cssRules.
|
|
2335
|
-
try {
|
|
2336
|
-
cssRules = styleSheet.cssRules;
|
|
2337
|
-
} catch (e) {}
|
|
2338
|
-
if (!cssRules) { continue; }
|
|
2339
|
-
for (var j = 0; j < cssRules.length; ++j) {
|
|
2340
|
-
var rule = cssRules[j];
|
|
2341
|
-
var selectedNodes = null;
|
|
2342
|
-
// Ignore errors on invalid selector texts.
|
|
2343
|
-
try {
|
|
2344
|
-
selectedNodes = document.querySelectorAll(rule.selectorText);
|
|
2345
|
-
} catch(e) {}
|
|
2346
|
-
if (!selectedNodes || !inNodeList(selectedNodes, element)) {
|
|
2347
|
-
continue;
|
|
2348
|
-
}
|
|
2349
|
-
var cssTop = rule.style.getPropertyValue('top');
|
|
2350
|
-
var cssBottom = rule.style.getPropertyValue('bottom');
|
|
2351
|
-
if ((cssTop && cssTop !== 'auto') || (cssBottom && cssBottom !== 'auto')) {
|
|
2352
|
-
return true;
|
|
2353
|
-
}
|
|
2354
|
-
}
|
|
2355
|
-
}
|
|
2356
|
-
return false;
|
|
2357
|
-
};
|
|
2358
|
-
|
|
2359
|
-
dialogPolyfill.needsCentering = function(dialog) {
|
|
2360
|
-
var computedStyle = window.getComputedStyle(dialog);
|
|
2361
|
-
if (computedStyle.position !== 'absolute') {
|
|
2362
|
-
return false;
|
|
2363
|
-
}
|
|
2364
|
-
|
|
2365
|
-
// We must determine whether the top/bottom specified value is non-auto. In
|
|
2366
|
-
// WebKit/Blink, checking computedStyle.top == 'auto' is sufficient, but
|
|
2367
|
-
// Firefox returns the used value. So we do this crazy thing instead: check
|
|
2368
|
-
// the inline style and then go through CSS rules.
|
|
2369
|
-
if ((dialog.style.top !== 'auto' && dialog.style.top !== '') ||
|
|
2370
|
-
(dialog.style.bottom !== 'auto' && dialog.style.bottom !== '')) {
|
|
2371
|
-
return false;
|
|
2372
|
-
}
|
|
2373
|
-
return !dialogPolyfill.isInlinePositionSetByStylesheet(dialog);
|
|
2374
|
-
};
|
|
2375
|
-
|
|
2376
|
-
/**
|
|
2377
|
-
* @param {!Element} element to force upgrade
|
|
2378
|
-
*/
|
|
2379
|
-
dialogPolyfill.forceRegisterDialog = function(element) {
|
|
2380
|
-
if (window.HTMLDialogElement || element.showModal) {
|
|
2381
|
-
console.warn('This browser already supports <dialog>, the polyfill ' +
|
|
2382
|
-
'may not work correctly', element);
|
|
2383
|
-
}
|
|
2384
|
-
if (element.localName !== 'dialog') {
|
|
2385
|
-
throw new Error('Failed to register dialog: The element is not a dialog.');
|
|
2386
|
-
}
|
|
2387
|
-
new dialogPolyfillInfo(/** @type {!HTMLDialogElement} */ (element));
|
|
2388
|
-
};
|
|
2389
|
-
|
|
2390
|
-
/**
|
|
2391
|
-
* @param {!Element} element to upgrade, if necessary
|
|
2392
|
-
*/
|
|
2393
|
-
dialogPolyfill.registerDialog = function(element) {
|
|
2394
|
-
if (!element.showModal) {
|
|
2395
|
-
dialogPolyfill.forceRegisterDialog(element);
|
|
2396
|
-
}
|
|
2397
|
-
};
|
|
2398
|
-
|
|
2399
|
-
/**
|
|
2400
|
-
* @constructor
|
|
2401
|
-
*/
|
|
2402
|
-
dialogPolyfill.DialogManager = function() {
|
|
2403
|
-
/** @type {!Array<!dialogPolyfillInfo>} */
|
|
2404
|
-
this.pendingDialogStack = [];
|
|
2405
|
-
|
|
2406
|
-
var checkDOM = this.checkDOM_.bind(this);
|
|
2407
|
-
|
|
2408
|
-
// The overlay is used to simulate how a modal dialog blocks the document.
|
|
2409
|
-
// The blocking dialog is positioned on top of the overlay, and the rest of
|
|
2410
|
-
// the dialogs on the pending dialog stack are positioned below it. In the
|
|
2411
|
-
// actual implementation, the modal dialog stacking is controlled by the
|
|
2412
|
-
// top layer, where z-index has no effect.
|
|
2413
|
-
this.overlay = document.createElement('div');
|
|
2414
|
-
this.overlay.className = '_dialog_overlay';
|
|
2415
|
-
this.overlay.addEventListener('click', function(e) {
|
|
2416
|
-
this.forwardTab_ = undefined;
|
|
2417
|
-
e.stopPropagation();
|
|
2418
|
-
checkDOM([]); // sanity-check DOM
|
|
2419
|
-
}.bind(this));
|
|
2420
|
-
|
|
2421
|
-
this.handleKey_ = this.handleKey_.bind(this);
|
|
2422
|
-
this.handleFocus_ = this.handleFocus_.bind(this);
|
|
2423
|
-
|
|
2424
|
-
this.zIndexLow_ = 100000;
|
|
2425
|
-
this.zIndexHigh_ = 100000 + 150;
|
|
2426
|
-
|
|
2427
|
-
this.forwardTab_ = undefined;
|
|
2428
|
-
|
|
2429
|
-
if ('MutationObserver' in window) {
|
|
2430
|
-
this.mo_ = new MutationObserver(function(records) {
|
|
2431
|
-
var removed = [];
|
|
2432
|
-
records.forEach(function(rec) {
|
|
2433
|
-
for (var i = 0, c; c = rec.removedNodes[i]; ++i) {
|
|
2434
|
-
if (!(c instanceof Element)) {
|
|
2435
|
-
continue;
|
|
2436
|
-
} else if (c.localName === 'dialog') {
|
|
2437
|
-
removed.push(c);
|
|
2438
|
-
}
|
|
2439
|
-
removed = removed.concat(c.querySelectorAll('dialog'));
|
|
2440
|
-
}
|
|
2441
|
-
});
|
|
2442
|
-
removed.length && checkDOM(removed);
|
|
2443
|
-
});
|
|
2444
|
-
}
|
|
2445
|
-
};
|
|
2446
|
-
|
|
2447
|
-
/**
|
|
2448
|
-
* Called on the first modal dialog being shown. Adds the overlay and related
|
|
2449
|
-
* handlers.
|
|
2450
|
-
*/
|
|
2451
|
-
dialogPolyfill.DialogManager.prototype.blockDocument = function() {
|
|
2452
|
-
document.documentElement.addEventListener('focus', this.handleFocus_, true);
|
|
2453
|
-
document.addEventListener('keydown', this.handleKey_);
|
|
2454
|
-
this.mo_ && this.mo_.observe(document, {childList: true, subtree: true});
|
|
2455
|
-
};
|
|
2456
|
-
|
|
2457
|
-
/**
|
|
2458
|
-
* Called on the first modal dialog being removed, i.e., when no more modal
|
|
2459
|
-
* dialogs are visible.
|
|
2460
|
-
*/
|
|
2461
|
-
dialogPolyfill.DialogManager.prototype.unblockDocument = function() {
|
|
2462
|
-
document.documentElement.removeEventListener('focus', this.handleFocus_, true);
|
|
2463
|
-
document.removeEventListener('keydown', this.handleKey_);
|
|
2464
|
-
this.mo_ && this.mo_.disconnect();
|
|
2465
|
-
};
|
|
2466
|
-
|
|
2467
|
-
/**
|
|
2468
|
-
* Updates the stacking of all known dialogs.
|
|
2469
|
-
*/
|
|
2470
|
-
dialogPolyfill.DialogManager.prototype.updateStacking = function() {
|
|
2471
|
-
var zIndex = this.zIndexHigh_;
|
|
2472
|
-
|
|
2473
|
-
for (var i = 0, dpi; dpi = this.pendingDialogStack[i]; ++i) {
|
|
2474
|
-
dpi.updateZIndex(--zIndex, --zIndex);
|
|
2475
|
-
if (i === 0) {
|
|
2476
|
-
this.overlay.style.zIndex = --zIndex;
|
|
2477
|
-
}
|
|
2478
|
-
}
|
|
2479
|
-
|
|
2480
|
-
// Make the overlay a sibling of the dialog itself.
|
|
2481
|
-
var last = this.pendingDialogStack[0];
|
|
2482
|
-
if (last) {
|
|
2483
|
-
var p = last.dialog.parentNode || document.body;
|
|
2484
|
-
p.appendChild(this.overlay);
|
|
2485
|
-
} else if (this.overlay.parentNode) {
|
|
2486
|
-
this.overlay.parentNode.removeChild(this.overlay);
|
|
2487
|
-
}
|
|
2488
|
-
};
|
|
2489
|
-
|
|
2490
|
-
/**
|
|
2491
|
-
* @param {Element} candidate to check if contained or is the top-most modal dialog
|
|
2492
|
-
* @return {boolean} whether candidate is contained in top dialog
|
|
2493
|
-
*/
|
|
2494
|
-
dialogPolyfill.DialogManager.prototype.containedByTopDialog_ = function(candidate) {
|
|
2495
|
-
while (candidate = findNearestDialog(candidate)) {
|
|
2496
|
-
for (var i = 0, dpi; dpi = this.pendingDialogStack[i]; ++i) {
|
|
2497
|
-
if (dpi.dialog === candidate) {
|
|
2498
|
-
return i === 0; // only valid if top-most
|
|
2499
|
-
}
|
|
2500
|
-
}
|
|
2501
|
-
candidate = candidate.parentElement;
|
|
2502
|
-
}
|
|
2503
|
-
return false;
|
|
2504
|
-
};
|
|
2505
|
-
|
|
2506
|
-
dialogPolyfill.DialogManager.prototype.handleFocus_ = function(event) {
|
|
2507
|
-
var target = event.composedPath ? event.composedPath()[0] : event.target;
|
|
2508
|
-
|
|
2509
|
-
if (this.containedByTopDialog_(target)) { return; }
|
|
2510
|
-
|
|
2511
|
-
if (document.activeElement === document.documentElement) { return; }
|
|
2512
|
-
|
|
2513
|
-
event.preventDefault();
|
|
2514
|
-
event.stopPropagation();
|
|
2515
|
-
safeBlur(/** @type {Element} */ (target));
|
|
2516
|
-
|
|
2517
|
-
if (this.forwardTab_ === undefined) { return; } // move focus only from a tab key
|
|
2518
|
-
|
|
2519
|
-
var dpi = this.pendingDialogStack[0];
|
|
2520
|
-
var dialog = dpi.dialog;
|
|
2521
|
-
var position = dialog.compareDocumentPosition(target);
|
|
2522
|
-
if (position & Node.DOCUMENT_POSITION_PRECEDING) {
|
|
2523
|
-
if (this.forwardTab_) {
|
|
2524
|
-
// forward
|
|
2525
|
-
dpi.focus_();
|
|
2526
|
-
} else if (target !== document.documentElement) {
|
|
2527
|
-
// backwards if we're not already focused on <html>
|
|
2528
|
-
document.documentElement.focus();
|
|
2529
|
-
}
|
|
2530
|
-
}
|
|
2531
|
-
|
|
2532
|
-
return false;
|
|
2533
|
-
};
|
|
2534
|
-
|
|
2535
|
-
dialogPolyfill.DialogManager.prototype.handleKey_ = function(event) {
|
|
2536
|
-
this.forwardTab_ = undefined;
|
|
2537
|
-
if (event.keyCode === 27) {
|
|
2538
|
-
event.preventDefault();
|
|
2539
|
-
event.stopPropagation();
|
|
2540
|
-
var cancelEvent = new supportCustomEvent('cancel', {
|
|
2541
|
-
bubbles: false,
|
|
2542
|
-
cancelable: true
|
|
2543
|
-
});
|
|
2544
|
-
var dpi = this.pendingDialogStack[0];
|
|
2545
|
-
if (dpi && safeDispatchEvent(dpi.dialog, cancelEvent)) {
|
|
2546
|
-
dpi.dialog.close();
|
|
2547
|
-
}
|
|
2548
|
-
} else if (event.keyCode === 9) {
|
|
2549
|
-
this.forwardTab_ = !event.shiftKey;
|
|
2550
|
-
}
|
|
2551
|
-
};
|
|
2552
|
-
|
|
2553
|
-
/**
|
|
2554
|
-
* Finds and downgrades any known modal dialogs that are no longer displayed. Dialogs that are
|
|
2555
|
-
* removed and immediately readded don't stay modal, they become normal.
|
|
2556
|
-
*
|
|
2557
|
-
* @param {!Array<!HTMLDialogElement>} removed that have definitely been removed
|
|
2558
|
-
*/
|
|
2559
|
-
dialogPolyfill.DialogManager.prototype.checkDOM_ = function(removed) {
|
|
2560
|
-
// This operates on a clone because it may cause it to change. Each change also calls
|
|
2561
|
-
// updateStacking, which only actually needs to happen once. But who removes many modal dialogs
|
|
2562
|
-
// at a time?!
|
|
2563
|
-
var clone = this.pendingDialogStack.slice();
|
|
2564
|
-
clone.forEach(function(dpi) {
|
|
2565
|
-
if (removed.indexOf(dpi.dialog) !== -1) {
|
|
2566
|
-
dpi.downgradeModal();
|
|
2567
|
-
} else {
|
|
2568
|
-
dpi.maybeHideModal();
|
|
2569
|
-
}
|
|
2570
|
-
});
|
|
2571
|
-
};
|
|
2572
|
-
|
|
2573
|
-
/**
|
|
2574
|
-
* @param {!dialogPolyfillInfo} dpi
|
|
2575
|
-
* @return {boolean} whether the dialog was allowed
|
|
2576
|
-
*/
|
|
2577
|
-
dialogPolyfill.DialogManager.prototype.pushDialog = function(dpi) {
|
|
2578
|
-
var allowed = (this.zIndexHigh_ - this.zIndexLow_) / 2 - 1;
|
|
2579
|
-
if (this.pendingDialogStack.length >= allowed) {
|
|
2580
|
-
return false;
|
|
2581
|
-
}
|
|
2582
|
-
if (this.pendingDialogStack.unshift(dpi) === 1) {
|
|
2583
|
-
this.blockDocument();
|
|
2584
|
-
}
|
|
2585
|
-
this.updateStacking();
|
|
2586
|
-
return true;
|
|
2587
|
-
};
|
|
2588
|
-
|
|
2589
|
-
/**
|
|
2590
|
-
* @param {!dialogPolyfillInfo} dpi
|
|
2591
|
-
*/
|
|
2592
|
-
dialogPolyfill.DialogManager.prototype.removeDialog = function(dpi) {
|
|
2593
|
-
var index = this.pendingDialogStack.indexOf(dpi);
|
|
2594
|
-
if (index === -1) { return; }
|
|
2595
|
-
|
|
2596
|
-
this.pendingDialogStack.splice(index, 1);
|
|
2597
|
-
if (this.pendingDialogStack.length === 0) {
|
|
2598
|
-
this.unblockDocument();
|
|
2599
|
-
}
|
|
2600
|
-
this.updateStacking();
|
|
2601
|
-
};
|
|
2602
|
-
|
|
2603
|
-
dialogPolyfill.dm = new dialogPolyfill.DialogManager();
|
|
2604
|
-
dialogPolyfill.formSubmitter = null;
|
|
2605
|
-
dialogPolyfill.imagemapUseValue = null;
|
|
2606
|
-
|
|
2607
|
-
/**
|
|
2608
|
-
* Installs global handlers, such as click listers and native method overrides. These are needed
|
|
2609
|
-
* even if a no dialog is registered, as they deal with <form method="dialog">.
|
|
2610
|
-
*/
|
|
2611
|
-
if (window.HTMLDialogElement === undefined) {
|
|
2612
|
-
|
|
2613
|
-
/**
|
|
2614
|
-
* If HTMLFormElement translates method="DIALOG" into 'get', then replace the descriptor with
|
|
2615
|
-
* one that returns the correct value.
|
|
2616
|
-
*/
|
|
2617
|
-
var testForm = document.createElement('form');
|
|
2618
|
-
testForm.setAttribute('method', 'dialog');
|
|
2619
|
-
if (testForm.method !== 'dialog') {
|
|
2620
|
-
var methodDescriptor = Object.getOwnPropertyDescriptor(HTMLFormElement.prototype, 'method');
|
|
2621
|
-
if (methodDescriptor) {
|
|
2622
|
-
// nb. Some older iOS and older PhantomJS fail to return the descriptor. Don't do anything
|
|
2623
|
-
// and don't bother to update the element.
|
|
2624
|
-
var realGet = methodDescriptor.get;
|
|
2625
|
-
methodDescriptor.get = function() {
|
|
2626
|
-
if (isFormMethodDialog(this)) {
|
|
2627
|
-
return 'dialog';
|
|
2628
|
-
}
|
|
2629
|
-
return realGet.call(this);
|
|
2630
|
-
};
|
|
2631
|
-
var realSet = methodDescriptor.set;
|
|
2632
|
-
/** @this {HTMLElement} */
|
|
2633
|
-
methodDescriptor.set = function(v) {
|
|
2634
|
-
if (typeof v === 'string' && v.toLowerCase() === 'dialog') {
|
|
2635
|
-
return this.setAttribute('method', v);
|
|
2636
|
-
}
|
|
2637
|
-
return realSet.call(this, v);
|
|
2638
|
-
};
|
|
2639
|
-
Object.defineProperty(HTMLFormElement.prototype, 'method', methodDescriptor);
|
|
2640
|
-
}
|
|
2641
|
-
}
|
|
2642
|
-
|
|
2643
|
-
/**
|
|
2644
|
-
* Global 'click' handler, to capture the <input type="submit"> or <button> element which has
|
|
2645
|
-
* submitted a <form method="dialog">. Needed as Safari and others don't report this inside
|
|
2646
|
-
* document.activeElement.
|
|
2647
|
-
*/
|
|
2648
|
-
document.addEventListener('click', function(ev) {
|
|
2649
|
-
dialogPolyfill.formSubmitter = null;
|
|
2650
|
-
dialogPolyfill.imagemapUseValue = null;
|
|
2651
|
-
if (ev.defaultPrevented) { return; } // e.g. a submit which prevents default submission
|
|
2652
|
-
|
|
2653
|
-
var target = /** @type {Element} */ (ev.target);
|
|
2654
|
-
if ('composedPath' in ev) {
|
|
2655
|
-
var path = ev.composedPath();
|
|
2656
|
-
target = path.shift() || target;
|
|
2657
|
-
}
|
|
2658
|
-
if (!target || !isFormMethodDialog(target.form)) { return; }
|
|
2659
|
-
|
|
2660
|
-
var valid = (target.type === 'submit' && ['button', 'input'].indexOf(target.localName) > -1);
|
|
2661
|
-
if (!valid) {
|
|
2662
|
-
if (!(target.localName === 'input' && target.type === 'image')) { return; }
|
|
2663
|
-
// this is a <input type="image">, which can submit forms
|
|
2664
|
-
dialogPolyfill.imagemapUseValue = ev.offsetX + ',' + ev.offsetY;
|
|
2665
|
-
}
|
|
2666
|
-
|
|
2667
|
-
var dialog = findNearestDialog(target);
|
|
2668
|
-
if (!dialog) { return; }
|
|
2669
|
-
|
|
2670
|
-
dialogPolyfill.formSubmitter = target;
|
|
2671
|
-
|
|
2672
|
-
}, false);
|
|
2673
|
-
|
|
2674
|
-
/**
|
|
2675
|
-
* Global 'submit' handler. This handles submits of `method="dialog"` which are invalid, i.e.,
|
|
2676
|
-
* outside a dialog. They get prevented.
|
|
2677
|
-
*/
|
|
2678
|
-
document.addEventListener('submit', function(ev) {
|
|
2679
|
-
var form = ev.target;
|
|
2680
|
-
var dialog = findNearestDialog(form);
|
|
2681
|
-
if (dialog) {
|
|
2682
|
-
return; // ignore, handle there
|
|
2683
|
-
}
|
|
2684
|
-
|
|
2685
|
-
var submitter = findFormSubmitter(ev);
|
|
2686
|
-
var formmethod = submitter && submitter.getAttribute('formmethod') || form.getAttribute('method');
|
|
2687
|
-
if (formmethod === 'dialog') {
|
|
2688
|
-
ev.preventDefault();
|
|
2689
|
-
}
|
|
2690
|
-
});
|
|
2691
|
-
|
|
2692
|
-
/**
|
|
2693
|
-
* Replace the native HTMLFormElement.submit() method, as it won't fire the
|
|
2694
|
-
* submit event and give us a chance to respond.
|
|
2695
|
-
*/
|
|
2696
|
-
var nativeFormSubmit = HTMLFormElement.prototype.submit;
|
|
2697
|
-
var replacementFormSubmit = function () {
|
|
2698
|
-
if (!isFormMethodDialog(this)) {
|
|
2699
|
-
return nativeFormSubmit.call(this);
|
|
2700
|
-
}
|
|
2701
|
-
var dialog = findNearestDialog(this);
|
|
2702
|
-
dialog && dialog.close();
|
|
2703
|
-
};
|
|
2704
|
-
HTMLFormElement.prototype.submit = replacementFormSubmit;
|
|
2705
|
-
}
|
|
2706
|
-
|
|
2707
|
-
const stylesCss$3 = ":host{font-family:var(--font-family-sans);font-weight:var(--font-rg)}:host>dialog{padding:0;border:none;margin:0;background-color:transparent}:host>dialog:modal{width:100%;max-width:100%;max-height:100%}:host>dialog::-webkit-backdrop{display:none}:host>dialog::-ms-backdrop{display:none}:host>dialog::backdrop{display:none}:host>dialog+.backdrop{display:none}:host>dialog:not([open]){display:none}:host>dialog[open]{display:block}.modal-container{z-index:1010;display:-ms-flexbox;display:flex;overflow:-moz-scrollbars-none;width:100%;height:100vh;-ms-flex-direction:column;flex-direction:column}.modal-container>.modal-content-scroll-outside{overflow:auto;background:var(--color-surface01)}.modal-container>header{padding:calc(var(--space-unit) * 2 - 2px) calc(var(--space-unit) * 2);background:var(--color-surface02)}.modal-container>header button{padding:0;border:none;margin:0;margin-left:auto;background:transparent;cursor:pointer}.modal-container>header z-icon{--z-icon-width:calc(var(--space-unit) * 2.5);--z-icon-height:calc(var(--space-unit) * 2.5);display:-ms-flexbox;display:flex;fill:var(--color-primary01-icon)}.modal-container>header>div{display:-ms-flexbox;display:flex;width:100%;-ms-flex-align:center;align-items:center;margin-right:calc(var(--space-unit) * 2)}.modal-container>header h1,.modal-container>header .subtitle{padding:0;margin:0;color:var(--color-default-text);font-weight:var(--font-rg)}.modal-container>header h1{font-size:var(--font-size-5);letter-spacing:0;line-height:1.4}.modal-container>header .subtitle{font-size:var(--font-size-3);letter-spacing:0;line-height:1.5}.modal-container>header>div>h1 *:empty{display:none}.modal-container>header h1+.subtitle{margin-top:calc(var(--space-unit) * 0.5)}.modal-container-scroll-inside>.modal-content-scroll-inside{overflow:hidden auto;-ms-flex:1 auto;flex:1 auto;background:var(--color-surface01)}.modal-container-scroll-inside>.modal-content-scroll-inside::-webkit-scrollbar,.modal-container-scroll-outside>.modal-content-scroll-outside::-webkit-scrollbar{width:10px;background:linear-gradient(to right, transparent 0 3px, var(--gray200) 3px 7px, transparent 7px 10px);border-radius:var(--border-radius)}.modal-container-scroll-inside>.modal-content-scroll-inside::-webkit-scrollbar-thumb,.modal-container-scroll-outside>.modal-content-scroll-outside::-webkit-scrollbar-thumb{width:10px;background-color:var(--color-primary01)}.modal-container-scroll-inside>.modal-content-scroll-inside::-webkit-scrollbar-thumb:hover,.modal-container-scroll-outside>.modal-content-scroll-outside::-webkit-scrollbar-thumb:hover{background-color:var(--color-hover-primary)}.modal-container-scroll-inside .modal-content-scroll-inside,.modal-container-scroll-outside .modal-content-scroll-outside{scrollbar-color:var(--color-primary01) transparent}@media only screen and (min-width: 768px){.modal-background{position:fixed;top:0;left:0;overflow:hidden;width:100vw;height:100vh;background-color:var(--gray900);opacity:0.7}.modal-background.modal-background-scroll-outside{position:-webkit-sticky;position:sticky}.modal-container-scroll-inside{position:fixed;top:calc(var(--space-unit) * 6);left:50%;overflow:hidden;width:auto;min-width:calc(var(--space-unit) * 40);height:auto;min-height:calc(var(--space-unit) * 40);max-height:calc(100vh - calc(var(--space-unit) * 6 * 2));border-radius:var(--border-radius);-webkit-transform:translateX(-50%);transform:translateX(-50%)}.modal-container-scroll-outside{position:absolute;top:calc(var(--space-unit) * 6);left:50%;display:block;overflow:initial;width:auto;min-width:calc(var(--space-unit) * 40);height:auto;min-height:calc(var(--space-unit) * 40);max-height:calc(100vh - calc(var(--space-unit) * 6 * 2));-webkit-transform:translateX(-50%);transform:translateX(-50%)}.modal-container>.modal-content-scroll-outside{overflow:initial}.modal-container-scroll-outside>header,.modal-container-scroll-inside>header{border-top-left-radius:var(--border-radius);border-top-right-radius:var(--border-radius)}.modal-container-scroll-outside::after{display:block;height:calc(var(--space-unit) * 6);content:\" \"}.modal-dialog{position:fixed;top:0;left:0;height:auto;overflow-x:hidden;overflow-y:auto}.modal-content-scroll-outside{border-bottom-left-radius:var(--border-radius);border-bottom-right-radius:var(--border-radius)}.modal-dialog::-webkit-scrollbar{display:none}.modal-container>header z-icon{--z-icon-width:calc(var(--space-unit) * 3);--z-icon-height:calc(var(--space-unit) * 3)}}@media only screen and (min-width: 768px) and (max-width: 1151px){.modal-container>header{padding:calc(var(--space-unit) * 3 - 2px) calc(var(--space-unit) * 3)}}@media only screen and (min-width: 1152px){.modal-container>header{padding:calc(var(--space-unit) * 4 - 4px) calc(var(--space-unit) * 4)}.modal-container>header h1{font-size:var(--font-size-6);letter-spacing:0;line-height:1.33}.modal-container>header .subtitle{font-size:var(--font-size-4);letter-spacing:0;line-height:1.5}.modal-container>header h1+.subtitle{margin-top:0}}";
|
|
2708
|
-
const ZModalStyle0 = stylesCss$3;
|
|
2709
|
-
|
|
2710
|
-
const FOCUSABLE_ELEMENTS_SELECTOR = ':is(button, input, select, textarea, [contenteditable=""], [contenteditable="true"], a[href], [tabindex], summary):not([disabled], [disabled=""], [tabindex="-1"], [aria-hidden="true"], [hidden])';
|
|
2711
|
-
const ZModal = class {
|
|
2712
|
-
constructor(hostRef) {
|
|
2713
|
-
index.registerInstance(this, hostRef);
|
|
2714
|
-
this.modalClose = index.createEvent(this, "modalClose", 7);
|
|
2715
|
-
this.modalHeaderActive = index.createEvent(this, "modalHeaderActive", 7);
|
|
2716
|
-
this.modalBackgroundClick = index.createEvent(this, "modalBackgroundClick", 7);
|
|
2717
|
-
this.modalid = undefined;
|
|
2718
|
-
this.modaltitle = undefined;
|
|
2719
|
-
this.modalsubtitle = undefined;
|
|
2720
|
-
this.closeButtonLabel = "chiudi modale";
|
|
2721
|
-
this.alertdialog = false;
|
|
2722
|
-
this.closable = true;
|
|
2723
|
-
this.scrollInside = true;
|
|
2724
|
-
}
|
|
2725
|
-
emitModalClose() {
|
|
2726
|
-
if (this.closable) {
|
|
2727
|
-
this.modalClose.emit({ modalid: this.modalid });
|
|
2728
|
-
}
|
|
2729
|
-
}
|
|
2730
|
-
emitModalHeaderActive() {
|
|
2731
|
-
this.modalHeaderActive.emit({ modalid: this.modalid });
|
|
2732
|
-
}
|
|
2733
|
-
emitBackgroundClick() {
|
|
2734
|
-
if (this.closable) {
|
|
2735
|
-
this.modalBackgroundClick.emit({ modalid: this.modalid });
|
|
2736
|
-
}
|
|
2737
|
-
}
|
|
2738
|
-
componentDidLoad() {
|
|
2739
|
-
if (typeof window.HTMLDialogElement !== "function") {
|
|
2740
|
-
/* workaround to fix `registerDialog` in test environment:
|
|
2741
|
-
stencil converts html elements to MockHTMLElement but this element is missing the `localName` property,
|
|
2742
|
-
which is used by `registerDialog` to recognize the element as dialog */
|
|
2743
|
-
if (!this.dialog.localName) {
|
|
2744
|
-
Object.defineProperty(this.dialog, "localName", { value: "dialog" });
|
|
2745
|
-
}
|
|
2746
|
-
dialogPolyfill.registerDialog(this.dialog);
|
|
2747
|
-
this.dialog.setAttribute("open", "true");
|
|
2748
|
-
}
|
|
2749
|
-
else {
|
|
2750
|
-
this.open();
|
|
2751
|
-
}
|
|
2752
|
-
}
|
|
2753
|
-
/** open modal */
|
|
2754
|
-
async open() {
|
|
2755
|
-
var _a;
|
|
2756
|
-
(_a = this.dialog) === null || _a === void 0 ? void 0 : _a.showModal();
|
|
2757
|
-
}
|
|
2758
|
-
/** close modal */
|
|
2759
|
-
async close() {
|
|
2760
|
-
var _a;
|
|
2761
|
-
if (this.closable) {
|
|
2762
|
-
(_a = this.dialog) === null || _a === void 0 ? void 0 : _a.close();
|
|
2763
|
-
}
|
|
2764
|
-
}
|
|
2765
|
-
/**
|
|
2766
|
-
* Get a list of focusable elements in the dialog.
|
|
2767
|
-
* Remove elements with `display: none` from the list, because they're not focusable.
|
|
2768
|
-
*
|
|
2769
|
-
* N.B. The list is built on the assumption that elements inside shadow root are placed ALL before the `modalContent` slot.
|
|
2770
|
-
* Adding focusable elements after the `modalContent` slot would break the order of elements in the list.
|
|
2771
|
-
*/
|
|
2772
|
-
get focusableElements() {
|
|
2773
|
-
return [
|
|
2774
|
-
...Array.from(this.host.shadowRoot.querySelectorAll(FOCUSABLE_ELEMENTS_SELECTOR)),
|
|
2775
|
-
...Array.from(this.host.querySelectorAll(FOCUSABLE_ELEMENTS_SELECTOR)),
|
|
2776
|
-
].filter((element) => getComputedStyle(element).display !== "none");
|
|
2777
|
-
}
|
|
2778
|
-
handleKeyDown(e) {
|
|
2779
|
-
if (e.code !== index$1.KeyboardCode.TAB) {
|
|
2780
|
-
return;
|
|
2781
|
-
}
|
|
2782
|
-
const focusableElements = this.focusableElements;
|
|
2783
|
-
const shadowActiveElement = this.host.shadowRoot.activeElement;
|
|
2784
|
-
const activeElement = this.host.ownerDocument.activeElement;
|
|
2785
|
-
const firstFocusableElement = focusableElements[0];
|
|
2786
|
-
const lastFocusableElement = focusableElements[focusableElements.length - 1];
|
|
2787
|
-
if (e.shiftKey && (shadowActiveElement == firstFocusableElement || activeElement == firstFocusableElement)) {
|
|
2788
|
-
// shift + tab was pressed and current active element is the first focusable element
|
|
2789
|
-
e.preventDefault();
|
|
2790
|
-
lastFocusableElement.focus();
|
|
2791
|
-
}
|
|
2792
|
-
else if (!e.shiftKey && (shadowActiveElement == lastFocusableElement || activeElement == lastFocusableElement)) {
|
|
2793
|
-
// shift + tab was pressed and current active element is the first focusable element
|
|
2794
|
-
e.preventDefault();
|
|
2795
|
-
firstFocusableElement.focus();
|
|
2796
|
-
}
|
|
2797
|
-
}
|
|
2798
|
-
closeButtonSlot() {
|
|
2799
|
-
if (this.closable) {
|
|
2800
|
-
return (index.h("slot", { name: "modalCloseButton" }, index.h("button", { "aria-label": this.closeButtonLabel, onClick: () => this.close() }, index.h("z-icon", { name: "multiply-circle-filled" }))));
|
|
2801
|
-
}
|
|
2802
|
-
}
|
|
2803
|
-
handleEscape(e) {
|
|
2804
|
-
if (this.closable) {
|
|
2805
|
-
return;
|
|
2806
|
-
}
|
|
2807
|
-
e.preventDefault();
|
|
2808
|
-
}
|
|
2809
|
-
render() {
|
|
2810
|
-
return (index.h("dialog", { key: '502c0fd42f37a498ef3ec2b2b174ac4950287883', class: {
|
|
2811
|
-
"modal-dialog": !this.scrollInside,
|
|
2812
|
-
}, "aria-labelledby": "modal-title", "aria-describedby": "modal-content", role: this.alertdialog ? "alertdialog" : undefined, ref: (el) => (this.dialog = el), onClose: () => this.emitModalClose(), onCancel: (e) => this.handleEscape(e) }, index.h("div", { key: '0dd9496ca11660307bcb8d751e8793659aa30741', class: {
|
|
2813
|
-
"modal-container": true,
|
|
2814
|
-
"modal-container-scroll-inside": this.scrollInside,
|
|
2815
|
-
"modal-container-scroll-outside": !this.scrollInside,
|
|
2816
|
-
}, id: this.modalid }, index.h("header", { key: '6952365a4a1d64e1ce23a9454f11cd4ae76e37ca', onClick: this.emitModalHeaderActive.bind(this) }, index.h("div", { key: 'fe219a40167ad9984255885bb189d9a9a0509cd5' }, this.modaltitle && index.h("h1", { key: '2991d4e6c254160dfe33e3558dc5db4d4dbf0abf', id: "modal-title" }, this.modaltitle), this.closeButtonSlot()), this.modalsubtitle && (index.h("div", { key: '5a612bc3eb027b488a37918794c4f24e1991a38d', class: "subtitle", id: "modal-subtitle" }, this.modalsubtitle))), index.h("div", { key: '34008ade3d0f05c701b4d94df647086a8de3cd27', class: {
|
|
2817
|
-
"modal-content-scroll-inside": this.scrollInside,
|
|
2818
|
-
"modal-content-scroll-outside": !this.scrollInside,
|
|
2819
|
-
}, id: "modal-content" }, index.h("slot", { key: '7ce631a687090f9b69bafa8de5dbe76d21d2c554', name: "modalContent" }))), index.h("div", { key: '8fc40e271bec8219fbbbf208bbba900a74ebdec8', class: {
|
|
2820
|
-
"modal-background": true,
|
|
2821
|
-
"modal-background-scroll-outside": !this.scrollInside,
|
|
2822
|
-
}, "data-action": "modalBackground", "data-modal": this.modalid, onClick: () => {
|
|
2823
|
-
this.emitBackgroundClick();
|
|
2824
|
-
this.close();
|
|
2825
|
-
} })));
|
|
2826
|
-
}
|
|
2827
|
-
get host() { return index.getElement(this); }
|
|
2828
|
-
};
|
|
2829
|
-
ZModal.style = ZModalStyle0;
|
|
2830
|
-
|
|
2831
1615
|
const stylesCss$2 = ".sc-z-offcanvas-h{--z-offcanvas--container-width:375px;--z-offcanvas--top-space:0;min-width:100%;height:100%;font-family:var(--font-family-sans);font-weight:var(--font-rg)}.canvas-container.sc-z-offcanvas{display:-ms-flexbox;display:flex;overflow:-moz-scrollbars-none;overflow:hidden;min-width:100%;height:100%;-ms-flex-direction:column;flex-direction:column;background:var(--color-surface01)}[variant=\"pushcontent\"].sc-z-offcanvas-h{display:none}[open].sc-z-offcanvas-h{display:-ms-flexbox;display:flex;visibility:visible}.sc-z-offcanvas-h:not([open]){visibility:hidden}[variant=\"overlay\"].sc-z-offcanvas-h{position:fixed;z-index:1000;top:var(--z-offcanvas--top-space);right:0;bottom:0;left:0;display:-ms-flexbox;display:flex;height:calc(100% - var(--z-offcanvas--top-space))}[variant=\"overlay\"][transitiondirection=\"left\"].sc-z-offcanvas-h{-ms-flex-pack:end;justify-content:end}[variant=\"overlay\"].sc-z-offcanvas-h>.canvas-container.sc-z-offcanvas{z-index:1010}[variant=\"overlay\"].sc-z-offcanvas-h .canvas-background.sc-z-offcanvas{position:absolute;left:0;width:100%;height:100%;background-color:var(--gray900);opacity:0.7}.canvas-container.sc-z-offcanvas>.canvas-content.sc-z-offcanvas{overflow:auto;-ms-flex:1 auto;flex:1 auto;padding:0 calc(var(--space-unit) * 2);margin:calc(var(--space-unit) * 2) calc(var(--space-unit) / 2) calc(var(--space-unit) * 2) 0;overflow-x:hidden}[variant=\"overlay\"].sc-z-offcanvas-h>.canvas-container.sc-z-offcanvas>.canvas-content.sc-z-offcanvas{padding:0 calc(var(--space-unit) * 2) calc(var(--space-unit) * 2) calc(var(--space-unit) * 2);margin:calc(var(--space-unit) * 2) calc(var(--space-unit) / 2) 0 0}.canvas-container.sc-z-offcanvas .canvas-content.sc-z-offcanvas::-webkit-scrollbar{width:10px;background:linear-gradient(to right, transparent 0 3px, var(--gray200) 3px 7px, transparent 7px 10px);border-radius:var(--border-radius)}.canvas-container.sc-z-offcanvas .canvas-content.sc-z-offcanvas::-webkit-scrollbar-track{background-color:transparent}.canvas-container.sc-z-offcanvas .canvas-content.sc-z-offcanvas::-webkit-scrollbar-thumb{width:10px;background-color:var(--color-primary01);border-radius:var(--border-radius)}.canvas-container.sc-z-offcanvas .canvas-content.sc-z-offcanvas::-webkit-scrollbar-thumb:hover{background-color:var(--color-hover-primary)}.canvas-container.sc-z-offcanvas .canvas-content.sc-z-offcanvas{scrollbar-color:var(--color-primary01) transparent}@media only screen and (max-width: 767px){[open][transitiondirection=\"left\"].sc-z-offcanvas-h:not(.skip-animation)>.canvas-container.sc-z-offcanvas{-webkit-animation:enter-right 0.4s ease-out;animation:enter-right 0.4s ease-out}[open][transitiondirection=\"right\"].sc-z-offcanvas-h:not(.skip-animation)>.canvas-container.sc-z-offcanvas{-webkit-animation:enter-left 0.4s ease-out;animation:enter-left 0.4s ease-out}}@media only screen and (min-width: 768px){.sc-z-offcanvas-h{min-width:auto}.canvas-container.sc-z-offcanvas{width:auto;min-width:max(var(--z-offcanvas--container-width), 375px);max-width:max(var(--z-offcanvas--container-width), 375px);height:auto;min-height:calc(var(--space-unit) * 40)}.sc-z-offcanvas-h:not([variant=\"overlay\"])[open]:not(.skip-animation){width:auto;-webkit-animation:grow 0.4s ease-out;animation:grow 0.4s ease-out}}@-webkit-keyframes grow{from{width:0}to{width:max(var(--z-offcanvas--container-width), 375px)}}@keyframes grow{from{width:0}to{width:max(var(--z-offcanvas--container-width), 375px)}}@-webkit-keyframes enter-left{from{-webkit-transform:translateX(-100%);transform:translateX(-100%)}to{-webkit-transform:translateX(0);transform:translateX(0)}}@keyframes enter-left{from{-webkit-transform:translateX(-100%);transform:translateX(-100%)}to{-webkit-transform:translateX(0);transform:translateX(0)}}@-webkit-keyframes enter-right{from{-webkit-transform:translateX(100%);transform:translateX(100%)}to{-webkit-transform:translateX(0);transform:translateX(0)}}@keyframes enter-right{from{-webkit-transform:translateX(100%);transform:translateX(100%)}to{-webkit-transform:translateX(0);transform:translateX(0)}}[open][variant=\"overlay\"][transitiondirection=\"left\"].sc-z-offcanvas-h:not(.skip-animation)>.canvas-container.sc-z-offcanvas{-webkit-animation:enter-right 0.4s ease-out;animation:enter-right 0.4s ease-out}[open][transitiondirection=\"right\"].sc-z-offcanvas-h:not(.skip-animation)>.canvas-container.sc-z-offcanvas{-webkit-animation:enter-left 0.4s ease-out;animation:enter-left 0.4s ease-out}.sc-z-offcanvas-h:not([open])[variant=\"overlay\"][transitiondirection=\"right\"]>.canvas-container.sc-z-offcanvas{-webkit-transform:translateX(-100%);transform:translateX(-100%);-webkit-transition:visibility 0.4s ease-out,\n -webkit-transform 0.4s ease-out;transition:visibility 0.4s ease-out,\n -webkit-transform 0.4s ease-out;transition:visibility 0.4s ease-out,\n transform 0.4s ease-out;transition:visibility 0.4s ease-out,\n transform 0.4s ease-out,\n -webkit-transform 0.4s ease-out}.sc-z-offcanvas-h:not([open])[variant=\"overlay\"][transitiondirection=\"left\"]>.canvas-container.sc-z-offcanvas{-webkit-transform:translateX(100%);transform:translateX(100%);-webkit-transition:visibility 0.4s ease-out,\n -webkit-transform 0.4s ease-out;transition:visibility 0.4s ease-out,\n -webkit-transform 0.4s ease-out;transition:visibility 0.4s ease-out,\n transform 0.4s ease-out;transition:visibility 0.4s ease-out,\n transform 0.4s ease-out,\n -webkit-transform 0.4s ease-out}.sc-z-offcanvas-h:not([open])[variant=\"overlay\"] .canvas-background.sc-z-offcanvas{-webkit-transition:visibility 0.4s ease-out;transition:visibility 0.4s ease-out;visibility:hidden}";
|
|
2832
1616
|
const ZOffcanvasStyle0 = stylesCss$2;
|
|
2833
1617
|
|
|
@@ -2863,7 +1647,7 @@ const ZOffcanvas = class {
|
|
|
2863
1647
|
};
|
|
2864
1648
|
ZOffcanvas.style = ZOffcanvasStyle0;
|
|
2865
1649
|
|
|
2866
|
-
const stylesCss$1 = ":host{--z-searchbar-tag-text-color:var(--color-primary03);--z-searchbar-tag-bg:var(--color-hover-primary);z-index:15;display:-ms-flexbox;display:flex;-webkit-column-gap:calc(var(--space-unit) * 2);-moz-column-gap:calc(var(--space-unit) * 2);column-gap:calc(var(--space-unit) * 2);font-family:var(--font-family-sans);font-weight:var(--font-rg)}:host,*{-webkit-box-sizing:border-box;box-sizing:border-box}.input-container{position:relative;display:-ms-flexbox;display:flex;width:100%;-ms-flex-direction:column;flex-direction:column}.results-wrapper{position:absolute;top:calc(100% - 1px);left:0;width:100%;padding:calc(var(--space-unit) / 4);border:var(--border-size-small) solid var(--color-surface03);border-top:none;background:var(--color-surface01)}.results{overflow:auto;max-height:var(--z-searchbar-results-height, 540px);padding:calc(var(--space-unit) / 2) calc(var(--space-unit) * 1.5);scrollbar-color:var(--color-primary01) transparent}.results::-webkit-scrollbar{width:10px;background:linear-gradient(to right, transparent 0 3px, var(--gray200) 3px 7px, transparent 7px 10px);border-radius:var(--border-radius)}.results::-webkit-scrollbar-track{background-color:transparent}.results::-webkit-scrollbar-thumb{width:10px;background-color:var(--color-primary01);border-radius:var(--border-radius)}.results .category-heading{display:block;font-size:var(--font-size-2);font-weight:var(--font-rg);line-height:var(--font-size-3)}.results .category-heading>*{display:block}.results .category-heading>.category{color:var(--color-text05);font-style:italic}.results .category-heading>.subcategory{margin-top:var(--space-unit);color:var(--color-default-text);text-transform:uppercase}.results z-list-element{display:block}.results z-list-element>.list-element{display:-ms-flexbox;display:flex;-ms-flex-pack:justify;justify-content:space-between}.results z-list-element>.list-element>z-tag{border:1px solid var(--gray800);font-size:var(--font-size-1);font-weight:var(--font-sb);--z-tag-bg:var(--z-searchbar-tag-bg);--z-tag-text-color:var(--z-searchbar-tag-text-color)}.results .item{--z-icon-height:12px;--z-icon-width:12px;display:-ms-flexbox;display:flex;-ms-flex-flow:row nowrap;flex-flow:row nowrap;-ms-flex-align:center;align-items:center;-ms-flex-pack:start;justify-content:flex-start;color:var(--color-default-text);-webkit-column-gap:calc(var(--space-unit) * 1.5);-moz-column-gap:calc(var(--space-unit) * 1.5);column-gap:calc(var(--space-unit) * 1.5);fill:var(--color-default-icon);font-size:var(--font-size-2);line-height:var(--font-size-3)}.results .item.ellipsis>.item-label{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.results .item>.item-label mark{background:var(--color-primary03)}.results .item.has-category{padding-left:calc(var(--space-unit) * 3)}.results .item.item-search{--z-icon-height:16px;--z-icon-width:16px}.results .item-show-all{text-align:center}.results .item-no-results{display:block;font-size:var(--font-size-2);font-style:italic;line-height:var(--font-size-5)}.results .item-no-results>ul{padding-left:calc(var(--space-unit) * 2);margin:var(--space-unit)}@media (min-width: 768px){.results .category-heading{font-size:var(--font-size-3);line-height:var(--font-size-6)}.results .item{font-size:var(--font-size-3);line-height:var(--font-size-6)}.results .item.item-search{--z-icon-height:18px;--z-icon-width:18px}.results .item.ellipsis>.item-label{height:24px}}@media (min-width: 1152px){.results .item{cursor:pointer}.results .item-no-results{cursor:default;font-size:var(--font-size-3);line-height:var(--font-size-6)}}:host([size=\"small\"]) .results :is(.item,.category-heading),:host([size=\"x-small\"]) .results :is(.item,.category-heading){font-size:var(--font-size-2)}:host([size=\"small\"]) .results .item:not(.has-category),:host([size=\"x-small\"]) .results .item:not(.has-category){--z-icon-height:16px;--z-icon-width:16px}:host([size=\"small\"])::part(list-item-container){min-height:calc(var(--space-unit) * 4.5);padding:0}:host([size=\"x-small\"])::part(list-item-container){min-height:calc(var(--space-unit) * 4);padding:0}";
|
|
1650
|
+
const stylesCss$1 = ":host{--z-searchbar-tag-text-color:var(--color-primary03);--z-searchbar-tag-bg:var(--color-hover-primary);z-index:15;display:-ms-flexbox;display:flex;-webkit-column-gap:calc(var(--space-unit) * 2);-moz-column-gap:calc(var(--space-unit) * 2);column-gap:calc(var(--space-unit) * 2);font-family:var(--font-family-sans);font-weight:var(--font-rg)}:host,*{-webkit-box-sizing:border-box;box-sizing:border-box}*:focus{-webkit-box-shadow:var(--shadow-focus-primary);box-shadow:var(--shadow-focus-primary);outline:none !important}.input-container{position:relative;display:-ms-flexbox;display:flex;width:100%;-ms-flex-direction:column;flex-direction:column}.results-wrapper{position:absolute;top:calc(100% - 1px);left:0;width:100%;padding:calc(var(--space-unit) / 4);border:var(--border-size-small) solid var(--color-surface03);border-top:none;background:var(--color-surface01)}.results{overflow:auto;max-height:var(--z-searchbar-results-height, 540px);padding:calc(var(--space-unit) / 2) calc(var(--space-unit) * 1.5);scrollbar-color:var(--color-primary01) transparent}.results::-webkit-scrollbar{width:10px;background:linear-gradient(to right, transparent 0 3px, var(--gray200) 3px 7px, transparent 7px 10px);border-radius:var(--border-radius)}.results::-webkit-scrollbar-track{background-color:transparent}.results::-webkit-scrollbar-thumb{width:10px;background-color:var(--color-primary01);border-radius:var(--border-radius)}.results .category-heading{display:block;font-size:var(--font-size-2);font-weight:var(--font-rg);line-height:var(--font-size-3)}.results .category-heading>*{display:block}.results .category-heading>.category{color:var(--color-text05);font-style:italic}.results .category-heading>.subcategory{margin-top:var(--space-unit);color:var(--color-default-text);text-transform:uppercase}.results z-list-element{display:block}.results z-list-element>.list-element{display:-ms-flexbox;display:flex;-ms-flex-pack:justify;justify-content:space-between}.results z-list-element>.list-element>z-tag{border:1px solid var(--gray800);font-size:var(--font-size-1);font-weight:var(--font-sb);--z-tag-bg:var(--z-searchbar-tag-bg);--z-tag-text-color:var(--z-searchbar-tag-text-color)}.results .item{--z-icon-height:12px;--z-icon-width:12px;display:-ms-flexbox;display:flex;-ms-flex-flow:row nowrap;flex-flow:row nowrap;-ms-flex-align:center;align-items:center;-ms-flex-pack:start;justify-content:flex-start;color:var(--color-default-text);-webkit-column-gap:calc(var(--space-unit) * 1.5);-moz-column-gap:calc(var(--space-unit) * 1.5);column-gap:calc(var(--space-unit) * 1.5);fill:var(--color-default-icon);font-size:var(--font-size-2);line-height:var(--font-size-3)}.results .item.ellipsis>.item-label{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.results .item>.item-label mark{background:var(--color-primary03)}.results .item.has-category{padding-left:calc(var(--space-unit) * 3)}.results .item.item-search{--z-icon-height:16px;--z-icon-width:16px}.results .item-show-all{text-align:center}.results .item-no-results{display:block;font-size:var(--font-size-2);font-style:italic;line-height:var(--font-size-5)}.results .item-no-results>ul{padding-left:calc(var(--space-unit) * 2);margin:var(--space-unit)}@media (min-width: 768px){.results .category-heading{font-size:var(--font-size-3);line-height:var(--font-size-6)}.results .item{font-size:var(--font-size-3);line-height:var(--font-size-6)}.results .item.item-search{--z-icon-height:18px;--z-icon-width:18px}.results .item.ellipsis>.item-label{height:24px}}@media (min-width: 1152px){.results .item{cursor:pointer}.results .item-no-results{cursor:default;font-size:var(--font-size-3);line-height:var(--font-size-6)}}:host([size=\"small\"]) .results :is(.item,.category-heading),:host([size=\"x-small\"]) .results :is(.item,.category-heading){font-size:var(--font-size-2)}:host([size=\"small\"]) .results .item:not(.has-category),:host([size=\"x-small\"]) .results .item:not(.has-category){--z-icon-height:16px;--z-icon-width:16px}:host([size=\"small\"])::part(list-item-container){min-height:calc(var(--space-unit) * 4.5);padding:0}:host([size=\"x-small\"])::part(list-item-container){min-height:calc(var(--space-unit) * 4);padding:0}";
|
|
2867
1651
|
const ZSearchbarStyle0 = stylesCss$1;
|
|
2868
1652
|
|
|
2869
1653
|
const ZSearchbar = class {
|
|
@@ -3120,17 +1904,14 @@ ZTag.style = ZTagStyle0;
|
|
|
3120
1904
|
exports.z_app_header = ZAppHeader;
|
|
3121
1905
|
exports.z_button = ZButton;
|
|
3122
1906
|
exports.z_divider = ZDivider;
|
|
3123
|
-
exports.z_dragdrop_area = ZDragdropArea;
|
|
3124
|
-
exports.z_file_upload = ZFileUpload;
|
|
3125
1907
|
exports.z_icon = ZIcon;
|
|
3126
1908
|
exports.z_input = ZInput;
|
|
3127
1909
|
exports.z_input_message = ZInputMessage;
|
|
3128
1910
|
exports.z_list = ZList;
|
|
3129
1911
|
exports.z_list_element = ZListElement;
|
|
3130
1912
|
exports.z_list_group = ZListGroup;
|
|
3131
|
-
exports.z_modal = ZModal;
|
|
3132
1913
|
exports.z_offcanvas = ZOffcanvas;
|
|
3133
1914
|
exports.z_searchbar = ZSearchbar;
|
|
3134
1915
|
exports.z_tag = ZTag;
|
|
3135
1916
|
|
|
3136
|
-
//# sourceMappingURL=z-app-
|
|
1917
|
+
//# sourceMappingURL=z-app-header_12.cjs.entry.js.map
|