@swisspost/design-system-components 9.0.0-next.9 → 10.0.0-next.37
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/breakpoints-cdf1b747.js +59 -0
- package/dist/cjs/check-non-empty-bd99d236.js +15 -0
- package/dist/cjs/check-one-of-75d270b5.js +13 -0
- package/dist/cjs/check-type-cdbf6d29.js +21 -0
- package/dist/cjs/check-url-220a286c.js +19 -0
- package/dist/cjs/event-guard-efabc84f.js +47 -0
- package/dist/cjs/fade-72d5ef55.js +14 -0
- package/dist/cjs/get-root-8102fecd.js +17 -0
- package/dist/cjs/index-23e36ff7.js +37 -0
- package/dist/cjs/{index-010dc207.js → index-b60129c4.js} +17 -10
- package/dist/cjs/index.browser-4af21c17.js +16 -0
- package/dist/cjs/index.cjs.js +36 -31
- package/dist/cjs/loader.cjs.js +2 -2
- package/dist/cjs/long-press-event-6e62d113.js +266 -0
- package/dist/cjs/{package-8e810a59.js → package-8121f093.js} +1 -1
- package/dist/cjs/{post-accordion-b9df8522.js → post-accordion-beac7c9f.js} +11 -12
- package/dist/cjs/post-accordion-item-4846fbee.js +64 -0
- package/dist/cjs/post-accordion-item.cjs.entry.js +10 -7
- package/dist/cjs/post-accordion.cjs.entry.js +6 -4
- package/dist/cjs/{post-avatar-f7236084.js → post-avatar-a36991fb.js} +10 -13
- package/dist/cjs/post-avatar.cjs.entry.js +5 -4
- package/dist/cjs/post-back-to-top-32aa9017.js +96 -0
- package/dist/cjs/post-back-to-top.cjs.entry.js +7 -6
- package/dist/cjs/post-banner-be0e8909.js +92 -0
- package/dist/cjs/post-banner.cjs.entry.js +11 -9
- package/dist/cjs/post-breadcrumb-item_2.cjs.entry.js +8 -7
- package/dist/cjs/post-breadcrumbs-6ef82a41.js +120 -0
- package/dist/cjs/post-breadcrumbs.cjs.entry.js +13 -0
- package/dist/cjs/post-card-control-fe919333.js +269 -0
- package/dist/cjs/post-card-control.cjs.entry.js +6 -5
- package/dist/cjs/post-closebutton_15.cjs.entry.js +13 -10
- package/dist/cjs/{post-collapsible-trigger-143cf84a.js → post-collapsible-trigger-f42be607.js} +59 -60
- package/dist/cjs/post-collapsible_2.cjs.entry.js +11 -10
- package/dist/cjs/post-components.cjs.js +2 -2
- package/dist/cjs/{post-footer-5f7fdf96.js → post-footer-5179aa17.js} +11 -57
- package/dist/cjs/post-footer.cjs.entry.js +4 -3
- package/dist/cjs/post-linkarea-27125078.js +30 -0
- package/dist/cjs/post-linkarea.cjs.entry.js +11 -0
- package/dist/cjs/{post-menu-item-bb0b0b9e.js → post-menu-item-d78a9121.js} +11 -17
- package/dist/cjs/post-popover-feb1e773.js +135 -0
- package/dist/cjs/post-popover.cjs.entry.js +4 -4
- package/dist/cjs/{post-rating-1082197c.js → post-rating-6d153a2c.js} +4 -4
- package/dist/cjs/post-rating.cjs.entry.js +3 -3
- package/dist/cjs/post-tab-header-e4532918.js +34 -0
- package/dist/cjs/post-tab-header.cjs.entry.js +6 -4
- package/dist/cjs/{post-tab-panel-60f211a5.js → post-tab-panel-40df21ad.js} +5 -4
- package/dist/cjs/post-tab-panel.cjs.entry.js +4 -3
- package/dist/cjs/{post-tabs-1f797ce4.js → post-tabs-45db2696.js} +13 -15
- package/dist/cjs/post-tabs.cjs.entry.js +5 -4
- package/dist/cjs/post-tag-0967bb1e.js +47 -0
- package/dist/cjs/post-tag.cjs.entry.js +3 -3
- package/dist/cjs/post-togglebutton-42b7d166.js +4494 -0
- package/dist/cjs/post-tooltip-f833d51d.js +73 -0
- package/dist/cjs/{post-tooltip-38c839a4.js → post-tooltip-trigger-3ceac010.js} +143 -456
- package/dist/cjs/post-tooltip-trigger.cjs.entry.js +13 -0
- package/dist/cjs/post-tooltip.cjs.entry.js +5 -9
- package/dist/cjs/{slide-5d51abe8.js → slide-cd1f09b3.js} +8 -8
- package/dist/collection/animations/collapse.js +8 -6
- package/dist/collection/animations/fade.js +6 -2
- package/dist/collection/animations/slide.js +8 -8
- package/dist/collection/collection-manifest.json +5 -3
- package/dist/collection/components/post-accordion/post-accordion.css +1 -1
- package/dist/collection/components/post-accordion/post-accordion.js +6 -8
- package/dist/collection/components/post-accordion-item/post-accordion-item.css +1 -1
- package/dist/collection/components/post-accordion-item/post-accordion-item.js +12 -12
- package/dist/collection/components/post-avatar/post-avatar.css +1 -3
- package/dist/collection/components/post-avatar/post-avatar.js +7 -11
- 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 +38 -18
- package/dist/collection/components/post-banner/post-banner.css +1 -3
- package/dist/collection/components/post-banner/post-banner.js +13 -12
- package/dist/collection/components/post-breadcrumb-item/post-breadcrumb-item.js +11 -8
- package/dist/collection/components/post-breadcrumbs/post-breadcrumbs.css +1 -0
- package/dist/collection/components/{post-breadcrumb/post-breadcrumb.js → post-breadcrumbs/post-breadcrumbs.js} +20 -21
- package/dist/collection/components/post-card-control/post-card-control.css +1 -3
- package/dist/collection/components/post-card-control/post-card-control.js +15 -19
- package/dist/collection/components/post-closebutton/post-closebutton.css +1 -0
- package/dist/collection/components/post-closebutton/post-closebutton.js +12 -1
- package/dist/collection/components/post-collapsible/post-collapsible.css +1 -1
- package/dist/collection/components/post-collapsible/post-collapsible.js +3 -2
- package/dist/collection/components/post-collapsible-trigger/post-collapsible-trigger.js +43 -45
- package/dist/collection/components/post-footer/post-footer.js +8 -8
- package/dist/collection/components/post-header/post-header.css +1 -1
- package/dist/collection/components/post-header/post-header.js +212 -52
- package/dist/collection/components/post-icon/post-icon.css +1 -1
- package/dist/collection/components/post-icon/post-icon.js +71 -29
- package/dist/collection/components/post-language-option/post-language-option.css +1 -3
- package/dist/collection/components/post-language-option/post-language-option.js +34 -12
- package/dist/collection/components/post-language-switch/post-language-switch.css +1 -1
- package/dist/collection/components/post-language-switch/post-language-switch.js +56 -33
- package/dist/collection/components/post-language-switch/switch-variants.js +1 -1
- package/dist/collection/components/post-linkarea/post-linkarea.css +1 -0
- package/dist/collection/components/post-linkarea/post-linkarea.js +30 -0
- package/dist/collection/components/post-list/post-list.css +1 -3
- package/dist/collection/components/post-list/post-list.js +4 -3
- package/dist/collection/components/post-list-item/post-list-item.js +2 -1
- package/dist/collection/components/post-logo/post-logo.css +1 -1
- package/dist/collection/components/post-logo/post-logo.js +2 -2
- package/dist/collection/components/post-mainnavigation/post-mainnavigation.css +1 -1
- package/dist/collection/components/post-mainnavigation/post-mainnavigation.js +157 -25
- package/dist/collection/components/post-megadropdown/post-megadropdown.css +1 -1
- package/dist/collection/components/post-megadropdown/post-megadropdown.js +179 -55
- package/dist/collection/components/post-megadropdown-trigger/post-megadropdown-trigger.css +1 -1
- package/dist/collection/components/post-megadropdown-trigger/post-megadropdown-trigger.js +41 -12
- package/dist/collection/components/post-menu/post-menu.css +1 -3
- package/dist/collection/components/post-menu/post-menu.js +44 -30
- package/dist/collection/components/post-menu-item/post-menu-item.js +1 -13
- package/dist/collection/components/post-menu-trigger/post-menu-trigger.js +16 -10
- package/dist/collection/components/post-popover/post-popover.css +1 -3
- package/dist/collection/components/post-popover/post-popover.js +23 -16
- package/dist/collection/components/post-popovercontainer/post-popovercontainer.css +1 -1
- package/dist/collection/components/post-popovercontainer/post-popovercontainer.js +217 -56
- package/dist/collection/components/post-rating/post-rating.css +1 -3
- package/dist/collection/components/post-rating/post-rating.js +1 -1
- package/dist/collection/components/post-tab-header/post-tab-header.css +1 -3
- package/dist/collection/components/post-tab-header/post-tab-header.js +6 -5
- package/dist/collection/components/post-tab-panel/post-tab-panel.js +4 -3
- package/dist/collection/components/post-tabs/post-tabs.css +1 -1
- package/dist/collection/components/post-tabs/post-tabs.js +6 -14
- package/dist/collection/components/post-tag/post-tag.css +1 -3
- package/dist/collection/components/post-tag/post-tag.js +2 -2
- package/dist/collection/components/post-togglebutton/post-togglebutton.js +3 -3
- package/dist/collection/components/post-tooltip/post-tooltip.css +1 -1
- package/dist/collection/components/post-tooltip/post-tooltip.js +62 -212
- package/dist/collection/components/post-tooltip-trigger/post-tooltip-trigger.css +1 -0
- package/dist/collection/components/post-tooltip-trigger/post-tooltip-trigger.js +230 -0
- package/dist/collection/index.js +3 -1
- package/dist/collection/utils/attribute-observer.js +6 -5
- package/dist/collection/utils/breakpoints.js +21 -15
- package/dist/collection/utils/component-on-ready.js +4 -4
- package/dist/collection/utils/debounce.js +2 -1
- package/dist/collection/utils/environment.js +2 -0
- package/dist/collection/utils/event-guard.js +43 -0
- package/dist/collection/utils/{is-focusable.js → get-focusable-children.js} +10 -3
- package/dist/collection/utils/get-root.js +6 -1
- package/dist/collection/utils/index.js +5 -0
- package/dist/collection/utils/is-motion-reduced.js +2 -1
- package/dist/collection/utils/property-checkers/check-non-empty.js +6 -2
- package/dist/collection/utils/property-checkers/check-one-of.js +8 -3
- package/dist/collection/utils/property-checkers/check-pattern.js +8 -3
- package/dist/collection/utils/property-checkers/check-type.js +11 -6
- package/dist/collection/utils/property-checkers/check-url.js +11 -6
- package/dist/collection/utils/property-checkers/empty-or.js +5 -2
- package/dist/collection/utils/sass-export.js +8 -5
- package/dist/components/breakpoints.js +56 -0
- package/dist/components/check-non-empty.js +6 -2
- package/dist/components/check-one-of.js +8 -3
- package/dist/components/check-type.js +11 -6
- package/dist/components/event-guard.js +45 -0
- package/dist/components/fade.js +6 -2
- package/dist/components/get-focusable-children.js +35 -0
- package/dist/components/get-root.js +7 -1
- package/dist/components/index.browser.js +14 -0
- package/dist/components/index.js +3 -1
- package/dist/components/index2.js +24 -11
- package/dist/components/long-press-event.js +264 -0
- package/dist/components/package.js +1 -1
- package/dist/components/post-accordion-item2.js +14 -13
- package/dist/components/post-accordion2.js +8 -9
- package/dist/components/post-avatar2.js +8 -11
- package/dist/components/post-back-to-top2.js +41 -20
- package/dist/components/post-banner2.js +15 -13
- package/dist/components/post-breadcrumb-item2.js +9 -9
- package/dist/components/post-breadcrumbs.d.ts +11 -0
- package/dist/components/post-breadcrumbs.js +6 -0
- package/dist/components/post-breadcrumbs2.js +177 -0
- package/dist/components/post-card-control2.js +16 -19
- package/dist/components/post-closebutton2.js +7 -2
- package/dist/components/post-collapsible-trigger2.js +46 -48
- package/dist/components/post-collapsible2.js +13 -10
- package/dist/components/post-footer2.js +8 -54
- package/dist/components/post-header2.js +174 -51
- package/dist/components/post-icon2.js +72 -29
- package/dist/components/post-language-option2.js +21 -12
- package/dist/components/post-language-switch2.js +44 -45
- package/dist/components/{post-breadcrumb.d.ts → post-linkarea.d.ts} +4 -4
- package/dist/components/post-linkarea.js +6 -0
- package/dist/components/post-linkarea2.js +43 -0
- package/dist/components/post-list-item2.js +2 -1
- package/dist/components/post-list2.js +5 -4
- package/dist/components/post-logo2.js +4 -3
- package/dist/components/post-mainnavigation2.js +150 -15
- package/dist/components/post-megadropdown-trigger2.js +43 -13
- package/dist/components/post-megadropdown2.js +136 -39
- package/dist/components/post-menu-item2.js +2 -8
- package/dist/components/post-menu-trigger2.js +17 -10
- package/dist/components/post-menu2.js +43 -54
- package/dist/components/post-popover2.js +46 -15
- package/dist/components/post-popovercontainer2.js +921 -111
- package/dist/components/post-rating2.js +2 -2
- package/dist/components/post-tab-header2.js +8 -6
- package/dist/components/post-tab-panel2.js +4 -3
- package/dist/components/post-tabs2.js +10 -12
- package/dist/components/post-tag2.js +2 -2
- package/dist/components/post-togglebutton2.js +4 -3
- package/dist/components/post-tooltip-trigger.d.ts +11 -0
- package/dist/components/post-tooltip-trigger.js +6 -0
- package/dist/components/post-tooltip-trigger2.js +4705 -0
- package/dist/components/post-tooltip2.js +34 -4960
- package/dist/components/slide.js +9 -9
- package/dist/docs.json +567 -252
- package/dist/esm/breakpoints-7812702e.js +56 -0
- package/dist/esm/check-non-empty-258a56b3.js +13 -0
- package/dist/esm/check-one-of-0bee20f5.js +11 -0
- package/dist/esm/check-type-37d5d307.js +19 -0
- package/dist/esm/check-url-17962bc8.js +17 -0
- package/dist/esm/event-guard-538ee077.js +45 -0
- package/dist/esm/fade-1f3cacf4.js +11 -0
- package/dist/esm/get-root-1b1af46f.js +15 -0
- package/dist/esm/index-8f8fe5b0.js +32 -0
- package/dist/esm/{index-fb8d6be7.js → index-f4d19816.js} +17 -10
- package/dist/esm/index.browser-ff103197.js +14 -0
- package/dist/esm/index.js +33 -30
- package/dist/esm/loader.js +3 -3
- package/dist/esm/long-press-event-04d24397.js +264 -0
- package/dist/esm/package-d9237b44.js +3 -0
- package/dist/esm/{post-accordion-ee54a3ef.js → post-accordion-fdcf7205.js} +11 -12
- package/dist/esm/post-accordion-item-e11e3804.js +62 -0
- package/dist/esm/post-accordion-item.entry.js +10 -7
- package/dist/esm/post-accordion.entry.js +6 -4
- package/dist/esm/{post-avatar-5572fa73.js → post-avatar-d360c6d2.js} +10 -13
- package/dist/esm/post-avatar.entry.js +5 -4
- package/dist/esm/post-back-to-top-85796c8b.js +94 -0
- package/dist/esm/post-back-to-top.entry.js +7 -6
- package/dist/esm/post-banner-a3090f67.js +90 -0
- package/dist/esm/post-banner.entry.js +11 -9
- package/dist/esm/post-breadcrumb-item_2.entry.js +8 -7
- package/dist/esm/post-breadcrumbs-15ec5a26.js +118 -0
- package/dist/esm/post-breadcrumbs.entry.js +5 -0
- package/dist/esm/post-card-control-6142534e.js +267 -0
- package/dist/esm/post-card-control.entry.js +6 -5
- package/dist/esm/post-closebutton_15.entry.js +13 -10
- package/dist/esm/{post-collapsible-trigger-1c7833f8.js → post-collapsible-trigger-68306358.js} +59 -60
- package/dist/esm/post-collapsible_2.entry.js +11 -10
- package/dist/esm/post-components.js +3 -3
- package/dist/esm/{post-footer-b18875e7.js → post-footer-d2a3270e.js} +10 -56
- package/dist/esm/post-footer.entry.js +4 -3
- package/dist/esm/post-linkarea-64998c67.js +28 -0
- package/dist/esm/post-linkarea.entry.js +3 -0
- package/dist/esm/{post-menu-item-2906384b.js → post-menu-item-95a0a647.js} +11 -17
- package/dist/esm/post-popover-c5f81087.js +133 -0
- package/dist/esm/post-popover.entry.js +4 -4
- package/dist/esm/{post-rating-95cbdbb8.js → post-rating-7bfedafb.js} +4 -4
- package/dist/esm/post-rating.entry.js +3 -3
- package/dist/esm/post-tab-header-08033da4.js +32 -0
- package/dist/esm/post-tab-header.entry.js +6 -4
- package/dist/esm/{post-tab-panel-cafd9e04.js → post-tab-panel-be701793.js} +5 -4
- package/dist/esm/post-tab-panel.entry.js +4 -3
- package/dist/esm/{post-tabs-beef8eae.js → post-tabs-c69e2842.js} +13 -15
- package/dist/esm/post-tabs.entry.js +5 -4
- package/dist/esm/post-tag-ebac7f3e.js +45 -0
- package/dist/esm/post-tag.entry.js +3 -3
- package/dist/esm/post-togglebutton-706e3af0.js +4478 -0
- package/dist/esm/post-tooltip-9a195d47.js +71 -0
- package/dist/esm/{post-tooltip-b298039a.js → post-tooltip-trigger-7d6f234b.js} +143 -456
- package/dist/esm/post-tooltip-trigger.entry.js +5 -0
- package/dist/esm/post-tooltip.entry.js +5 -9
- package/dist/esm/{slide-3422b8a3.js → slide-cd2850ee.js} +9 -9
- package/dist/post-components/index.esm.js +1 -1
- package/dist/post-components/p-034715ec.js +1 -0
- package/dist/post-components/p-0717fe4c.js +1 -0
- package/dist/post-components/p-0889c759.js +1 -0
- package/dist/post-components/p-0c03547b.js +1 -0
- package/dist/post-components/p-0de8d05f.js +1 -0
- package/dist/post-components/p-1373a79b.entry.js +1 -0
- package/dist/post-components/{p-4f9746f6.js → p-17dc4170.js} +2 -9
- package/dist/post-components/p-181c73d5.js +1 -0
- package/dist/post-components/p-1a21fd8d.js +1 -0
- package/dist/post-components/p-1ab3eba4.entry.js +1 -0
- package/dist/post-components/p-2d6c0670.js +1 -0
- package/dist/post-components/p-2dc0a2d0.js +1 -0
- package/dist/post-components/p-35ad2e11.entry.js +1 -0
- package/dist/post-components/p-368c473a.js +1 -0
- package/dist/post-components/p-38f778a7.entry.js +1 -0
- package/dist/post-components/p-39a8df3c.entry.js +1 -0
- package/dist/post-components/p-3c7f6003.js +1 -0
- package/dist/post-components/p-474a41bc.entry.js +1 -0
- package/dist/post-components/p-64e3de38.js +1 -0
- package/dist/post-components/p-69bc8eaf.entry.js +1 -0
- package/dist/post-components/p-6b31a76a.js +1 -0
- package/dist/post-components/p-722ffaae.js +1 -0
- package/dist/post-components/p-72310bf0.entry.js +1 -0
- package/dist/post-components/p-7709c14a.js +1 -0
- package/dist/post-components/p-804b61b7.entry.js +1 -0
- package/dist/post-components/p-85fdc2d3.js +1 -0
- package/dist/post-components/p-89247caa.js +1 -0
- package/dist/post-components/p-89dc67c7.entry.js +1 -0
- package/dist/post-components/p-8db32dab.js +8 -0
- package/dist/post-components/p-8f7f5200.entry.js +1 -0
- package/dist/post-components/p-964f9581.js +1 -0
- package/dist/post-components/p-9b052461.js +1 -0
- package/dist/post-components/{p-c0ae9886.js → p-9e461613.js} +2 -2
- package/dist/post-components/p-a52b2d34.js +1 -0
- package/dist/post-components/p-ab566526.js +1 -0
- package/dist/post-components/p-b648e537.entry.js +1 -0
- package/dist/post-components/p-bc33a6d9.js +1 -0
- package/dist/post-components/p-bcfdbd0b.entry.js +1 -0
- package/dist/post-components/p-beb67979.js +1 -0
- package/dist/post-components/p-c41868b1.js +1 -0
- package/dist/post-components/p-c65f32b0.js +1 -0
- package/dist/post-components/p-c71700a7.js +1 -0
- package/dist/post-components/p-cb027003.js +1 -0
- package/dist/post-components/p-cc5b1437.js +1 -0
- package/dist/post-components/p-ceda889e.entry.js +1 -0
- package/dist/post-components/p-d45df336.js +1 -0
- package/dist/post-components/p-de4d4274.js +1 -0
- package/dist/post-components/p-deb9efcf.entry.js +1 -0
- package/dist/post-components/p-e585c6fe.js +1 -0
- package/dist/post-components/p-e9f1cc46.entry.js +1 -0
- package/dist/post-components/p-ee4e776d.entry.js +1 -0
- package/dist/post-components/p-ee7c3bcc.entry.js +1 -0
- package/dist/post-components/p-f56482fa.entry.js +1 -0
- package/dist/post-components/p-f8c652ce.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-accordion-item/post-accordion-item.d.ts +1 -1
- package/dist/types/components/post-avatar/post-avatar.d.ts +1 -1
- package/dist/types/components/post-back-to-top/post-back-to-top.d.ts +4 -2
- package/dist/types/components/post-banner/post-banner.d.ts +5 -5
- package/dist/types/components/post-breadcrumb-item/post-breadcrumb-item.d.ts +4 -0
- package/dist/types/components/{post-breadcrumb/post-breadcrumb.d.ts → post-breadcrumbs/post-breadcrumbs.d.ts} +4 -4
- package/dist/types/components/post-card-control/post-card-control.d.ts +3 -3
- package/dist/types/components/post-collapsible-trigger/post-collapsible-trigger.d.ts +9 -14
- package/dist/types/components/post-footer/post-footer.d.ts +2 -2
- package/dist/types/components/post-header/post-header.d.ts +38 -10
- package/dist/types/components/post-icon/post-icon.d.ts +11 -7
- package/dist/types/components/post-language-option/post-language-option.d.ts +9 -5
- package/dist/types/components/post-language-switch/post-language-switch.d.ts +16 -8
- package/dist/types/components/post-language-switch/switch-variants.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 +36 -9
- package/dist/types/components/post-megadropdown/post-megadropdown.d.ts +37 -13
- package/dist/types/components/post-megadropdown-trigger/post-megadropdown-trigger.d.ts +9 -1
- package/dist/types/components/post-menu/post-menu.d.ts +4 -3
- package/dist/types/components/post-menu-item/post-menu-item.d.ts +0 -1
- package/dist/types/components/post-menu-trigger/post-menu-trigger.d.ts +4 -3
- package/dist/types/components/post-popover/post-popover.d.ts +6 -4
- package/dist/types/components/post-popovercontainer/post-popovercontainer.d.ts +40 -14
- package/dist/types/components/post-tab-header/post-tab-header.d.ts +1 -1
- package/dist/types/components/post-tabs/post-tabs.d.ts +1 -1
- package/dist/types/components/post-tag/post-tag.d.ts +1 -1
- package/dist/types/components/post-togglebutton/post-togglebutton.d.ts +1 -1
- package/dist/types/components/post-tooltip/post-tooltip.d.ts +21 -34
- package/dist/types/components/post-tooltip-trigger/post-tooltip-trigger.d.ts +46 -0
- package/dist/types/components.d.ts +181 -94
- 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 +5 -3
- package/dist/types/popover-fn.d.ts +11 -0
- package/dist/types/utils/attribute-observer.d.ts +1 -1
- package/dist/types/utils/breakpoints.d.ts +1 -0
- package/dist/types/utils/component-on-ready.d.ts +1 -1
- package/dist/types/utils/environment.d.ts +2 -0
- package/dist/types/utils/event-guard.d.ts +4 -0
- package/dist/types/utils/get-focusable-children.d.ts +1 -0
- package/dist/types/utils/get-root.d.ts +5 -1
- package/dist/types/utils/index.d.ts +5 -0
- package/dist/types/utils/property-checkers/check-non-empty.d.ts +3 -1
- package/dist/types/utils/property-checkers/check-one-of.d.ts +3 -1
- package/dist/types/utils/property-checkers/check-pattern.d.ts +3 -1
- package/dist/types/utils/property-checkers/check-type.d.ts +3 -1
- package/dist/types/utils/property-checkers/check-url.d.ts +3 -1
- package/dist/types/utils/property-checkers/index.d.ts +12 -4
- package/dist/types/utils/sass-export.d.ts +5 -1
- package/loaders/breakpoints.js +56 -0
- package/loaders/check-non-empty.js +6 -2
- package/loaders/check-one-of.js +8 -3
- package/loaders/check-type.js +11 -6
- package/loaders/event-guard.js +45 -0
- package/loaders/fade.js +6 -2
- package/loaders/get-focusable-children.js +35 -0
- package/loaders/get-root.js +7 -1
- package/loaders/index.browser.js +14 -0
- package/loaders/index.d.ts +6 -2
- package/loaders/index.js +8 -5
- package/loaders/index2.js +25 -12
- package/loaders/long-press-event.js +264 -0
- package/loaders/package.js +1 -1
- package/loaders/post-accordion-item2.js +15 -14
- package/loaders/post-accordion.js +8 -9
- package/loaders/post-avatar.js +8 -11
- package/loaders/post-back-to-top.js +41 -20
- package/loaders/post-banner.js +16 -14
- package/loaders/post-breadcrumb-item2.js +9 -9
- package/loaders/post-breadcrumbs.d.ts +11 -0
- package/loaders/post-breadcrumbs.js +180 -0
- package/loaders/post-card-control.js +16 -19
- package/loaders/post-closebutton.js +7 -2
- package/loaders/post-collapsible-trigger2.js +46 -48
- package/loaders/post-collapsible2.js +14 -11
- package/loaders/post-footer.js +8 -54
- package/loaders/post-header.js +174 -51
- package/loaders/post-icon2.js +73 -30
- package/loaders/post-language-option.js +22 -13
- package/loaders/post-language-switch.js +45 -46
- package/loaders/{post-breadcrumb.d.ts → post-linkarea.d.ts} +4 -4
- package/loaders/post-linkarea.js +46 -0
- package/loaders/post-list-item.js +2 -1
- package/loaders/post-list.js +5 -4
- package/loaders/post-logo.js +4 -3
- package/loaders/post-mainnavigation.js +150 -15
- package/loaders/post-megadropdown-trigger.js +43 -13
- package/loaders/post-megadropdown.js +136 -39
- package/loaders/post-menu-item2.js +2 -8
- package/loaders/post-menu-trigger2.js +17 -10
- package/loaders/post-menu2.js +43 -54
- package/loaders/post-popover.js +46 -15
- package/loaders/post-popovercontainer2.js +921 -111
- package/loaders/post-rating.js +2 -2
- package/loaders/post-tab-header.js +8 -6
- package/loaders/post-tab-panel.js +4 -3
- package/loaders/post-tabs.js +10 -12
- package/loaders/post-tag.js +2 -2
- package/loaders/post-togglebutton.js +4 -3
- package/loaders/post-tooltip-trigger.d.ts +11 -0
- package/loaders/post-tooltip-trigger.js +4708 -0
- package/loaders/post-tooltip.js +34 -4960
- package/loaders/slide.js +9 -9
- package/package.json +41 -32
- package/dist/cjs/attribute-observer-10f08c04.js +0 -27
- package/dist/cjs/check-non-empty-eeaa8f77.js +0 -11
- package/dist/cjs/check-one-of-f4f5d0c0.js +0 -8
- package/dist/cjs/check-type-64af82a9.js +0 -16
- package/dist/cjs/check-url-3ffdd2fb.js +0 -14
- package/dist/cjs/debounce-1151afe3.js +0 -12
- package/dist/cjs/fade-35a3633a.js +0 -10
- package/dist/cjs/get-root-7a3498ef.js +0 -11
- package/dist/cjs/index-5d4e0aed.js +0 -29
- package/dist/cjs/post-accordion-item-ecc6749f.js +0 -63
- package/dist/cjs/post-back-to-top-60762f8e.js +0 -75
- package/dist/cjs/post-banner-9662f22c.js +0 -90
- package/dist/cjs/post-breadcrumb-b40732fc.js +0 -111
- package/dist/cjs/post-breadcrumb.cjs.entry.js +0 -13
- package/dist/cjs/post-card-control-039c9a4b.js +0 -272
- package/dist/cjs/post-popover-d0ce9dc6.js +0 -104
- package/dist/cjs/post-tab-header-4b6d8d54.js +0 -32
- package/dist/cjs/post-tag-ddaaaedc.js +0 -47
- package/dist/cjs/post-togglebutton-0984a694.js +0 -3239
- package/dist/collection/components/post-breadcrumb/post-breadcrumb.css +0 -3
- package/dist/collection/components/post-menu-item/post-menu-item.css +0 -1
- package/dist/components/attribute-observer.js +0 -25
- package/dist/components/debounce.js +0 -10
- package/dist/components/post-breadcrumb.js +0 -6
- package/dist/components/post-breadcrumb2.js +0 -168
- package/dist/esm/attribute-observer-37fa950a.js +0 -25
- package/dist/esm/check-non-empty-58bd6b17.js +0 -9
- package/dist/esm/check-one-of-6b3ef8eb.js +0 -6
- package/dist/esm/check-type-8828dbe4.js +0 -14
- package/dist/esm/check-url-a974431e.js +0 -12
- package/dist/esm/debounce-abe98cc2.js +0 -10
- package/dist/esm/fade-7fd71785.js +0 -7
- package/dist/esm/get-root-7af2e0d1.js +0 -9
- package/dist/esm/index-b49c9904.js +0 -24
- package/dist/esm/package-4d81f3c2.js +0 -3
- package/dist/esm/post-accordion-item-e10452dc.js +0 -61
- package/dist/esm/post-back-to-top-1d823c43.js +0 -73
- package/dist/esm/post-banner-78480475.js +0 -88
- package/dist/esm/post-breadcrumb-aaa77f74.js +0 -109
- package/dist/esm/post-breadcrumb.entry.js +0 -5
- package/dist/esm/post-card-control-862aa961.js +0 -270
- package/dist/esm/post-popover-2432bb3f.js +0 -102
- package/dist/esm/post-tab-header-dfea00ea.js +0 -30
- package/dist/esm/post-tag-a77e7af6.js +0 -45
- package/dist/esm/post-togglebutton-395bf3f0.js +0 -3223
- package/dist/post-components/p-0711f76d.entry.js +0 -1
- package/dist/post-components/p-095a06f6.entry.js +0 -1
- package/dist/post-components/p-0b5a5f32.js +0 -1
- package/dist/post-components/p-135fa60f.js +0 -1
- package/dist/post-components/p-18e38d8a.js +0 -1
- package/dist/post-components/p-2737eaf5.js +0 -1
- package/dist/post-components/p-2e1ec074.entry.js +0 -1
- package/dist/post-components/p-4202b433.entry.js +0 -1
- package/dist/post-components/p-45773f59.js +0 -1
- package/dist/post-components/p-4953de7e.js +0 -1
- package/dist/post-components/p-4a3f67ab.js +0 -1
- package/dist/post-components/p-4f67c5f5.entry.js +0 -1
- package/dist/post-components/p-5075c672.entry.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-611b3c41.js +0 -1
- package/dist/post-components/p-67036798.entry.js +0 -1
- package/dist/post-components/p-6adeaa6c.js +0 -1
- package/dist/post-components/p-6d953fb2.js +0 -1
- package/dist/post-components/p-6edb0ac5.js +0 -1
- package/dist/post-components/p-6f8f39ca.js +0 -1
- package/dist/post-components/p-7503a623.js +0 -1
- package/dist/post-components/p-761b24c7.entry.js +0 -1
- package/dist/post-components/p-77c4c1d2.js +0 -1
- package/dist/post-components/p-7cf0c2ad.js +0 -1
- package/dist/post-components/p-856c14d6.entry.js +0 -1
- package/dist/post-components/p-866bf50a.entry.js +0 -1
- package/dist/post-components/p-8d621781.js +0 -1
- package/dist/post-components/p-8fe2d72c.entry.js +0 -1
- package/dist/post-components/p-9ad5088f.entry.js +0 -1
- package/dist/post-components/p-a1d2b90e.js +0 -1
- package/dist/post-components/p-a521419d.entry.js +0 -1
- package/dist/post-components/p-aa538648.js +0 -1
- package/dist/post-components/p-afdbee2f.js +0 -1
- package/dist/post-components/p-b02817f2.entry.js +0 -1
- package/dist/post-components/p-b095519d.js +0 -1
- package/dist/post-components/p-b157dcba.entry.js +0 -1
- package/dist/post-components/p-b22656b1.js +0 -1
- package/dist/post-components/p-bdbd11cb.js +0 -1
- package/dist/post-components/p-c537e196.entry.js +0 -1
- package/dist/post-components/p-d4f93f2b.js +0 -1
- package/dist/post-components/p-dca4246a.entry.js +0 -1
- package/dist/post-components/p-f319b026.js +0 -1
- package/dist/post-components/p-f4b7b379.js +0 -1
- package/dist/post-components/p-fac66087.entry.js +0 -1
- package/dist/post-components/p-fc91cbc2.js +0 -1
- package/dist/types/utils/is-focusable.d.ts +0 -1
- package/loaders/attribute-observer.js +0 -25
- package/loaders/debounce.js +0 -10
- package/loaders/post-breadcrumb.js +0 -171
|
@@ -1,88 +0,0 @@
|
|
|
1
|
-
import { r as registerInstance, c as createEvent, h, H as Host, g as getElement } from './index-fb8d6be7.js';
|
|
2
|
-
import { v as version } from './package-4d81f3c2.js';
|
|
3
|
-
import { f as fadeOut } from './fade-7fd71785.js';
|
|
4
|
-
import { a as checkEmptyOrPattern, c as checkEmptyOrOneOf } from './index-b49c9904.js';
|
|
5
|
-
import { c as checkType } from './check-type-8828dbe4.js';
|
|
6
|
-
import { c as checkNonEmpty } from './check-non-empty-58bd6b17.js';
|
|
7
|
-
|
|
8
|
-
const BANNER_TYPES = ['neutral', 'success', 'warning', 'danger', 'info'];
|
|
9
|
-
|
|
10
|
-
const postBannerCss = ".banner,.alert{min-height:calc(var(--post-device-sizing-notification-icon-2) + (2 * var(--post-device-spacing-padding-10)));box-sizing:border-box;box-shadow:var(--post-device-elevation-100);border-radius:var(--post-device-border-radius-2);padding:var(--post-device-spacing-padding-10) var(--post-device-spacing-padding-10);padding-inline-start:calc(var(--post-device-spacing-padding-10) + var(--post-device-sizing-notification-icon-2) + var(--post-device-spacing-gap-inline-6));font-weight:400;border-style:var(--post-core-border-style-solid);border-width:var(--post-device-border-width-default);position:relative;color:var(--post-scheme-color-surface-default-fg);background-color:var(--post-scheme-color-signal-neutral);border-color:var(--post-scheme-color-signal-neutral-dark);color-scheme:var(--post-core-bg-scheme-light)}.banner:not(.no-icon)::before,.alert:not(.no-icon)::before{-webkit-mask-image:url(\"data:image/svg+xml,%3Csvg viewBox='0 0 32 32' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M31.986 15.73c-.503.16-1.03.27-1.586.27a5.24 5.24 0 0 1-4.43-2.448c-.73.382-1.547.62-2.427.62a5.257 5.257 0 0 1-5.257-5.258c0-.88.237-1.698.62-2.427a5.24 5.24 0 0 1-2.449-4.43c0-.714.145-1.393.403-2.014C16.574.028 16.29 0 16 0 7.163 0 0 7.163 0 16s7.163 16 16 16 16-7.163 16-16c0-.091-.012-.18-.014-.27M16 30.667c-8.087 0-14.667-6.58-14.667-14.667 0-7.806 6.13-14.207 13.828-14.643a6.54 6.54 0 0 0 2.116 5.56 6.3 6.3 0 0 0-.325 1.997 6.6 6.6 0 0 0 6.59 6.59c.677 0 1.346-.108 1.998-.324a6.54 6.54 0 0 0 5.067 2.15C29.933 24.796 23.639 30.667 16 30.667M11.352 14.17a2.667 2.667 0 1 0-5.333 0 2.667 2.667 0 0 0 5.333 0m-4 0a1.335 1.335 0 1 1 1.334 1.334 1.336 1.336 0 0 1-1.334-1.334m13.981 8.496a2.667 2.667 0 1 0-5.333 0 2.667 2.667 0 0 0 5.333 0m-4 0a1.335 1.335 0 0 1 2.667 0c0 .735-.598 1.333-1.333 1.333a1.335 1.335 0 0 1-1.334-1.333m-7.276-1.829a2 2 0 1 0 0 4 2 2 0 0 0 0-4m0 2.667a.667.667 0 1 1 .002-1.335.667.667 0 0 1-.002 1.335m7.772-6a2 2 0 1 0-4 0 2 2 0 0 0 4 0m-2 .666a.667.667 0 1 1 .001-1.334.667.667 0 0 1-.001 1.334M11.505 5.505a2 2 0 1 0 0 4 2 2 0 0 0 0-4m0 2.666a.667.667 0 1 1 .001-1.334.667.667 0 0 1-.001 1.334M28.93 18.548a13.2 13.2 0 0 1-4.335 7.357.663.663 0 0 1-.94-.073.666.666 0 0 1 .073-.94 11.84 11.84 0 0 0 3.894-6.61.668.668 0 0 1 1.307.266m-6.668 8.212a.667.667 0 0 1-.295.896c-.837.423-1.722.757-2.63.99a.665.665 0 1 1-.33-1.292 11.7 11.7 0 0 0 2.359-.888.67.67 0 0 1 .896.294M4 15.921a.666.666 0 1 1-1.333 0 13.13 13.13 0 0 1 4.597-9.984.666.666 0 1 1 .867 1.013A11.8 11.8 0 0 0 4 15.92'/%3E%3C/svg%3E\");mask-image:url(\"data:image/svg+xml,%3Csvg viewBox='0 0 32 32' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M31.986 15.73c-.503.16-1.03.27-1.586.27a5.24 5.24 0 0 1-4.43-2.448c-.73.382-1.547.62-2.427.62a5.257 5.257 0 0 1-5.257-5.258c0-.88.237-1.698.62-2.427a5.24 5.24 0 0 1-2.449-4.43c0-.714.145-1.393.403-2.014C16.574.028 16.29 0 16 0 7.163 0 0 7.163 0 16s7.163 16 16 16 16-7.163 16-16c0-.091-.012-.18-.014-.27M16 30.667c-8.087 0-14.667-6.58-14.667-14.667 0-7.806 6.13-14.207 13.828-14.643a6.54 6.54 0 0 0 2.116 5.56 6.3 6.3 0 0 0-.325 1.997 6.6 6.6 0 0 0 6.59 6.59c.677 0 1.346-.108 1.998-.324a6.54 6.54 0 0 0 5.067 2.15C29.933 24.796 23.639 30.667 16 30.667M11.352 14.17a2.667 2.667 0 1 0-5.333 0 2.667 2.667 0 0 0 5.333 0m-4 0a1.335 1.335 0 1 1 1.334 1.334 1.336 1.336 0 0 1-1.334-1.334m13.981 8.496a2.667 2.667 0 1 0-5.333 0 2.667 2.667 0 0 0 5.333 0m-4 0a1.335 1.335 0 0 1 2.667 0c0 .735-.598 1.333-1.333 1.333a1.335 1.335 0 0 1-1.334-1.333m-7.276-1.829a2 2 0 1 0 0 4 2 2 0 0 0 0-4m0 2.667a.667.667 0 1 1 .002-1.335.667.667 0 0 1-.002 1.335m7.772-6a2 2 0 1 0-4 0 2 2 0 0 0 4 0m-2 .666a.667.667 0 1 1 .001-1.334.667.667 0 0 1-.001 1.334M11.505 5.505a2 2 0 1 0 0 4 2 2 0 0 0 0-4m0 2.666a.667.667 0 1 1 .001-1.334.667.667 0 0 1-.001 1.334M28.93 18.548a13.2 13.2 0 0 1-4.335 7.357.663.663 0 0 1-.94-.073.666.666 0 0 1 .073-.94 11.84 11.84 0 0 0 3.894-6.61.668.668 0 0 1 1.307.266m-6.668 8.212a.667.667 0 0 1-.295.896c-.837.423-1.722.757-2.63.99a.665.665 0 1 1-.33-1.292 11.7 11.7 0 0 0 2.359-.888.67.67 0 0 1 .896.294M4 15.921a.666.666 0 1 1-1.333 0 13.13 13.13 0 0 1 4.597-9.984.666.666 0 1 1 .867 1.013A11.8 11.8 0 0 0 4 15.92'/%3E%3C/svg%3E\");background-color:currentColor;color:currentColor;forced-color-adjust:preserve-parent-color;color:var(--post-scheme-color-signal-neutral-dark)}.banner:has(>post-icon)::before,.alert:has(>post-icon)::before{content:none}.banner>post-icon,.alert>post-icon{background-color:var(--post-scheme-color-signal-neutral);color:var(--post-scheme-color-signal-neutral-dark)}.banner::before,.alert::before{content:\"\";display:block}.banner::before,.banner>post-icon,.alert::before,.alert>post-icon{position:absolute;height:var(--post-device-sizing-notification-icon-2);width:var(--post-device-sizing-notification-icon-2);left:var(--post-device-spacing-padding-10);top:var(--post-device-spacing-padding-10)}.banner.no-icon,.alert.no-icon{min-height:calc(2 * var(--post-device-spacing-padding-10) + close.$close-size);padding-inline-start:var(--post-device-spacing-padding-10)}.banner.no-icon::before,.alert.no-icon::before{content:unset}.banner.no-icon>post-icon,.alert.no-icon>post-icon{display:none}@media (forced-colors: active),(-ms-high-contrast: active),(-ms-high-contrast: white-on-black){.banner,.alert{filter:none !important;border:2px solid CanvasText}}.banner:not(.banner-action):not(.alert-action),.alert:not(.banner-action):not(.alert-action){display:flex;flex-direction:column;justify-content:center;gap:.25rem}.banner:not(.banner-action):not(.alert-action) a,.alert:not(.banner-action):not(.alert-action) a{font-weight:400}.banner:not(.banner-action):not(.alert-action) hr,.alert:not(.banner-action):not(.alert-action) hr{margin-block:.5rem .75rem !important}.banner:not(.banner-action):not(.alert-action)>*,.alert:not(.banner-action):not(.alert-action)>*{margin:0}.banner-container{border:unset;background-color:rgba(0,0,0,0)}.banner-dismissible,.alert-dismissible{pointer-events:auto;position:relative}.banner-dismissible:not(.banner-action):not(.alert-action),.alert-dismissible:not(.banner-action):not(.alert-action){padding-inline-end:calc(var(--post-device-spacing-padding-10) + var(--post-device-spacing-gap-inline-6) + 1.5rem)}.banner-dismissible>.btn-close,.alert-dismissible>.btn-close{position:absolute;inset-block-start:1rem;inset-inline-end:var(--post-device-spacing-padding-10)}.banner-buttons,.alert-buttons{display:flex;align-items:center;justify-content:flex-start;flex-direction:row-reverse;margin-block-start:var(--post-device-spacing-padding-block-10);gap:var(--post-device-spacing-gap-1)}@media (max-width: 779.98px){.banner-buttons,.alert-buttons{flex-direction:column}}.banner-action>.banner-content,.banner-action>.alert-content,.alert-action>.banner-content,.alert-action>.alert-content{display:flex;flex-direction:column;justify-content:center;gap:.25rem}.banner-action>.banner-content a,.banner-action>.alert-content a,.alert-action>.banner-content a,.alert-action>.alert-content a{font-weight:400}.banner-action>.banner-content hr,.banner-action>.alert-content hr,.alert-action>.banner-content hr,.alert-action>.alert-content hr{margin-block:.5rem .75rem !important}.banner-action>.banner-content>*,.banner-action>.alert-content>*,.alert-action>.banner-content>*,.alert-action>.alert-content>*{margin:0}@media (max-width: 779.98px){.banner-action,.alert-action{flex-direction:column;align-items:stretch}.banner-action>.banner-content,.banner-action>.alert-content,.alert-action>.banner-content,.alert-action>.alert-content{padding-inline-start:var(--post-device-spacing-gap-inline-6)var(--post-device-sizing-notification-icon-2);padding-inline-end:var(--post-device-spacing-gap-inline-6)1.5rem}.banner-action.no-icon>.banner-content,.banner-action.no-icon>.alert-content,.alert-action.no-icon>.banner-content,.alert-action.no-icon>.alert-content{padding-inline-start:0}.banner-action>.banner-buttons,.banner-action>.alert-buttons,.alert-action>.banner-buttons,.alert-action>.alert-buttons{display:flex}.banner-action>.banner-buttons>.btn,.banner-action>.banner-buttons>::slotted(.btn),.banner-action>.alert-buttons>.btn,.banner-action>.alert-buttons>::slotted(.btn),.alert-action>.banner-buttons>.btn,.alert-action>.banner-buttons>::slotted(.btn),.alert-action>.alert-buttons>.btn,.alert-action>.alert-buttons>::slotted(.btn){flex:1 0 0;width:100%}.banner-action>.banner-buttons>.btn:first-child,.banner-action>.banner-buttons>::slotted(.btn:first-child),.banner-action>.alert-buttons>.btn:first-child,.banner-action>.alert-buttons>::slotted(.btn:first-child),.alert-action>.banner-buttons>.btn:first-child,.alert-action>.banner-buttons>::slotted(.btn:first-child),.alert-action>.alert-buttons>.btn:first-child,.alert-action>.alert-buttons>::slotted(.btn:first-child){margin-inline-start:0}}.banner-neutral,.alert-neutral{background-color:var(--post-scheme-color-signal-neutral);border-color:var(--post-scheme-color-signal-neutral-dark);color-scheme:var(--post-core-bg-scheme-light)}.banner-neutral:not(.no-icon)::before,.alert-neutral:not(.no-icon)::before{-webkit-mask-image:url(\"data:image/svg+xml,%3Csvg viewBox='0 0 32 32' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M31.986 15.73c-.503.16-1.03.27-1.586.27a5.24 5.24 0 0 1-4.43-2.448c-.73.382-1.547.62-2.427.62a5.257 5.257 0 0 1-5.257-5.258c0-.88.237-1.698.62-2.427a5.24 5.24 0 0 1-2.449-4.43c0-.714.145-1.393.403-2.014C16.574.028 16.29 0 16 0 7.163 0 0 7.163 0 16s7.163 16 16 16 16-7.163 16-16c0-.091-.012-.18-.014-.27M16 30.667c-8.087 0-14.667-6.58-14.667-14.667 0-7.806 6.13-14.207 13.828-14.643a6.54 6.54 0 0 0 2.116 5.56 6.3 6.3 0 0 0-.325 1.997 6.6 6.6 0 0 0 6.59 6.59c.677 0 1.346-.108 1.998-.324a6.54 6.54 0 0 0 5.067 2.15C29.933 24.796 23.639 30.667 16 30.667M11.352 14.17a2.667 2.667 0 1 0-5.333 0 2.667 2.667 0 0 0 5.333 0m-4 0a1.335 1.335 0 1 1 1.334 1.334 1.336 1.336 0 0 1-1.334-1.334m13.981 8.496a2.667 2.667 0 1 0-5.333 0 2.667 2.667 0 0 0 5.333 0m-4 0a1.335 1.335 0 0 1 2.667 0c0 .735-.598 1.333-1.333 1.333a1.335 1.335 0 0 1-1.334-1.333m-7.276-1.829a2 2 0 1 0 0 4 2 2 0 0 0 0-4m0 2.667a.667.667 0 1 1 .002-1.335.667.667 0 0 1-.002 1.335m7.772-6a2 2 0 1 0-4 0 2 2 0 0 0 4 0m-2 .666a.667.667 0 1 1 .001-1.334.667.667 0 0 1-.001 1.334M11.505 5.505a2 2 0 1 0 0 4 2 2 0 0 0 0-4m0 2.666a.667.667 0 1 1 .001-1.334.667.667 0 0 1-.001 1.334M28.93 18.548a13.2 13.2 0 0 1-4.335 7.357.663.663 0 0 1-.94-.073.666.666 0 0 1 .073-.94 11.84 11.84 0 0 0 3.894-6.61.668.668 0 0 1 1.307.266m-6.668 8.212a.667.667 0 0 1-.295.896c-.837.423-1.722.757-2.63.99a.665.665 0 1 1-.33-1.292 11.7 11.7 0 0 0 2.359-.888.67.67 0 0 1 .896.294M4 15.921a.666.666 0 1 1-1.333 0 13.13 13.13 0 0 1 4.597-9.984.666.666 0 1 1 .867 1.013A11.8 11.8 0 0 0 4 15.92'/%3E%3C/svg%3E\");mask-image:url(\"data:image/svg+xml,%3Csvg viewBox='0 0 32 32' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M31.986 15.73c-.503.16-1.03.27-1.586.27a5.24 5.24 0 0 1-4.43-2.448c-.73.382-1.547.62-2.427.62a5.257 5.257 0 0 1-5.257-5.258c0-.88.237-1.698.62-2.427a5.24 5.24 0 0 1-2.449-4.43c0-.714.145-1.393.403-2.014C16.574.028 16.29 0 16 0 7.163 0 0 7.163 0 16s7.163 16 16 16 16-7.163 16-16c0-.091-.012-.18-.014-.27M16 30.667c-8.087 0-14.667-6.58-14.667-14.667 0-7.806 6.13-14.207 13.828-14.643a6.54 6.54 0 0 0 2.116 5.56 6.3 6.3 0 0 0-.325 1.997 6.6 6.6 0 0 0 6.59 6.59c.677 0 1.346-.108 1.998-.324a6.54 6.54 0 0 0 5.067 2.15C29.933 24.796 23.639 30.667 16 30.667M11.352 14.17a2.667 2.667 0 1 0-5.333 0 2.667 2.667 0 0 0 5.333 0m-4 0a1.335 1.335 0 1 1 1.334 1.334 1.336 1.336 0 0 1-1.334-1.334m13.981 8.496a2.667 2.667 0 1 0-5.333 0 2.667 2.667 0 0 0 5.333 0m-4 0a1.335 1.335 0 0 1 2.667 0c0 .735-.598 1.333-1.333 1.333a1.335 1.335 0 0 1-1.334-1.333m-7.276-1.829a2 2 0 1 0 0 4 2 2 0 0 0 0-4m0 2.667a.667.667 0 1 1 .002-1.335.667.667 0 0 1-.002 1.335m7.772-6a2 2 0 1 0-4 0 2 2 0 0 0 4 0m-2 .666a.667.667 0 1 1 .001-1.334.667.667 0 0 1-.001 1.334M11.505 5.505a2 2 0 1 0 0 4 2 2 0 0 0 0-4m0 2.666a.667.667 0 1 1 .001-1.334.667.667 0 0 1-.001 1.334M28.93 18.548a13.2 13.2 0 0 1-4.335 7.357.663.663 0 0 1-.94-.073.666.666 0 0 1 .073-.94 11.84 11.84 0 0 0 3.894-6.61.668.668 0 0 1 1.307.266m-6.668 8.212a.667.667 0 0 1-.295.896c-.837.423-1.722.757-2.63.99a.665.665 0 1 1-.33-1.292 11.7 11.7 0 0 0 2.359-.888.67.67 0 0 1 .896.294M4 15.921a.666.666 0 1 1-1.333 0 13.13 13.13 0 0 1 4.597-9.984.666.666 0 1 1 .867 1.013A11.8 11.8 0 0 0 4 15.92'/%3E%3C/svg%3E\");background-color:currentColor;color:currentColor;forced-color-adjust:preserve-parent-color;color:var(--post-scheme-color-signal-neutral-dark)}.banner-neutral:has(>post-icon)::before,.alert-neutral:has(>post-icon)::before{content:none}.banner-neutral>post-icon,.alert-neutral>post-icon{background-color:var(--post-scheme-color-signal-neutral);color:var(--post-scheme-color-signal-neutral-dark)}.banner-success,.alert-success{background-color:var(--post-scheme-color-interactive-notification-success-bg);border-color:var(--post-scheme-color-interactive-notification-success-stroke);color-scheme:var(--post-core-bg-scheme-light)}.banner-success:not(.no-icon)::before,.alert-success:not(.no-icon)::before{-webkit-mask-image:url(\"data:image/svg+xml,%3Csvg viewBox='0 0 32 32' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='m12.667 24.533-7.6-7.6 1.867-1.867 5.733 5.733 12.4-12.4 1.867 1.867z'/%3E%3C/svg%3E\");mask-image:url(\"data:image/svg+xml,%3Csvg viewBox='0 0 32 32' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='m12.667 24.533-7.6-7.6 1.867-1.867 5.733 5.733 12.4-12.4 1.867 1.867z'/%3E%3C/svg%3E\");background-color:currentColor;color:currentColor;forced-color-adjust:preserve-parent-color;color:var(--post-scheme-color-interactive-notification-success-icon)}.banner-success:has(>post-icon)::before,.alert-success:has(>post-icon)::before{content:none}.banner-success>post-icon,.alert-success>post-icon{background-color:var(--post-scheme-color-interactive-notification-success-bg);color:var(--post-scheme-color-interactive-notification-success-icon)}.banner-warning,.alert-warning{background-color:var(--post-scheme-color-interactive-notification-warning-bg);border-color:var(--post-scheme-color-interactive-notification-warning-stroke);color-scheme:var(--post-core-bg-scheme-light)}.banner-warning:not(.no-icon)::before,.alert-warning:not(.no-icon)::before{-webkit-mask-image:url(\"data:image/svg+xml,%3Csvg viewBox='0 0 32 32' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M14.67 4h2.67v18.67h-2.67zm0 21.33h2.67V28h-2.67z'/%3E%3C/svg%3E\");mask-image:url(\"data:image/svg+xml,%3Csvg viewBox='0 0 32 32' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M14.67 4h2.67v18.67h-2.67zm0 21.33h2.67V28h-2.67z'/%3E%3C/svg%3E\");background-color:currentColor;color:currentColor;forced-color-adjust:preserve-parent-color;color:var(--post-scheme-color-interactive-notification-warning-icon)}.banner-warning:has(>post-icon)::before,.alert-warning:has(>post-icon)::before{content:none}.banner-warning>post-icon,.alert-warning>post-icon{background-color:var(--post-scheme-color-interactive-notification-warning-bg);color:var(--post-scheme-color-interactive-notification-warning-icon)}.banner-error,.alert-error{background-color:var(--post-scheme-color-interactive-notification-error-bg);border-color:var(--post-scheme-color-interactive-notification-error-stroke);color-scheme:var(--post-core-bg-scheme-light)}.banner-error:not(.no-icon)::before,.alert-error:not(.no-icon)::before{-webkit-mask-image:url(\"data:image/svg+xml,%3Csvg viewBox='0 0 32 32' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M14.67 4h2.67v18.67h-2.67zm0 21.33h2.67V28h-2.67z'/%3E%3C/svg%3E\");mask-image:url(\"data:image/svg+xml,%3Csvg viewBox='0 0 32 32' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M14.67 4h2.67v18.67h-2.67zm0 21.33h2.67V28h-2.67z'/%3E%3C/svg%3E\");background-color:currentColor;color:currentColor;forced-color-adjust:preserve-parent-color;color:var(--post-scheme-color-interactive-notification-error-icon)}.banner-error:has(>post-icon)::before,.alert-error:has(>post-icon)::before{content:none}.banner-error>post-icon,.alert-error>post-icon{background-color:var(--post-scheme-color-interactive-notification-error-bg);color:var(--post-scheme-color-interactive-notification-error-icon)}.banner-info,.alert-info{background-color:var(--post-scheme-color-interactive-notification-info-bg);border-color:var(--post-scheme-color-interactive-notification-info-stroke);color-scheme:var(--post-core-bg-scheme-light)}.banner-info:not(.no-icon)::before,.alert-info:not(.no-icon)::before{-webkit-mask-image:url(\"data:image/svg+xml,%3Csvg viewBox='0 0 32 32' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M17.33 25.33v-16h-4.67V12h2v13.33h-2V28h6.67v-2.67zM14.67 4h2.67v2.67h-2.67z'/%3E%3C/svg%3E\");mask-image:url(\"data:image/svg+xml,%3Csvg viewBox='0 0 32 32' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M17.33 25.33v-16h-4.67V12h2v13.33h-2V28h6.67v-2.67zM14.67 4h2.67v2.67h-2.67z'/%3E%3C/svg%3E\");background-color:currentColor;color:currentColor;forced-color-adjust:preserve-parent-color;color:var(--post-scheme-color-interactive-notification-info-icon)}.banner-info:has(>post-icon)::before,.alert-info:has(>post-icon)::before{content:none}.banner-info>post-icon,.alert-info>post-icon{background-color:var(--post-scheme-color-interactive-notification-info-bg);color:var(--post-scheme-color-interactive-notification-info-icon)}.banner-danger,.alert-danger{background-color:var(--post-scheme-color-interactive-notification-error-bg);border-color:var(--post-scheme-color-interactive-notification-error-stroke);color-scheme:var(--post-core-bg-scheme-light)}.banner-danger:not(.no-icon)::before,.alert-danger:not(.no-icon)::before{-webkit-mask-image:url(\"data:image/svg+xml,%3Csvg viewBox='0 0 32 32' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M14.67 4h2.67v18.67h-2.67zm0 21.33h2.67V28h-2.67z'/%3E%3C/svg%3E\");mask-image:url(\"data:image/svg+xml,%3Csvg viewBox='0 0 32 32' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M14.67 4h2.67v18.67h-2.67zm0 21.33h2.67V28h-2.67z'/%3E%3C/svg%3E\");background-color:currentColor;color:currentColor;forced-color-adjust:preserve-parent-color;color:var(--post-scheme-color-interactive-notification-error-icon)}.banner-danger:has(>post-icon)::before,.alert-danger:has(>post-icon)::before{content:none}.banner-danger>post-icon,.alert-danger>post-icon{background-color:var(--post-scheme-color-interactive-notification-error-bg);color:var(--post-scheme-color-interactive-notification-error-icon)}.btn-close{padding:0;overflow:visible;border:0;background:none;color:inherit;font:inherit;-webkit-user-select:none;user-select:none;appearance:button;border-radius:var(--post-device-border-radius-round);color:#000;transition:opacity 250ms,border-color 250ms,background-color 250ms,color 250ms;cursor:pointer}.btn-close{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}.btn-close:is(:focus-visible,:has(:focus-visible),.pretend-focus){outline-style:var(--post-core-border-style-solid) !important;border-radius:4px}@media (forced-colors: active),(-ms-high-contrast: active),(-ms-high-contrast: white-on-black){.btn-close:is(:focus-visible,:has(:focus-visible),.pretend-focus){outline-color:Highlight !important}}@supports not selector(:has(:focus-visible)){.btn-close:is(:focus-visible,:focus-within,.pretend-focus){outline-style:var(--post-core-border-style-solid) !important;border-radius:4px}@media (forced-colors: active),(-ms-high-contrast: active),(-ms-high-contrast: white-on-black){.btn-close:is(:focus-visible,:focus-within,.pretend-focus){outline-color:Highlight !important}}}.btn-close::before{-webkit-mask-image:url(\"data:image/svg+xml,%3Csvg viewBox='0 0 32 32' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='m16.267 16.667 6.667-6.533-.933-1.067-6.667 6.667-6.667-6.667-.933 1.067 6.667 6.533-6.667 6.667 1.067.933 6.533-6.667 6.667 6.667.933-1.067z'/%3E%3C/svg%3E\");mask-image:url(\"data:image/svg+xml,%3Csvg viewBox='0 0 32 32' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='m16.267 16.667 6.667-6.533-.933-1.067-6.667 6.667-6.667-6.667-.933 1.067 6.667 6.533-6.667 6.667 1.067.933 6.533-6.667 6.667 6.667.933-1.067z'/%3E%3C/svg%3E\");background-color:currentColor;color:currentColor;forced-color-adjust:preserve-parent-color;content:\"\";display:block;height:1.5rem;width:1.5rem}.btn-close:focus,.btn-close:not(:disabled):hover,.pretend-hover.btn-close{color:#000}.btn-close:disabled{color:var(--post-gray-40)}@media (forced-colors: active),(-ms-high-contrast: active),(-ms-high-contrast: white-on-black){.btn-close{color:CanvasText;forced-color-adjust:none}.btn-close:focus,.btn-close:not(:disabled):hover,.pretend-hover.btn-close{color:Highlight}}.btn-close-white{color:#e6e6e6}.btn-close-white:focus,.btn-close-white:not(:disabled):hover,.btn-close-white.pretend-hover{color:#fff}.btn-close-white:disabled{color:#999}/*!\n * Copyright 2021 by Swiss Post, Information Technology\n */:host{display:block}:host ::slotted(*){margin:0 !important}.visually-hidden{width:1px !important;height:1px !important;padding:0 !important;margin:-1px !important;overflow:hidden !important;clip:rect(0, 0, 0, 0) !important;white-space:nowrap !important;border:0 !important}.visually-hidden:not(caption){position:absolute !important}";
|
|
11
|
-
const PostBannerStyle0 = postBannerCss;
|
|
12
|
-
|
|
13
|
-
const PostBanner = class {
|
|
14
|
-
constructor(hostRef) {
|
|
15
|
-
registerInstance(this, hostRef);
|
|
16
|
-
this.postDismissed = createEvent(this, "postDismissed", 7);
|
|
17
|
-
this.bannerId = crypto.randomUUID();
|
|
18
|
-
this.classes = undefined;
|
|
19
|
-
this.hasActions = undefined;
|
|
20
|
-
this.hasHeading = undefined;
|
|
21
|
-
this.onDismissButtonClick = () => this.dismiss();
|
|
22
|
-
this.dismissible = false;
|
|
23
|
-
this.dismissLabel = undefined;
|
|
24
|
-
this.icon = undefined;
|
|
25
|
-
this.type = 'neutral';
|
|
26
|
-
}
|
|
27
|
-
validateDismissible(isDismissible = this.dismissible) {
|
|
28
|
-
checkType(isDismissible, 'boolean', 'The post-banner "dismissible" prop should be a boolean.');
|
|
29
|
-
setTimeout(() => this.validateDismissLabel());
|
|
30
|
-
}
|
|
31
|
-
validateDismissLabel(dismissLabel = this.dismissLabel) {
|
|
32
|
-
if (this.dismissible) {
|
|
33
|
-
checkNonEmpty(dismissLabel, 'Dismissible post-banner\'s require a "dismiss-label" prop.');
|
|
34
|
-
}
|
|
35
|
-
}
|
|
36
|
-
validateIcon(icon = this.icon) {
|
|
37
|
-
checkEmptyOrPattern(icon, /\d{4}|none/, 'The post-banner "icon" prop should be a 4-digits string.');
|
|
38
|
-
}
|
|
39
|
-
validateType(type = this.type) {
|
|
40
|
-
checkEmptyOrOneOf(type, BANNER_TYPES, `The post-banner requires a type form: ${BANNER_TYPES.join(', ')}`);
|
|
41
|
-
}
|
|
42
|
-
componentDidLoad() {
|
|
43
|
-
this.validateDismissible();
|
|
44
|
-
this.validateIcon();
|
|
45
|
-
this.validateType();
|
|
46
|
-
}
|
|
47
|
-
componentWillRender() {
|
|
48
|
-
this.hasHeading = this.host.querySelectorAll('[slot=heading]').length > 0;
|
|
49
|
-
this.hasActions = this.host.querySelectorAll('[slot=actions]').length > 0;
|
|
50
|
-
this.classes = `banner ${this.type ? 'banner-' + this.type : ''}`;
|
|
51
|
-
if (this.dismissible)
|
|
52
|
-
this.classes += ' banner-dismissible';
|
|
53
|
-
if (this.hasActions)
|
|
54
|
-
this.classes += ' banner-action';
|
|
55
|
-
if (this.icon === 'none')
|
|
56
|
-
this.classes += ' no-icon';
|
|
57
|
-
}
|
|
58
|
-
/**
|
|
59
|
-
* Triggers banner dismissal programmatically (same as clicking on the close button (×)).
|
|
60
|
-
*/
|
|
61
|
-
async dismiss() {
|
|
62
|
-
const dismissal = fadeOut(this.host);
|
|
63
|
-
await dismissal.finished;
|
|
64
|
-
this.host.remove();
|
|
65
|
-
this.postDismissed.emit();
|
|
66
|
-
}
|
|
67
|
-
render() {
|
|
68
|
-
const defaultBannerContent = [
|
|
69
|
-
this.hasHeading && (h("div", { key: `${this.bannerId}-heading`, class: "banner-heading" }, h("slot", { key: '7c03020bf287d48d71b31a7ae1d973ec0094d0f8', name: "heading" }))),
|
|
70
|
-
h("slot", { key: `${this.bannerId}-message` }),
|
|
71
|
-
];
|
|
72
|
-
const actionBannerContent = [
|
|
73
|
-
h("div", { key: `${this.bannerId}-content`, class: "banner-content" }, defaultBannerContent),
|
|
74
|
-
h("div", { key: `${this.bannerId}-buttons`, class: "banner-buttons" }, h("slot", { key: 'e7a4fca1de6d984560ab46c87c9406e567b482f9', name: "actions" })),
|
|
75
|
-
];
|
|
76
|
-
return (h(Host, { key: '58fcfe2258e5d5426c713864af729b046c9ed678', "data-version": version }, h("div", { key: '0c54f8b1ece142fd9cd3d071cf36fde2dc5e1d08', role: "alert", class: this.classes, part: this.classes }, this.dismissible && (h("button", { key: '8e1c32b63a39605ad15c550f4cd55ebb5630e4fe', class: "btn-close", onClick: this.onDismissButtonClick }, h("span", { key: 'cea941fe2637f3cabb5889875ca12d6f9818e636', class: "visually-hidden" }, this.dismissLabel))), this.icon && this.icon !== 'none' && (h("post-icon", { key: `${this.bannerId}-icon`, name: this.icon })), this.hasActions ? actionBannerContent : defaultBannerContent)));
|
|
77
|
-
}
|
|
78
|
-
get host() { return getElement(this); }
|
|
79
|
-
static get watchers() { return {
|
|
80
|
-
"dismissible": ["validateDismissible"],
|
|
81
|
-
"dismissLabel": ["validateDismissLabel"],
|
|
82
|
-
"icon": ["validateIcon"],
|
|
83
|
-
"type": ["validateType"]
|
|
84
|
-
}; }
|
|
85
|
-
};
|
|
86
|
-
PostBanner.style = PostBannerStyle0;
|
|
87
|
-
|
|
88
|
-
export { PostBanner as P };
|
|
@@ -1,109 +0,0 @@
|
|
|
1
|
-
import { r as registerInstance, h, H as Host, g as getElement } from './index-fb8d6be7.js';
|
|
2
|
-
import { v as version } from './package-4d81f3c2.js';
|
|
3
|
-
import { c as checkUrl } from './check-url-a974431e.js';
|
|
4
|
-
import { d as debounce } from './debounce-abe98cc2.js';
|
|
5
|
-
|
|
6
|
-
const postBreadcrumbCss = "/*!\n * Copyright 2021 by Swiss Post, Information Technology\n */:host{display:flex;align-items:center}.breadcrumbs-nav{display:flex;align-items:center}.hidden-items{gap:var(--post-device-spacing-gap-inline-4);position:absolute;height:0;overflow:hidden;white-space:nowrap}.breadcrumbs-list{display:flex;flex-wrap:nowrap;position:relative;margin:0;padding:0;list-style:none;align-items:center;height:100%;gap:var(--post-device-spacing-gap-inline-4)}post-icon{display:inline-block;box-sizing:border-box;color:var(--post-scheme-color-interactive-primary-enabled-fg1);height:var(--post-core-dimension-24);width:var(--post-core-dimension-24)}.breadcrumb-item-icon{padding-block:var(--post-core-dimension-4);padding-inline:var(--post-core-dimension-4)}li a{display:flex;align-items:center}li a{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}li a: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){li a:is(:focus-visible,:has(:focus-visible),.pretend-focus){outline-color:Highlight !important}}@supports not selector(:has(:focus-visible)){li a: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){li a:is(:focus-visible,:focus-within,.pretend-focus){outline-color:Highlight !important}}}li a:focus{border-radius:var(--post-device-border-radius-focus)}li a .home-icon{padding-block:var(--post-device-spacing-padding-4);padding-inline:var(--post-device-spacing-padding-4)}li a .home-icon:hover{color:var(--post-scheme-color-interactive-primary-hover-fg1)}@media (forced-colors: active),(-ms-high-contrast: active),(-ms-high-contrast: white-on-black){li a .home-icon a,li a .home-icon:focus,li a .home-icon:hover{color:CanvasText !important}}.menu-trigger-wrapper{display:flex;align-items:center;gap:var(--post-device-spacing-gap-inline-5)}.actual-menu{display:flex;align-items:center}post-menu-trigger{display:flex;align-items:center;padding-block:var(--post-device-spacing-padding-block-7)}post-menu-trigger{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}post-menu-trigger: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){post-menu-trigger:is(:focus-visible,:has(:focus-visible),.pretend-focus){outline-color:Highlight !important}}@supports not selector(:has(:focus-visible)){post-menu-trigger: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){post-menu-trigger:is(:focus-visible,:focus-within,.pretend-focus){outline-color:Highlight !important}}}post-menu-trigger:focus{border-radius:var(--post-device-border-radius-focus)}post-menu-trigger button{background:none;border:none;line-height:150%;font-size:var(--post-device-font-size-6);cursor:pointer;padding:0;color:var(--post-scheme-color-interactive-primary-enabled-fg1)}post-menu-trigger button:hover{color:var(--post-scheme-color-interactive-primary-hover-fg1)}@media (forced-colors: active),(-ms-high-contrast: active),(-ms-high-contrast: white-on-black){post-menu-trigger button a,post-menu-trigger button:focus,post-menu-trigger button:hover{color:LinkText !important}}post-menu::part(popover-container){display:flex;flex-direction:column;align-items:start;padding:.6rem;gap:var(--post-device-spacing-gap-inline-4)}post-menu::part(popover-container) ::slotted(post-menu-item:not(:last-child)){margin-bottom:var(--post-device-spacing-gap-inline-4)}.breadcrumb-item{display:flex;align-items:center;justify-content:center;gap:var(--post-device-spacing-gap-inline-5)}.breadcrumb-item a{text-decoration:none;color:inherit;line-height:150%;padding-block:var(--post-device-spacing-padding-block-7);font-size:var(--post-device-font-size-6)}.breadcrumb-item a{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}.breadcrumb-item a: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){.breadcrumb-item a:is(:focus-visible,:has(:focus-visible),.pretend-focus){outline-color:Highlight !important}}@supports not selector(:has(:focus-visible)){.breadcrumb-item a: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){.breadcrumb-item a:is(:focus-visible,:focus-within,.pretend-focus){outline-color:Highlight !important}}}.breadcrumb-item a:hover{color:var(--post-scheme-color-interactive-primary-hover-fg1);text-decoration:var(--post-core-text-decoration-underline)}.breadcrumb-item a:focus-visible{border-radius:var(--post-device-border-radius-focus)}.breadcrumb-item span:hover{color:var(--post-scheme-color-interactive-primary-hover-fg1);text-decoration:var(--post-core-text-decoration-underline)}.breadcrumb-item span:focus-visible{border-radius:var(--post-device-border-radius-focus)}@media (forced-colors: active),(-ms-high-contrast: active),(-ms-high-contrast: white-on-black){.breadcrumb-item a,.breadcrumb-item:focus,.breadcrumb-item:hover{color:LinkText !important}.breadcrumb-item:visited{color:VisitedText !important}}post-breadcrumb-item:last-of-type{pointer-events:none;color:var(--post-scheme-color-interactive-primary-selected-fg1);font-weight:var(--post-device-font-weight-bold);text-decoration:var(--post-core-text-decoration-none)}post-breadcrumb-item:last-of-type:hover{color:var(--post-scheme-color-interactive-primary-selected-fg1);text-decoration:none}.visually-hidden{width:1px !important;height:1px !important;padding:0 !important;margin:-1px !important;overflow:hidden !important;clip:rect(0, 0, 0, 0) !important;white-space:nowrap !important;border:0 !important}.visually-hidden:not(caption){position:absolute !important}";
|
|
7
|
-
const PostBreadcrumbStyle0 = postBreadcrumbCss;
|
|
8
|
-
|
|
9
|
-
const PostBreadcrumb = class {
|
|
10
|
-
constructor(hostRef) {
|
|
11
|
-
registerInstance(this, hostRef);
|
|
12
|
-
// Waits for breadcrumb navigation reference to be available
|
|
13
|
-
this.waitForBreadcrumbRef = debounce(() => {
|
|
14
|
-
var _a;
|
|
15
|
-
if (((_a = this.breadcrumbNavRef) === null || _a === void 0 ? void 0 : _a.clientWidth) > 0) {
|
|
16
|
-
this.checkConcatenation();
|
|
17
|
-
}
|
|
18
|
-
else {
|
|
19
|
-
this.waitForBreadcrumbRef();
|
|
20
|
-
}
|
|
21
|
-
}, 50);
|
|
22
|
-
// Handles resizing to check concatenation
|
|
23
|
-
this.handleResize = () => {
|
|
24
|
-
if (window.innerWidth === this.lastWindowWidth)
|
|
25
|
-
return;
|
|
26
|
-
this.lastWindowWidth = window.innerWidth;
|
|
27
|
-
this.checkConcatenation();
|
|
28
|
-
};
|
|
29
|
-
this.homeUrl = undefined;
|
|
30
|
-
this.homeText = 'Home';
|
|
31
|
-
this.breadcrumbItems = [];
|
|
32
|
-
this.isConcatenated = undefined;
|
|
33
|
-
this.lastWindowWidth = undefined;
|
|
34
|
-
}
|
|
35
|
-
validateUrl() {
|
|
36
|
-
checkUrl(this.homeUrl, 'The "url" property of the home-icon is invalid');
|
|
37
|
-
}
|
|
38
|
-
componentWillLoad() {
|
|
39
|
-
this.updateBreadcrumbItems();
|
|
40
|
-
}
|
|
41
|
-
componentDidLoad() {
|
|
42
|
-
window.addEventListener('resize', this.handleResize);
|
|
43
|
-
this.waitForBreadcrumbRef();
|
|
44
|
-
}
|
|
45
|
-
disconnectedCallback() {
|
|
46
|
-
window.removeEventListener('resize', this.handleResize);
|
|
47
|
-
}
|
|
48
|
-
// Updates breadcrumb items and sets the last item
|
|
49
|
-
updateBreadcrumbItems() {
|
|
50
|
-
this.breadcrumbItems = Array.from(this.host.querySelectorAll('post-breadcrumb-item')).map((item) => ({
|
|
51
|
-
text: item.textContent || '',
|
|
52
|
-
url: item.getAttribute('url') || '',
|
|
53
|
-
}));
|
|
54
|
-
this.lastItem = this.breadcrumbItems[this.breadcrumbItems.length - 1];
|
|
55
|
-
}
|
|
56
|
-
// Determines parent width for concatenation logic
|
|
57
|
-
getParentWidth() {
|
|
58
|
-
let parent = this.host.parentNode;
|
|
59
|
-
while (parent && !(parent instanceof HTMLElement)) {
|
|
60
|
-
parent = parent.parentNode;
|
|
61
|
-
}
|
|
62
|
-
return parent instanceof HTMLElement ? parent.clientWidth : window.innerWidth;
|
|
63
|
-
}
|
|
64
|
-
checkConcatenation() {
|
|
65
|
-
var _a;
|
|
66
|
-
if (!this.breadcrumbNavRef)
|
|
67
|
-
return;
|
|
68
|
-
const visibleWidth = this.getParentWidth();
|
|
69
|
-
// Measure all hidden breadcrumb items
|
|
70
|
-
const hiddenItems = Array.from(((_a = this.host.shadowRoot) === null || _a === void 0 ? void 0 : _a.querySelectorAll('.hidden-breadcrumb-item')) || []);
|
|
71
|
-
const totalWidth = hiddenItems.reduce((accum, element) => {
|
|
72
|
-
const rect = element.getBoundingClientRect();
|
|
73
|
-
return accum + rect.width;
|
|
74
|
-
}, 0);
|
|
75
|
-
this.isConcatenated = totalWidth > visibleWidth;
|
|
76
|
-
}
|
|
77
|
-
// Handles breadcrumb item click to open the menu
|
|
78
|
-
handleBreadcrumbItemClick() {
|
|
79
|
-
var _a, _b;
|
|
80
|
-
if (this.host.shadowRoot) {
|
|
81
|
-
const menuTrigger = (_b = (_a = this.host.shadowRoot) === null || _a === void 0 ? void 0 : _a.querySelector('.menu-trigger-wrapper')) === null || _b === void 0 ? void 0 : _b.querySelector('button');
|
|
82
|
-
if (menuTrigger) {
|
|
83
|
-
menuTrigger.click();
|
|
84
|
-
}
|
|
85
|
-
}
|
|
86
|
-
}
|
|
87
|
-
render() {
|
|
88
|
-
const visibleItems = this.breadcrumbItems.slice(0, -1);
|
|
89
|
-
return (h(Host, { key: '1baffcf05840127383931baec809e2b94e402e5e', "data-version": version }, h("nav", { key: 'c6725b8aa970f35f15f31ecc56280e7518b2dba9', "aria-label": "Breadcrumb", class: "breadcrumbs-nav", ref: (el) => (this.breadcrumbNavRef = el) }, h("ol", { key: '3166f345dde9f7003b23f5e7a1ddbe587b3fb4be', class: "no-list breadcrumbs-list" }, h("li", { key: '2efcbd6502cc5245ee63fd344a28c8aea4561cde' }, h("a", { key: 'b727c3d880ca9ebb7fc8527263a142662e4d42fd', href: this.homeUrl, class: "breadcrumb-link" }, h("span", { key: 'd683d05bce032759aa224e7a36ef5d7fb3883187', class: "visually-hidden" }, this.homeText), h("post-icon", { key: 'f17d5f56a49f0525d64414c079968d80b0c7eca3', name: "home", class: "home-icon" }))), this.isConcatenated ? (h("div", { class: "menu-trigger-wrapper", "aria-label": "More breadcrumbs", onKeyDown: (e) => {
|
|
90
|
-
if (e.key === 'Enter' || e.key === ' ') {
|
|
91
|
-
e.preventDefault();
|
|
92
|
-
this.handleBreadcrumbItemClick();
|
|
93
|
-
}
|
|
94
|
-
} }, h("post-icon", { name: "2111", class: "breadcrumb-item-icon" }), h("div", { class: "actual-menu" }, h("post-menu-trigger", { for: "breadcrumb-menu", tabIndex: 0 }, h("button", { class: "btn test", tabIndex: -1 }, "...")), h("post-menu", { id: "breadcrumb-menu" }, visibleItems.map((item) => (h("post-menu-item", { key: item.url || item.text, class: "breadcrumb-item", onKeyDown: (e) => {
|
|
95
|
-
if (e.key === 'Enter' || e.key === ' ') {
|
|
96
|
-
const linkElement = e.currentTarget.querySelector('a');
|
|
97
|
-
linkElement === null || linkElement === void 0 ? void 0 : linkElement.click();
|
|
98
|
-
e.preventDefault();
|
|
99
|
-
}
|
|
100
|
-
} }, item.url ? h("a", { href: item.url }, item.text) : h("span", null, item.text)))))))) : (visibleItems.map((item) => (h("post-breadcrumb-item", { url: item.url, key: item.url || item.text }, item.text)))), this.lastItem && (h("post-breadcrumb-item", { key: '674dd84e23c325f874f57b92b0171b47d600d463', url: this.lastItem.url, "aria-current": "page", tabindex: -1 }, this.lastItem.text))), h("div", { key: 'b4131833874403a8166446991510a36003a21aed', class: "hidden-items" }, h("a", { key: 'aa31950651d486afdb97974c24929cc80e0c3f53', href: this.homeUrl, class: "hidden-breadcrumb-item" }, h("span", { key: 'e9d1f5e225220a5942f8844dc26014f1278f935f', class: "visually-hidden" }, this.homeText), h("post-icon", { key: '493a91739d10c3e536da52d636aca4b305f88273', name: "home", class: "home-icon" })), this.breadcrumbItems.map((item) => (h("post-breadcrumb-item", { url: item.url, key: `hidden-${item.url || item.text}`, class: "hidden-breadcrumb-item" }, item.text)))))));
|
|
101
|
-
}
|
|
102
|
-
get host() { return getElement(this); }
|
|
103
|
-
static get watchers() { return {
|
|
104
|
-
"homeUrl": ["validateUrl"]
|
|
105
|
-
}; }
|
|
106
|
-
};
|
|
107
|
-
PostBreadcrumb.style = PostBreadcrumbStyle0;
|
|
108
|
-
|
|
109
|
-
export { PostBreadcrumb as P };
|
|
@@ -1,270 +0,0 @@
|
|
|
1
|
-
import { r as registerInstance, c as createEvent, h, H as Host, g as getElement } from './index-fb8d6be7.js';
|
|
2
|
-
import { c as checkOneOf } from './check-one-of-6b3ef8eb.js';
|
|
3
|
-
import { c as checkNonEmpty } from './check-non-empty-58bd6b17.js';
|
|
4
|
-
import { v as version } from './package-4d81f3c2.js';
|
|
5
|
-
|
|
6
|
-
const postCardControlCss = "/*!\n * Copyright 2021 by Swiss Post, Information Technology\n */.form-check{display:flex;flex-wrap:wrap;align-items:flex-start;width:-moz-fit-content;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:1.5rem}.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%;-webkit-mask-size:var(--post-device-sizing-interactive-icon-size);mask-size:var(--post-device-sizing-interactive-icon-size);-webkit-mask-repeat:no-repeat;mask-repeat:no-repeat;-webkit-mask-position:center;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{-webkit-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>\");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{-webkit-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>\");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:1rem}.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 .5rem;margin:0;padding:1rem;background-color:var(--post-card-control-bg);border:2px 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:.25rem 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:.25rem 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:2rem;height:2rem;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:2px;outline:2px 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:2px solid Field;outline-offset:-4px}.card-control .card-control--input{outline:2px 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:2px;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:2px;border-radius:1px;background-color:SelectedItem}.card-control.is-checked>*{position:relative}.card-control.is-checked .card-control--input{outline:2px 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:1rem}: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}}";
|
|
7
|
-
const PostCardControlStyle0 = postCardControlCss;
|
|
8
|
-
|
|
9
|
-
let cardControlIds = 0;
|
|
10
|
-
const PostCardControl = class {
|
|
11
|
-
/**
|
|
12
|
-
* A public method to reset the controls `checked` and `validity` state.
|
|
13
|
-
* The validity state is set to `null`, so it's neither valid nor invalid.
|
|
14
|
-
*/
|
|
15
|
-
async reset() {
|
|
16
|
-
this.validity = null;
|
|
17
|
-
this.controlSetChecked(this.initialChecked);
|
|
18
|
-
}
|
|
19
|
-
/**
|
|
20
|
-
* A hidden public method to reset the group controls `checked` state to `false`.
|
|
21
|
-
*/
|
|
22
|
-
async groupReset() {
|
|
23
|
-
if (this.disabled)
|
|
24
|
-
this.control.checked = this.checked = false;
|
|
25
|
-
this.controlSetChecked(false);
|
|
26
|
-
}
|
|
27
|
-
validateControlLabel(label = this.label) {
|
|
28
|
-
checkNonEmpty(label, 'The "post-card-control" element requires its "label" property to be set.');
|
|
29
|
-
}
|
|
30
|
-
validateControlType(type = this.type) {
|
|
31
|
-
checkOneOf(type, ['checkbox', 'radio'], 'The "post-card-control" element requires its "type" prop to be one of either "checkbox" or "radio".');
|
|
32
|
-
}
|
|
33
|
-
updateControlChecked(checked = this.checked) {
|
|
34
|
-
this.controlSetChecked(checked);
|
|
35
|
-
}
|
|
36
|
-
updateControlDisabled() {
|
|
37
|
-
this.controlSetChecked(this.checked);
|
|
38
|
-
}
|
|
39
|
-
constructor(hostRef) {
|
|
40
|
-
registerInstance(this, hostRef);
|
|
41
|
-
this.postInput = createEvent(this, "postInput", 7);
|
|
42
|
-
this.postChange = createEvent(this, "postChange", 7);
|
|
43
|
-
if (hostRef.$hostElement$["s-ei"]) {
|
|
44
|
-
this.internals = hostRef.$hostElement$["s-ei"];
|
|
45
|
-
}
|
|
46
|
-
else {
|
|
47
|
-
this.internals = hostRef.$hostElement$.attachInternals();
|
|
48
|
-
hostRef.$hostElement$["s-ei"] = this.internals;
|
|
49
|
-
}
|
|
50
|
-
this.EVENT_MAP = {
|
|
51
|
-
input: 'postInput',
|
|
52
|
-
change: 'postChange',
|
|
53
|
-
};
|
|
54
|
-
this.KEYCODES = {
|
|
55
|
-
SPACE: 'Space',
|
|
56
|
-
LEFT: 'ArrowLeft',
|
|
57
|
-
UP: 'ArrowUp',
|
|
58
|
-
RIGHT: 'ArrowRight',
|
|
59
|
-
DOWN: 'ArrowDown',
|
|
60
|
-
};
|
|
61
|
-
this.group = {
|
|
62
|
-
hosts: [],
|
|
63
|
-
members: [],
|
|
64
|
-
first: null,
|
|
65
|
-
last: null,
|
|
66
|
-
checked: null,
|
|
67
|
-
focused: null,
|
|
68
|
-
};
|
|
69
|
-
this.controlId = `PostCardControl_${cardControlIds++}`;
|
|
70
|
-
this.focused = false;
|
|
71
|
-
this.label = undefined;
|
|
72
|
-
this.description = null;
|
|
73
|
-
this.type = undefined;
|
|
74
|
-
this.name = null;
|
|
75
|
-
this.value = null;
|
|
76
|
-
this.checked = false;
|
|
77
|
-
this.disabled = false;
|
|
78
|
-
this.validity = null;
|
|
79
|
-
this.icon = null;
|
|
80
|
-
this.cardClickHandler = this.cardClickHandler.bind(this);
|
|
81
|
-
this.controlClickHandler = this.controlClickHandler.bind(this);
|
|
82
|
-
this.controlChangeHandler = this.controlChangeHandler.bind(this);
|
|
83
|
-
this.controlFocusHandler = this.controlFocusHandler.bind(this);
|
|
84
|
-
this.controlKeyDownHandler = this.controlKeyDownHandler.bind(this);
|
|
85
|
-
}
|
|
86
|
-
cardClickHandler(e) {
|
|
87
|
-
e.stopPropagation();
|
|
88
|
-
// if this was not the clicked element anyway, trigger click on control to change it
|
|
89
|
-
if (e.target !== this.control)
|
|
90
|
-
this.control.click();
|
|
91
|
-
}
|
|
92
|
-
controlClickHandler(e) {
|
|
93
|
-
e.stopPropagation();
|
|
94
|
-
// if control is disabled do nothing
|
|
95
|
-
// else control value will fire a change event, which is handled in the controlChangeHandler method
|
|
96
|
-
if (this.disabled)
|
|
97
|
-
e.preventDefault();
|
|
98
|
-
}
|
|
99
|
-
controlChangeHandler(e) {
|
|
100
|
-
e.stopPropagation();
|
|
101
|
-
this.groupCollectMembers();
|
|
102
|
-
this.controlSetChecked(this.control.checked, e);
|
|
103
|
-
this.groupSetChecked(this.control, e);
|
|
104
|
-
}
|
|
105
|
-
controlFocusHandler() {
|
|
106
|
-
this.focused = this.host === document.activeElement;
|
|
107
|
-
}
|
|
108
|
-
// https://googlechromelabs.github.io/howto-components/howto-radio-group/
|
|
109
|
-
controlKeyDownHandler(e) {
|
|
110
|
-
if (this.type === 'radio') {
|
|
111
|
-
e.stopPropagation();
|
|
112
|
-
if (Object.values(this.KEYCODES).includes(e.code))
|
|
113
|
-
e.preventDefault();
|
|
114
|
-
this.groupCollectMembers();
|
|
115
|
-
switch (e.code) {
|
|
116
|
-
case this.KEYCODES.UP:
|
|
117
|
-
case this.KEYCODES.LEFT:
|
|
118
|
-
this.groupSetChecked(this.groupGetPrev(), e);
|
|
119
|
-
break;
|
|
120
|
-
case this.KEYCODES.DOWN:
|
|
121
|
-
case this.KEYCODES.RIGHT:
|
|
122
|
-
this.groupSetChecked(this.groupGetNext(), e);
|
|
123
|
-
break;
|
|
124
|
-
case this.KEYCODES.SPACE:
|
|
125
|
-
this.groupSetChecked(this.control, e);
|
|
126
|
-
break;
|
|
127
|
-
}
|
|
128
|
-
}
|
|
129
|
-
}
|
|
130
|
-
controlSetChecked(checked, e) {
|
|
131
|
-
if (!this.control)
|
|
132
|
-
return;
|
|
133
|
-
if (this.disabled) {
|
|
134
|
-
this.internals.setFormValue(null);
|
|
135
|
-
}
|
|
136
|
-
else {
|
|
137
|
-
this.control.checked = this.checked = checked;
|
|
138
|
-
this.internals.setFormValue(this.checked ? this.control.value : null);
|
|
139
|
-
if (e) {
|
|
140
|
-
const isCheckbox = this.type === 'checkbox';
|
|
141
|
-
const isRadioAndChecked = this.type === 'radio' && this.checked;
|
|
142
|
-
// https://developer.mozilla.org/en-US/docs/Web/HTML/Element/input/checkbox
|
|
143
|
-
// https://developer.mozilla.org/en-US/docs/Web/HTML/Element/input/radio
|
|
144
|
-
// if an event parameter is given and a native control would fire an event, emit the corresponding event to the light dom
|
|
145
|
-
if (isCheckbox || isRadioAndChecked)
|
|
146
|
-
this[this.EVENT_MAP[e.type]].emit({ state: this.checked, value: this.value });
|
|
147
|
-
}
|
|
148
|
-
}
|
|
149
|
-
}
|
|
150
|
-
groupCollectMembers() {
|
|
151
|
-
var _a, _b;
|
|
152
|
-
if (this.type === 'radio' && this.name) {
|
|
153
|
-
this.group.hosts = Array.from(document.querySelectorAll(`post-card-control[type="radio"][name="${this.name}"]`));
|
|
154
|
-
this.group.members = this.group.hosts
|
|
155
|
-
.map(m => m.shadowRoot.querySelector('input[type="radio"]'))
|
|
156
|
-
.filter(m => m !== null);
|
|
157
|
-
if (this.group.members.length > 1) {
|
|
158
|
-
this.group.first = this.group.members[0];
|
|
159
|
-
this.group.last = this.group.members[this.group.members.length - 1];
|
|
160
|
-
this.group.checked = (_a = this.group.members.find(m => m.checked)) !== null && _a !== void 0 ? _a : null;
|
|
161
|
-
this.group.focused =
|
|
162
|
-
(_b = this.group.members.find(m => m.getRootNode().host === document.activeElement)) !== null && _b !== void 0 ? _b : this.group.first;
|
|
163
|
-
const focusableMember = this.group.checked || this.group.focused || this.group.first;
|
|
164
|
-
this.group.members.forEach(m => {
|
|
165
|
-
m.tabIndex = m === focusableMember ? 0 : -1;
|
|
166
|
-
});
|
|
167
|
-
}
|
|
168
|
-
}
|
|
169
|
-
}
|
|
170
|
-
groupGetPrev() {
|
|
171
|
-
var _a;
|
|
172
|
-
const focusedIndex = this.group.members.findIndex(m => m.id === this.group.focused.id);
|
|
173
|
-
return (_a = this.group.members.find((_m, i) => i === focusedIndex - 1)) !== null && _a !== void 0 ? _a : this.group.last;
|
|
174
|
-
}
|
|
175
|
-
groupGetNext() {
|
|
176
|
-
var _a;
|
|
177
|
-
const focusedIndex = this.group.members.findIndex(m => m.id === this.group.focused.id);
|
|
178
|
-
return (_a = this.group.members.find((_m, i) => i === focusedIndex + 1)) !== null && _a !== void 0 ? _a : this.group.first;
|
|
179
|
-
}
|
|
180
|
-
groupSetChecked(newChecked, e) {
|
|
181
|
-
if (this.group.members.length > 1) {
|
|
182
|
-
const isKeyboardEvent = e.type === 'keydown';
|
|
183
|
-
const newIsAriaDisabled = newChecked.hasAttribute('aria-disabled');
|
|
184
|
-
const newIndex = this.group.members.findIndex(m => m === newChecked);
|
|
185
|
-
if (isKeyboardEvent)
|
|
186
|
-
newChecked.focus();
|
|
187
|
-
// if new is disabled, do not reset/set anything
|
|
188
|
-
if (!newIsAriaDisabled) {
|
|
189
|
-
// reset all group members but the newChecked
|
|
190
|
-
this.group.hosts
|
|
191
|
-
.filter((_h, i) => i !== newIndex)
|
|
192
|
-
.forEach(h => {
|
|
193
|
-
h.groupReset();
|
|
194
|
-
});
|
|
195
|
-
// if method was called by keyboard event, select newChecked
|
|
196
|
-
// else this has already been done by clicking on the newChecked element already
|
|
197
|
-
if (isKeyboardEvent)
|
|
198
|
-
newChecked.click();
|
|
199
|
-
}
|
|
200
|
-
}
|
|
201
|
-
}
|
|
202
|
-
// remove as soon as all browser support :host-context()
|
|
203
|
-
// https://caniuse.com/?search=%3Ahost-context()
|
|
204
|
-
setHostContext() {
|
|
205
|
-
let bgContext;
|
|
206
|
-
const possibleBgContexts = window
|
|
207
|
-
.getComputedStyle(this.host)
|
|
208
|
-
.getPropertyValue('--post-card-control-bg-context')
|
|
209
|
-
.split(', ');
|
|
210
|
-
let formContext;
|
|
211
|
-
const possibleFromContexts = ['fieldset'];
|
|
212
|
-
let element = this.host;
|
|
213
|
-
while (element && (!bgContext || !formContext)) {
|
|
214
|
-
bgContext = bgContext !== null && bgContext !== void 0 ? bgContext : possibleBgContexts.find(selector => element.matches(selector));
|
|
215
|
-
formContext = formContext !== null && formContext !== void 0 ? formContext : possibleFromContexts.find(selector => element.matches(selector));
|
|
216
|
-
element = element.parentElement;
|
|
217
|
-
}
|
|
218
|
-
const hostContext = [bgContext, formContext].filter(context => !!context).join(' ');
|
|
219
|
-
this.host.setAttribute('data-context', hostContext);
|
|
220
|
-
}
|
|
221
|
-
connectedCallback() {
|
|
222
|
-
this.initialChecked = this.checked;
|
|
223
|
-
}
|
|
224
|
-
componentWillRender() {
|
|
225
|
-
this.hasIcon = Boolean(this.host.querySelector('[slot="icon"]') || this.icon);
|
|
226
|
-
}
|
|
227
|
-
render() {
|
|
228
|
-
return (h(Host, { key: 'd5a554358103f47b5294dc5f6e21e41a78ec383f', "data-version": version, onClick: this.cardClickHandler }, h("div", { key: 'd9bd511744e04792f456ab2e22c0f48ea8f3234b', class: {
|
|
229
|
-
'card-control': true,
|
|
230
|
-
'is-checked': this.checked,
|
|
231
|
-
'is-disabled': this.disabled,
|
|
232
|
-
'is-focused': this.focused,
|
|
233
|
-
'is-valid': this.validity !== null && this.validity !== 'false',
|
|
234
|
-
'is-invalid': this.validity === 'false',
|
|
235
|
-
} }, 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' })))));
|
|
236
|
-
}
|
|
237
|
-
componentDidRender() {
|
|
238
|
-
this.setHostContext();
|
|
239
|
-
this.groupCollectMembers();
|
|
240
|
-
}
|
|
241
|
-
componentDidLoad() {
|
|
242
|
-
this.validateControlLabel();
|
|
243
|
-
this.validateControlType();
|
|
244
|
-
}
|
|
245
|
-
// https://stenciljs.com/docs/form-associated
|
|
246
|
-
/* eslint-disable @stencil-community/own-methods-must-be-private */
|
|
247
|
-
formAssociatedCallback() {
|
|
248
|
-
this.controlSetChecked(this.checked);
|
|
249
|
-
}
|
|
250
|
-
formDisabledCallback(disabled) {
|
|
251
|
-
this.disabled = disabled;
|
|
252
|
-
}
|
|
253
|
-
formStateRestoreCallback(checked) {
|
|
254
|
-
this.controlSetChecked(checked);
|
|
255
|
-
}
|
|
256
|
-
formResetCallback() {
|
|
257
|
-
this.reset();
|
|
258
|
-
}
|
|
259
|
-
static get formAssociated() { return true; }
|
|
260
|
-
get host() { return getElement(this); }
|
|
261
|
-
static get watchers() { return {
|
|
262
|
-
"label": ["validateControlLabel"],
|
|
263
|
-
"type": ["validateControlType"],
|
|
264
|
-
"checked": ["updateControlChecked"],
|
|
265
|
-
"disabled": ["updateControlDisabled"]
|
|
266
|
-
}; }
|
|
267
|
-
};
|
|
268
|
-
PostCardControl.style = PostCardControlStyle0;
|
|
269
|
-
|
|
270
|
-
export { PostCardControl as P };
|