@swisspost/design-system-components 9.0.0-next.12 → 9.0.0-next.14
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/dist/.config/bindings.angular.js +4 -0
- package/dist/cjs/{attribute-observer-10f08c04.js → attribute-observer-6d8b886b.js} +4 -4
- package/dist/cjs/{check-one-of-f4f5d0c0.js → check-one-of-ef931478.js} +2 -1
- package/dist/cjs/{check-type-64af82a9.js → check-type-696d2c51.js} +4 -4
- package/dist/cjs/{check-url-3ffdd2fb.js → check-url-1cf6fb0d.js} +2 -1
- package/dist/cjs/{debounce-1151afe3.js → debounce-158fd76f.js} +2 -1
- package/dist/cjs/fade-72d5ef55.js +14 -0
- package/dist/cjs/{index-f1b08cdb.js → index-0ee3ab4a.js} +334 -152
- package/dist/cjs/{index-5d4e0aed.js → index-bea4ac42.js} +7 -5
- package/dist/cjs/index.cjs.js +30 -28
- package/dist/cjs/loader.cjs.js +2 -2
- package/dist/cjs/{package-0bd6fb0d.js → package-7d11b6ea.js} +1 -1
- package/dist/cjs/{post-accordion-7aadd881.js → post-accordion-29861d97.js} +15 -8
- package/dist/cjs/{post-accordion-item-bd033c7f.js → post-accordion-item-0da0f7aa.js} +20 -13
- package/dist/cjs/post-accordion-item.cjs.entry.js +7 -7
- package/dist/cjs/post-accordion.cjs.entry.js +4 -4
- package/dist/cjs/{post-avatar-5dbdf70d.js → post-avatar-01b9cd6d.js} +29 -21
- package/dist/cjs/post-avatar.cjs.entry.js +3 -3
- package/dist/cjs/post-back-to-top-9a5647f7.js +80 -0
- package/dist/cjs/post-back-to-top.cjs.entry.js +5 -5
- package/dist/cjs/post-banner-33929088.js +110 -0
- package/dist/cjs/post-banner.cjs.entry.js +8 -8
- package/dist/cjs/{post-breadcrumb-531c4f79.js → post-breadcrumb-1384018e.js} +41 -34
- package/dist/cjs/post-breadcrumb-item_2.cjs.entry.js +7 -7
- package/dist/cjs/post-breadcrumb.cjs.entry.js +5 -5
- package/dist/cjs/post-card-control-4c85eda3.js +314 -0
- package/dist/cjs/post-card-control.cjs.entry.js +4 -4
- package/dist/cjs/post-closebutton_15.cjs.entry.js +8 -8
- package/dist/cjs/{post-collapsible-trigger-02924200.js → post-collapsible-trigger-0fb2596a.js} +47 -35
- package/dist/cjs/post-collapsible_2.cjs.entry.js +8 -8
- package/dist/cjs/post-components.cjs.js +3 -3
- package/dist/cjs/{post-footer-96d7bd47.js → post-footer-f621a563.js} +18 -12
- package/dist/cjs/post-footer.cjs.entry.js +3 -3
- package/dist/cjs/post-linkarea-865079c1.js +32 -0
- package/dist/cjs/post-linkarea.cjs.entry.js +11 -0
- package/dist/cjs/{post-menu-item-3f73fb4d.js → post-menu-item-ab3e2e7e.js} +12 -9
- package/dist/cjs/{post-popover-64195ffd.js → post-popover-a2ba9226.js} +24 -10
- package/dist/cjs/post-popover.cjs.entry.js +4 -4
- package/dist/cjs/{post-rating-bd27ebfc.js → post-rating-c402c294.js} +33 -10
- package/dist/cjs/post-rating.cjs.entry.js +3 -3
- package/dist/cjs/post-tab-header-c819517d.js +36 -0
- package/dist/cjs/post-tab-header.cjs.entry.js +3 -3
- package/dist/cjs/{post-tab-panel-3eedcd19.js → post-tab-panel-3cb207f3.js} +9 -6
- package/dist/cjs/post-tab-panel.cjs.entry.js +3 -3
- package/dist/cjs/{post-tabs-ea94b243.js → post-tabs-b6fa39c3.js} +29 -18
- package/dist/cjs/post-tabs.cjs.entry.js +4 -4
- package/dist/cjs/{post-tag-1d75024b.js → post-tag-9c366519.js} +20 -9
- package/dist/cjs/post-tag.cjs.entry.js +3 -3
- package/dist/cjs/{post-togglebutton-876f7892.js → post-togglebutton-d49bec2c.js} +682 -221
- package/dist/cjs/{post-tooltip-e4ef3c7e.js → post-tooltip-425c01ba.js} +24 -12
- package/dist/cjs/post-tooltip.cjs.entry.js +8 -8
- package/dist/cjs/{slide-5d51abe8.js → slide-8ae17ee4.js} +4 -4
- package/dist/collection/animations/collapse.js +5 -5
- package/dist/collection/animations/fade.js +6 -2
- package/dist/collection/animations/slide.js +4 -4
- package/dist/collection/collection-manifest.json +4 -3
- package/dist/collection/components/post-accordion/post-accordion.js +16 -6
- package/dist/collection/components/post-accordion-item/post-accordion-item.js +21 -11
- package/dist/collection/components/post-avatar/post-avatar.js +35 -20
- 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 +14 -8
- package/dist/collection/components/post-banner/post-banner.css +1 -1
- package/dist/collection/components/post-banner/post-banner.js +40 -14
- package/dist/collection/components/post-breadcrumb/post-breadcrumb.js +41 -31
- package/dist/collection/components/post-breadcrumb-item/post-breadcrumb-item.js +10 -6
- package/dist/collection/components/post-card-control/post-card-control.css +1 -1
- package/dist/collection/components/post-card-control/post-card-control.js +104 -43
- package/dist/collection/components/post-closebutton/post-closebutton.js +2 -1
- package/dist/collection/components/post-collapsible/post-collapsible.js +16 -6
- package/dist/collection/components/post-collapsible-trigger/post-collapsible-trigger.js +25 -21
- package/dist/collection/components/post-footer/post-footer.js +9 -5
- package/dist/collection/components/post-header/post-header.css +1 -1
- package/dist/collection/components/post-header/post-header.js +90 -15
- package/dist/collection/components/post-icon/post-icon.js +93 -23
- package/dist/collection/components/post-language-option/post-language-option.js +37 -8
- package/dist/collection/components/post-language-switch/post-language-switch.css +1 -1
- package/dist/collection/components/post-language-switch/post-language-switch.js +24 -7
- package/dist/collection/components/post-linkarea/post-linkarea.css +1 -0
- package/dist/collection/components/post-linkarea/post-linkarea.js +32 -0
- package/dist/collection/components/post-list/post-list.js +19 -6
- package/dist/collection/components/post-list-item/post-list-item.js +2 -1
- package/dist/collection/components/post-logo/post-logo.js +8 -4
- package/dist/collection/components/post-mainnavigation/post-mainnavigation.css +1 -1
- package/dist/collection/components/post-mainnavigation/post-mainnavigation.js +197 -17
- package/dist/collection/components/post-megadropdown/post-megadropdown.css +1 -1
- package/dist/collection/components/post-megadropdown/post-megadropdown.js +134 -64
- package/dist/collection/components/post-megadropdown-trigger/post-megadropdown-trigger.css +1 -1
- package/dist/collection/components/post-megadropdown-trigger/post-megadropdown-trigger.js +18 -11
- package/dist/collection/components/post-menu/post-menu.js +56 -33
- package/dist/collection/components/post-menu-item/post-menu-item.js +1 -1
- package/dist/collection/components/post-menu-trigger/post-menu-trigger.js +24 -16
- package/dist/collection/components/post-popover/post-popover.css +1 -1
- package/dist/collection/components/post-popover/post-popover.js +26 -5
- package/dist/collection/components/post-popovercontainer/post-popovercontainer.css +1 -1
- package/dist/collection/components/post-popovercontainer/post-popovercontainer.js +55 -8
- package/dist/collection/components/post-rating/post-rating.js +39 -7
- package/dist/collection/components/post-tab-header/post-tab-header.css +1 -1
- package/dist/collection/components/post-tab-header/post-tab-header.js +9 -5
- package/dist/collection/components/post-tab-panel/post-tab-panel.js +9 -5
- package/dist/collection/components/post-tabs/post-tabs.css +1 -1
- package/dist/collection/components/post-tabs/post-tabs.js +25 -18
- package/dist/collection/components/post-tag/post-tag.css +1 -1
- package/dist/collection/components/post-tag/post-tag.js +23 -5
- package/dist/collection/components/post-togglebutton/post-togglebutton.js +18 -14
- package/dist/collection/components/post-tooltip/post-tooltip.js +26 -9
- package/dist/collection/index.js +1 -0
- package/dist/collection/utils/attribute-observer.js +4 -4
- package/dist/collection/utils/breakpoints.js +9 -6
- package/dist/collection/utils/component-on-ready.js +4 -4
- package/dist/collection/utils/debounce.js +2 -1
- package/dist/collection/utils/get-focusable-children.js +2 -2
- package/dist/collection/utils/property-checkers/check-one-of.js +2 -1
- package/dist/collection/utils/property-checkers/check-pattern.js +2 -1
- package/dist/collection/utils/property-checkers/check-type.js +4 -4
- package/dist/collection/utils/property-checkers/check-url.js +2 -1
- package/dist/collection/utils/property-checkers/empty-or.js +2 -1
- package/dist/collection/utils/sass-export.js +8 -5
- package/dist/components/index.js +36 -35
- package/dist/components/{post-collapsible-trigger2.js → p-05590ac0.js} +30 -27
- package/dist/components/{post-breadcrumb2.js → p-146677d1.js} +50 -43
- package/dist/components/p-1ee1742f.js +237 -0
- package/dist/components/p-2083ae2c.js +3 -0
- package/dist/components/{post-megadropdown-trigger2.js → p-27edc023.js} +21 -15
- package/dist/components/{post-tooltip2.js → p-2d9b46b4.js} +26 -14
- package/dist/components/p-38778a14.js +345 -0
- package/dist/components/p-3aba7629.js +29 -0
- package/dist/components/{post-togglebutton2.js → p-3cee636a.js} +20 -17
- package/dist/components/p-3e8554e7.js +1646 -0
- package/dist/components/p-424d5ea9.js +199 -0
- package/dist/components/p-46a6c5ec.js +168 -0
- package/dist/components/p-4965cfe1.js +145 -0
- package/{loaders/slide.js → dist/components/p-4af6dbed.js} +4 -4
- package/dist/components/{post-list2.js → p-536eba02.js} +19 -9
- package/dist/components/p-5653923a.js +44 -0
- package/dist/components/{post-footer2.js → p-58878996.js} +23 -17
- package/dist/components/{post-logo2.js → p-5f51ec58.js} +10 -7
- package/{loaders/post-popovercontainer2.js → dist/components/p-60cf53cc.js} +34 -11
- package/dist/components/p-64e3de38.js +11 -0
- package/dist/components/{post-accordion-item2.js → p-68ecd276.js} +26 -19
- package/dist/components/p-75b8b652.js +54 -0
- package/dist/components/{post-tab-panel2.js → p-78e1d893.js} +11 -8
- package/dist/components/{check-type.js → p-8562c7dc.js} +4 -4
- package/{loaders/post-menu-trigger2.js → dist/components/p-8b053fd5.js} +27 -20
- package/dist/components/{post-icon2.js → p-91031e3b.js} +85 -28
- package/dist/components/{post-menu2.js → p-91882483.js} +60 -65
- package/dist/{esm/attribute-observer-37fa950a.js → components/p-9748a355.js} +4 -4
- package/dist/components/{post-list-item2.js → p-9e4b1f10.js} +4 -4
- package/dist/components/{post-accordion2.js → p-a3a004e6.js} +17 -10
- package/dist/components/{post-popover2.js → p-af23f7de.js} +26 -12
- package/dist/components/{post-collapsible2.js → p-b018d864.js} +23 -14
- package/dist/components/{check-non-empty.js → p-b095519d.js} +1 -1
- package/dist/components/{check-one-of.js → p-bacd3e2c.js} +2 -1
- package/dist/components/{post-closebutton2.js → p-bf14d264.js} +6 -6
- package/dist/components/{post-breadcrumb-item2.js → p-c7c1d466.js} +13 -10
- package/dist/components/{post-tag2.js → p-cab43cee.js} +22 -11
- package/dist/components/{post-menu-item2.js → p-ccccf0c3.js} +4 -4
- package/dist/components/{post-tabs2.js → p-ce854a7d.js} +30 -19
- package/dist/components/{post-avatar2.js → p-d3fb70af.js} +31 -23
- package/dist/components/{post-language-option2.js → p-d47bb5bf.js} +32 -12
- package/dist/components/{debounce.js → p-e1baac59.js} +2 -1
- package/dist/components/{post-back-to-top2.js → p-e20366a6.js} +20 -15
- package/dist/components/{index2.js → p-eabb09ad.js} +9 -6
- package/dist/components/{post-language-switch2.js → p-f6d80d76.js} +29 -17
- package/dist/components/p-f7b9f90a.js +135 -0
- package/dist/components/{post-rating2.js → p-fc59de7c.js} +35 -12
- package/dist/components/post-accordion-item.js +1 -1
- package/dist/components/post-accordion.js +1 -1
- package/dist/components/post-avatar.js +1 -1
- package/dist/components/post-back-to-top.js +1 -1
- package/dist/components/post-banner.js +1 -1
- package/dist/components/post-breadcrumb-item.js +1 -1
- package/dist/components/post-breadcrumb.js +1 -1
- package/dist/components/post-card-control.js +1 -1
- package/dist/components/post-closebutton.js +1 -1
- package/dist/components/post-collapsible-trigger.js +1 -1
- package/dist/components/post-collapsible.js +1 -1
- package/dist/components/post-footer.js +1 -1
- package/dist/components/post-header.js +1 -1
- package/dist/components/post-icon.js +1 -1
- package/dist/components/post-language-option.js +1 -1
- package/dist/components/post-language-switch.js +1 -1
- package/dist/components/post-linkarea.d.ts +11 -0
- package/dist/components/post-linkarea.js +6 -0
- package/dist/components/post-list-item.js +1 -1
- package/dist/components/post-list.js +1 -1
- package/dist/components/post-logo.js +1 -1
- package/dist/components/post-mainnavigation.js +1 -1
- package/dist/components/post-megadropdown-trigger.js +1 -1
- package/dist/components/post-megadropdown.js +1 -1
- package/dist/components/post-menu-item.js +1 -1
- package/dist/components/post-menu-trigger.js +1 -1
- package/dist/components/post-menu.js +1 -1
- package/dist/components/post-popover.js +1 -1
- package/dist/components/post-popovercontainer.js +1 -1
- package/dist/components/post-rating.js +1 -1
- package/dist/components/post-tab-header.js +1 -1
- package/dist/components/post-tab-panel.js +1 -1
- package/dist/components/post-tabs.js +1 -1
- package/dist/components/post-tag.js +1 -1
- package/dist/components/post-togglebutton.js +1 -1
- package/dist/components/post-tooltip.js +1 -1
- package/dist/docs.d.ts +8 -0
- package/dist/docs.json +335 -156
- package/{loaders/attribute-observer.js → dist/esm/attribute-observer-2f203993.js} +4 -4
- package/{loaders/check-one-of.js → dist/esm/check-one-of-0d5858c0.js} +2 -1
- package/dist/esm/{check-type-8828dbe4.js → check-type-a6ccc9a3.js} +4 -4
- package/dist/esm/{check-url-a974431e.js → check-url-0bd876f7.js} +2 -1
- package/dist/esm/{debounce-abe98cc2.js → debounce-e54c7131.js} +2 -1
- package/dist/esm/fade-1f3cacf4.js +11 -0
- package/dist/esm/{index-6bfe6554.js → index-2c232bf2.js} +334 -152
- package/dist/esm/{index-b49c9904.js → index-d1bbbd88.js} +7 -5
- package/dist/esm/index.js +29 -28
- package/dist/esm/loader.js +3 -3
- package/dist/esm/package-8c98af5e.js +3 -0
- package/dist/esm/{post-accordion-ca48eb18.js → post-accordion-49fba403.js} +15 -8
- package/dist/esm/{post-accordion-item-a461f2a7.js → post-accordion-item-c516517a.js} +20 -13
- package/dist/esm/post-accordion-item.entry.js +7 -7
- package/dist/esm/post-accordion.entry.js +4 -4
- package/dist/esm/{post-avatar-0da1a2e8.js → post-avatar-b527ac63.js} +29 -21
- package/dist/esm/post-avatar.entry.js +3 -3
- package/dist/esm/post-back-to-top-f514c1f0.js +78 -0
- package/dist/esm/post-back-to-top.entry.js +5 -5
- package/dist/esm/post-banner-0ad7758b.js +108 -0
- package/dist/esm/post-banner.entry.js +8 -8
- package/dist/esm/{post-breadcrumb-85ffd02f.js → post-breadcrumb-57bca9dd.js} +41 -34
- package/dist/esm/post-breadcrumb-item_2.entry.js +7 -7
- package/dist/esm/post-breadcrumb.entry.js +5 -5
- package/dist/esm/post-card-control-ea741f60.js +312 -0
- package/dist/esm/post-card-control.entry.js +4 -4
- package/dist/esm/post-closebutton_15.entry.js +8 -8
- package/dist/esm/{post-collapsible-trigger-883db3bf.js → post-collapsible-trigger-31155750.js} +47 -35
- package/dist/esm/post-collapsible_2.entry.js +8 -8
- package/dist/esm/post-components.js +4 -4
- package/dist/esm/{post-footer-7b0eb067.js → post-footer-cdde2086.js} +18 -12
- package/dist/esm/post-footer.entry.js +3 -3
- package/dist/esm/post-linkarea-cad95623.js +30 -0
- package/dist/esm/post-linkarea.entry.js +3 -0
- package/dist/esm/{post-menu-item-37f637a3.js → post-menu-item-db732728.js} +12 -9
- package/dist/esm/{post-popover-c24ecd38.js → post-popover-00f427ac.js} +24 -10
- package/dist/esm/post-popover.entry.js +4 -4
- package/dist/esm/{post-rating-e1c66e5c.js → post-rating-cdcb2a1d.js} +33 -10
- package/dist/esm/post-rating.entry.js +3 -3
- package/dist/esm/post-tab-header-1d4113cb.js +34 -0
- package/dist/esm/post-tab-header.entry.js +3 -3
- package/dist/esm/{post-tab-panel-73b56a16.js → post-tab-panel-7a5c03ef.js} +9 -6
- package/dist/esm/post-tab-panel.entry.js +3 -3
- package/dist/esm/{post-tabs-02e523b8.js → post-tabs-308190c0.js} +29 -18
- package/dist/esm/post-tabs.entry.js +4 -4
- package/dist/esm/{post-tag-43aba068.js → post-tag-aebbda10.js} +20 -9
- package/dist/esm/post-tag.entry.js +3 -3
- package/dist/esm/{post-togglebutton-c2231709.js → post-togglebutton-95ba85d2.js} +682 -221
- package/dist/esm/{post-tooltip-8271950c.js → post-tooltip-918d3a54.js} +24 -12
- package/dist/esm/post-tooltip.entry.js +8 -8
- package/dist/{components/slide.js → esm/slide-62768431.js} +4 -4
- package/dist/post-components/index.esm.js +1 -1
- package/dist/post-components/p-037d6ef2.entry.js +1 -0
- package/dist/post-components/p-1e69a72f.js +1 -0
- package/dist/post-components/p-1fda117c.js +1 -0
- package/dist/post-components/p-2083ae2c.js +1 -0
- package/dist/post-components/p-24297444.js +1 -0
- package/dist/post-components/{p-e2f886ab.js → p-267f52a9.js} +3 -3
- package/dist/post-components/p-2e6c5b60.js +1 -0
- package/dist/post-components/p-3591d4e3.entry.js +1 -0
- package/dist/post-components/p-3dec4425.entry.js +1 -0
- package/dist/post-components/p-423aecd4.js +1 -0
- package/dist/post-components/p-43221de8.entry.js +1 -0
- package/dist/post-components/p-48fd00e7.entry.js +1 -0
- package/dist/post-components/p-4af6dbed.js +1 -0
- package/dist/post-components/p-4ca79b52.js +1 -0
- package/dist/post-components/p-4d2dee9f.entry.js +1 -0
- package/dist/post-components/p-4fedef65.js +1 -0
- package/dist/post-components/p-59109b3b.entry.js +1 -0
- package/dist/post-components/p-64e3de38.js +1 -0
- package/dist/post-components/p-675352c3.entry.js +1 -0
- package/dist/post-components/p-6e4527d9.entry.js +1 -0
- package/dist/post-components/p-726bfda2.js +1 -0
- package/dist/post-components/p-767c0bf3.js +1 -0
- package/dist/post-components/p-796968bd.entry.js +1 -0
- package/dist/post-components/p-7c9758fa.js +1 -0
- package/dist/post-components/p-8a452260.js +1 -0
- package/dist/post-components/p-8a50b900.js +1 -0
- package/dist/post-components/p-8de4f677.entry.js +1 -0
- package/dist/post-components/p-93632808.js +1 -0
- package/dist/post-components/p-9748a355.js +1 -0
- package/dist/post-components/p-9aca3d07.entry.js +1 -0
- package/dist/post-components/p-9f0c5164.js +1 -0
- package/dist/post-components/p-a6436e7f.js +1 -0
- package/dist/post-components/p-ad246c0d.js +1 -0
- package/dist/post-components/p-b015efcb.entry.js +1 -0
- package/dist/post-components/p-b0afc087.entry.js +1 -0
- package/dist/post-components/p-b1adc221.js +1 -0
- package/dist/post-components/p-b2c0d21a.js +1 -0
- package/dist/post-components/p-b5a566f1.js +1 -0
- package/dist/post-components/p-c0961047.entry.js +1 -0
- package/dist/post-components/p-c388b7bb.entry.js +1 -0
- package/dist/post-components/{p-c510d968.entry.js → p-ca41b899.entry.js} +1 -1
- package/dist/post-components/p-d2395ae9.entry.js +1 -0
- package/dist/post-components/p-d9833667.js +2 -0
- package/dist/post-components/p-da261c46.entry.js +1 -0
- package/dist/post-components/post-components.esm.js +1 -1
- package/dist/types/animations/collapse.d.ts +2 -2
- package/dist/types/animations/fade.d.ts +2 -2
- package/dist/types/animations/slide.d.ts +2 -2
- package/dist/types/components/post-header/post-header.d.ts +11 -2
- package/dist/types/components/post-icon/post-icon.d.ts +1 -1
- package/dist/types/components/post-language-switch/post-language-switch.d.ts +1 -1
- package/dist/types/components/post-linkarea/post-linkarea.d.ts +5 -0
- package/dist/types/components/post-mainnavigation/post-mainnavigation.d.ts +57 -3
- package/dist/types/components/post-megadropdown/post-megadropdown.d.ts +26 -12
- package/dist/types/components/post-popovercontainer/post-popovercontainer.d.ts +4 -0
- package/dist/types/components/post-tabs/post-tabs.d.ts +1 -1
- package/dist/types/components.d.ts +51 -25
- package/dist/types/home/runner/work/design-system/design-system/packages/components/.stencil/.config/bindings.angular.d.ts +2 -0
- package/dist/types/index.d.ts +3 -2
- package/dist/types/stencil-public-runtime.d.ts +6 -0
- package/dist/types/utils/attribute-observer.d.ts +1 -1
- package/dist/types/utils/component-on-ready.d.ts +1 -1
- package/dist/types/utils/get-focusable-children.d.ts +1 -1
- package/dist/types/utils/sass-export.d.ts +5 -1
- package/loaders/index.d.ts +2 -0
- package/loaders/index.js +3 -2
- package/loaders/{post-collapsible-trigger2.js → p-05590ac0.js} +30 -27
- package/loaders/{post-breadcrumb-item2.js → p-1beacb73.js} +13 -10
- package/loaders/p-2083ae2c.js +3 -0
- package/loaders/p-3aba7629.js +29 -0
- package/loaders/p-3e8554e7.js +1646 -0
- package/{dist/esm/slide-3422b8a3.js → loaders/p-4af6dbed.js} +4 -4
- package/loaders/{index2.js → p-56ad4838.js} +9 -6
- package/{dist/components/post-popovercontainer2.js → loaders/p-60cf53cc.js} +34 -11
- package/loaders/p-64e3de38.js +11 -0
- package/loaders/{post-accordion-item2.js → p-83baa315.js} +26 -19
- package/loaders/{check-type.js → p-8562c7dc.js} +4 -4
- package/{dist/components/post-menu-trigger2.js → loaders/p-8b053fd5.js} +27 -20
- package/loaders/{post-menu2.js → p-91882483.js} +60 -65
- package/{dist/components/attribute-observer.js → loaders/p-9748a355.js} +4 -4
- package/loaders/{post-collapsible2.js → p-9fac5d7d.js} +23 -14
- package/loaders/{check-non-empty.js → p-b095519d.js} +1 -1
- package/{dist/esm/check-one-of-6b3ef8eb.js → loaders/p-bacd3e2c.js} +2 -1
- package/loaders/{post-menu-item2.js → p-ccccf0c3.js} +4 -4
- package/loaders/{debounce.js → p-e1baac59.js} +2 -1
- package/loaders/{post-icon2.js → p-f7177e26.js} +85 -28
- package/loaders/p-f7b9f90a.js +135 -0
- package/loaders/post-accordion-item.js +1 -1
- package/loaders/post-accordion.js +17 -10
- package/loaders/post-avatar.js +31 -23
- package/loaders/post-back-to-top.js +20 -15
- package/loaders/post-banner.js +42 -23
- package/loaders/post-breadcrumb-item.js +1 -1
- package/loaders/post-breadcrumb.js +50 -43
- package/loaders/post-card-control.js +93 -51
- package/loaders/post-closebutton.js +6 -6
- package/loaders/post-collapsible-trigger.js +1 -1
- package/loaders/post-collapsible.js +1 -1
- package/loaders/post-footer.js +23 -17
- package/loaders/post-header.js +74 -154
- package/loaders/post-icon.js +1 -1
- package/loaders/post-language-option.js +32 -12
- package/loaders/post-language-switch.js +29 -17
- package/loaders/post-linkarea.d.ts +11 -0
- package/loaders/post-linkarea.js +47 -0
- package/loaders/post-list-item.js +4 -4
- package/loaders/post-list.js +19 -9
- package/loaders/post-logo.js +10 -7
- package/loaders/post-mainnavigation.js +197 -8
- package/loaders/post-megadropdown-trigger.js +21 -15
- package/loaders/post-megadropdown.js +119 -51
- package/loaders/post-menu-item.js +1 -1
- package/loaders/post-menu-trigger.js +1 -1
- package/loaders/post-menu.js +1 -1
- package/loaders/post-popover.js +26 -12
- package/loaders/post-popovercontainer.js +1 -1
- package/loaders/post-rating.js +35 -12
- package/loaders/post-tab-header.js +13 -10
- package/loaders/post-tab-panel.js +11 -8
- package/loaders/post-tabs.js +30 -19
- package/loaders/post-tag.js +22 -11
- package/loaders/post-togglebutton.js +20 -17
- package/loaders/post-tooltip.js +26 -14
- package/package.json +19 -16
- package/dist/cjs/fade-35a3633a.js +0 -10
- package/dist/cjs/post-back-to-top-71bc912c.js +0 -75
- package/dist/cjs/post-banner-d4e0c73c.js +0 -91
- package/dist/cjs/post-card-control-332f6f1f.js +0 -272
- package/dist/cjs/post-tab-header-1f057694.js +0 -33
- package/dist/components/fade.js +0 -7
- package/dist/components/package.js +0 -3
- package/dist/components/post-banner2.js +0 -126
- package/dist/components/post-card-control2.js +0 -303
- package/dist/components/post-header2.js +0 -279
- package/dist/components/post-mainnavigation2.js +0 -48
- package/dist/components/post-megadropdown2.js +0 -100
- package/dist/components/post-tab-header2.js +0 -51
- package/dist/esm/fade-7fd71785.js +0 -7
- package/dist/esm/package-f8f7bb40.js +0 -3
- package/dist/esm/post-back-to-top-77471a90.js +0 -73
- package/dist/esm/post-banner-b0af5bd3.js +0 -89
- package/dist/esm/post-card-control-3225eb57.js +0 -270
- package/dist/esm/post-tab-header-6a9b0153.js +0 -31
- package/dist/post-components/p-025688e5.js +0 -1
- package/dist/post-components/p-08b51b35.entry.js +0 -1
- package/dist/post-components/p-0e216cc4.js +0 -2
- package/dist/post-components/p-24c92608.js +0 -1
- package/dist/post-components/p-25a57971.js +0 -1
- package/dist/post-components/p-2737eaf5.js +0 -1
- package/dist/post-components/p-2cb4a8f1.js +0 -1
- package/dist/post-components/p-33b64e0c.js +0 -1
- package/dist/post-components/p-34d70cd5.js +0 -1
- package/dist/post-components/p-350f3900.entry.js +0 -1
- package/dist/post-components/p-35bc4554.js +0 -1
- package/dist/post-components/p-38b259a4.entry.js +0 -1
- package/dist/post-components/p-3c6cef1e.entry.js +0 -1
- package/dist/post-components/p-4a713cf8.js +0 -1
- package/dist/post-components/p-4b5e2b24.js +0 -1
- package/dist/post-components/p-515e0f96.js +0 -1
- package/dist/post-components/p-5467b223.js +0 -1
- package/dist/post-components/p-54e58fc2.entry.js +0 -1
- package/dist/post-components/p-637759d6.js +0 -1
- package/dist/post-components/p-6adeaa6c.js +0 -1
- package/dist/post-components/p-7589a19f.js +0 -1
- package/dist/post-components/p-7cce7342.entry.js +0 -1
- package/dist/post-components/p-819e19de.js +0 -1
- package/dist/post-components/p-82d48128.js +0 -1
- package/dist/post-components/p-85171893.entry.js +0 -1
- package/dist/post-components/p-882fdd0c.entry.js +0 -1
- package/dist/post-components/p-94399c69.js +0 -1
- package/dist/post-components/p-9a02b162.entry.js +0 -1
- package/dist/post-components/p-b1f5bc26.js +0 -1
- package/dist/post-components/p-b2f239a1.entry.js +0 -1
- package/dist/post-components/p-b571e5c8.js +0 -1
- package/dist/post-components/p-ba530822.js +0 -1
- package/dist/post-components/p-bae1c85f.entry.js +0 -1
- package/dist/post-components/p-bdabdec5.js +0 -1
- package/dist/post-components/p-c1225174.entry.js +0 -1
- package/dist/post-components/p-c372a141.entry.js +0 -1
- package/dist/post-components/p-c87c5d59.entry.js +0 -1
- package/dist/post-components/p-d04c1b7f.entry.js +0 -1
- package/dist/post-components/p-da300843.entry.js +0 -1
- package/dist/post-components/p-fec04a15.entry.js +0 -1
- package/loaders/fade.js +0 -7
- package/loaders/package.js +0 -3
- /package/dist/components/{heading-levels.js → p-247a1668.js} +0 -0
- /package/dist/components/{constants.js → p-440193f4.js} +0 -0
- /package/dist/components/{index.browser.js → p-5959f2bd.js} +0 -0
- /package/dist/components/{get-root.js → p-fc91cbc2.js} +0 -0
- /package/dist/post-components/{p-4a3f67ab.js → p-8562c7dc.js} +0 -0
- /package/dist/post-components/{p-611b3c41.js → p-bacd3e2c.js} +0 -0
- /package/dist/post-components/{p-b22656b1.js → p-cb9ab938.js} +0 -0
- /package/dist/post-components/{p-d4f93f2b.js → p-e1baac59.js} +0 -0
- /package/loaders/{heading-levels.js → p-247a1668.js} +0 -0
- /package/loaders/{constants.js → p-440193f4.js} +0 -0
- /package/loaders/{index.browser.js → p-5959f2bd.js} +0 -0
- /package/loaders/{get-root.js → p-fc91cbc2.js} +0 -0
|
@@ -1,303 +0,0 @@
|
|
|
1
|
-
import { proxyCustomElement, HTMLElement, createEvent, h, Host } from '@stencil/core/internal/client';
|
|
2
|
-
import { c as checkOneOf } from './check-one-of.js';
|
|
3
|
-
import { c as checkNonEmpty } from './check-non-empty.js';
|
|
4
|
-
import { v as version } from './package.js';
|
|
5
|
-
import { d as defineCustomElement$1 } from './post-icon2.js';
|
|
6
|
-
|
|
7
|
-
const postCardControlCss = "/*!\n * Copyright 2021 by Swiss Post, Information Technology\n */.form-check{display:flex;flex-wrap:wrap;align-items:flex-start;width:fit-content;border-radius:var(--post-device-border-radius-focus)}.form-check-inline{display:inline-flex;vertical-align:top}fieldset>.form-check-inline:not(:last-of-type){margin-right:var(--post-core-dimension-24)}.form-check:has(>input:not(:only-child)){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}.form-check:has(>input:not(:only-child)):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){.form-check:has(>input:not(:only-child)):is(:focus-visible,:has(:focus-visible),.pretend-focus){outline-color:Highlight !important}}@supports not selector(:has(:focus-visible)){.form-check:has(>input:not(:only-child)):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){.form-check:has(>input:not(:only-child)):is(:focus-visible,:focus-within,.pretend-focus){outline-color:Highlight !important}}}.form-check:has(>input:not(:only-child))>input{outline:none !important}.form-check:has(input[type=checkbox]):not(.form-switch){padding-block:var(--post-device-spacing-padding-block-19)}fieldset>.form-check:has(input[type=checkbox]):not(.form-switch):not(:last-of-type){margin-bottom:var(--post-device-spacing-gap-4)}.form-check:has(input[type=checkbox]):not(.form-switch)>input[type=checkbox]~label{padding-block:var(--post-device-spacing-padding-block-20);padding-inline-start:var(--post-device-spacing-gap-inline-12);color:var(--post-scheme-color-interactive-primary-enabled-fg1)}.form-check:has(input[type=checkbox]):not(.form-switch)>input[type=checkbox]:not([disabled])~label{cursor:pointer}.form-check:has(input[type=checkbox]):not(.form-switch)>input[type=checkbox]:not([disabled]):hover~label{color:var(--post-scheme-color-interactive-primary-hover-fg1)}@media (forced-colors: active),(-ms-high-contrast: active),(-ms-high-contrast: white-on-black){.form-check:has(input[type=checkbox]):not(.form-switch)>input[type=checkbox]:not([disabled]):hover~label{color:Highlight}}.form-check:has(input[type=checkbox]):not(.form-switch)>input[type=checkbox][disabled]~label{color:var(--post-scheme-color-interactive-primary-disabled-fg4)}@media (forced-colors: active),(-ms-high-contrast: active),(-ms-high-contrast: white-on-black){.form-check:has(input[type=checkbox]):not(.form-switch)>input[type=checkbox][disabled]~label{color:GrayText}}.form-check.form-switch>input[type=checkbox]~label{color:var(--post-scheme-color-interactive-primary-enabled-fg1)}.form-check.form-switch>input[type=checkbox]:not([disabled])~label{cursor:pointer}.form-check.form-switch>input[type=checkbox]:not([disabled]):hover~label{color:var(--post-scheme-color-interactive-primary-enabled-fg1)}@media (forced-colors: active),(-ms-high-contrast: active),(-ms-high-contrast: white-on-black){.form-check.form-switch>input[type=checkbox]:not([disabled]):hover~label{color:Highlight}}.form-check.form-switch>input[type=checkbox][disabled]~label{color:var(--post-scheme-color-interactive-primary-disabled-fg1)}@media (forced-colors: active),(-ms-high-contrast: active),(-ms-high-contrast: white-on-black){.form-check.form-switch>input[type=checkbox][disabled]~label{color:GrayText}}.form-check:has(input[type=radio]){padding-block:var(--post-device-spacing-padding-block-19)}fieldset>.form-check:has(input[type=radio]):not(:last-of-type){margin-bottom:var(--post-device-spacing-gap-4)}.form-check:has(input[type=radio])>input[type=radio]~label{padding-block:var(--post-device-spacing-padding-block-20);padding-inline-start:var(--post-device-spacing-gap-inline-12);color:var(--post-scheme-color-interactive-primary-enabled-fg1)}.form-check:has(input[type=radio])>input[type=radio]:not([disabled])~label{cursor:pointer}.form-check:has(input[type=radio])>input[type=radio]:not([disabled]):hover~label{color:var(--post-scheme-color-interactive-primary-hover-fg1)}@media (forced-colors: active),(-ms-high-contrast: active),(-ms-high-contrast: white-on-black){.form-check:has(input[type=radio])>input[type=radio]:not([disabled]):hover~label{color:Highlight}}.form-check:has(input[type=radio])>input[type=radio][disabled]~label{color:var(--post-scheme-color-interactive-primary-disabled-fg4)}@media (forced-colors: active),(-ms-high-contrast: active),(-ms-high-contrast: white-on-black){.form-check:has(input[type=radio])>input[type=radio][disabled]~label{color:GrayText}}.form-check>label{transition:color 250ms cubic-bezier(0.4, 0, 0.2, 1);flex:1}@media (forced-colors: active),(-ms-high-contrast: active),(-ms-high-contrast: white-on-black){.form-check>label{transition:none}}:where(.form-check>input[type=checkbox]){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}:where(.form-check>input[type=checkbox]):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){:where(.form-check>input[type=checkbox]):is(:focus-visible,:has(:focus-visible),.pretend-focus){outline-color:Highlight !important}}@supports not selector(:has(:focus-visible)){:where(.form-check>input[type=checkbox]):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){:where(.form-check>input[type=checkbox]):is(:focus-visible,:focus-within,.pretend-focus){outline-color:Highlight !important}}}.form-check:not(.form-switch):has(input[type=checkbox])>input{appearance:none;flex:none;display:inline-flex;margin:var(--post-device-spacing-padding-1);margin-block:calc(var(--post-device-spacing-padding-1) + var(--post-device-spacing-padding-block-18));width:var(--post-device-sizing-interactive-icon-size);height:var(--post-device-sizing-interactive-icon-size);background-color:var(--post-scheme-color-interactive-primary-enabled-bg3);border:var(--post-device-border-width-default) var(--post-core-border-style-solid) var(--post-scheme-color-interactive-primary-enabled-stroke);border-radius:var(--post-core-dimension-2);color:var(--post-scheme-color-interactive-primary-enabled-fg1);vertical-align:top;transition:background-color 250ms cubic-bezier(0.4, 0, 0.2, 1),border-color 250ms cubic-bezier(0.4, 0, 0.2, 1),color 250ms cubic-bezier(0.4, 0, 0.2, 1),box-shadow 250ms cubic-bezier(0.4, 0, 0.2, 1)}@media (forced-colors: active),(-ms-high-contrast: active),(-ms-high-contrast: white-on-black){.form-check:not(.form-switch):has(input[type=checkbox])>input{background-color:Field;border-color:FieldText;color:FieldText}}.form-check:not(.form-switch):has(input[type=checkbox])>input:not([disabled]){cursor:pointer}.form-check:not(.form-switch):has(input[type=checkbox])>input::after{display:block;content:\"\";width:100%;height:100%;mask-size:var(--post-device-sizing-interactive-icon-size);mask-repeat:no-repeat;mask-position:center}.form-check:not(.form-switch):has(input[type=checkbox])>input:checked::after,.form-check:not(.form-switch):has(input[type=checkbox])>input:indeterminate::after{background-color:currentColor}@media (forced-colors: active),(-ms-high-contrast: active),(-ms-high-contrast: white-on-black){.form-check:not(.form-switch):has(input[type=checkbox])>input:checked::after,.form-check:not(.form-switch):has(input[type=checkbox])>input:indeterminate::after{background-color:FieldText}}.form-check:not(.form-switch):has(input[type=checkbox])>input:not([disabled]):hover{background-color:var(--post-scheme-color-interactive-primary-hover-bg3);border-color:var(--post-scheme-color-interactive-primary-hover-stroke);color:var(--post-scheme-color-interactive-primary-hover-fg1)}@media (forced-colors: active),(-ms-high-contrast: active),(-ms-high-contrast: white-on-black){.form-check:not(.form-switch):has(input[type=checkbox])>input:not([disabled]):hover{background-color:Field;border-color:Highlight}.form-check:not(.form-switch):has(input[type=checkbox])>input:not([disabled]):hover:checked::after,.form-check:not(.form-switch):has(input[type=checkbox])>input:not([disabled]):hover:indeterminate::after{background-color:Highlight}}.form-check:not(.form-switch):has(input[type=checkbox])>input:checked::after{mask-image:url(\"data:image/svg+xml,<svg viewBox='0 0 16 16' xmlns='http://www.w3.org/2000/svg'><path d='M7.51712 12.1332L4.30712 8.69325C4.02712 8.39325 4.03712 7.91325 4.34712 7.63325C4.64712 7.35325 5.12712 7.36325 5.40712 7.67325L7.31712 9.72325L10.7171 4.57325C10.9471 4.22325 11.4071 4.13325 11.7571 4.36325C12.1071 4.59325 12.1971 5.05325 11.9671 5.40325L7.51712 12.1332Z'/></svg>\")}.form-check:not(.form-switch):has(input[type=checkbox])>input:indeterminate::after{mask-image:url(\"data:image/svg+xml,<svg width='16' height='16' viewBox='0 0 16 16' xmlns='http://www.w3.org/2000/svg'><path d='M11.21 8.5H4.75C4.34 8.5 4 8.16 4 7.75C4 7.34 4.34 7 4.75 7H11.21C11.62 7 11.96 7.34 11.96 7.75C11.96 8.16 11.62 8.5 11.21 8.5Z'/></svg>\")}.form-check:not(.form-switch):has(input[type=checkbox])>input[disabled]{background-color:var(--post-scheme-color-interactive-primary-disabled-bg6);border:var(--post-device-border-width-default) var(--post-core-border-style-dash) var(--post-scheme-color-interactive-primary-disabled-stroke4);color:var(--post-scheme-color-interactive-primary-disabled-fg4)}@media (forced-colors: active),(-ms-high-contrast: active),(-ms-high-contrast: white-on-black){.form-check:not(.form-switch):has(input[type=checkbox])>input[disabled]{background-color:Field;border-color:GrayText}.form-check:not(.form-switch):has(input[type=checkbox])>input[disabled]:checked::after,.form-check:not(.form-switch):has(input[type=checkbox])>input[disabled]:indeterminate::after{background-color:GrayText}}:where(.form-check>input[type=radio]){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}:where(.form-check>input[type=radio]):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){:where(.form-check>input[type=radio]):is(:focus-visible,:has(:focus-visible),.pretend-focus){outline-color:Highlight !important}}@supports not selector(:has(:focus-visible)){:where(.form-check>input[type=radio]):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){:where(.form-check>input[type=radio]):is(:focus-visible,:focus-within,.pretend-focus){outline-color:Highlight !important}}}.form-check>input[type=radio]{appearance:none;flex:none;display:inline-flex;justify-content:center;align-items:center;margin-block:calc(var(--post-device-spacing-padding-1) + var(--post-device-spacing-padding-block-18));margin-inline:var(--post-device-spacing-padding-1);width:var(--post-device-sizing-interactive-icon-size);height:var(--post-device-sizing-interactive-icon-size);background-color:var(--post-scheme-color-interactive-primary-enabled-bg3);border:var(--post-device-border-width-default) var(--post-core-border-style-solid) var(--post-scheme-color-interactive-primary-enabled-stroke);border-radius:var(--post-device-border-radius-round);color:var(--post-scheme-color-interactive-primary-enabled-fg1);vertical-align:top;transition:background-color 250ms cubic-bezier(0.4, 0, 0.2, 1),border-color 250ms cubic-bezier(0.4, 0, 0.2, 1),color 250ms cubic-bezier(0.4, 0, 0.2, 1),box-shadow 250ms cubic-bezier(0.4, 0, 0.2, 1)}@media (forced-colors: active),(-ms-high-contrast: active),(-ms-high-contrast: white-on-black){.form-check>input[type=radio]{background-color:Field;border-color:FieldText;color:FieldText;transition:none}}.form-check>input[type=radio]:not([disabled]){cursor:pointer}.form-check>input[type=radio]::after{display:block;content:\"\";width:var(--post-device-sizing-icon-3);height:var(--post-device-sizing-icon-3);border-radius:inherit}.form-check>input[type=radio]:checked::after{background-color:var(--post-scheme-color-interactive-primary-enabled-fg1)}@media (forced-colors: active),(-ms-high-contrast: active),(-ms-high-contrast: white-on-black){.form-check>input[type=radio]:checked::after{background-color:FieldText}}.form-check>input[type=radio]:not([disabled]):hover{background-color:var(--post-scheme-color-interactive-primary-hover-bg3);border-color:var(--post-scheme-color-interactive-primary-hover-stroke);color:var(--post-scheme-color-interactive-primary-hover-fg1)}.form-check>input[type=radio]:not([disabled]):hover:checked::after{background-color:var(--post-scheme-color-interactive-primary-hover-fg1)}@media (forced-colors: active),(-ms-high-contrast: active),(-ms-high-contrast: white-on-black){.form-check>input[type=radio]:not([disabled]):hover{background-color:Field;border-color:Highlight}.form-check>input[type=radio]:not([disabled]):hover:checked::after{background-color:Highlight}}.form-check>input[type=radio][disabled]{background-color:var(--post-scheme-color-interactive-primary-disabled-bg6);border:var(--post-device-border-width-default) var(--post-core-border-style-dash) var(--post-scheme-color-interactive-primary-disabled-stroke4);color:var(--post-scheme-color-interactive-primary-disabled-fg4)}.form-check>input[type=radio][disabled]:checked::after{background-color:var(--post-scheme-color-interactive-primary-disabled-fg4)}@media (forced-colors: active),(-ms-high-contrast: active),(-ms-high-contrast: white-on-black){.form-check>input[type=radio][disabled]{background-color:Field;border-color:GrayText}.form-check>input[type=radio][disabled]:checked::after{background-color:GrayText}}:host{--post-card-control-bg-context:.bg-yellow, .bg-white, .bg-light, .bg-gray, .bg-warning, .bg-info, .bg-success-background, .bg-warning-background, .bg-error-background, .bg-dark, .bg-black, .bg-primary, .bg-secondary, .bg-success, .bg-error;display:flex;width:100%}:host-context(fieldset):host(:not(:last-child)) .card-control{margin-bottom:var(--post-core-dimension-16)}.card-control{--post-card-control-border-color:hsl(0, 0%, 40%);--post-card-control-bg:#fff;--post-card-control-color:hsl(0, 0%, 20%);--post-card-control-input-border-color:hsl(0, 0%, 20%);--post-card-control-input-bg:#fff;flex-basis:100%;display:grid;grid-template:\"input label icon\" \"input content content\"/min-content auto min-content;align-items:center;gap:0 var(--post-core-dimension-8);margin:0;padding:var(--post-core-dimension-12);background-color:var(--post-card-control-bg);border:var(--post-core-dimension-2) solid var(--post-card-control-border-color);border-radius:4px;color:var(--post-card-control-color) !important;cursor:pointer}.card-control .card-control--input{grid-area:input;margin:var(--post-core-dimension-4) 0;background-color:var(--post-card-control-input-bg) !important;border-color:var(--post-card-control-input-border-color) !important;color:var(--post-card-control-input-border-color) !important;cursor:inherit;transition:none;outline:none !important}.card-control .card-control--input:hover:not([disabled]),.card-control .card-control--input:hover:not([disabled])~label.form-check-label{color:var(--post-contrast-color);background-color:rgba(0,0,0,0)}.card-control .card-control--input:focus,.card-control .card-control--input:focus-visible{box-shadow:none}@media (forced-colors: active),(-ms-high-contrast: active),(-ms-high-contrast: white-on-black){.card-control .card-control--input::after{forced-color-adjust:none;border-color:rgba(0,0,0,0)}}.card-control .card-control--label{grid-area:label;margin:var(--post-core-dimension-4) 0;padding:0 !important;color:inherit !important;pointer-events:none;transition:none}.card-control .card-control--label:not(:has(+.card-control--icon)){grid-area:1/label/1/icon}.card-control .card-control--description{grid-area:label;font-size:.75rem}.card-control .card-control--content{grid-area:content}.card-control .card-control--icon{grid-area:icon;width:var(--post-core-dimension-32);height:var(--post-core-dimension-32);pointer-events:none}.card-control .card-control--icon>slot>*{width:100%;height:100%}.card-control:not(.is-disabled).is-checked{--post-card-control-border-color:#000;--post-card-control-bg:#fc0}@media (forced-colors: active),(-ms-high-contrast: active),(-ms-high-contrast: white-on-black){.card-control:not(.is-disabled).is-checked{--post-card-control-border-color:FieldText;--post-card-control-bg:SelectedItem;--post-card-control-color:SelectedItemText;--post-card-control-input-border-color:SelectedItemText;--post-card-control-input-bg:SelectedItem}.card-control:not(.is-disabled).is-checked .card-control--input::after{background-color:var(--post-card-control-color) !important}}.card-control:not(.is-disabled).is-invalid{--post-card-control-border-color:#a51728;--post-card-control-color:#a51728;--post-card-control-input-border-color:#a51728}.card-control:not(.is-disabled):hover{--post-card-control-border-color:hsl(0, 0%, 20%);--post-card-control-bg:hsl(0, 0%, 40%);--post-card-control-color:#fff;--post-card-control-input-border-color:#000}@media (forced-colors: active),(-ms-high-contrast: active),(-ms-high-contrast: white-on-black){.card-control:not(.is-disabled):hover{--post-card-control-border-color:Highlight;--post-card-control-bg:Field;--post-card-control-color:FieldText;--post-card-control-input-border-color:Highlight;--post-card-control-input-bg:Field}.card-control:not(.is-disabled):hover .card-control--input::after{color:FieldText}}.card-control.is-focused:where(:has(.card-control--input:focus-visible)){outline-offset:var(--post-core-dimension-2);outline:var(--post-core-dimension-2) solid #1976c8}.card-control.is-disabled{--post-card-control-border-color:hsl(0, 0%, 40%);--post-card-control-bg:transparent;--post-card-control-color:hsl(0, 0%, 40%);--post-card-control-input-border-color:hsl(0, 0%, 40%);--post-card-control-input-bg:transparent;border-style:dashed;cursor:default}.card-control.is-disabled .card-control--input{padding:2px;border-style:dashed}@media (forced-colors: active),(-ms-high-contrast: active),(-ms-high-contrast: white-on-black){.card-control{--post-card-control-border-color:FieldText;--post-card-control-bg:Field;--post-card-control-color:FieldText;--post-card-control-input-border-color:FieldText;--post-card-control-input-bg:Field;outline:var(--post-core-dimension-2) solid Field;outline-offset:calc(var(--post-core-dimension-2)*-2)}.card-control .card-control--input{outline:var(--post-core-dimension-2) solid Field}.card-control .card-control--input[type]{background-color:Field !important}.card-control .card-control--input::after{border-color:Field !important}.card-control .card-control--label,.card-control .card-control--content{background-color:var(--post-card-control-bg) !important}.card-control:not(.is-disabled).is-checked{--post-card-control-border-color:FieldText;--post-card-control-bg:SelectedItem;--post-card-control-color:SelectedItemText;--post-card-control-input-border-color:FieldText}.card-control:not(.is-disabled).is-checked .card-control--input::after{background-color:FieldText !important}.card-control:not(.is-disabled):hover{--post-card-control-border-color:Highlight;--post-card-control-bg:Field;--post-card-control-color:FieldText;--post-card-control-input-border-color:Highlight}.card-control.is-disabled{--post-card-control-border-color:GrayText;--post-card-control-bg:Field;--post-card-control-color:FieldText;--post-card-control-input-border-color:GrayText;--post-card-control-input-bg:Field}.card-control.is-disabled .card-control--input{background-image:url(\"data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg'%3e%3crect width='100%' height='100%' fill='none' stroke='GrayText' stroke-width='4px ' stroke-dasharray='2 1.5 4 1.5 4 1.5 4 1.5 2 3.5 4 1.5 4 1.5 4 1.5 2 3.5 4 1.5 4 1.5 4 1.5 2 3.5 4 1.5 4 1.5 4' pathLength='88' /%3e%3c/svg%3e\")}.card-control.is-disabled .card-control--input[type=radio]{background-image:url(\"data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg'%3e%3crect width='100%' height='100%' rx='100' ry='100' fill='none' stroke='GrayText' stroke-width='4px ' stroke-dasharray='4 2' /%3e%3c/svg%3e\")}.card-control.is-disabled.is-checked{--post-card-control-bg:SelectedItem;--post-card-control-color:SelectedItemText;position:relative;background-color:Field}.card-control.is-disabled.is-checked::before{display:block;content:\"\";position:absolute;inset:var(--post-core-dimension-2);background-color:SelectedItem;z-index:1}.card-control.is-disabled.is-checked>*{position:relative;z-index:2}.card-control.is-disabled.is-checked .card-control--input::after{background-color:FieldText !important}}@media (forced-colors: active)and (forced-colors: active),(forced-colors: active)and (-ms-high-contrast: active),(forced-colors: active)and (-ms-high-contrast: white-on-black),(-ms-high-contrast: active)and (forced-colors: active),(-ms-high-contrast: active)and (-ms-high-contrast: active),(-ms-high-contrast: active)and (-ms-high-contrast: white-on-black),(-ms-high-contrast: white-on-black)and (forced-colors: active),(-ms-high-contrast: white-on-black)and (-ms-high-contrast: active),(-ms-high-contrast: white-on-black)and (-ms-high-contrast: white-on-black){.card-control{--post-card-control-border-color:GrayText;--post-card-control-color:GrayText;--post-card-control-input-border-color:GrayText}.card-control.is-checked{--post-card-control-input-bg:field;position:relative}.card-control.is-checked::before{display:block;content:\"\";position:absolute;inset:var(--post-core-dimension-2);border-radius:calc(var(--post-core-dimension-2)*.5);background-color:SelectedItem}.card-control.is-checked>*{position:relative}.card-control.is-checked .card-control--input{outline:var(--post-core-dimension-2) solid Field}}:host-context(:is(.bg-dark,.bg-black,.bg-primary,.bg-secondary,.bg-success,.bg-error)) .card-control{--post-card-control-border-color:#fff;--post-card-control-bg:transparent;--post-card-control-color:#fff;--post-card-control-input-border-color:#fff;--post-card-control-input-bg:transparent}:host-context(:is(.bg-dark,.bg-black,.bg-primary,.bg-secondary,.bg-success,.bg-error)) .card-control:not(.is-disabled).is-checked{--post-card-control-border-color:#fc0;--post-card-control-bg:#fc0;--post-card-control-color:hsl(0, 0%, 20%);--post-card-control-input-border-color:hsl(0, 0%, 20%);--post-card-control-input-bg:#fff}:host-context(:is(.bg-dark,.bg-black,.bg-primary,.bg-secondary,.bg-success,.bg-error)) .card-control:not(.is-disabled).is-invalid{--post-card-control-border-color:#a51728;--post-card-control-bg:#ffdade;--post-card-control-color:#a51728;--post-card-control-input-border-color:#a51728;--post-card-control-input-bg:#fff}:host-context(:is(.bg-dark,.bg-black,.bg-primary,.bg-secondary,.bg-success,.bg-error)) .card-control:not(.is-disabled).is-invalid:where(.is-checked){--post-card-control-bg:#fc0}:host-context(:is(.bg-dark,.bg-black,.bg-primary,.bg-secondary,.bg-success,.bg-error)) .card-control:not(.is-disabled):hover{--post-card-control-border-color:#000;--post-card-control-bg:hsl(0, 0%, 80%);--post-card-control-color:#000;--post-card-control-input-border-color:#000;--post-card-control-input-bg:#fff}@media (forced-colors: active),(-ms-high-contrast: active),(-ms-high-contrast: white-on-black){:host-context(:is(.bg-dark,.bg-black,.bg-primary,.bg-secondary,.bg-success,.bg-error)) .card-control:not(.is-disabled):hover{--post-card-control-border-color:Highlight;--post-card-control-bg:Field;--post-card-control-color:FieldText;--post-card-control-input-border-color:Highlight;--post-card-control-input-bg:Field}}:host-context(:is(.bg-dark,.bg-black,.bg-primary,.bg-secondary,.bg-success,.bg-error)) .card-control.is-focused:where(:has(.card-control--input:focus-visible)){outline-color:#fff}:host-context(:is(.bg-dark,.bg-black,.bg-primary,.bg-secondary,.bg-success,.bg-error)) .card-control.is-disabled{--post-card-control-border-color:post.$white-alpha-80;--post-card-control-bg:transparent;--post-card-control-color:post.$white-alpha-80;--post-card-control-input-border-color:post.$white-alpha-80;--post-card-control-input-bg:transparent}@media (forced-colors: active),(-ms-high-contrast: active),(-ms-high-contrast: white-on-black){:host-context(:is(.bg-dark,.bg-black,.bg-primary,.bg-secondary,.bg-success,.bg-error)) .card-control.is-disabled{--post-card-control-border-color:GrayText;--post-card-control-color:GrayText;--post-card-control-input-border-color:GrayText}:host-context(:is(.bg-dark,.bg-black,.bg-primary,.bg-secondary,.bg-success,.bg-error)) .card-control.is-disabled.is-checked{--post-card-control-input-bg:Field}}@media (forced-colors: active),(-ms-high-contrast: active),(-ms-high-contrast: white-on-black){:host-context(:is(.bg-dark,.bg-black,.bg-primary,.bg-secondary,.bg-success,.bg-error)) .card-control{--post-card-control-border-color:FieldText;--post-card-control-bg:Field;--post-card-control-color:FieldText;--post-card-control-input-border-color:FieldText;--post-card-control-input-bg:Field}:host-context(:is(.bg-dark,.bg-black,.bg-primary,.bg-secondary,.bg-success,.bg-error)) .card-control:not(.is-disabled).is-checked{--post-card-control-border-color:FieldText;--post-card-control-bg:SelectedItem;--post-card-control-color:SelectedItemText;--post-card-control-input-border-color:FieldText}:host-context(:is(.bg-dark,.bg-black,.bg-primary,.bg-secondary,.bg-success,.bg-error)) .card-control:not(.is-disabled):hover{--post-card-control-border-color:Highlight;--post-card-control-bg:Field;--post-card-control-color:FieldText;--post-card-control-input-border-color:Highlight}:host-context(:is(.bg-dark,.bg-black,.bg-primary,.bg-secondary,.bg-success,.bg-error)) .card-control.is-disabled{--post-card-control-border-color:GrayText;--post-card-control-bg:Field;--post-card-control-color:FieldText;--post-card-control-input-border-color:GrayText;--post-card-control-input-bg:Field}:host-context(:is(.bg-dark,.bg-black,.bg-primary,.bg-secondary,.bg-success,.bg-error)) .card-control.is-disabled.is-checked{--post-card-control-bg:SelectedItem;--post-card-control-color:SelectedItemText}}:host(:not([data-context])){display:none}:host([data-context*=fieldset]:not(:last-child)) .card-control{margin-bottom:var(--post-core-dimension-16)}:host(:is([data-context*=\".bg-dark\"],[data-context*=\".bg-black\"],[data-context*=\".bg-primary\"],[data-context*=\".bg-secondary\"],[data-context*=\".bg-success\"],[data-context*=\".bg-error\"])) .card-control{--post-card-control-border-color:#fff;--post-card-control-bg:transparent;--post-card-control-color:#fff;--post-card-control-input-border-color:#fff;--post-card-control-input-bg:transparent}:host(:is([data-context*=\".bg-dark\"],[data-context*=\".bg-black\"],[data-context*=\".bg-primary\"],[data-context*=\".bg-secondary\"],[data-context*=\".bg-success\"],[data-context*=\".bg-error\"])) .card-control:not(.is-disabled).is-checked{--post-card-control-border-color:#fc0;--post-card-control-bg:#fc0;--post-card-control-color:hsl(0, 0%, 20%);--post-card-control-input-border-color:hsl(0, 0%, 20%);--post-card-control-input-bg:#fff}:host(:is([data-context*=\".bg-dark\"],[data-context*=\".bg-black\"],[data-context*=\".bg-primary\"],[data-context*=\".bg-secondary\"],[data-context*=\".bg-success\"],[data-context*=\".bg-error\"])) .card-control:not(.is-disabled).is-invalid{--post-card-control-border-color:#a51728;--post-card-control-bg:#ffdade;--post-card-control-color:#a51728;--post-card-control-input-border-color:#a51728;--post-card-control-input-bg:#fff}:host(:is([data-context*=\".bg-dark\"],[data-context*=\".bg-black\"],[data-context*=\".bg-primary\"],[data-context*=\".bg-secondary\"],[data-context*=\".bg-success\"],[data-context*=\".bg-error\"])) .card-control:not(.is-disabled).is-invalid:where(.is-checked){--post-card-control-bg:#fc0}:host(:is([data-context*=\".bg-dark\"],[data-context*=\".bg-black\"],[data-context*=\".bg-primary\"],[data-context*=\".bg-secondary\"],[data-context*=\".bg-success\"],[data-context*=\".bg-error\"])) .card-control:not(.is-disabled):hover{--post-card-control-border-color:#000;--post-card-control-bg:hsl(0, 0%, 80%);--post-card-control-color:#000;--post-card-control-input-border-color:#000;--post-card-control-input-bg:#fff}@media (forced-colors: active),(-ms-high-contrast: active),(-ms-high-contrast: white-on-black){:host(:is([data-context*=\".bg-dark\"],[data-context*=\".bg-black\"],[data-context*=\".bg-primary\"],[data-context*=\".bg-secondary\"],[data-context*=\".bg-success\"],[data-context*=\".bg-error\"])) .card-control:not(.is-disabled):hover{--post-card-control-border-color:Highlight;--post-card-control-bg:Field;--post-card-control-color:FieldText;--post-card-control-input-border-color:Highlight;--post-card-control-input-bg:Field}}:host(:is([data-context*=\".bg-dark\"],[data-context*=\".bg-black\"],[data-context*=\".bg-primary\"],[data-context*=\".bg-secondary\"],[data-context*=\".bg-success\"],[data-context*=\".bg-error\"])) .card-control.is-focused:where(:has(.card-control--input:focus-visible)){outline-color:#fff}:host(:is([data-context*=\".bg-dark\"],[data-context*=\".bg-black\"],[data-context*=\".bg-primary\"],[data-context*=\".bg-secondary\"],[data-context*=\".bg-success\"],[data-context*=\".bg-error\"])) .card-control.is-disabled{--post-card-control-border-color:post.$white-alpha-80;--post-card-control-bg:transparent;--post-card-control-color:post.$white-alpha-80;--post-card-control-input-border-color:post.$white-alpha-80;--post-card-control-input-bg:transparent}@media (forced-colors: active),(-ms-high-contrast: active),(-ms-high-contrast: white-on-black){:host(:is([data-context*=\".bg-dark\"],[data-context*=\".bg-black\"],[data-context*=\".bg-primary\"],[data-context*=\".bg-secondary\"],[data-context*=\".bg-success\"],[data-context*=\".bg-error\"])) .card-control.is-disabled{--post-card-control-border-color:GrayText;--post-card-control-color:GrayText;--post-card-control-input-border-color:GrayText}:host(:is([data-context*=\".bg-dark\"],[data-context*=\".bg-black\"],[data-context*=\".bg-primary\"],[data-context*=\".bg-secondary\"],[data-context*=\".bg-success\"],[data-context*=\".bg-error\"])) .card-control.is-disabled.is-checked{--post-card-control-input-bg:Field}}@media (forced-colors: active),(-ms-high-contrast: active),(-ms-high-contrast: white-on-black){:host(:is([data-context*=\".bg-dark\"],[data-context*=\".bg-black\"],[data-context*=\".bg-primary\"],[data-context*=\".bg-secondary\"],[data-context*=\".bg-success\"],[data-context*=\".bg-error\"])) .card-control{--post-card-control-border-color:FieldText;--post-card-control-bg:Field;--post-card-control-color:FieldText;--post-card-control-input-border-color:FieldText;--post-card-control-input-bg:Field}:host(:is([data-context*=\".bg-dark\"],[data-context*=\".bg-black\"],[data-context*=\".bg-primary\"],[data-context*=\".bg-secondary\"],[data-context*=\".bg-success\"],[data-context*=\".bg-error\"])) .card-control:not(.is-disabled).is-checked{--post-card-control-border-color:FieldText;--post-card-control-bg:SelectedItem;--post-card-control-color:SelectedItemText;--post-card-control-input-border-color:FieldText}:host(:is([data-context*=\".bg-dark\"],[data-context*=\".bg-black\"],[data-context*=\".bg-primary\"],[data-context*=\".bg-secondary\"],[data-context*=\".bg-success\"],[data-context*=\".bg-error\"])) .card-control:not(.is-disabled):hover{--post-card-control-border-color:Highlight;--post-card-control-bg:Field;--post-card-control-color:FieldText;--post-card-control-input-border-color:Highlight}:host(:is([data-context*=\".bg-dark\"],[data-context*=\".bg-black\"],[data-context*=\".bg-primary\"],[data-context*=\".bg-secondary\"],[data-context*=\".bg-success\"],[data-context*=\".bg-error\"])) .card-control.is-disabled{--post-card-control-border-color:GrayText;--post-card-control-bg:Field;--post-card-control-color:FieldText;--post-card-control-input-border-color:GrayText;--post-card-control-input-bg:Field}:host(:is([data-context*=\".bg-dark\"],[data-context*=\".bg-black\"],[data-context*=\".bg-primary\"],[data-context*=\".bg-secondary\"],[data-context*=\".bg-success\"],[data-context*=\".bg-error\"])) .card-control.is-disabled.is-checked{--post-card-control-bg:SelectedItem;--post-card-control-color:SelectedItemText}}";
|
|
8
|
-
const PostCardControlStyle0 = postCardControlCss;
|
|
9
|
-
|
|
10
|
-
let cardControlIds = 0;
|
|
11
|
-
const PostCardControl = /*@__PURE__*/ proxyCustomElement(class PostCardControl extends HTMLElement {
|
|
12
|
-
/**
|
|
13
|
-
* A public method to reset the controls `checked` and `validity` state.
|
|
14
|
-
* The validity state is set to `null`, so it's neither valid nor invalid.
|
|
15
|
-
*/
|
|
16
|
-
async reset() {
|
|
17
|
-
this.validity = null;
|
|
18
|
-
this.controlSetChecked(this.initialChecked);
|
|
19
|
-
}
|
|
20
|
-
/**
|
|
21
|
-
* A hidden public method to reset the group controls `checked` state to `false`.
|
|
22
|
-
*/
|
|
23
|
-
async groupReset() {
|
|
24
|
-
if (this.disabled)
|
|
25
|
-
this.control.checked = this.checked = false;
|
|
26
|
-
this.controlSetChecked(false);
|
|
27
|
-
}
|
|
28
|
-
validateControlLabel(label = this.label) {
|
|
29
|
-
checkNonEmpty(label, 'The "post-card-control" element requires its "label" property to be set.');
|
|
30
|
-
}
|
|
31
|
-
validateControlType(type = this.type) {
|
|
32
|
-
checkOneOf(type, ['checkbox', 'radio'], 'The "post-card-control" element requires its "type" prop to be one of either "checkbox" or "radio".');
|
|
33
|
-
}
|
|
34
|
-
updateControlChecked(checked = this.checked) {
|
|
35
|
-
this.controlSetChecked(checked);
|
|
36
|
-
}
|
|
37
|
-
updateControlDisabled() {
|
|
38
|
-
this.controlSetChecked(this.checked);
|
|
39
|
-
}
|
|
40
|
-
constructor() {
|
|
41
|
-
super();
|
|
42
|
-
this.__registerHost();
|
|
43
|
-
this.__attachShadow();
|
|
44
|
-
this.postInput = createEvent(this, "postInput", 7);
|
|
45
|
-
this.postChange = createEvent(this, "postChange", 7);
|
|
46
|
-
this.internals = this.attachInternals();
|
|
47
|
-
this.EVENT_MAP = {
|
|
48
|
-
input: 'postInput',
|
|
49
|
-
change: 'postChange',
|
|
50
|
-
};
|
|
51
|
-
this.KEYCODES = {
|
|
52
|
-
SPACE: 'Space',
|
|
53
|
-
LEFT: 'ArrowLeft',
|
|
54
|
-
UP: 'ArrowUp',
|
|
55
|
-
RIGHT: 'ArrowRight',
|
|
56
|
-
DOWN: 'ArrowDown',
|
|
57
|
-
};
|
|
58
|
-
this.group = {
|
|
59
|
-
hosts: [],
|
|
60
|
-
members: [],
|
|
61
|
-
first: null,
|
|
62
|
-
last: null,
|
|
63
|
-
checked: null,
|
|
64
|
-
focused: null,
|
|
65
|
-
};
|
|
66
|
-
this.controlId = `PostCardControl_${cardControlIds++}`;
|
|
67
|
-
this.focused = false;
|
|
68
|
-
this.label = undefined;
|
|
69
|
-
this.description = null;
|
|
70
|
-
this.type = undefined;
|
|
71
|
-
this.name = null;
|
|
72
|
-
this.value = null;
|
|
73
|
-
this.checked = false;
|
|
74
|
-
this.disabled = false;
|
|
75
|
-
this.validity = null;
|
|
76
|
-
this.icon = null;
|
|
77
|
-
this.cardClickHandler = this.cardClickHandler.bind(this);
|
|
78
|
-
this.controlClickHandler = this.controlClickHandler.bind(this);
|
|
79
|
-
this.controlChangeHandler = this.controlChangeHandler.bind(this);
|
|
80
|
-
this.controlFocusHandler = this.controlFocusHandler.bind(this);
|
|
81
|
-
this.controlKeyDownHandler = this.controlKeyDownHandler.bind(this);
|
|
82
|
-
}
|
|
83
|
-
cardClickHandler(e) {
|
|
84
|
-
e.stopPropagation();
|
|
85
|
-
// if this was not the clicked element anyway, trigger click on control to change it
|
|
86
|
-
if (e.target !== this.control)
|
|
87
|
-
this.control.click();
|
|
88
|
-
}
|
|
89
|
-
controlClickHandler(e) {
|
|
90
|
-
e.stopPropagation();
|
|
91
|
-
// if control is disabled do nothing
|
|
92
|
-
// else control value will fire a change event, which is handled in the controlChangeHandler method
|
|
93
|
-
if (this.disabled)
|
|
94
|
-
e.preventDefault();
|
|
95
|
-
}
|
|
96
|
-
controlChangeHandler(e) {
|
|
97
|
-
e.stopPropagation();
|
|
98
|
-
this.groupCollectMembers();
|
|
99
|
-
this.controlSetChecked(this.control.checked, e);
|
|
100
|
-
this.groupSetChecked(this.control, e);
|
|
101
|
-
}
|
|
102
|
-
controlFocusHandler() {
|
|
103
|
-
this.focused = this.host === document.activeElement;
|
|
104
|
-
}
|
|
105
|
-
// https://googlechromelabs.github.io/howto-components/howto-radio-group/
|
|
106
|
-
controlKeyDownHandler(e) {
|
|
107
|
-
if (this.type === 'radio') {
|
|
108
|
-
e.stopPropagation();
|
|
109
|
-
if (Object.values(this.KEYCODES).includes(e.code))
|
|
110
|
-
e.preventDefault();
|
|
111
|
-
this.groupCollectMembers();
|
|
112
|
-
switch (e.code) {
|
|
113
|
-
case this.KEYCODES.UP:
|
|
114
|
-
case this.KEYCODES.LEFT:
|
|
115
|
-
this.groupSetChecked(this.groupGetPrev(), e);
|
|
116
|
-
break;
|
|
117
|
-
case this.KEYCODES.DOWN:
|
|
118
|
-
case this.KEYCODES.RIGHT:
|
|
119
|
-
this.groupSetChecked(this.groupGetNext(), e);
|
|
120
|
-
break;
|
|
121
|
-
case this.KEYCODES.SPACE:
|
|
122
|
-
this.groupSetChecked(this.control, e);
|
|
123
|
-
break;
|
|
124
|
-
}
|
|
125
|
-
}
|
|
126
|
-
}
|
|
127
|
-
controlSetChecked(checked, e) {
|
|
128
|
-
if (!this.control)
|
|
129
|
-
return;
|
|
130
|
-
if (this.disabled) {
|
|
131
|
-
this.internals.setFormValue(null);
|
|
132
|
-
}
|
|
133
|
-
else {
|
|
134
|
-
this.control.checked = this.checked = checked;
|
|
135
|
-
this.internals.setFormValue(this.checked ? this.control.value : null);
|
|
136
|
-
if (e) {
|
|
137
|
-
const isCheckbox = this.type === 'checkbox';
|
|
138
|
-
const isRadioAndChecked = this.type === 'radio' && this.checked;
|
|
139
|
-
// https://developer.mozilla.org/en-US/docs/Web/HTML/Element/input/checkbox
|
|
140
|
-
// https://developer.mozilla.org/en-US/docs/Web/HTML/Element/input/radio
|
|
141
|
-
// if an event parameter is given and a native control would fire an event, emit the corresponding event to the light dom
|
|
142
|
-
if (isCheckbox || isRadioAndChecked)
|
|
143
|
-
this[this.EVENT_MAP[e.type]].emit({ state: this.checked, value: this.value });
|
|
144
|
-
}
|
|
145
|
-
}
|
|
146
|
-
}
|
|
147
|
-
groupCollectMembers() {
|
|
148
|
-
var _a, _b;
|
|
149
|
-
if (this.type === 'radio' && this.name) {
|
|
150
|
-
this.group.hosts = Array.from(document.querySelectorAll(`post-card-control[type="radio"][name="${this.name}"]`));
|
|
151
|
-
this.group.members = this.group.hosts
|
|
152
|
-
.map(m => m.shadowRoot.querySelector('input[type="radio"]'))
|
|
153
|
-
.filter(m => m !== null);
|
|
154
|
-
if (this.group.members.length > 1) {
|
|
155
|
-
this.group.first = this.group.members[0];
|
|
156
|
-
this.group.last = this.group.members[this.group.members.length - 1];
|
|
157
|
-
this.group.checked = (_a = this.group.members.find(m => m.checked)) !== null && _a !== void 0 ? _a : null;
|
|
158
|
-
this.group.focused =
|
|
159
|
-
(_b = this.group.members.find(m => m.getRootNode().host === document.activeElement)) !== null && _b !== void 0 ? _b : this.group.first;
|
|
160
|
-
const focusableMember = this.group.checked || this.group.focused || this.group.first;
|
|
161
|
-
this.group.members.forEach(m => {
|
|
162
|
-
m.tabIndex = m === focusableMember ? 0 : -1;
|
|
163
|
-
});
|
|
164
|
-
}
|
|
165
|
-
}
|
|
166
|
-
}
|
|
167
|
-
groupGetPrev() {
|
|
168
|
-
var _a;
|
|
169
|
-
const focusedIndex = this.group.members.findIndex(m => m.id === this.group.focused.id);
|
|
170
|
-
return (_a = this.group.members.find((_m, i) => i === focusedIndex - 1)) !== null && _a !== void 0 ? _a : this.group.last;
|
|
171
|
-
}
|
|
172
|
-
groupGetNext() {
|
|
173
|
-
var _a;
|
|
174
|
-
const focusedIndex = this.group.members.findIndex(m => m.id === this.group.focused.id);
|
|
175
|
-
return (_a = this.group.members.find((_m, i) => i === focusedIndex + 1)) !== null && _a !== void 0 ? _a : this.group.first;
|
|
176
|
-
}
|
|
177
|
-
groupSetChecked(newChecked, e) {
|
|
178
|
-
if (this.group.members.length > 1) {
|
|
179
|
-
const isKeyboardEvent = e.type === 'keydown';
|
|
180
|
-
const newIsAriaDisabled = newChecked.hasAttribute('aria-disabled');
|
|
181
|
-
const newIndex = this.group.members.findIndex(m => m === newChecked);
|
|
182
|
-
if (isKeyboardEvent)
|
|
183
|
-
newChecked.focus();
|
|
184
|
-
// if new is disabled, do not reset/set anything
|
|
185
|
-
if (!newIsAriaDisabled) {
|
|
186
|
-
// reset all group members but the newChecked
|
|
187
|
-
this.group.hosts
|
|
188
|
-
.filter((_h, i) => i !== newIndex)
|
|
189
|
-
.forEach(h => {
|
|
190
|
-
h.groupReset();
|
|
191
|
-
});
|
|
192
|
-
// if method was called by keyboard event, select newChecked
|
|
193
|
-
// else this has already been done by clicking on the newChecked element already
|
|
194
|
-
if (isKeyboardEvent)
|
|
195
|
-
newChecked.click();
|
|
196
|
-
}
|
|
197
|
-
}
|
|
198
|
-
}
|
|
199
|
-
// remove as soon as all browser support :host-context()
|
|
200
|
-
// https://caniuse.com/?search=%3Ahost-context()
|
|
201
|
-
setHostContext() {
|
|
202
|
-
let bgContext;
|
|
203
|
-
const possibleBgContexts = window
|
|
204
|
-
.getComputedStyle(this.host)
|
|
205
|
-
.getPropertyValue('--post-card-control-bg-context')
|
|
206
|
-
.split(', ');
|
|
207
|
-
let formContext;
|
|
208
|
-
const possibleFromContexts = ['fieldset'];
|
|
209
|
-
let element = this.host;
|
|
210
|
-
while (element && (!bgContext || !formContext)) {
|
|
211
|
-
bgContext = bgContext !== null && bgContext !== void 0 ? bgContext : possibleBgContexts.find(selector => element.matches(selector));
|
|
212
|
-
formContext = formContext !== null && formContext !== void 0 ? formContext : possibleFromContexts.find(selector => element.matches(selector));
|
|
213
|
-
element = element.parentElement;
|
|
214
|
-
}
|
|
215
|
-
const hostContext = [bgContext, formContext].filter(context => !!context).join(' ');
|
|
216
|
-
this.host.setAttribute('data-context', hostContext);
|
|
217
|
-
}
|
|
218
|
-
connectedCallback() {
|
|
219
|
-
this.initialChecked = this.checked;
|
|
220
|
-
}
|
|
221
|
-
componentWillRender() {
|
|
222
|
-
this.hasIcon = Boolean(this.host.querySelector('[slot="icon"]') || this.icon);
|
|
223
|
-
}
|
|
224
|
-
render() {
|
|
225
|
-
return (h(Host, { key: 'd5a554358103f47b5294dc5f6e21e41a78ec383f', "data-version": version, onClick: this.cardClickHandler }, h("div", { key: 'd9bd511744e04792f456ab2e22c0f48ea8f3234b', class: {
|
|
226
|
-
'card-control': true,
|
|
227
|
-
'is-checked': this.checked,
|
|
228
|
-
'is-disabled': this.disabled,
|
|
229
|
-
'is-focused': this.focused,
|
|
230
|
-
'is-valid': this.validity !== null && this.validity !== 'false',
|
|
231
|
-
'is-invalid': this.validity === 'false',
|
|
232
|
-
} }, h("input", { key: '37a7bc7d656aa5527037303daacdb8b8ee26b973', ref: el => (this.control = el), id: this.controlId, class: "card-control--input", type: this.type, name: this.name, value: this.value, checked: this.checked, "aria-describedby": `${this.controlId}_content`, "aria-disabled": this.disabled, "aria-invalid": this.validity === 'false', onClick: this.controlClickHandler, onInput: this.controlChangeHandler, onChange: this.controlChangeHandler, onFocus: this.controlFocusHandler, onBlur: this.controlFocusHandler, onKeyDown: this.controlKeyDownHandler }), h("label", { key: '9482a54b665dc2f2fe254f2656af9cb57cb0fb4b', id: `${this.controlId}_label`, htmlFor: this.controlId, class: "card-control--label" }, this.label, this.description ? (h("div", { class: "card-control--description" }, this.description)) : null), this.hasIcon ? (h("div", { class: "card-control--icon" }, h("slot", { name: "icon" }, this.icon ? h("post-icon", { name: this.icon }) : null))) : null, h("div", { key: '1b2a1fdb408ea8dcb4649fd76ae848685474f7b5', id: `${this.controlId}_content`, class: "card-control--content" }, h("slot", { key: '5b9f15b75920c0956730686b52959a9b21a64857' })))));
|
|
233
|
-
}
|
|
234
|
-
componentDidRender() {
|
|
235
|
-
this.setHostContext();
|
|
236
|
-
this.groupCollectMembers();
|
|
237
|
-
}
|
|
238
|
-
componentDidLoad() {
|
|
239
|
-
this.validateControlLabel();
|
|
240
|
-
this.validateControlType();
|
|
241
|
-
}
|
|
242
|
-
// https://stenciljs.com/docs/form-associated
|
|
243
|
-
/* eslint-disable @stencil-community/own-methods-must-be-private */
|
|
244
|
-
formAssociatedCallback() {
|
|
245
|
-
this.controlSetChecked(this.checked);
|
|
246
|
-
}
|
|
247
|
-
formDisabledCallback(disabled) {
|
|
248
|
-
this.disabled = disabled;
|
|
249
|
-
}
|
|
250
|
-
formStateRestoreCallback(checked) {
|
|
251
|
-
this.controlSetChecked(checked);
|
|
252
|
-
}
|
|
253
|
-
formResetCallback() {
|
|
254
|
-
this.reset();
|
|
255
|
-
}
|
|
256
|
-
static get formAssociated() { return true; }
|
|
257
|
-
get host() { return this; }
|
|
258
|
-
static get watchers() { return {
|
|
259
|
-
"label": ["validateControlLabel"],
|
|
260
|
-
"type": ["validateControlType"],
|
|
261
|
-
"checked": ["updateControlChecked"],
|
|
262
|
-
"disabled": ["updateControlDisabled"]
|
|
263
|
-
}; }
|
|
264
|
-
static get style() { return PostCardControlStyle0; }
|
|
265
|
-
}, [65, "post-card-control", {
|
|
266
|
-
"label": [1],
|
|
267
|
-
"description": [1],
|
|
268
|
-
"type": [1],
|
|
269
|
-
"name": [1],
|
|
270
|
-
"value": [1],
|
|
271
|
-
"checked": [1028],
|
|
272
|
-
"disabled": [1028],
|
|
273
|
-
"validity": [1025],
|
|
274
|
-
"icon": [1],
|
|
275
|
-
"focused": [32],
|
|
276
|
-
"reset": [64],
|
|
277
|
-
"groupReset": [64]
|
|
278
|
-
}, undefined, {
|
|
279
|
-
"label": ["validateControlLabel"],
|
|
280
|
-
"type": ["validateControlType"],
|
|
281
|
-
"checked": ["updateControlChecked"],
|
|
282
|
-
"disabled": ["updateControlDisabled"]
|
|
283
|
-
}]);
|
|
284
|
-
function defineCustomElement() {
|
|
285
|
-
if (typeof customElements === "undefined") {
|
|
286
|
-
return;
|
|
287
|
-
}
|
|
288
|
-
const components = ["post-card-control", "post-icon"];
|
|
289
|
-
components.forEach(tagName => { switch (tagName) {
|
|
290
|
-
case "post-card-control":
|
|
291
|
-
if (!customElements.get(tagName)) {
|
|
292
|
-
customElements.define(tagName, PostCardControl);
|
|
293
|
-
}
|
|
294
|
-
break;
|
|
295
|
-
case "post-icon":
|
|
296
|
-
if (!customElements.get(tagName)) {
|
|
297
|
-
defineCustomElement$1();
|
|
298
|
-
}
|
|
299
|
-
break;
|
|
300
|
-
} });
|
|
301
|
-
}
|
|
302
|
-
|
|
303
|
-
export { PostCardControl as P, defineCustomElement as d };
|
|
@@ -1,279 +0,0 @@
|
|
|
1
|
-
import { proxyCustomElement, HTMLElement, h, Host } from '@stencil/core/internal/client';
|
|
2
|
-
import { v as version } from './package.js';
|
|
3
|
-
import { s as slideUp, a as slideDown } from './slide.js';
|
|
4
|
-
|
|
5
|
-
/* eslint-disable no-undefined,no-param-reassign,no-shadow */
|
|
6
|
-
|
|
7
|
-
/**
|
|
8
|
-
* Throttle execution of a function. Especially useful for rate limiting
|
|
9
|
-
* execution of handlers on events like resize and scroll.
|
|
10
|
-
*
|
|
11
|
-
* @param {number} delay - A zero-or-greater delay in milliseconds. For event callbacks, values around 100 or 250 (or even higher)
|
|
12
|
-
* are most useful.
|
|
13
|
-
* @param {Function} callback - A function to be executed after delay milliseconds. The `this` context and all arguments are passed through,
|
|
14
|
-
* as-is, to `callback` when the throttled-function is executed.
|
|
15
|
-
* @param {object} [options] - An object to configure options.
|
|
16
|
-
* @param {boolean} [options.noTrailing] - Optional, defaults to false. If noTrailing is true, callback will only execute every `delay` milliseconds
|
|
17
|
-
* while the throttled-function is being called. If noTrailing is false or unspecified, callback will be executed
|
|
18
|
-
* one final time after the last throttled-function call. (After the throttled-function has not been called for
|
|
19
|
-
* `delay` milliseconds, the internal counter is reset).
|
|
20
|
-
* @param {boolean} [options.noLeading] - Optional, defaults to false. If noLeading is false, the first throttled-function call will execute callback
|
|
21
|
-
* immediately. If noLeading is true, the first the callback execution will be skipped. It should be noted that
|
|
22
|
-
* callback will never executed if both noLeading = true and noTrailing = true.
|
|
23
|
-
* @param {boolean} [options.debounceMode] - If `debounceMode` is true (at begin), schedule `clear` to execute after `delay` ms. If `debounceMode` is
|
|
24
|
-
* false (at end), schedule `callback` to execute after `delay` ms.
|
|
25
|
-
*
|
|
26
|
-
* @returns {Function} A new, throttled, function.
|
|
27
|
-
*/
|
|
28
|
-
function throttle (delay, callback, options) {
|
|
29
|
-
var _ref = options || {},
|
|
30
|
-
_ref$noTrailing = _ref.noTrailing,
|
|
31
|
-
noTrailing = _ref$noTrailing === void 0 ? false : _ref$noTrailing,
|
|
32
|
-
_ref$noLeading = _ref.noLeading,
|
|
33
|
-
noLeading = _ref$noLeading === void 0 ? false : _ref$noLeading,
|
|
34
|
-
_ref$debounceMode = _ref.debounceMode,
|
|
35
|
-
debounceMode = _ref$debounceMode === void 0 ? undefined : _ref$debounceMode;
|
|
36
|
-
/*
|
|
37
|
-
* After wrapper has stopped being called, this timeout ensures that
|
|
38
|
-
* `callback` is executed at the proper times in `throttle` and `end`
|
|
39
|
-
* debounce modes.
|
|
40
|
-
*/
|
|
41
|
-
var timeoutID;
|
|
42
|
-
var cancelled = false;
|
|
43
|
-
|
|
44
|
-
// Keep track of the last time `callback` was executed.
|
|
45
|
-
var lastExec = 0;
|
|
46
|
-
|
|
47
|
-
// Function to clear existing timeout
|
|
48
|
-
function clearExistingTimeout() {
|
|
49
|
-
if (timeoutID) {
|
|
50
|
-
clearTimeout(timeoutID);
|
|
51
|
-
}
|
|
52
|
-
}
|
|
53
|
-
|
|
54
|
-
// Function to cancel next exec
|
|
55
|
-
function cancel(options) {
|
|
56
|
-
var _ref2 = options || {},
|
|
57
|
-
_ref2$upcomingOnly = _ref2.upcomingOnly,
|
|
58
|
-
upcomingOnly = _ref2$upcomingOnly === void 0 ? false : _ref2$upcomingOnly;
|
|
59
|
-
clearExistingTimeout();
|
|
60
|
-
cancelled = !upcomingOnly;
|
|
61
|
-
}
|
|
62
|
-
|
|
63
|
-
/*
|
|
64
|
-
* The `wrapper` function encapsulates all of the throttling / debouncing
|
|
65
|
-
* functionality and when executed will limit the rate at which `callback`
|
|
66
|
-
* is executed.
|
|
67
|
-
*/
|
|
68
|
-
function wrapper() {
|
|
69
|
-
for (var _len = arguments.length, arguments_ = new Array(_len), _key = 0; _key < _len; _key++) {
|
|
70
|
-
arguments_[_key] = arguments[_key];
|
|
71
|
-
}
|
|
72
|
-
var self = this;
|
|
73
|
-
var elapsed = Date.now() - lastExec;
|
|
74
|
-
if (cancelled) {
|
|
75
|
-
return;
|
|
76
|
-
}
|
|
77
|
-
|
|
78
|
-
// Execute `callback` and update the `lastExec` timestamp.
|
|
79
|
-
function exec() {
|
|
80
|
-
lastExec = Date.now();
|
|
81
|
-
callback.apply(self, arguments_);
|
|
82
|
-
}
|
|
83
|
-
|
|
84
|
-
/*
|
|
85
|
-
* If `debounceMode` is true (at begin) this is used to clear the flag
|
|
86
|
-
* to allow future `callback` executions.
|
|
87
|
-
*/
|
|
88
|
-
function clear() {
|
|
89
|
-
timeoutID = undefined;
|
|
90
|
-
}
|
|
91
|
-
if (!noLeading && debounceMode && !timeoutID) {
|
|
92
|
-
/*
|
|
93
|
-
* Since `wrapper` is being called for the first time and
|
|
94
|
-
* `debounceMode` is true (at begin), execute `callback`
|
|
95
|
-
* and noLeading != true.
|
|
96
|
-
*/
|
|
97
|
-
exec();
|
|
98
|
-
}
|
|
99
|
-
clearExistingTimeout();
|
|
100
|
-
if (debounceMode === undefined && elapsed > delay) {
|
|
101
|
-
if (noLeading) {
|
|
102
|
-
/*
|
|
103
|
-
* In throttle mode with noLeading, if `delay` time has
|
|
104
|
-
* been exceeded, update `lastExec` and schedule `callback`
|
|
105
|
-
* to execute after `delay` ms.
|
|
106
|
-
*/
|
|
107
|
-
lastExec = Date.now();
|
|
108
|
-
if (!noTrailing) {
|
|
109
|
-
timeoutID = setTimeout(debounceMode ? clear : exec, delay);
|
|
110
|
-
}
|
|
111
|
-
} else {
|
|
112
|
-
/*
|
|
113
|
-
* In throttle mode without noLeading, if `delay` time has been exceeded, execute
|
|
114
|
-
* `callback`.
|
|
115
|
-
*/
|
|
116
|
-
exec();
|
|
117
|
-
}
|
|
118
|
-
} else if (noTrailing !== true) {
|
|
119
|
-
/*
|
|
120
|
-
* In trailing throttle mode, since `delay` time has not been
|
|
121
|
-
* exceeded, schedule `callback` to execute `delay` ms after most
|
|
122
|
-
* recent execution.
|
|
123
|
-
*
|
|
124
|
-
* If `debounceMode` is true (at begin), schedule `clear` to execute
|
|
125
|
-
* after `delay` ms.
|
|
126
|
-
*
|
|
127
|
-
* If `debounceMode` is false (at end), schedule `callback` to
|
|
128
|
-
* execute after `delay` ms.
|
|
129
|
-
*/
|
|
130
|
-
timeoutID = setTimeout(debounceMode ? clear : exec, debounceMode === undefined ? delay - elapsed : delay);
|
|
131
|
-
}
|
|
132
|
-
}
|
|
133
|
-
wrapper.cancel = cancel;
|
|
134
|
-
|
|
135
|
-
// Return the wrapper function.
|
|
136
|
-
return wrapper;
|
|
137
|
-
}
|
|
138
|
-
|
|
139
|
-
const postHeaderCss = "*,::before,::after{box-sizing:border-box}:host{--global-header-height:72px;--global-header-minimal-height:24px;--main-header-height:56px;--main-header-min-height:56px;--header-height:calc(var(--global-header-height) + var(--main-header-height))}@media screen and (min-width: 1024px){:host{display:block;position:sticky;inset-inline:0;inset-block-start:calc(-1*(var(--global-header-height) + var(--main-header-height) - var(--global-header-minimal-height)));box-shadow:var(--post-core-elevation-3)}}@media screen and (max-width: 1023.99px){:host{--global-header-height:64px;--main-header-height:48px;--main-header-min-height:48px}}.d-flex{display:flex}.space-between{justify-content:space-between}.global-header{background-color:#fc0;display:flex;justify-content:space-between;align-items:center;position:sticky;padding-inline:var(--post-core-dimension-4);height:var(--global-header-height);z-index:1}@media screen and (max-width: 1023.99px){.global-header{inset-block-start:0}}@media screen and (min-width: 1024px){.global-header{padding-inline-end:var(--post-core-dimension-12);top:calc((var(--global-header-height) - var(--global-header-minimal-height))*-1)}}slot[name=post-logo]{align-self:flex-end}.global-sub{display:flex;align-items:center;gap:var(--post-core-dimension-24)}.align-end{align-items:flex-end}.logo{flex:1 0 auto;height:var(--global-header-height);width:var(--global-header-height);min-height:var(--global-header-minimal-height);align-self:flex-end}@media screen and (min-width: 1024px){.logo{height:calc(var(--global-header-height) - var(--header-scroll-top))}}::slotted(ul){margin-block:0;list-style:none;display:flex;padding-left:0;gap:1rem;flex-shrink:0 !important}.title-header{display:flex;align-items:center;gap:var(--post-core-dimension-8);min-height:var(--main-header-min-height);justify-content:space-between;background:var(--post-core-color-brand-white)}@media screen and (min-width: 1024px){.title-header{padding:var(--post-core-dimension-18) var(--post-core-dimension-16) var(--post-core-dimension-4) var(--post-core-dimension-12)}}@media screen and (max-width: 1023.99px){.title-header{position:sticky;z-index:1;inset-block-start:var(--global-header-height);padding-inline:var(--post-core-dimension-8) var(--post-core-dimension-16);padding-block:var(--post-core-dimension-9);flex-wrap:wrap}.title-header.title-header-mobile-extended{border-bottom:1px solid var(--post-core-color-sandgrey-012)}}:host(:not(:has([slot=title]))) .title-header{display:none}::slotted(h1){margin:0 !important;flex-shrink:10}@media screen and (min-width: 1024px){::slotted(h1){font-size:var(--post-core-font-size-28) !important}}@media screen and (max-width: 1023.99px){::slotted(h1){font-size:var(--post-core-font-size-20) !important;max-width:calc(100vw - var(--post-core-dimension-8) - var(--post-core-dimension-16))}}@media screen and (min-width: 1024px){.mobile-toggle{display:none}}.navigation{background:var(--post-core-color-brand-white)}@media screen and (min-width: 1024px){.navigation{position:sticky;z-index:1;inset-block-start:var(--global-header-minimal-height)}}@media screen and (max-width: 1023.99px){.navigation{position:fixed;inset-inline:0;inset-block-end:calc(100vh - var(--header-height));box-shadow:var(--post-core-elevation-3);min-height:var(--post-core-dimension-10);max-height:calc(100vh - var(--header-height));overflow:auto}::slotted(post-mainnavigation),.navigation-footer{display:none;flex-direction:column;padding-block:var(--post-core-dimension-16) var(--post-core-dimension-24);padding-inline:var(--post-core-dimension-32)}.navigation.extended ::slotted(post-mainnavigation),.navigation.extended .navigation-footer{display:flex}::slotted(post-mainnavigation){background-color:var(--post-core-color-sandgrey-002);gap:var(--post-core-dimension-32)}.navigation-footer{background-color:var(--post-core-color-sandgrey-006);gap:var(--post-core-dimension-24)}}";
|
|
140
|
-
const PostHeaderStyle0 = postHeaderCss;
|
|
141
|
-
|
|
142
|
-
const PostHeader = /*@__PURE__*/ proxyCustomElement(class PostHeader extends HTMLElement {
|
|
143
|
-
constructor() {
|
|
144
|
-
super();
|
|
145
|
-
this.__registerHost();
|
|
146
|
-
this.__attachShadow();
|
|
147
|
-
this.scrollParent = null;
|
|
148
|
-
this.throttledScroll = () => this.handleScrollEvent();
|
|
149
|
-
this.throttledResize = throttle(50, () => this.handleResize());
|
|
150
|
-
this.device = null;
|
|
151
|
-
this.mobileMenuExtended = false;
|
|
152
|
-
}
|
|
153
|
-
componentWillRender() {
|
|
154
|
-
this.scrollParent = this.getScrollParent(this.host);
|
|
155
|
-
this.scrollParent.addEventListener('scroll', this.throttledScroll, { passive: true });
|
|
156
|
-
window.addEventListener('resize', this.throttledResize, { passive: true });
|
|
157
|
-
this.handleResize();
|
|
158
|
-
this.handleScrollEvent();
|
|
159
|
-
}
|
|
160
|
-
frozeBody(isMobileMenuExtended) {
|
|
161
|
-
document.body.style.overflow = isMobileMenuExtended ? 'hidden' : '';
|
|
162
|
-
}
|
|
163
|
-
/**
|
|
164
|
-
* Toggles the mobile navigation.
|
|
165
|
-
*/
|
|
166
|
-
async toggleMobileMenu() {
|
|
167
|
-
if (this.device === 'desktop')
|
|
168
|
-
return;
|
|
169
|
-
this.mobileMenuAnimation = this.mobileMenuExtended
|
|
170
|
-
? slideUp(this.mobileMenu)
|
|
171
|
-
: slideDown(this.mobileMenu);
|
|
172
|
-
// Update the state of the toggle button
|
|
173
|
-
const menuButton = this.host.querySelector('post-togglebutton');
|
|
174
|
-
menuButton.toggled = !this.mobileMenuExtended;
|
|
175
|
-
// Toggle menu visibility before it slides down and after it slides back up
|
|
176
|
-
if (this.mobileMenuExtended)
|
|
177
|
-
await this.mobileMenuAnimation.finished;
|
|
178
|
-
this.mobileMenuExtended = !this.mobileMenuExtended;
|
|
179
|
-
if (!this.mobileMenuExtended)
|
|
180
|
-
await this.mobileMenuAnimation.finished;
|
|
181
|
-
}
|
|
182
|
-
handleScrollEvent() {
|
|
183
|
-
// Credits: "https://github.com/qeremy/so/blob/master/so.dom.js#L426"
|
|
184
|
-
const st = Math.max(0, this.scrollParent instanceof Document
|
|
185
|
-
? this.scrollParent.documentElement.scrollTop
|
|
186
|
-
: this.scrollParent.scrollTop);
|
|
187
|
-
this.host.style.setProperty('--header-scroll-top', `${st}px`);
|
|
188
|
-
}
|
|
189
|
-
getScrollParent(node) {
|
|
190
|
-
let currentParent = node.parentElement;
|
|
191
|
-
while (currentParent) {
|
|
192
|
-
if (currentParent.nodeName === 'BODY') {
|
|
193
|
-
return document;
|
|
194
|
-
}
|
|
195
|
-
if (this.isScrollable(currentParent)) {
|
|
196
|
-
return currentParent;
|
|
197
|
-
}
|
|
198
|
-
currentParent = currentParent.parentElement;
|
|
199
|
-
}
|
|
200
|
-
return document;
|
|
201
|
-
}
|
|
202
|
-
isScrollable(node) {
|
|
203
|
-
if (!(node instanceof HTMLElement || node instanceof SVGElement)) {
|
|
204
|
-
return false;
|
|
205
|
-
}
|
|
206
|
-
const style = getComputedStyle(node);
|
|
207
|
-
return ['overflow', 'overflow-x', 'overflow-y'].some(propertyName => {
|
|
208
|
-
const value = style.getPropertyValue(propertyName);
|
|
209
|
-
return value === 'auto' || value === 'scroll';
|
|
210
|
-
});
|
|
211
|
-
}
|
|
212
|
-
handleResize() {
|
|
213
|
-
var _a;
|
|
214
|
-
const previousDevice = this.device;
|
|
215
|
-
let newDevice;
|
|
216
|
-
const width = window === null || window === void 0 ? void 0 : window.innerWidth;
|
|
217
|
-
if (width >= 1024) {
|
|
218
|
-
newDevice = 'desktop';
|
|
219
|
-
}
|
|
220
|
-
else if (width >= 600) {
|
|
221
|
-
newDevice = 'tablet';
|
|
222
|
-
}
|
|
223
|
-
else {
|
|
224
|
-
newDevice = 'mobile';
|
|
225
|
-
}
|
|
226
|
-
// Close any open mobile menu
|
|
227
|
-
if (newDevice === 'desktop' && this.mobileMenuExtended) {
|
|
228
|
-
this.toggleMobileMenu();
|
|
229
|
-
this.mobileMenuAnimation.finish(); // no animation
|
|
230
|
-
}
|
|
231
|
-
const mhh = (_a = this.host.shadowRoot.querySelector('.title-header')) === null || _a === void 0 ? void 0 : _a.clientHeight;
|
|
232
|
-
this.host.style.setProperty('--main-header-height', `${mhh}px`);
|
|
233
|
-
// Apply only on change for doing work only when necessary
|
|
234
|
-
if (newDevice !== previousDevice) {
|
|
235
|
-
this.device = newDevice;
|
|
236
|
-
window.requestAnimationFrame(() => {
|
|
237
|
-
this.switchLanguageSwitchMode();
|
|
238
|
-
});
|
|
239
|
-
}
|
|
240
|
-
}
|
|
241
|
-
switchLanguageSwitchMode() {
|
|
242
|
-
var _a;
|
|
243
|
-
const variant = this.device === 'desktop' ? 'menu' : 'list';
|
|
244
|
-
(_a = this.host.querySelector('post-language-switch')) === null || _a === void 0 ? void 0 : _a.setAttribute('variant', variant);
|
|
245
|
-
}
|
|
246
|
-
render() {
|
|
247
|
-
const navigationClasses = ['navigation'];
|
|
248
|
-
if (this.mobileMenuExtended) {
|
|
249
|
-
navigationClasses.push('extended');
|
|
250
|
-
}
|
|
251
|
-
return (h(Host, { key: '008e84568ce41249365d93169b2f94cd988601d0', version: version }, h("div", { key: 'f6415c30b3bfacd01a65166c7f0a3afc37676cc8', class: "global-header" }, h("div", { key: 'dc1465a3a68ce8c66c7da644d992c37d8d09ccc4', class: "global-sub" }, h("div", { key: '490b4afe502465bc20ccc41149533929987f2fab', class: "logo" }, h("slot", { key: '28ee1cdb2804f6315fffa2c319a1e2fa1e54ad08', name: "post-logo" }))), h("div", { key: '777d715f4718bb6738665f3d65c9ee4729a977de', class: "global-sub" }, this.device === 'desktop' && h("slot", { key: 'c1ddbfdecc96fe3a6efb930d8475ee880059d372', name: "meta-navigation" }), h("slot", { key: 'df1ccf5c36ea4a05812c3983961389c42c42ddb9', name: "global-controls" }), this.device === 'desktop' && h("slot", { key: 'ace2dda9a3f3d898934c7d47c84e2475fb555e5d', name: "post-language-switch" }), h("div", { key: '3e8d94d9534d5daaa2f8e6ca5cc0833e78a49224', onClick: () => this.toggleMobileMenu(), class: "mobile-toggle" }, h("slot", { key: '58e3637f103411f5e577dba931caf884f46a6e47', name: "post-togglebutton" })))), h("div", { key: 'f90ff065ed795fc780c90768e5c0ab5a431bec8d', class: 'title-header ' + (this.mobileMenuExtended ? 'title-header-mobile-extended' : '') }, h("slot", { key: 'a1aaaf02da073b9e7de82e84c93745afa6a8c4e9', name: "title" }), h("div", { key: '84ae2f8b846536130967362de160e054049c8489', class: "global-sub" }, h("slot", { key: '8a845cd7f87b3a2c2fba7ffc1ace31e87f6329d9', name: "local-controls" }), h("slot", { key: 'f3822b883fc88436a84d3ca7f840946af992417e' }))), h("div", { key: '8e0390c6c2b9a71488eea73c9207d0c336c9b75d', ref: el => (this.mobileMenu = el), class: navigationClasses.join(' ') }, h("slot", { key: '5fc2db060eb962c313fc4c9ab67032e990ff54c6', name: "post-mainnavigation" }), (this.device === 'mobile' || this.device === 'tablet') && (h("div", { key: '7b9147dcf5de01865785d417c8d1966efb891ace', class: "navigation-footer" }, h("slot", { key: '6e163a7dad7b0b0fc02493cd15152179d4242980', name: "meta-navigation" }), h("slot", { key: 'e8fd19eeed8a99d69ccd8635e36cd0256ed4424b', name: "post-language-switch" }))))));
|
|
252
|
-
}
|
|
253
|
-
get host() { return this; }
|
|
254
|
-
static get watchers() { return {
|
|
255
|
-
"mobileMenuExtended": ["frozeBody"]
|
|
256
|
-
}; }
|
|
257
|
-
static get style() { return PostHeaderStyle0; }
|
|
258
|
-
}, [1, "post-header", {
|
|
259
|
-
"device": [32],
|
|
260
|
-
"mobileMenuExtended": [32],
|
|
261
|
-
"toggleMobileMenu": [64]
|
|
262
|
-
}, undefined, {
|
|
263
|
-
"mobileMenuExtended": ["frozeBody"]
|
|
264
|
-
}]);
|
|
265
|
-
function defineCustomElement() {
|
|
266
|
-
if (typeof customElements === "undefined") {
|
|
267
|
-
return;
|
|
268
|
-
}
|
|
269
|
-
const components = ["post-header"];
|
|
270
|
-
components.forEach(tagName => { switch (tagName) {
|
|
271
|
-
case "post-header":
|
|
272
|
-
if (!customElements.get(tagName)) {
|
|
273
|
-
customElements.define(tagName, PostHeader);
|
|
274
|
-
}
|
|
275
|
-
break;
|
|
276
|
-
} });
|
|
277
|
-
}
|
|
278
|
-
|
|
279
|
-
export { PostHeader as P, defineCustomElement as d };
|