@swisspost/design-system-components 9.0.0-next.8 → 9.0.0-next.9
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/dist/cjs/check-url-3ffdd2fb.js +14 -0
- package/dist/cjs/debounce-1151afe3.js +12 -0
- package/dist/cjs/{index-e1f32cce.js → index-010dc207.js} +20 -27
- package/dist/cjs/{index-824d2b71.js → index-5d4e0aed.js} +2 -12
- package/dist/cjs/index.cjs.js +45 -42
- package/dist/cjs/loader.cjs.js +2 -2
- package/dist/cjs/{package-a2b895fc.js → package-8e810a59.js} +1 -1
- package/dist/cjs/{post-accordion-3ce01432.js → post-accordion-b9df8522.js} +2 -2
- package/dist/cjs/{post-accordion-item-81601b1e.js → post-accordion-item-ecc6749f.js} +8 -7
- package/dist/cjs/post-accordion-item.cjs.entry.js +5 -4
- package/dist/cjs/post-accordion.cjs.entry.js +3 -3
- package/dist/cjs/{post-avatar-b1c97f51.js → post-avatar-f7236084.js} +2 -2
- package/dist/cjs/post-avatar.cjs.entry.js +3 -3
- package/dist/cjs/post-back-to-top-60762f8e.js +75 -0
- package/dist/cjs/post-back-to-top.cjs.entry.js +4 -3
- package/dist/cjs/{post-banner-8611eab5.js → post-banner-9662f22c.js} +3 -3
- package/dist/cjs/post-banner.cjs.entry.js +5 -4
- package/dist/cjs/post-breadcrumb-b40732fc.js +111 -0
- package/dist/cjs/post-breadcrumb-item_2.cjs.entry.js +17 -0
- package/dist/cjs/post-breadcrumb.cjs.entry.js +13 -0
- package/dist/cjs/{post-card-control-acd30573.js → post-card-control-039c9a4b.js} +4 -4
- package/dist/cjs/post-card-control.cjs.entry.js +3 -3
- package/dist/cjs/post-closebutton_15.cjs.entry.js +33 -0
- package/dist/cjs/{post-collapsible-trigger-8ca4d85b.js → post-collapsible-trigger-143cf84a.js} +6 -14
- package/dist/cjs/post-collapsible_2.cjs.entry.js +6 -4
- package/dist/cjs/post-components.cjs.js +2 -2
- package/dist/cjs/post-footer-5f7fdf96.js +84 -0
- package/dist/cjs/post-footer.cjs.entry.js +11 -0
- package/dist/cjs/post-menu-item-bb0b0b9e.js +74 -0
- package/dist/cjs/{post-popover-c4f50134.js → post-popover-d0ce9dc6.js} +3 -3
- package/dist/cjs/post-popover.cjs.entry.js +3 -3
- package/dist/cjs/{post-rating-3a87ca46.js → post-rating-1082197c.js} +3 -3
- package/dist/cjs/post-rating.cjs.entry.js +3 -3
- package/dist/cjs/{post-tab-header-5fdb05a1.js → post-tab-header-4b6d8d54.js} +3 -3
- package/dist/cjs/post-tab-header.cjs.entry.js +3 -3
- package/dist/cjs/{post-tab-panel-34aed8e6.js → post-tab-panel-60f211a5.js} +3 -3
- package/dist/cjs/post-tab-panel.cjs.entry.js +3 -3
- package/dist/cjs/{post-tabs-dd2da5d2.js → post-tabs-1f797ce4.js} +8 -6
- package/dist/cjs/post-tabs.cjs.entry.js +3 -3
- package/dist/cjs/{post-tag-59232922.js → post-tag-ddaaaedc.js} +3 -3
- package/dist/cjs/post-tag.cjs.entry.js +3 -3
- package/dist/cjs/{post-megadropdown-trigger-7376d867.js → post-togglebutton-0984a694.js} +1789 -1234
- package/dist/cjs/{post-tooltip-3e0c1509.js → post-tooltip-38c839a4.js} +4 -4
- package/dist/cjs/post-tooltip.cjs.entry.js +5 -4
- package/dist/cjs/slide-5d51abe8.js +28 -0
- package/dist/collection/animations/slide.js +4 -4
- package/dist/collection/collection-manifest.json +12 -9
- package/dist/collection/components/post-accordion-item/post-accordion-item.js +7 -4
- package/dist/collection/components/post-back-to-top/post-back-to-top.css +1 -1
- package/dist/collection/components/post-back-to-top/post-back-to-top.js +2 -2
- package/dist/collection/components/post-breadcrumb/post-breadcrumb.css +3 -0
- package/dist/collection/components/post-breadcrumb/post-breadcrumb.js +161 -0
- package/dist/collection/components/post-breadcrumb-item/post-breadcrumb-item.css +1 -1
- package/dist/collection/components/post-breadcrumb-item/post-breadcrumb-item.js +11 -1
- package/dist/collection/components/post-card-control/post-card-control.js +2 -2
- package/dist/collection/components/post-closebutton/post-closebutton.js +1 -1
- package/dist/collection/components/post-collapsible/post-collapsible.js +1 -1
- package/dist/collection/components/post-footer/post-footer.css +1 -0
- package/dist/collection/components/post-footer/post-footer.js +75 -0
- package/dist/collection/components/post-header/post-header.css +1 -1
- package/dist/collection/components/post-header/post-header.js +74 -17
- package/dist/collection/components/post-icon/post-icon.js +1 -1
- package/dist/collection/components/post-language-option/post-language-option.css +1 -1
- package/dist/collection/components/post-language-option/post-language-option.js +25 -1
- package/dist/collection/components/post-language-switch/post-language-switch.css +1 -0
- package/dist/collection/components/post-language-switch/post-language-switch.js +163 -0
- package/dist/collection/components/post-language-switch/switch-variants.js +1 -0
- package/dist/collection/components/post-list/post-list.css +1 -1
- package/dist/collection/components/post-list/post-list.js +3 -3
- package/dist/collection/components/post-list-item/post-list-item.js +1 -1
- package/dist/collection/components/post-logo/post-logo.js +1 -1
- package/dist/collection/components/post-mainnavigation/post-mainnavigation.css +1 -1
- package/dist/collection/components/post-mainnavigation/post-mainnavigation.js +15 -24
- package/dist/collection/components/post-megadropdown/post-megadropdown.css +1 -1
- package/dist/collection/components/post-megadropdown/post-megadropdown.js +82 -68
- package/dist/collection/components/post-megadropdown-trigger/post-megadropdown-trigger.css +1 -1
- package/dist/collection/components/post-megadropdown-trigger/post-megadropdown-trigger.js +80 -24
- package/dist/collection/components/post-menu/post-menu.js +6 -4
- package/dist/collection/components/post-menu-item/post-menu-item.js +1 -1
- package/dist/collection/components/post-menu-trigger/post-menu-trigger.js +11 -1
- package/dist/collection/components/post-popover/post-popover.js +1 -1
- package/dist/collection/components/post-popovercontainer/post-popovercontainer.js +2 -2
- package/dist/collection/components/post-rating/post-rating.js +1 -1
- package/dist/collection/components/post-tab-header/post-tab-header.js +1 -1
- package/dist/collection/components/post-tab-panel/post-tab-panel.js +1 -1
- package/dist/collection/components/post-tabs/post-tabs.js +6 -4
- package/dist/collection/components/post-tag/post-tag.js +1 -1
- package/dist/collection/components/post-togglebutton/post-togglebutton.css +1 -1
- package/dist/collection/components/post-togglebutton/post-togglebutton.js +24 -6
- package/dist/collection/components/post-tooltip/post-tooltip.js +1 -1
- package/dist/collection/index.js +12 -9
- package/dist/collection/utils/breakpoints.js +46 -0
- package/dist/components/debounce.js +10 -0
- package/dist/components/index.js +12 -9
- package/dist/components/index2.js +1 -1
- package/dist/components/package.js +1 -1
- package/dist/components/post-accordion-item2.js +5 -4
- package/dist/components/post-back-to-top2.js +4 -27
- package/dist/components/post-breadcrumb-item2.js +13 -3
- package/dist/components/post-breadcrumb.d.ts +11 -0
- package/dist/components/post-breadcrumb.js +6 -0
- package/dist/components/post-breadcrumb2.js +168 -0
- package/dist/components/post-card-control2.js +2 -2
- package/dist/components/post-closebutton2.js +1 -1
- package/dist/components/post-collapsible-trigger2.js +1 -9
- package/dist/components/post-collapsible2.js +2 -2
- package/dist/components/post-footer.d.ts +11 -0
- package/dist/components/post-footer.js +6 -0
- package/dist/components/post-footer2.js +124 -0
- package/dist/components/post-header2.js +55 -14
- package/dist/components/post-icon2.js +2 -2
- package/dist/components/post-language-option2.js +5 -3
- package/dist/components/post-language-switch.d.ts +11 -0
- package/dist/components/post-language-switch.js +6 -0
- package/dist/components/post-language-switch2.js +146 -0
- package/dist/components/post-list-item2.js +1 -1
- package/dist/components/post-list2.js +4 -4
- package/dist/components/post-logo2.js +2 -2
- package/dist/components/post-mainnavigation2.js +17 -17
- package/dist/components/post-megadropdown-trigger2.js +63 -11
- package/dist/components/post-megadropdown2.js +48 -22
- package/dist/components/post-menu-item2.js +1 -1
- package/dist/components/post-menu-trigger2.js +11 -1
- package/dist/components/post-menu2.js +6 -4
- package/dist/components/post-popover2.js +1 -1
- package/dist/components/post-popovercontainer2.js +2 -2
- package/dist/components/post-rating2.js +1 -1
- package/dist/components/post-tab-header2.js +1 -1
- package/dist/components/post-tab-panel2.js +1 -1
- package/dist/components/post-tabs2.js +6 -4
- package/dist/components/post-tag2.js +1 -1
- package/dist/components/post-togglebutton2.js +23 -5
- package/dist/components/post-tooltip2.js +2 -2
- package/dist/components/slide.js +25 -0
- package/dist/docs.json +500 -123
- package/dist/esm/check-url-a974431e.js +12 -0
- package/dist/esm/debounce-abe98cc2.js +10 -0
- package/dist/esm/{index-f8a00dc0.js → index-b49c9904.js} +1 -11
- package/dist/esm/{index-e1b64755.js → index-fb8d6be7.js} +20 -27
- package/dist/esm/index.js +24 -24
- package/dist/esm/loader.js +3 -3
- package/dist/esm/package-4d81f3c2.js +3 -0
- package/dist/esm/{post-accordion-19e88941.js → post-accordion-ee54a3ef.js} +2 -2
- package/dist/esm/{post-accordion-item-33bbe4de.js → post-accordion-item-e10452dc.js} +8 -7
- package/dist/esm/post-accordion-item.entry.js +5 -4
- package/dist/esm/post-accordion.entry.js +3 -3
- package/dist/esm/{post-avatar-d15a9f9e.js → post-avatar-5572fa73.js} +2 -2
- package/dist/esm/post-avatar.entry.js +3 -3
- package/dist/esm/post-back-to-top-1d823c43.js +73 -0
- package/dist/esm/post-back-to-top.entry.js +4 -3
- package/dist/esm/{post-banner-bf5e6a18.js → post-banner-78480475.js} +3 -3
- package/dist/esm/post-banner.entry.js +5 -4
- package/dist/esm/post-breadcrumb-aaa77f74.js +109 -0
- package/dist/esm/post-breadcrumb-item_2.entry.js +8 -0
- package/dist/esm/post-breadcrumb.entry.js +5 -0
- package/dist/esm/{post-card-control-f0788f6f.js → post-card-control-862aa961.js} +4 -4
- package/dist/esm/post-card-control.entry.js +3 -3
- package/dist/esm/post-closebutton_15.entry.js +11 -0
- package/dist/esm/{post-collapsible-trigger-1d939eb6.js → post-collapsible-trigger-1c7833f8.js} +5 -13
- package/dist/esm/post-collapsible_2.entry.js +6 -4
- package/dist/esm/post-components.js +3 -3
- package/dist/esm/post-footer-b18875e7.js +82 -0
- package/dist/esm/post-footer.entry.js +3 -0
- package/dist/esm/post-menu-item-2906384b.js +71 -0
- package/dist/esm/{post-popover-7195d05a.js → post-popover-2432bb3f.js} +3 -3
- package/dist/esm/post-popover.entry.js +3 -3
- package/dist/esm/{post-rating-8baf86fe.js → post-rating-95cbdbb8.js} +3 -3
- package/dist/esm/post-rating.entry.js +3 -3
- package/dist/esm/{post-tab-header-a1d1d9d0.js → post-tab-header-dfea00ea.js} +3 -3
- package/dist/esm/post-tab-header.entry.js +3 -3
- package/dist/esm/{post-tab-panel-afce8d40.js → post-tab-panel-cafd9e04.js} +3 -3
- package/dist/esm/post-tab-panel.entry.js +3 -3
- package/dist/esm/{post-tabs-fbb42496.js → post-tabs-beef8eae.js} +8 -6
- package/dist/esm/post-tabs.entry.js +3 -3
- package/dist/esm/{post-tag-d67b6a19.js → post-tag-a77e7af6.js} +3 -3
- package/dist/esm/post-tag.entry.js +3 -3
- package/dist/esm/{post-megadropdown-trigger-210b4ab3.js → post-togglebutton-395bf3f0.js} +1785 -1235
- package/dist/esm/{post-tooltip-7101ed24.js → post-tooltip-b298039a.js} +4 -4
- package/dist/esm/post-tooltip.entry.js +5 -4
- package/dist/esm/slide-3422b8a3.js +25 -0
- package/dist/post-components/index.esm.js +1 -1
- package/dist/post-components/p-0711f76d.entry.js +1 -0
- package/dist/post-components/p-095a06f6.entry.js +1 -0
- package/dist/post-components/p-0b5a5f32.js +1 -0
- package/dist/post-components/{p-f0f8427e.js → p-135fa60f.js} +1 -1
- package/dist/post-components/p-18e38d8a.js +1 -0
- package/dist/post-components/p-2e1ec074.entry.js +1 -0
- package/dist/post-components/p-4202b433.entry.js +1 -0
- package/dist/post-components/p-45773f59.js +1 -0
- package/dist/post-components/{p-282115c4.js → p-4953de7e.js} +1 -1
- package/dist/post-components/p-4f67c5f5.entry.js +1 -0
- package/dist/post-components/{p-6cea23cd.js → p-4f9746f6.js} +2 -2
- package/dist/post-components/p-5075c672.entry.js +1 -0
- package/dist/post-components/p-515e0f96.js +1 -0
- package/dist/post-components/p-5467b223.js +1 -0
- package/dist/post-components/p-67036798.entry.js +1 -0
- package/dist/post-components/{p-d0b8820a.js → p-6d953fb2.js} +1 -1
- package/dist/post-components/p-6edb0ac5.js +1 -0
- package/dist/post-components/{p-939f2ba7.js → p-6f8f39ca.js} +1 -1
- package/dist/post-components/p-7503a623.js +1 -0
- package/dist/post-components/p-761b24c7.entry.js +1 -0
- package/dist/post-components/{p-00fa0152.js → p-77c4c1d2.js} +1 -1
- package/dist/post-components/p-7cf0c2ad.js +1 -0
- package/dist/post-components/p-856c14d6.entry.js +1 -0
- package/dist/post-components/p-866bf50a.entry.js +1 -0
- package/dist/post-components/p-8d621781.js +1 -0
- package/dist/post-components/p-8fe2d72c.entry.js +1 -0
- package/dist/post-components/p-9ad5088f.entry.js +1 -0
- package/dist/post-components/{p-485dafcf.js → p-a1d2b90e.js} +1 -1
- package/dist/post-components/p-a521419d.entry.js +1 -0
- package/dist/post-components/p-aa538648.js +1 -0
- package/dist/post-components/p-afdbee2f.js +1 -0
- package/dist/post-components/p-b02817f2.entry.js +1 -0
- package/dist/post-components/p-b157dcba.entry.js +1 -0
- package/dist/post-components/p-b22656b1.js +1 -0
- package/dist/post-components/{p-61e79941.js → p-bdbd11cb.js} +1 -1
- package/dist/post-components/{p-3eab790d.js → p-c0ae9886.js} +1 -1
- package/dist/post-components/p-c537e196.entry.js +1 -0
- package/dist/post-components/p-d4f93f2b.js +1 -0
- package/dist/post-components/p-dca4246a.entry.js +1 -0
- package/dist/post-components/{p-f627744e.js → p-f319b026.js} +1 -1
- package/dist/post-components/{p-ccb6dfa1.js → p-f4b7b379.js} +1 -1
- package/dist/post-components/p-fac66087.entry.js +1 -0
- package/dist/post-components/post-components.esm.js +1 -1
- package/dist/types/components/post-accordion-item/post-accordion-item.d.ts +2 -0
- package/dist/types/components/post-back-to-top/post-back-to-top.d.ts +3 -3
- package/dist/types/components/post-breadcrumb/post-breadcrumb.d.ts +30 -0
- package/dist/types/components/post-breadcrumb-item/post-breadcrumb-item.d.ts +1 -0
- package/dist/types/components/post-footer/post-footer.d.ts +23 -0
- package/dist/types/components/post-header/post-header.d.ts +13 -5
- package/dist/types/components/post-language-option/post-language-option.d.ts +5 -0
- package/dist/types/components/post-language-switch/post-language-switch.d.ts +31 -0
- package/dist/types/components/post-language-switch/switch-variants.d.ts +2 -0
- package/dist/types/components/post-mainnavigation/post-mainnavigation.d.ts +10 -1
- package/dist/types/components/post-megadropdown/post-megadropdown.d.ts +24 -12
- package/dist/types/components/post-megadropdown-trigger/post-megadropdown-trigger.d.ts +20 -5
- package/dist/types/components/post-menu/post-menu.d.ts +1 -0
- package/dist/types/components/post-togglebutton/post-togglebutton.d.ts +4 -2
- package/dist/types/components.d.ts +129 -29
- package/dist/types/index.d.ts +12 -9
- package/dist/types/utils/breakpoints.d.ts +11 -0
- package/loaders/debounce.js +10 -0
- package/loaders/index.d.ts +6 -0
- package/loaders/index.js +3 -0
- package/loaders/index2.js +1 -1
- package/loaders/package.js +1 -1
- package/loaders/post-accordion-item.js +1 -99
- package/loaders/post-accordion-item2.js +102 -0
- package/loaders/post-back-to-top.js +4 -27
- package/loaders/post-banner.js +1 -1
- package/loaders/post-breadcrumb-item.js +1 -70
- package/loaders/post-breadcrumb-item2.js +82 -0
- package/loaders/post-breadcrumb.d.ts +11 -0
- package/loaders/post-breadcrumb.js +171 -0
- package/loaders/post-card-control.js +2 -2
- package/loaders/post-closebutton.js +1 -1
- package/loaders/post-collapsible-trigger2.js +1 -9
- package/loaders/post-collapsible2.js +1 -1
- package/loaders/post-footer.d.ts +11 -0
- package/loaders/post-footer.js +127 -0
- package/loaders/post-header.js +55 -14
- package/loaders/post-icon2.js +2 -2
- package/loaders/post-language-option.js +4 -2
- package/loaders/post-language-switch.d.ts +11 -0
- package/loaders/post-language-switch.js +149 -0
- package/loaders/post-list-item.js +1 -1
- package/loaders/post-list.js +4 -4
- package/loaders/post-logo.js +2 -2
- package/loaders/post-mainnavigation.js +17 -17
- package/loaders/post-megadropdown-trigger.js +63 -11
- package/loaders/post-megadropdown.js +48 -22
- package/loaders/post-menu-item.js +1 -31
- package/loaders/post-menu-item2.js +33 -0
- package/loaders/post-menu-trigger.js +1 -90
- package/{dist/esm/post-menu-trigger-80c2bdf4.js → loaders/post-menu-trigger2.js} +41 -12
- package/loaders/post-menu.js +1 -199
- package/{dist/esm/post-menu-e853e28b.js → loaders/post-menu2.js} +42 -13
- package/loaders/post-popover.js +1 -1
- package/loaders/post-popovercontainer2.js +2 -2
- package/loaders/post-rating.js +1 -1
- package/loaders/post-tab-header.js +1 -1
- package/loaders/post-tab-panel.js +1 -1
- package/loaders/post-tabs.js +6 -4
- package/loaders/post-tag.js +1 -1
- package/loaders/post-togglebutton.js +23 -5
- package/loaders/post-tooltip.js +1 -1
- package/loaders/slide.js +25 -0
- package/package.json +5 -4
- package/dist/cjs/post-back-to-top-0ce98569.js +0 -98
- package/dist/cjs/post-breadcrumb-item-2075462a.js +0 -49
- package/dist/cjs/post-breadcrumb-item.cjs.entry.js +0 -15
- package/dist/cjs/post-closebutton_10.cjs.entry.js +0 -25
- package/dist/cjs/post-language-option-cf32d0ed.js +0 -68
- package/dist/cjs/post-language-option.cjs.entry.js +0 -15
- package/dist/cjs/post-menu-a3b7b63b.js +0 -176
- package/dist/cjs/post-menu-item-28ab1a72.js +0 -20
- package/dist/cjs/post-menu-item.cjs.entry.js +0 -11
- package/dist/cjs/post-menu-trigger-821839f5.js +0 -75
- package/dist/cjs/post-menu-trigger.cjs.entry.js +0 -13
- package/dist/cjs/post-menu.cjs.entry.js +0 -11
- package/dist/cjs/post-togglebutton-59c6357b.js +0 -28
- package/dist/cjs/post-togglebutton.cjs.entry.js +0 -11
- package/dist/esm/package-9cafe148.js +0 -3
- package/dist/esm/post-back-to-top-bcf46150.js +0 -96
- package/dist/esm/post-breadcrumb-item-e3b41f74.js +0 -47
- package/dist/esm/post-breadcrumb-item.entry.js +0 -7
- package/dist/esm/post-closebutton_10.entry.js +0 -8
- package/dist/esm/post-language-option-1436370d.js +0 -66
- package/dist/esm/post-language-option.entry.js +0 -7
- package/dist/esm/post-menu-item-86d4c7ab.js +0 -18
- package/dist/esm/post-menu-item.entry.js +0 -3
- package/dist/esm/post-menu-trigger.entry.js +0 -5
- package/dist/esm/post-menu.entry.js +0 -3
- package/dist/esm/post-togglebutton-c3fb912d.js +0 -26
- package/dist/esm/post-togglebutton.entry.js +0 -3
- package/dist/post-components/p-0338f9da.js +0 -1
- package/dist/post-components/p-1667387e.entry.js +0 -1
- package/dist/post-components/p-19551c18.entry.js +0 -1
- package/dist/post-components/p-1b627f80.js +0 -1
- package/dist/post-components/p-24673919.js +0 -1
- package/dist/post-components/p-266b734f.entry.js +0 -1
- package/dist/post-components/p-2d0ffc1e.entry.js +0 -1
- package/dist/post-components/p-45018d7e.entry.js +0 -1
- package/dist/post-components/p-4a647a78.js +0 -1
- package/dist/post-components/p-4abfa65b.js +0 -1
- package/dist/post-components/p-517f2b1f.entry.js +0 -1
- package/dist/post-components/p-55224ee7.entry.js +0 -1
- package/dist/post-components/p-558a9849.js +0 -1
- package/dist/post-components/p-59b31557.js +0 -1
- package/dist/post-components/p-5d1db85c.entry.js +0 -1
- package/dist/post-components/p-679978de.entry.js +0 -1
- package/dist/post-components/p-6a842b96.entry.js +0 -1
- package/dist/post-components/p-71f03424.js +0 -1
- package/dist/post-components/p-8c2568c1.entry.js +0 -1
- package/dist/post-components/p-8fd3a3cb.entry.js +0 -1
- package/dist/post-components/p-a4c39296.entry.js +0 -1
- package/dist/post-components/p-af5d3b89.entry.js +0 -1
- package/dist/post-components/p-b4423249.entry.js +0 -1
- package/dist/post-components/p-c31a7d65.entry.js +0 -1
- package/dist/post-components/p-c544bb82.js +0 -1
- package/dist/post-components/p-d36adfb5.js +0 -1
- package/dist/post-components/p-da6a8268.entry.js +0 -1
- package/dist/post-components/p-ece14d88.js +0 -1
- package/dist/post-components/p-f2e1b4d8.js +0 -1
- package/dist/post-components/p-f7b6b96a.entry.js +0 -1
- package/dist/post-components/p-f812e93d.entry.js +0 -1
- package/dist/post-components/p-f8d41c32.js +0 -1
- package/dist/post-components/p-fe516cdf.entry.js +0 -1
- package/dist/post-components/p-fe7467fb.entry.js +0 -1
package/loaders/slide.js
ADDED
|
@@ -0,0 +1,25 @@
|
|
|
1
|
+
const easing = 'ease';
|
|
2
|
+
const duration = 500;
|
|
3
|
+
const fill = 'forwards';
|
|
4
|
+
const slideUp = (el, translateSize = '100%') => {
|
|
5
|
+
return el.animate([
|
|
6
|
+
{ transform: `translateY(${translateSize})` }, // Starting position (no translation)
|
|
7
|
+
{ transform: 'translateY(0)' }, // End position
|
|
8
|
+
], {
|
|
9
|
+
duration: duration,
|
|
10
|
+
easing,
|
|
11
|
+
fill,
|
|
12
|
+
});
|
|
13
|
+
};
|
|
14
|
+
const slideDown = (el, translateSize = '100%') => {
|
|
15
|
+
return el.animate([
|
|
16
|
+
{ transform: 'translateY(0)' }, // Starting position (no translation)
|
|
17
|
+
{ transform: `translateY(${translateSize})` }, // End position
|
|
18
|
+
], {
|
|
19
|
+
duration: duration,
|
|
20
|
+
easing,
|
|
21
|
+
fill,
|
|
22
|
+
});
|
|
23
|
+
};
|
|
24
|
+
|
|
25
|
+
export { slideDown as a, slideUp as s };
|
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@swisspost/design-system-components",
|
|
3
|
-
"version": "9.0.0-next.
|
|
3
|
+
"version": "9.0.0-next.9",
|
|
4
4
|
"description": "A collection of web components built with Stencil JS for the Swiss Post Design System.",
|
|
5
5
|
"license": "Apache-2.0",
|
|
6
6
|
"main": "dist/index.cjs.js",
|
|
@@ -26,10 +26,11 @@
|
|
|
26
26
|
"dependencies": {
|
|
27
27
|
"@floating-ui/dom": "1.6.8",
|
|
28
28
|
"@oddbird/popover-polyfill": "0.3.7",
|
|
29
|
-
"@swisspost/design-system-
|
|
30
|
-
"@swisspost/design-system-
|
|
29
|
+
"@swisspost/design-system-icons": "9.0.0-next.9",
|
|
30
|
+
"@swisspost/design-system-styles": "9.0.0-next.9",
|
|
31
31
|
"ally.js": "1.4.1",
|
|
32
|
-
"long-press-event": "2.5.0"
|
|
32
|
+
"long-press-event": "2.5.0",
|
|
33
|
+
"nanoid": "5.0.9"
|
|
33
34
|
},
|
|
34
35
|
"devDependencies": {
|
|
35
36
|
"@percy/cli": "1.29.1",
|
|
@@ -1,98 +0,0 @@
|
|
|
1
|
-
'use strict';
|
|
2
|
-
|
|
3
|
-
const index = require('./index-e1f32cce.js');
|
|
4
|
-
const _package = require('./package-a2b895fc.js');
|
|
5
|
-
const checkType = require('./check-type-64af82a9.js');
|
|
6
|
-
const checkNonEmpty = require('./check-non-empty-eeaa8f77.js');
|
|
7
|
-
|
|
8
|
-
const easing = 'ease';
|
|
9
|
-
const duration = 500;
|
|
10
|
-
const fill = 'forwards';
|
|
11
|
-
const slideUp = (el, translateSize = '8rem') => {
|
|
12
|
-
return el.animate([
|
|
13
|
-
{ transform: `translateY(-${translateSize})` }, // Starting position (no translation)
|
|
14
|
-
{ transform: 'translateY(0)' }, // End position
|
|
15
|
-
], {
|
|
16
|
-
duration: duration,
|
|
17
|
-
easing,
|
|
18
|
-
fill,
|
|
19
|
-
});
|
|
20
|
-
};
|
|
21
|
-
const slideDown = (el, translateSize = '8rem') => {
|
|
22
|
-
return el.animate([
|
|
23
|
-
{ transform: 'translateY(0)' }, // Starting position (no translation)
|
|
24
|
-
{ transform: `translateY(-${translateSize})` }, // End position
|
|
25
|
-
], {
|
|
26
|
-
duration: duration,
|
|
27
|
-
easing,
|
|
28
|
-
fill,
|
|
29
|
-
});
|
|
30
|
-
};
|
|
31
|
-
|
|
32
|
-
const postBackToTopCss = ":host{--post-floating-button-translate-y:var(--post-core-dimension-112);position:fixed;top:var(--post-device-position-1);right:var(--post-device-position-1)}:host .back-to-top{padding:0;overflow:visible;border:0;background:none;color:inherit;font:inherit;-webkit-user-select:none;user-select:none;appearance:button;box-shadow:.5px 3px 4px rgba(0,0,0,.1),2px 4px 10px 4px rgba(0,0,0,.12);cursor:pointer;border-radius:var(--post-device-border-radius-round);width:var(--post-device-sizing-interactive-button-height-2);height:var(--post-device-sizing-interactive-button-height-2);border:var(--post-device-border-width-default) solid var(--post-scheme-color-interactive-button-secondary-enabled-stroke);color:var(--post-scheme-color-interactive-button-secondary-enabled-fg);background-color:var(--post-scheme-color-interactive-button-secondary-enabled-bg);display:flex;align-items:center;justify-content:center}:host .back-to-top{outline-offset:var(--post-device-spacing-padding-2) !important;outline:var(--post-scheme-color-interactive-focus-stroke) none var(--post-device-border-width-focus) !important}:host .back-to-top:is(:focus-visible,:has(:focus-visible),.pretend-focus){outline-style:var(--post-core-border-style-solid) !important}@media (forced-colors: active),(-ms-high-contrast: active),(-ms-high-contrast: white-on-black){:host .back-to-top:is(:focus-visible,:has(:focus-visible),.pretend-focus){outline-color:Highlight !important}}@supports not selector(:has(:focus-visible)){:host .back-to-top:is(:focus-visible,:focus-within,.pretend-focus){outline-style:var(--post-core-border-style-solid) !important}@media (forced-colors: active),(-ms-high-contrast: active),(-ms-high-contrast: white-on-black){:host .back-to-top:is(:focus-visible,:focus-within,.pretend-focus){outline-color:Highlight !important}}}:host .back-to-top:hover{border-color:var(--post-scheme-color-interactive-button-secondary-hover-stroke);color:var(--post-scheme-color-interactive-button-secondary-hover-fg);background-color:var(--post-scheme-color-interactive-button-secondary-hover-bg)}:host .back-to-top post-icon{height:var(--post-device-sizing-interactive-button-icon-3);width:var(--post-device-sizing-interactive-button-icon-3)}:host .visually-hidden{position:absolute;width:1px;height:1px;margin:-1px;padding:0;overflow:hidden;clip:rect(0 0 0 0);border:0}";
|
|
33
|
-
const PostBackToTopStyle0 = postBackToTopCss;
|
|
34
|
-
|
|
35
|
-
const PostBackToTop = class {
|
|
36
|
-
constructor(hostRef) {
|
|
37
|
-
index.registerInstance(this, hostRef);
|
|
38
|
-
this.handleScroll = () => {
|
|
39
|
-
this.belowFold = this.isBelowFold();
|
|
40
|
-
};
|
|
41
|
-
this.label = undefined;
|
|
42
|
-
this.belowFold = false;
|
|
43
|
-
}
|
|
44
|
-
isBelowFold() {
|
|
45
|
-
return window.scrollY > window.innerHeight;
|
|
46
|
-
}
|
|
47
|
-
// Watch for changes in belowFold
|
|
48
|
-
watchBelowFold(newValue) {
|
|
49
|
-
if (newValue) {
|
|
50
|
-
slideUp(this.el, this.translateY);
|
|
51
|
-
}
|
|
52
|
-
else {
|
|
53
|
-
slideDown(this.el, this.translateY);
|
|
54
|
-
}
|
|
55
|
-
}
|
|
56
|
-
scrollToTop() {
|
|
57
|
-
window.scrollTo({
|
|
58
|
-
top: 0,
|
|
59
|
-
});
|
|
60
|
-
}
|
|
61
|
-
// Validate the label
|
|
62
|
-
validateLabel() {
|
|
63
|
-
checkType.checkType(this.label, 'string', 'The label property of the Back to Top component is required for accessibility purposes. Please ensure it is set.');
|
|
64
|
-
checkNonEmpty.checkNonEmpty(this.label, 'The label property of the Back to Top component must not be empty. Please provide a proper text for the label');
|
|
65
|
-
}
|
|
66
|
-
// Set the initial state
|
|
67
|
-
componentWillLoad() {
|
|
68
|
-
this.belowFold = this.isBelowFold();
|
|
69
|
-
}
|
|
70
|
-
componentDidLoad() {
|
|
71
|
-
window.addEventListener('scroll', this.handleScroll, false);
|
|
72
|
-
this.translateY = window
|
|
73
|
-
.getComputedStyle(this.el)
|
|
74
|
-
.getPropertyValue('--post-floating-button-translate-y');
|
|
75
|
-
if (!this.belowFold) {
|
|
76
|
-
this.el.style.transform = `translateY(-${this.translateY})`;
|
|
77
|
-
}
|
|
78
|
-
// Initial load
|
|
79
|
-
if (this.belowFold) {
|
|
80
|
-
slideUp(this.el, this.translateY);
|
|
81
|
-
}
|
|
82
|
-
this.validateLabel();
|
|
83
|
-
}
|
|
84
|
-
disconnectedCallback() {
|
|
85
|
-
window.removeEventListener('scroll', this.handleScroll);
|
|
86
|
-
}
|
|
87
|
-
render() {
|
|
88
|
-
return (index.h(index.Host, { key: '24d2bc9d7cc6a9cc2ffc7fb47196282993c49f02', "data-version": _package.version }, index.h("button", { key: '4ab2b8f8c812f202ec18461581541ef7f0134b63', class: "back-to-top", "aria-hidden": this.belowFold ? 'false' : 'true', tabindex: this.belowFold ? '0' : '-1', onClick: this.scrollToTop }, index.h("post-icon", { key: 'eb1ed42514d1187121625f9108e35dea86812ae4', "aria-hidden": "true", name: "3026" }), index.h("span", { key: '9215f4777c859b8225580a10bf2df48ab68f4eb1', class: "visually-hidden" }, this.label))));
|
|
89
|
-
}
|
|
90
|
-
get el() { return index.getElement(this); }
|
|
91
|
-
static get watchers() { return {
|
|
92
|
-
"belowFold": ["watchBelowFold"],
|
|
93
|
-
"label": ["validateLabel"]
|
|
94
|
-
}; }
|
|
95
|
-
};
|
|
96
|
-
PostBackToTop.style = PostBackToTopStyle0;
|
|
97
|
-
|
|
98
|
-
exports.PostBackToTop = PostBackToTop;
|
|
@@ -1,49 +0,0 @@
|
|
|
1
|
-
'use strict';
|
|
2
|
-
|
|
3
|
-
const index = require('./index-e1f32cce.js');
|
|
4
|
-
const _package = require('./package-a2b895fc.js');
|
|
5
|
-
const index$1 = require('./index-824d2b71.js');
|
|
6
|
-
|
|
7
|
-
const postBreadcrumbItemCss = ":host{display:inline-block}:host{outline-offset:var(--post-device-spacing-padding-2) !important;outline:var(--post-scheme-color-interactive-focus-stroke) none var(--post-device-border-width-focus) !important}:host:is(:focus-visible,:has(:focus-visible),.pretend-focus){outline-style:var(--post-core-border-style-solid) !important}@media (forced-colors: active),(-ms-high-contrast: active),(-ms-high-contrast: white-on-black){:host:is(:focus-visible,:has(:focus-visible),.pretend-focus){outline-color:Highlight !important}}@supports not selector(:has(:focus-visible)){:host:is(:focus-visible,:focus-within,.pretend-focus){outline-style:var(--post-core-border-style-solid) !important}@media (forced-colors: active),(-ms-high-contrast: active),(-ms-high-contrast: white-on-black){:host:is(:focus-visible,:focus-within,.pretend-focus){outline-color:Highlight !important}}}.breadcrumb-item{display:inline-flex;align-items:center;justify-content:center;padding-block:var(--post-device-spacing-padding-block-7);gap:var(--post-device-spacing-gap-inline-5);color:var(--post-scheme-color-interactive-primary-enabled-fg1);text-decoration:var(--post-core-text-decoration-none)}.breadcrumb-item post-icon{height:var(--post-core-dimension-24);width:var(--post-core-dimension-24)}.breadcrumb-item:hover{color:var(--post-scheme-color-interactive-primary-hover-fg1);text-decoration:var(--post-core-text-decoration-underline)}@media (forced-colors: active),(-ms-high-contrast: active),(-ms-high-contrast: white-on-black){.breadcrumb-item,.breadcrumb-item:focus,.breadcrumb-item:hover{color:LinkText !important}.breadcrumb-item:visited{color:VisitedText !important}}";
|
|
8
|
-
const PostBreadcrumbItemStyle0 = postBreadcrumbItemCss;
|
|
9
|
-
|
|
10
|
-
const PostBreadcrumbItem = class {
|
|
11
|
-
constructor(hostRef) {
|
|
12
|
-
index.registerInstance(this, hostRef);
|
|
13
|
-
this.url = undefined;
|
|
14
|
-
}
|
|
15
|
-
validateUrl() {
|
|
16
|
-
try {
|
|
17
|
-
this.validUrl = this.constructUrl(this.url);
|
|
18
|
-
}
|
|
19
|
-
catch (error) {
|
|
20
|
-
this.validUrl = undefined;
|
|
21
|
-
}
|
|
22
|
-
}
|
|
23
|
-
// Helper to construct a valid URL string or return undefined
|
|
24
|
-
constructUrl(value) {
|
|
25
|
-
const hasBaseURL = /^https?:\/\//.test(String(this.url));
|
|
26
|
-
if (typeof value === 'string') {
|
|
27
|
-
const urlString = hasBaseURL
|
|
28
|
-
? value
|
|
29
|
-
: `${window.location.origin}${value}`;
|
|
30
|
-
index$1.checkEmptyOrUrl(urlString, 'The "url" property of the post-breadcrumb-item is invalid');
|
|
31
|
-
return urlString;
|
|
32
|
-
}
|
|
33
|
-
return undefined;
|
|
34
|
-
}
|
|
35
|
-
connectedCallback() {
|
|
36
|
-
this.validateUrl();
|
|
37
|
-
}
|
|
38
|
-
render() {
|
|
39
|
-
const BreadcrumbTag = this.validUrl ? 'a' : 'span';
|
|
40
|
-
return (index.h(index.Host, { key: '0a161b7e3890549ea0a7645be6a4a1a407d81011', "data-version": _package.version }, index.h(BreadcrumbTag, Object.assign({ key: '5844d3d93b00ba0f9062dc9b3d8c91e6b7ac9e97', class: "breadcrumb-item" }, (this.validUrl ? { href: this.validUrl } : {})), index.h("post-icon", { key: '852b13f76a650c9952e5edc6266141d13eab6afa', name: "2111", class: "breadcrumb-item-icon" }), index.h("slot", { key: 'd4fbec6b09662b59aefd763be8323746c0b2bcd9' }))));
|
|
41
|
-
}
|
|
42
|
-
get host() { return index.getElement(this); }
|
|
43
|
-
static get watchers() { return {
|
|
44
|
-
"url": ["validateUrl"]
|
|
45
|
-
}; }
|
|
46
|
-
};
|
|
47
|
-
PostBreadcrumbItem.style = PostBreadcrumbItemStyle0;
|
|
48
|
-
|
|
49
|
-
exports.PostBreadcrumbItem = PostBreadcrumbItem;
|
|
@@ -1,15 +0,0 @@
|
|
|
1
|
-
'use strict';
|
|
2
|
-
|
|
3
|
-
Object.defineProperty(exports, '__esModule', { value: true });
|
|
4
|
-
|
|
5
|
-
const postBreadcrumbItem = require('./post-breadcrumb-item-2075462a.js');
|
|
6
|
-
require('./index-e1f32cce.js');
|
|
7
|
-
require('./package-a2b895fc.js');
|
|
8
|
-
require('./index-824d2b71.js');
|
|
9
|
-
require('./constants-238701d3.js');
|
|
10
|
-
require('./check-one-of-f4f5d0c0.js');
|
|
11
|
-
require('./check-type-64af82a9.js');
|
|
12
|
-
|
|
13
|
-
|
|
14
|
-
|
|
15
|
-
exports.post_breadcrumb_item = postBreadcrumbItem.PostBreadcrumbItem;
|
|
@@ -1,25 +0,0 @@
|
|
|
1
|
-
'use strict';
|
|
2
|
-
|
|
3
|
-
Object.defineProperty(exports, '__esModule', { value: true });
|
|
4
|
-
|
|
5
|
-
const postMegadropdownTrigger = require('./post-megadropdown-trigger-7376d867.js');
|
|
6
|
-
require('./index-e1f32cce.js');
|
|
7
|
-
require('./package-a2b895fc.js');
|
|
8
|
-
require('./index-824d2b71.js');
|
|
9
|
-
require('./constants-238701d3.js');
|
|
10
|
-
require('./check-one-of-f4f5d0c0.js');
|
|
11
|
-
require('./check-type-64af82a9.js');
|
|
12
|
-
require('./check-non-empty-eeaa8f77.js');
|
|
13
|
-
|
|
14
|
-
|
|
15
|
-
|
|
16
|
-
exports.post_closebutton = postMegadropdownTrigger.PostClosebutton;
|
|
17
|
-
exports.post_header = postMegadropdownTrigger.PostHeader;
|
|
18
|
-
exports.post_icon = postMegadropdownTrigger.PostIcon;
|
|
19
|
-
exports.post_list = postMegadropdownTrigger.PostList;
|
|
20
|
-
exports.post_list_item = postMegadropdownTrigger.PostListItem;
|
|
21
|
-
exports.post_logo = postMegadropdownTrigger.PostLogo;
|
|
22
|
-
exports.post_mainnavigation = postMegadropdownTrigger.PostMainnavigation;
|
|
23
|
-
exports.post_megadropdown = postMegadropdownTrigger.PostMegadropdown;
|
|
24
|
-
exports.post_megadropdown_trigger = postMegadropdownTrigger.PostMegadropdownTrigger;
|
|
25
|
-
exports.post_popovercontainer = postMegadropdownTrigger.PostPopovercontainer;
|
|
@@ -1,68 +0,0 @@
|
|
|
1
|
-
'use strict';
|
|
2
|
-
|
|
3
|
-
const index = require('./index-e1f32cce.js');
|
|
4
|
-
const index$1 = require('./index-824d2b71.js');
|
|
5
|
-
const _package = require('./package-a2b895fc.js');
|
|
6
|
-
const checkType = require('./check-type-64af82a9.js');
|
|
7
|
-
|
|
8
|
-
const postLanguageOptionCss = "/*!\n * Copyright 2021 by Swiss Post, Information Technology\n */:host{display:inline-block;width:fit-content}button{padding:0;overflow:visible;border:0;background:none;color:inherit;font:inherit;-webkit-user-select:none;user-select:none;appearance:button}a{color:inherit;text-decoration:none}:is(a,button){cursor:pointer;display:flex;align-items:center;justify-content:center;height:100%;width:100%;padding:var(--post-language-option-padding)}";
|
|
9
|
-
const PostLanguageOptionStyle0 = postLanguageOptionCss;
|
|
10
|
-
|
|
11
|
-
const PostLanguageOption = class {
|
|
12
|
-
constructor(hostRef) {
|
|
13
|
-
index.registerInstance(this, hostRef);
|
|
14
|
-
this.postChange = index.createEvent(this, "postChange", 7);
|
|
15
|
-
this.code = undefined;
|
|
16
|
-
this.active = undefined;
|
|
17
|
-
this.name = undefined;
|
|
18
|
-
this.url = undefined;
|
|
19
|
-
}
|
|
20
|
-
validateCode(value = this.code) {
|
|
21
|
-
checkType.checkType(value, 'string', 'The "code" property of the post-language-option component must be a string.');
|
|
22
|
-
}
|
|
23
|
-
validateActiveProp(value = this.active) {
|
|
24
|
-
index$1.checkEmptyOrType(value, 'boolean', 'The "active" property of the post-language-option component must be a boolean value.');
|
|
25
|
-
}
|
|
26
|
-
validateName(value = this.name) {
|
|
27
|
-
index$1.checkEmptyOrType(value, 'string', 'The "name" property of the post-language-option component must be a string.');
|
|
28
|
-
}
|
|
29
|
-
validateUrl(value = this.url) {
|
|
30
|
-
index$1.checkEmptyOrType(value, 'string', 'The "url" property of the post-language-option component must be a valid URL.');
|
|
31
|
-
}
|
|
32
|
-
componentDidLoad() {
|
|
33
|
-
this.validateCode();
|
|
34
|
-
this.validateActiveProp();
|
|
35
|
-
this.validateName();
|
|
36
|
-
this.validateUrl();
|
|
37
|
-
if (!this.name && this.isNameRequired()) {
|
|
38
|
-
throw new Error('The "name" property of the post-language-option component is required when the full language name is not displayed.');
|
|
39
|
-
}
|
|
40
|
-
}
|
|
41
|
-
/**
|
|
42
|
-
* Selects the language option programmatically.
|
|
43
|
-
*/
|
|
44
|
-
async select() {
|
|
45
|
-
this.active = true;
|
|
46
|
-
this.emitChange();
|
|
47
|
-
}
|
|
48
|
-
emitChange() {
|
|
49
|
-
this.postChange.emit(this.code);
|
|
50
|
-
}
|
|
51
|
-
isNameRequired() {
|
|
52
|
-
return this.host.textContent.toLowerCase() === this.code.toLowerCase();
|
|
53
|
-
}
|
|
54
|
-
render() {
|
|
55
|
-
const lang = this.code.toLowerCase();
|
|
56
|
-
return (index.h(index.Host, { key: '0a80e062fecb20c7277b89f49a4d774fda80a18e', "data-version": _package.version, role: "listitem" }, this.url ? (index.h("a", { "aria-current": this.active ? 'page' : undefined, "aria-label": this.name, href: this.url, hrefLang: lang, lang: lang, onClick: () => this.emitChange() }, index.h("slot", null))) : (index.h("button", { "aria-current": this.active ? 'true' : undefined, "aria-label": this.name, lang: lang, onClick: () => this.emitChange() }, index.h("slot", null)))));
|
|
57
|
-
}
|
|
58
|
-
get host() { return index.getElement(this); }
|
|
59
|
-
static get watchers() { return {
|
|
60
|
-
"code": ["validateCode"],
|
|
61
|
-
"active": ["validateActiveProp"],
|
|
62
|
-
"name": ["validateName"],
|
|
63
|
-
"url": ["validateUrl"]
|
|
64
|
-
}; }
|
|
65
|
-
};
|
|
66
|
-
PostLanguageOption.style = PostLanguageOptionStyle0;
|
|
67
|
-
|
|
68
|
-
exports.PostLanguageOption = PostLanguageOption;
|
|
@@ -1,15 +0,0 @@
|
|
|
1
|
-
'use strict';
|
|
2
|
-
|
|
3
|
-
Object.defineProperty(exports, '__esModule', { value: true });
|
|
4
|
-
|
|
5
|
-
const postLanguageOption = require('./post-language-option-cf32d0ed.js');
|
|
6
|
-
require('./index-e1f32cce.js');
|
|
7
|
-
require('./index-824d2b71.js');
|
|
8
|
-
require('./constants-238701d3.js');
|
|
9
|
-
require('./check-one-of-f4f5d0c0.js');
|
|
10
|
-
require('./check-type-64af82a9.js');
|
|
11
|
-
require('./package-a2b895fc.js');
|
|
12
|
-
|
|
13
|
-
|
|
14
|
-
|
|
15
|
-
exports.post_language_option = postLanguageOption.PostLanguageOption;
|
|
@@ -1,176 +0,0 @@
|
|
|
1
|
-
'use strict';
|
|
2
|
-
|
|
3
|
-
const index = require('./index-e1f32cce.js');
|
|
4
|
-
const _package = require('./package-a2b895fc.js');
|
|
5
|
-
|
|
6
|
-
const focusableSelector = `:where(${[
|
|
7
|
-
'button',
|
|
8
|
-
'input:not([type="hidden"])',
|
|
9
|
-
'[tabindex]',
|
|
10
|
-
'select',
|
|
11
|
-
'textarea',
|
|
12
|
-
'[contenteditable]',
|
|
13
|
-
'a[href]',
|
|
14
|
-
'iframe',
|
|
15
|
-
'audio[controls]',
|
|
16
|
-
'video[controls]',
|
|
17
|
-
'area[href]',
|
|
18
|
-
'details > summary:first-of-type',
|
|
19
|
-
].join(',')})`;
|
|
20
|
-
const focusDisablingSelector = `:where(${[
|
|
21
|
-
'[inert]',
|
|
22
|
-
'[inert] *',
|
|
23
|
-
':disabled',
|
|
24
|
-
'dialog:not([open]) *',
|
|
25
|
-
'[popover]:not(:popover-open) *',
|
|
26
|
-
'details:not([open]) > *:not(details > summary:first-of-type)',
|
|
27
|
-
'details:not([open]) > *:not(details > summary:first-of-type) *',
|
|
28
|
-
].join(',')})`;
|
|
29
|
-
const isFocusable = (element) => {
|
|
30
|
-
return (element === null || element === void 0 ? void 0 : element.matches(focusableSelector)) && !(element === null || element === void 0 ? void 0 : element.matches(focusDisablingSelector));
|
|
31
|
-
};
|
|
32
|
-
|
|
33
|
-
const postMenuCss = "/*!\n * Copyright 2021 by Swiss Post, Information Technology\n */:host{display:block}post-popovercontainer{padding:var(--post-menu-padding);background-color:var(--post-menu-bg, #ffffff);border-color:var(--post-menu-bg, #ffffff)}";
|
|
34
|
-
const PostMenuStyle0 = postMenuCss;
|
|
35
|
-
|
|
36
|
-
const PostMenu = class {
|
|
37
|
-
constructor(hostRef) {
|
|
38
|
-
index.registerInstance(this, hostRef);
|
|
39
|
-
this.toggleMenu = index.createEvent(this, "toggleMenu", 7);
|
|
40
|
-
this.lastFocusedElement = null;
|
|
41
|
-
this.KEYCODES = {
|
|
42
|
-
SPACE: ' ',
|
|
43
|
-
ENTER: 'Enter',
|
|
44
|
-
UP: 'ArrowUp',
|
|
45
|
-
DOWN: 'ArrowDown',
|
|
46
|
-
TAB: 'Tab',
|
|
47
|
-
HOME: 'Home',
|
|
48
|
-
END: 'End',
|
|
49
|
-
ESCAPE: 'Escape'
|
|
50
|
-
};
|
|
51
|
-
this.handleKeyDown = (e) => {
|
|
52
|
-
e.stopPropagation();
|
|
53
|
-
if (e.key === this.KEYCODES.ESCAPE) {
|
|
54
|
-
this.toggle(this.host);
|
|
55
|
-
return;
|
|
56
|
-
}
|
|
57
|
-
if (Object.values(this.KEYCODES).includes(e.key)) {
|
|
58
|
-
this.controlKeyDownHandler(e);
|
|
59
|
-
}
|
|
60
|
-
};
|
|
61
|
-
this.handleClick = (e) => {
|
|
62
|
-
const target = e.target;
|
|
63
|
-
if (['BUTTON', 'A', 'INPUT', 'SELECT', 'TEXTAREA'].includes(target.tagName)) {
|
|
64
|
-
this.toggle(this.host);
|
|
65
|
-
}
|
|
66
|
-
};
|
|
67
|
-
this.placement = 'bottom';
|
|
68
|
-
this.isVisible = false;
|
|
69
|
-
}
|
|
70
|
-
connectedCallback() {
|
|
71
|
-
this.host.addEventListener('keydown', this.handleKeyDown);
|
|
72
|
-
this.host.addEventListener('click', this.handleClick);
|
|
73
|
-
}
|
|
74
|
-
disconnectedCallback() {
|
|
75
|
-
this.host.removeEventListener('keydown', this.handleKeyDown);
|
|
76
|
-
this.host.removeEventListener('click', this.handleClick);
|
|
77
|
-
}
|
|
78
|
-
componentDidLoad() {
|
|
79
|
-
this.popoverRef.addEventListener('postToggle', (event) => {
|
|
80
|
-
this.isVisible = event.detail;
|
|
81
|
-
this.toggleMenu.emit(this.isVisible);
|
|
82
|
-
});
|
|
83
|
-
}
|
|
84
|
-
/**
|
|
85
|
-
* Toggles the menu visibility based on its current state.
|
|
86
|
-
*/
|
|
87
|
-
async toggle(target) {
|
|
88
|
-
this.isVisible ? await this.hide() : await this.show(target);
|
|
89
|
-
}
|
|
90
|
-
/**
|
|
91
|
-
* Displays the popover menu, focusing the first menu item.
|
|
92
|
-
*
|
|
93
|
-
* @param target - The HTML element relative to which the popover menu should be displayed.
|
|
94
|
-
*/
|
|
95
|
-
async show(target) {
|
|
96
|
-
if (this.popoverRef) {
|
|
97
|
-
await this.popoverRef.show(target);
|
|
98
|
-
this.lastFocusedElement = document.activeElement;
|
|
99
|
-
const menuItems = this.getSlottedItems();
|
|
100
|
-
if (menuItems.length > 0) {
|
|
101
|
-
menuItems[0].focus();
|
|
102
|
-
}
|
|
103
|
-
}
|
|
104
|
-
else {
|
|
105
|
-
console.error('show: popoverRef is null or undefined');
|
|
106
|
-
}
|
|
107
|
-
}
|
|
108
|
-
/**
|
|
109
|
-
* Hides the popover menu and restores focus to the previously focused element.
|
|
110
|
-
*/
|
|
111
|
-
async hide() {
|
|
112
|
-
if (this.popoverRef) {
|
|
113
|
-
await this.popoverRef.hide();
|
|
114
|
-
if (this.lastFocusedElement) {
|
|
115
|
-
this.lastFocusedElement.focus();
|
|
116
|
-
}
|
|
117
|
-
}
|
|
118
|
-
else {
|
|
119
|
-
console.error('hide: popoverRef is null or undefined');
|
|
120
|
-
}
|
|
121
|
-
}
|
|
122
|
-
controlKeyDownHandler(e) {
|
|
123
|
-
const menuItems = this.getSlottedItems();
|
|
124
|
-
if (!menuItems.length) {
|
|
125
|
-
return;
|
|
126
|
-
}
|
|
127
|
-
const currentFocusedElement = document.activeElement;
|
|
128
|
-
let currentIndex = menuItems.findIndex(el => el === currentFocusedElement);
|
|
129
|
-
switch (e.key) {
|
|
130
|
-
case this.KEYCODES.UP:
|
|
131
|
-
e.preventDefault();
|
|
132
|
-
currentIndex = (currentIndex - 1 + menuItems.length) % menuItems.length;
|
|
133
|
-
break;
|
|
134
|
-
case this.KEYCODES.DOWN:
|
|
135
|
-
e.preventDefault();
|
|
136
|
-
currentIndex = (currentIndex + 1) % menuItems.length;
|
|
137
|
-
break;
|
|
138
|
-
case this.KEYCODES.HOME:
|
|
139
|
-
currentIndex = 0;
|
|
140
|
-
break;
|
|
141
|
-
case this.KEYCODES.END:
|
|
142
|
-
currentIndex = menuItems.length - 1;
|
|
143
|
-
break;
|
|
144
|
-
case this.KEYCODES.SPACE:
|
|
145
|
-
case this.KEYCODES.ENTER:
|
|
146
|
-
this.toggle(this.host);
|
|
147
|
-
return;
|
|
148
|
-
case this.KEYCODES.TAB:
|
|
149
|
-
this.toggle(this.host);
|
|
150
|
-
break;
|
|
151
|
-
}
|
|
152
|
-
if (menuItems[currentIndex]) {
|
|
153
|
-
menuItems[currentIndex].focus();
|
|
154
|
-
}
|
|
155
|
-
}
|
|
156
|
-
getSlottedItems() {
|
|
157
|
-
const slot = this.host.shadowRoot.querySelector('slot');
|
|
158
|
-
const slottedElements = slot ? slot.assignedElements() : [];
|
|
159
|
-
const menuItems = slottedElements
|
|
160
|
-
.filter(el => el.tagName === 'POST-MENU-ITEM')
|
|
161
|
-
.map(el => {
|
|
162
|
-
const slot = el.shadowRoot.querySelector('slot');
|
|
163
|
-
const assignedElements = slot ? slot.assignedElements() : [];
|
|
164
|
-
return assignedElements.filter(isFocusable);
|
|
165
|
-
})
|
|
166
|
-
.flat();
|
|
167
|
-
return menuItems;
|
|
168
|
-
}
|
|
169
|
-
render() {
|
|
170
|
-
return (index.h(index.Host, { key: 'c3fa319c92cc36b562590df18b6585b1bc18f133', "data-version": _package.version }, index.h("post-popovercontainer", { key: '7d297b7598fecb01f46c3f1b999b6017ee878d06', placement: this.placement, ref: e => (this.popoverRef = e) }, index.h("div", { key: '3ae32950348ae8910094cddd34afef060ca517f1', class: "popover-container" }, index.h("slot", { key: '7faa98f2f4c50ef1ac424387a6c3890dcf09adce' })))));
|
|
171
|
-
}
|
|
172
|
-
get host() { return index.getElement(this); }
|
|
173
|
-
};
|
|
174
|
-
PostMenu.style = PostMenuStyle0;
|
|
175
|
-
|
|
176
|
-
exports.PostMenu = PostMenu;
|
|
@@ -1,20 +0,0 @@
|
|
|
1
|
-
'use strict';
|
|
2
|
-
|
|
3
|
-
const index = require('./index-e1f32cce.js');
|
|
4
|
-
const _package = require('./package-a2b895fc.js');
|
|
5
|
-
|
|
6
|
-
const postMenuItemCss = ":host{display:block}";
|
|
7
|
-
const PostMenuItemStyle0 = postMenuItemCss;
|
|
8
|
-
|
|
9
|
-
const PostMenuItem = class {
|
|
10
|
-
constructor(hostRef) {
|
|
11
|
-
index.registerInstance(this, hostRef);
|
|
12
|
-
}
|
|
13
|
-
render() {
|
|
14
|
-
return (index.h(index.Host, { key: '8e20fdee0faff826319440bed6ec7be0c56e6d06', role: "menuitem", "data-version": _package.version }, index.h("slot", { key: '69e2be9dec334ade8e84ccb268c7d4955dd2fefb' })));
|
|
15
|
-
}
|
|
16
|
-
get host() { return index.getElement(this); }
|
|
17
|
-
};
|
|
18
|
-
PostMenuItem.style = PostMenuItemStyle0;
|
|
19
|
-
|
|
20
|
-
exports.PostMenuItem = PostMenuItem;
|
|
@@ -1,11 +0,0 @@
|
|
|
1
|
-
'use strict';
|
|
2
|
-
|
|
3
|
-
Object.defineProperty(exports, '__esModule', { value: true });
|
|
4
|
-
|
|
5
|
-
const postMenuItem = require('./post-menu-item-28ab1a72.js');
|
|
6
|
-
require('./index-e1f32cce.js');
|
|
7
|
-
require('./package-a2b895fc.js');
|
|
8
|
-
|
|
9
|
-
|
|
10
|
-
|
|
11
|
-
exports.post_menu_item = postMenuItem.PostMenuItem;
|
|
@@ -1,75 +0,0 @@
|
|
|
1
|
-
'use strict';
|
|
2
|
-
|
|
3
|
-
const index = require('./index-e1f32cce.js');
|
|
4
|
-
const _package = require('./package-a2b895fc.js');
|
|
5
|
-
const checkType = require('./check-type-64af82a9.js');
|
|
6
|
-
const getRoot = require('./get-root-7a3498ef.js');
|
|
7
|
-
|
|
8
|
-
const postMenuTriggerCss = ":host{display:inline-block}";
|
|
9
|
-
const PostMenuTriggerStyle0 = postMenuTriggerCss;
|
|
10
|
-
|
|
11
|
-
const PostMenuTrigger = class {
|
|
12
|
-
constructor(hostRef) {
|
|
13
|
-
index.registerInstance(this, hostRef);
|
|
14
|
-
/**
|
|
15
|
-
* Reference to the slotted button within the trigger, if present.
|
|
16
|
-
* Used to manage click and key events for menu control.
|
|
17
|
-
*/
|
|
18
|
-
this.slottedButton = null;
|
|
19
|
-
this.handleKeyDown = (e) => {
|
|
20
|
-
if (e.key === 'ArrowUp' || e.key === 'ArrowDown') {
|
|
21
|
-
e.preventDefault();
|
|
22
|
-
this.handleToggle();
|
|
23
|
-
}
|
|
24
|
-
};
|
|
25
|
-
this.for = undefined;
|
|
26
|
-
this.ariaExpanded = false;
|
|
27
|
-
}
|
|
28
|
-
/**
|
|
29
|
-
* Watch for changes to the `for` property to validate its type and ensure it is a string.
|
|
30
|
-
* @param forValue - The new value of the `for` property.
|
|
31
|
-
*/
|
|
32
|
-
validateControlFor(forValue = this.for) {
|
|
33
|
-
checkType.checkType(forValue, 'string', 'The "for" property is required and should be a string.');
|
|
34
|
-
}
|
|
35
|
-
get menu() {
|
|
36
|
-
const ref = this.root.getElementById(this.for);
|
|
37
|
-
return ref && ref.localName === 'post-menu' ? ref : null;
|
|
38
|
-
}
|
|
39
|
-
handleToggle() {
|
|
40
|
-
const menu = this.menu;
|
|
41
|
-
if (menu && this.slottedButton) {
|
|
42
|
-
this.ariaExpanded = !this.ariaExpanded;
|
|
43
|
-
this.slottedButton.setAttribute('aria-expanded', this.ariaExpanded.toString());
|
|
44
|
-
menu.toggle(this.host);
|
|
45
|
-
}
|
|
46
|
-
else {
|
|
47
|
-
console.warn(`No post-menu found with ID: ${this.for}`);
|
|
48
|
-
}
|
|
49
|
-
}
|
|
50
|
-
componentDidLoad() {
|
|
51
|
-
this.root = getRoot.getRoot(this.host);
|
|
52
|
-
this.validateControlFor();
|
|
53
|
-
this.slottedButton = this.host.querySelector('button');
|
|
54
|
-
if (this.slottedButton) {
|
|
55
|
-
this.slottedButton.setAttribute('aria-haspopup', 'menu');
|
|
56
|
-
this.slottedButton.addEventListener('click', () => {
|
|
57
|
-
this.handleToggle();
|
|
58
|
-
});
|
|
59
|
-
this.slottedButton.addEventListener('keydown', this.handleKeyDown);
|
|
60
|
-
}
|
|
61
|
-
else {
|
|
62
|
-
console.warn('No button found within post-menu-trigger');
|
|
63
|
-
}
|
|
64
|
-
}
|
|
65
|
-
render() {
|
|
66
|
-
return (index.h(index.Host, { key: 'd6b5619d0b4035887eaffdcc3c153eb0a5fe4ceb', "data-version": _package.version, "tab-index": "-1" }, index.h("slot", { key: '5d87c80dae6188470b10207993822d92adc714b1' })));
|
|
67
|
-
}
|
|
68
|
-
get host() { return index.getElement(this); }
|
|
69
|
-
static get watchers() { return {
|
|
70
|
-
"for": ["validateControlFor"]
|
|
71
|
-
}; }
|
|
72
|
-
};
|
|
73
|
-
PostMenuTrigger.style = PostMenuTriggerStyle0;
|
|
74
|
-
|
|
75
|
-
exports.PostMenuTrigger = PostMenuTrigger;
|
|
@@ -1,13 +0,0 @@
|
|
|
1
|
-
'use strict';
|
|
2
|
-
|
|
3
|
-
Object.defineProperty(exports, '__esModule', { value: true });
|
|
4
|
-
|
|
5
|
-
const postMenuTrigger = require('./post-menu-trigger-821839f5.js');
|
|
6
|
-
require('./index-e1f32cce.js');
|
|
7
|
-
require('./package-a2b895fc.js');
|
|
8
|
-
require('./check-type-64af82a9.js');
|
|
9
|
-
require('./get-root-7a3498ef.js');
|
|
10
|
-
|
|
11
|
-
|
|
12
|
-
|
|
13
|
-
exports.post_menu_trigger = postMenuTrigger.PostMenuTrigger;
|