@swisspost/design-system-components 9.0.0-next.18 → 9.0.0-next.19
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/dist/cjs/{check-url-1ff4cf75.js → check-url-4c524d85.js} +1 -1
- package/dist/cjs/{index-f2eedfeb.js → index-d4222dcb.js} +1 -1
- package/dist/cjs/index.cjs.js +22 -22
- package/dist/cjs/loader.cjs.js +1 -1
- package/dist/cjs/{package-5e20c234.js → package-1403e51d.js} +1 -1
- package/dist/cjs/{post-accordion-75c0c474.js → post-accordion-e84c9d23.js} +1 -1
- package/dist/cjs/{post-accordion-item-1157ea24.js → post-accordion-item-d1ef00c3.js} +3 -3
- package/dist/cjs/post-accordion-item.cjs.entry.js +4 -4
- package/dist/cjs/post-accordion.cjs.entry.js +2 -2
- package/dist/cjs/{post-avatar-35dcad67.js → post-avatar-7a8860df.js} +1 -1
- package/dist/cjs/post-avatar.cjs.entry.js +2 -2
- package/dist/cjs/{post-back-to-top-4de4041e.js → post-back-to-top-6c7057f9.js} +2 -2
- package/dist/cjs/post-back-to-top.cjs.entry.js +2 -2
- package/dist/cjs/{post-banner-2114b7e3.js → post-banner-ecc46714.js} +3 -3
- package/dist/cjs/post-banner.cjs.entry.js +4 -4
- package/dist/cjs/{post-breadcrumb-5bfcf477.js → post-breadcrumb-dbb85db9.js} +2 -2
- package/dist/cjs/post-breadcrumb-item_2.cjs.entry.js +4 -4
- package/dist/cjs/post-breadcrumb.cjs.entry.js +3 -3
- package/dist/cjs/{post-card-control-404ee898.js → post-card-control-76f6a5b3.js} +1 -1
- package/dist/cjs/post-card-control.cjs.entry.js +2 -2
- package/dist/cjs/post-closebutton_15.cjs.entry.js +4 -4
- package/dist/cjs/{post-collapsible-trigger-476cb22d.js → post-collapsible-trigger-8b242323.js} +2 -2
- package/dist/cjs/post-collapsible_2.cjs.entry.js +4 -4
- package/dist/cjs/post-components.cjs.js +1 -1
- package/dist/cjs/{post-footer-4318962c.js → post-footer-eeec84e0.js} +1 -1
- package/dist/cjs/post-footer.cjs.entry.js +2 -2
- package/dist/cjs/post-linkarea-61dbfe5d.js +30 -0
- package/dist/cjs/post-linkarea.cjs.entry.js +2 -2
- package/dist/cjs/{post-menu-item-bce515b2.js → post-menu-item-12639f7c.js} +2 -2
- package/dist/cjs/{post-popover-5363267c.js → post-popover-9569b144.js} +2 -2
- package/dist/cjs/post-popover.cjs.entry.js +2 -2
- package/dist/cjs/{post-rating-a3f7c5df.js → post-rating-5645cae4.js} +2 -2
- package/dist/cjs/post-rating.cjs.entry.js +2 -2
- package/dist/cjs/{post-tab-header-68fcb0ed.js → post-tab-header-82e8ccd0.js} +3 -3
- package/dist/cjs/post-tab-header.cjs.entry.js +2 -2
- package/dist/cjs/{post-tab-panel-909efe62.js → post-tab-panel-ef3df53e.js} +2 -2
- package/dist/cjs/post-tab-panel.cjs.entry.js +2 -2
- package/dist/cjs/{post-tabs-8515f7a8.js → post-tabs-8f1e74d9.js} +2 -2
- package/dist/cjs/post-tabs.cjs.entry.js +2 -2
- package/dist/cjs/{post-tag-f66f6506.js → post-tag-c353e30c.js} +2 -2
- package/dist/cjs/post-tag.cjs.entry.js +2 -2
- package/dist/cjs/{post-togglebutton-c773c4f5.js → post-togglebutton-8949d278.js} +341 -171
- package/dist/cjs/{post-tooltip-dc0fef88.js → post-tooltip-cf18ac29.js} +4 -4
- package/dist/cjs/post-tooltip.cjs.entry.js +4 -4
- package/dist/collection/components/post-accordion-item/post-accordion-item.css +1 -1
- package/dist/collection/components/post-back-to-top/post-back-to-top.css +1 -1
- package/dist/collection/components/post-banner/post-banner.css +1 -1
- package/dist/collection/components/post-header/post-header.css +1 -1
- package/dist/collection/components/post-header/post-header.js +10 -2
- package/dist/collection/components/post-icon/post-icon.js +41 -37
- package/dist/collection/components/post-language-option/post-language-option.css +1 -1
- package/dist/collection/components/post-language-option/post-language-option.js +1 -25
- package/dist/collection/components/post-language-switch/post-language-switch.css +1 -1
- package/dist/collection/components/post-language-switch/post-language-switch.js +8 -40
- package/dist/collection/components/post-language-switch/switch-variants.js +0 -1
- package/dist/collection/components/post-linkarea/post-linkarea.js +12 -14
- package/dist/collection/components/post-list/post-list.js +2 -2
- package/dist/collection/components/post-mainnavigation/post-mainnavigation.css +1 -1
- package/dist/collection/components/post-mainnavigation/post-mainnavigation.js +55 -34
- package/dist/collection/components/post-megadropdown/post-megadropdown.css +1 -1
- package/dist/collection/components/post-megadropdown/post-megadropdown.js +64 -21
- package/dist/collection/components/post-megadropdown-trigger/post-megadropdown-trigger.js +24 -2
- package/dist/collection/components/post-menu/post-menu.js +17 -13
- package/dist/collection/components/post-menu-trigger/post-menu-trigger.js +13 -7
- package/dist/collection/components/post-popover/post-popover.css +1 -1
- package/dist/collection/components/post-popovercontainer/post-popovercontainer.css +1 -1
- package/dist/collection/components/post-popovercontainer/post-popovercontainer.js +141 -33
- package/dist/collection/components/post-rating/post-rating.js +1 -1
- package/dist/collection/components/post-tab-header/post-tab-header.css +1 -1
- package/dist/collection/components/post-tab-header/post-tab-header.js +1 -1
- package/dist/collection/components/post-tab-panel/post-tab-panel.js +1 -1
- package/dist/collection/components/post-tabs/post-tabs.js +1 -1
- package/dist/collection/components/post-tag/post-tag.js +1 -1
- package/dist/collection/components/post-togglebutton/post-togglebutton.js +1 -1
- package/dist/collection/components/post-tooltip/post-tooltip.css +1 -1
- package/dist/collection/components/post-tooltip/post-tooltip.js +1 -1
- package/dist/collection/utils/property-checkers/check-url.js +1 -1
- package/dist/components/index2.js +1 -1
- package/dist/components/package.js +1 -1
- package/dist/components/post-accordion-item2.js +1 -1
- package/dist/components/post-back-to-top2.js +1 -1
- package/dist/components/post-banner2.js +1 -1
- package/dist/components/post-header2.js +11 -3
- package/dist/components/post-icon2.js +41 -37
- package/dist/components/post-language-option2.js +2 -4
- package/dist/components/post-language-switch2.js +10 -19
- package/dist/components/post-linkarea2.js +11 -13
- package/dist/components/post-list2.js +2 -2
- package/dist/components/post-mainnavigation2.js +57 -36
- package/dist/components/post-megadropdown-trigger2.js +24 -2
- package/dist/components/post-megadropdown2.js +42 -19
- package/dist/components/post-menu-trigger2.js +13 -7
- package/dist/components/post-menu2.js +17 -13
- package/dist/components/post-popover2.js +1 -1
- package/dist/components/post-popovercontainer2.js +125 -33
- package/dist/components/post-rating2.js +1 -1
- package/dist/components/post-tab-header2.js +2 -2
- package/dist/components/post-tab-panel2.js +1 -1
- package/dist/components/post-tabs2.js +1 -1
- package/dist/components/post-tag2.js +1 -1
- package/dist/components/post-togglebutton2.js +1 -1
- package/dist/components/post-tooltip2.js +2 -2
- package/dist/docs.json +69 -79
- package/dist/esm/{check-url-8ab230de.js → check-url-f84034b1.js} +1 -1
- package/dist/esm/{index-0aec278f.js → index-1b263a63.js} +1 -1
- package/dist/esm/index.js +22 -22
- package/dist/esm/loader.js +1 -1
- package/dist/esm/package-21cb9eb8.js +3 -0
- package/dist/esm/{post-accordion-e5330c72.js → post-accordion-db14e23a.js} +1 -1
- package/dist/esm/{post-accordion-item-4e13a044.js → post-accordion-item-c1f42c05.js} +3 -3
- package/dist/esm/post-accordion-item.entry.js +4 -4
- package/dist/esm/post-accordion.entry.js +2 -2
- package/dist/esm/{post-avatar-d6612e0e.js → post-avatar-ccda94eb.js} +1 -1
- package/dist/esm/post-avatar.entry.js +2 -2
- package/dist/esm/{post-back-to-top-d5b3d5f5.js → post-back-to-top-f038d599.js} +2 -2
- package/dist/esm/post-back-to-top.entry.js +2 -2
- package/dist/esm/{post-banner-ae45a03b.js → post-banner-a24ccf11.js} +3 -3
- package/dist/esm/post-banner.entry.js +4 -4
- package/dist/esm/{post-breadcrumb-c7caf609.js → post-breadcrumb-e3e4b50c.js} +2 -2
- package/dist/esm/post-breadcrumb-item_2.entry.js +4 -4
- package/dist/esm/post-breadcrumb.entry.js +3 -3
- package/dist/esm/{post-card-control-c51f4406.js → post-card-control-0a4497d8.js} +1 -1
- package/dist/esm/post-card-control.entry.js +2 -2
- package/dist/esm/post-closebutton_15.entry.js +4 -4
- package/dist/esm/{post-collapsible-trigger-e086c018.js → post-collapsible-trigger-6b0253d8.js} +2 -2
- package/dist/esm/post-collapsible_2.entry.js +4 -4
- package/dist/esm/post-components.js +1 -1
- package/dist/esm/{post-footer-fac4e9a3.js → post-footer-fa4a2a32.js} +1 -1
- package/dist/esm/post-footer.entry.js +2 -2
- package/dist/esm/post-linkarea-1458faa8.js +28 -0
- package/dist/esm/post-linkarea.entry.js +2 -2
- package/dist/esm/{post-menu-item-bdfe59ae.js → post-menu-item-b9af8b46.js} +2 -2
- package/dist/esm/{post-popover-15208f18.js → post-popover-425eb5c9.js} +2 -2
- package/dist/esm/post-popover.entry.js +2 -2
- package/dist/esm/{post-rating-261def37.js → post-rating-4057a5b5.js} +2 -2
- package/dist/esm/post-rating.entry.js +2 -2
- package/dist/esm/{post-tab-header-f2e84ba5.js → post-tab-header-602eb0cb.js} +3 -3
- package/dist/esm/post-tab-header.entry.js +2 -2
- package/dist/esm/{post-tab-panel-389e0709.js → post-tab-panel-fccea5b6.js} +2 -2
- package/dist/esm/post-tab-panel.entry.js +2 -2
- package/dist/esm/{post-tabs-79ea5b62.js → post-tabs-b9f41051.js} +2 -2
- package/dist/esm/post-tabs.entry.js +2 -2
- package/dist/esm/{post-tag-887d422c.js → post-tag-54b70906.js} +2 -2
- package/dist/esm/post-tag.entry.js +2 -2
- package/dist/esm/{post-togglebutton-70b0f44e.js → post-togglebutton-f6746062.js} +341 -171
- package/dist/esm/{post-tooltip-1be020fd.js → post-tooltip-eccf3d93.js} +4 -4
- package/dist/esm/post-tooltip.entry.js +4 -4
- package/dist/post-components/index.esm.js +1 -1
- package/dist/post-components/p-0337eb03.entry.js +1 -0
- package/dist/post-components/p-0470d5af.entry.js +1 -0
- package/dist/post-components/p-07b75b18.entry.js +1 -0
- package/dist/post-components/{p-5171e02f.js → p-0d879e8b.js} +1 -1
- package/dist/post-components/{p-6c3ac622.js → p-0f6fee8f.js} +1 -1
- package/dist/post-components/p-114bb8ba.js +1 -0
- package/dist/post-components/{p-99502c06.js → p-18fa847f.js} +1 -1
- package/dist/post-components/{p-fb8f5195.js → p-1c1a614d.js} +1 -1
- package/dist/post-components/p-202156ad.js +1 -0
- package/dist/post-components/p-2f5425e2.entry.js +1 -0
- package/dist/post-components/p-39586235.js +1 -0
- package/dist/post-components/p-3b1c2b8a.entry.js +1 -0
- package/dist/post-components/{p-5f1f7b49.js → p-46accc5f.js} +1 -1
- package/dist/post-components/{p-eb8b3ffa.js → p-470c7464.js} +1 -1
- package/dist/post-components/{p-9b179f0f.js → p-509fc6e6.js} +1 -1
- package/dist/post-components/{p-898d9196.js → p-541c7be9.js} +2 -2
- package/dist/post-components/p-54c98790.js +1 -0
- package/dist/post-components/p-5afa25c7.entry.js +1 -0
- package/dist/post-components/{p-a2ae208a.js → p-5b1c57d5.js} +1 -1
- package/dist/post-components/p-5cf79fe3.entry.js +1 -0
- package/dist/post-components/p-5d9c1fc3.entry.js +1 -0
- package/dist/post-components/p-608ba689.entry.js +1 -0
- package/dist/post-components/p-64776810.entry.js +1 -0
- package/dist/post-components/{p-bff8004e.js → p-6651164c.js} +1 -1
- package/dist/post-components/p-7085e0e7.entry.js +1 -0
- package/dist/post-components/{p-76257bba.entry.js → p-7bf39758.entry.js} +1 -1
- package/dist/post-components/p-7dc1ccf0.entry.js +1 -0
- package/dist/post-components/p-81eac2e5.entry.js +1 -0
- package/dist/post-components/p-8a31b2fc.entry.js +1 -0
- package/dist/post-components/p-8e7e9942.entry.js +1 -0
- package/dist/post-components/p-a24bf798.js +1 -0
- package/dist/post-components/p-a621090d.js +1 -0
- package/dist/post-components/p-a926c755.js +1 -0
- package/dist/post-components/{p-e7bec3de.js → p-b27b7d03.js} +1 -1
- package/dist/post-components/{p-74122649.js → p-b8100b63.js} +1 -1
- package/dist/post-components/p-c48553bd.entry.js +1 -0
- package/dist/post-components/{p-dc8af283.js → p-cb472e20.js} +1 -1
- package/dist/post-components/p-cea81e00.entry.js +1 -0
- package/dist/post-components/p-d2d2681a.js +1 -0
- package/dist/post-components/{p-ce34c58e.js → p-d8b179fb.js} +1 -1
- package/dist/post-components/p-f405f29e.entry.js +1 -0
- package/dist/post-components/post-components.esm.js +1 -1
- package/dist/types/components/post-header/post-header.d.ts +1 -0
- package/dist/types/components/post-icon/post-icon.d.ts +5 -0
- package/dist/types/components/post-language-option/post-language-option.d.ts +1 -5
- package/dist/types/components/post-language-switch/post-language-switch.d.ts +2 -7
- package/dist/types/components/post-language-switch/switch-variants.d.ts +0 -2
- package/dist/types/components/post-linkarea/post-linkarea.d.ts +2 -2
- package/dist/types/components/post-mainnavigation/post-mainnavigation.d.ts +2 -5
- package/dist/types/components/post-megadropdown/post-megadropdown.d.ts +12 -5
- package/dist/types/components/post-megadropdown-trigger/post-megadropdown-trigger.d.ts +6 -0
- package/dist/types/components/post-menu-trigger/post-menu-trigger.d.ts +2 -1
- package/dist/types/components/post-popovercontainer/post-popovercontainer.d.ts +15 -1
- package/dist/types/components.d.ts +17 -24
- package/loaders/index2.js +1 -1
- package/loaders/package.js +1 -1
- package/loaders/post-accordion-item2.js +1 -1
- package/loaders/post-back-to-top.js +1 -1
- package/loaders/post-banner.js +1 -1
- package/loaders/post-header.js +11 -3
- package/loaders/post-icon2.js +41 -37
- package/loaders/post-language-option.js +2 -4
- package/loaders/post-language-switch.js +10 -19
- package/loaders/post-linkarea.js +11 -13
- package/loaders/post-list.js +2 -2
- package/loaders/post-mainnavigation.js +57 -36
- package/loaders/post-megadropdown-trigger.js +24 -2
- package/loaders/post-megadropdown.js +42 -19
- package/loaders/post-menu-trigger2.js +13 -7
- package/loaders/post-menu2.js +17 -13
- package/loaders/post-popover.js +1 -1
- package/loaders/post-popovercontainer2.js +125 -33
- package/loaders/post-rating.js +1 -1
- package/loaders/post-tab-header.js +2 -2
- package/loaders/post-tab-panel.js +1 -1
- package/loaders/post-tabs.js +1 -1
- package/loaders/post-tag.js +1 -1
- package/loaders/post-togglebutton.js +1 -1
- package/loaders/post-tooltip.js +2 -2
- package/package.json +3 -3
- package/dist/cjs/post-linkarea-abe3848a.js +0 -32
- package/dist/esm/package-52c62831.js +0 -3
- package/dist/esm/post-linkarea-12db6e2a.js +0 -30
- package/dist/post-components/p-14312d05.entry.js +0 -1
- package/dist/post-components/p-19aa8e97.entry.js +0 -1
- package/dist/post-components/p-19d9ae56.entry.js +0 -1
- package/dist/post-components/p-3a8aa86c.entry.js +0 -1
- package/dist/post-components/p-4575b6be.js +0 -1
- package/dist/post-components/p-47e21420.js +0 -1
- package/dist/post-components/p-4f608797.entry.js +0 -1
- package/dist/post-components/p-59373941.js +0 -1
- package/dist/post-components/p-5c5b1fc0.entry.js +0 -1
- package/dist/post-components/p-7a7ce5d1.js +0 -1
- package/dist/post-components/p-7ed1123b.entry.js +0 -1
- package/dist/post-components/p-7ff34767.js +0 -1
- package/dist/post-components/p-82e405cc.entry.js +0 -1
- package/dist/post-components/p-98c7bec2.entry.js +0 -1
- package/dist/post-components/p-9f202ea3.entry.js +0 -1
- package/dist/post-components/p-a24295d5.entry.js +0 -1
- package/dist/post-components/p-bac3cb12.js +0 -1
- package/dist/post-components/p-bd85e141.js +0 -1
- package/dist/post-components/p-c9c86df8.entry.js +0 -1
- package/dist/post-components/p-d3c4e8ea.entry.js +0 -1
- package/dist/post-components/p-d72abd74.entry.js +0 -1
- package/dist/post-components/p-dfcee8dc.entry.js +0 -1
- package/dist/post-components/p-e0c0467e.entry.js +0 -1
- package/dist/post-components/p-f41b0150.entry.js +0 -1
- package/dist/post-components/p-f580d6dd.entry.js +0 -1
- package/dist/post-components/p-ff065ad4.js +0 -1
package/loaders/post-banner.js
CHANGED
|
@@ -9,7 +9,7 @@ import { c as checkNonEmpty } from './check-non-empty.js';
|
|
|
9
9
|
|
|
10
10
|
const BANNER_TYPES = ['neutral', 'success', 'warning', 'danger', 'info'];
|
|
11
11
|
|
|
12
|
-
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:var(--post-core-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{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)}@media (forced-colors: active),(-ms-high-contrast: active),(-ms-high-contrast: white-on-black){.banner:not(.no-icon)::before,.alert:not(.no-icon)::before{color:CanvasText}}.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) + var(--post-core-dimension-24));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:var(--post-core-dimension-4)}.banner:not(.banner-action):not(.alert-action) a,.alert:not(.banner-action):not(.alert-action) a{font-weight:var(--post-core-font-weight-400)}.banner:not(.banner-action):not(.alert-action) hr,.alert:not(.banner-action):not(.alert-action) hr{margin-block:var(--post-core-dimension-8) var(--post-core-dimension-12) !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) + var(--post-core-dimension-24))}.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:var(--post-core-dimension-4)}.banner-action>.banner-content a,.banner-action>.alert-content a,.alert-action>.banner-content a,.alert-action>.alert-content a{font-weight:var(--post-core-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:var(--post-core-dimension-8) var(--post-core-dimension-12) !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)var(--post-core-dimension-24)}.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{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)}@media (forced-colors: active),(-ms-high-contrast: active),(-ms-high-contrast: white-on-black){.banner-neutral:not(.no-icon)::before,.alert-neutral:not(.no-icon)::before{color:CanvasText}}.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{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)}@media (forced-colors: active),(-ms-high-contrast: active),(-ms-high-contrast: white-on-black){.banner-success:not(.no-icon)::before,.alert-success:not(.no-icon)::before{color:CanvasText}}.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{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)}@media (forced-colors: active),(-ms-high-contrast: active),(-ms-high-contrast: white-on-black){.banner-warning:not(.no-icon)::before,.alert-warning:not(.no-icon)::before{color:CanvasText}}.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{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)}@media (forced-colors: active),(-ms-high-contrast: active),(-ms-high-contrast: white-on-black){.banner-error:not(.no-icon)::before,.alert-error:not(.no-icon)::before{color:CanvasText}}.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{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)}@media (forced-colors: active),(-ms-high-contrast: active),(-ms-high-contrast: white-on-black){.banner-info:not(.no-icon)::before,.alert-info:not(.no-icon)::before{color:CanvasText}}.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{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)}@media (forced-colors: active),(-ms-high-contrast: active),(-ms-high-contrast: white-on-black){.banner-danger:not(.no-icon)::before,.alert-danger:not(.no-icon)::before{color:CanvasText}}.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{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:var(--post-core-dimension-24);width:var(--post-core-dimension-24)}.btn-close:focus,.btn-close:not(:disabled):hover,.pretend-hover.btn-close{color:#000}.btn-close:disabled{color:#999}@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}";
|
|
12
|
+
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:var(--post-core-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{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)}@media (forced-colors: active),(-ms-high-contrast: active),(-ms-high-contrast: white-on-black){.banner:not(.no-icon)::before,.alert:not(.no-icon)::before{color:CanvasText}}.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) + var(--post-core-dimension-24));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:var(--post-core-dimension-4)}.banner:not(.banner-action):not(.alert-action) a,.alert:not(.banner-action):not(.alert-action) a{font-weight:var(--post-core-font-weight-400)}.banner:not(.banner-action):not(.alert-action) hr,.alert:not(.banner-action):not(.alert-action) hr{margin-block:var(--post-core-dimension-8) var(--post-core-dimension-12) !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) + var(--post-core-dimension-24))}.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:var(--post-core-dimension-4)}.banner-action>.banner-content a,.banner-action>.alert-content a,.alert-action>.banner-content a,.alert-action>.alert-content a{font-weight:var(--post-core-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:var(--post-core-dimension-8) var(--post-core-dimension-12) !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)var(--post-core-dimension-24)}.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{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)}@media (forced-colors: active),(-ms-high-contrast: active),(-ms-high-contrast: white-on-black){.banner-neutral:not(.no-icon)::before,.alert-neutral:not(.no-icon)::before{color:CanvasText}}.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{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)}@media (forced-colors: active),(-ms-high-contrast: active),(-ms-high-contrast: white-on-black){.banner-success:not(.no-icon)::before,.alert-success:not(.no-icon)::before{color:CanvasText}}.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{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)}@media (forced-colors: active),(-ms-high-contrast: active),(-ms-high-contrast: white-on-black){.banner-warning:not(.no-icon)::before,.alert-warning:not(.no-icon)::before{color:CanvasText}}.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{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)}@media (forced-colors: active),(-ms-high-contrast: active),(-ms-high-contrast: white-on-black){.banner-error:not(.no-icon)::before,.alert-error:not(.no-icon)::before{color:CanvasText}}.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{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)}@media (forced-colors: active),(-ms-high-contrast: active),(-ms-high-contrast: white-on-black){.banner-info:not(.no-icon)::before,.alert-info:not(.no-icon)::before{color:CanvasText}}.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{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)}@media (forced-colors: active),(-ms-high-contrast: active),(-ms-high-contrast: white-on-black){.banner-danger:not(.no-icon)::before,.alert-danger:not(.no-icon)::before{color:CanvasText}}.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:var(--post-scheme-color-interactive-button-secondary-enabled-fg);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}@media (forced-colors: active),(-ms-high-contrast: active),(-ms-high-contrast: white-on-black){.btn-close{background-color:ButtonFace !important}.btn-close:hover{background-color:Highlight !important}}.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{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:var(--post-core-dimension-24);width:var(--post-core-dimension-24)}.btn-close:focus,.btn-close:not(:disabled):hover,.pretend-hover.btn-close{color:#000}.btn-close:disabled{color:#999}@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}";
|
|
13
13
|
const PostBannerStyle0 = postBannerCss;
|
|
14
14
|
|
|
15
15
|
const PostBanner$1 = /*@__PURE__*/ proxyCustomElement(class PostBanner extends HTMLElement {
|
package/loaders/post-header.js
CHANGED
|
@@ -4,7 +4,7 @@ import { v as version } from './package.js';
|
|
|
4
4
|
import { s as slideUp, a as slideDown } from './slide.js';
|
|
5
5
|
import { g as getFocusableChildren } from './get-focusable-children.js';
|
|
6
6
|
|
|
7
|
-
const postHeaderCss = "*,::before,::after{box-sizing:border-box}:host{z-index:
|
|
7
|
+
const postHeaderCss = "*,::before,::after{box-sizing:border-box}:host{z-index:1020;position:relative}:host(:not(:has([slot=title]))) .local-header{padding-block-start:0}:host(:not(:has([slot=title]))) .local-sub{display:none}.d-flex{display:flex}.space-between{justify-content:space-between}.global-header{background-color:#fc0;display:flex;justify-content:space-between;position:sticky;padding-inline:4px;height:var(--global-header-height)}@media screen and (max-width: 1023.98px){.global-header{z-index:3;inset-block-start:0}}@media screen and (min-width: 1024px){.global-header{z-index:5;padding-inline-end:12px;inset-block-start:calc((var(--global-header-height) - var(--global-header-reduced-height))*-1)}}.global-sub{display:flex;align-items:center;gap:24px}.align-end{align-items:flex-end}.logo{flex:1 0 auto;height:var(--global-header-height);width:var(--global-header-height);min-height:var(--global-header-reduced-height);align-self:flex-end}@media screen and (min-width: 1024px){.logo{height:calc(var(--global-header-height) - var(--header-scroll-top))}}::slotted(ul){margin-block:0 !important;list-style:none;display:flex;padding-left:0;gap:1rem;flex-shrink:0 !important}.local-header{display:flex;position:sticky;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:4px;min-height:var(--local-header-min-height);background:#fff;transition:box-shadow .2s ease-in-out;border-block-end:1px solid #e1e0dc}@media screen and (min-width: 1024px){.local-header{z-index:3;inset-block-start:calc(-1*(var(--local-header-height) - var(--main-navigation-height)) + var(--global-header-reduced-height));padding-block-start:18px;box-shadow:var(--post-device-elevation-300)}}@media screen and (max-width: 1023.98px){.local-header{z-index:2;inset-block-start:var(--global-header-height);padding-block:9px;flex-wrap:wrap}.local-header.local-header-mobile-extended{border-bottom:1px solid #e1e0dc}.local-header:not(.local-header-mobile-extended){box-shadow:var(--post-device-elevation-300)}}.local-sub{margin-inline-end:16px}::slotted(.list-inline){margin:-8px 0 !important;z-index:3 !important;position:relative !important}::slotted(h1){margin:0 !important;flex-shrink:10;z-index:3}@media screen and (min-width: 600px){::slotted(h1){margin-inline-start:12px !important}}@media screen and (max-width: 599.98px){::slotted(h1){margin-inline-start:8px !important}}@media screen and (min-width: 1024px){::slotted(h1){font-size:28px !important}}@media screen and (max-width: 1023.98px){::slotted(h1){font-size:20px !important;max-width:calc(100vw - 8px - 16px)}}@media screen and (min-width: 1024px){.mobile-toggle{display:none}}.navigation{width:100%}@media screen and (min-width: 1024px){.navigation{inset-block-start:var(--global-header-reduced-height)}.navigation::before{display:block;content:\"\";position:absolute;inset:0;z-index:2;background:#fff}}@media screen and (max-width: 1023.98px){.navigation{position:fixed;z-index:1;inset-inline:0;background:#fff;inset-block-end:calc(100vh - var(--header-height))}::slotted(post-mainnavigation),.navigation-footer{display:none;flex-direction:column;padding-block:16px 24px;padding-inline:32px}.navigation.extended ::slotted(post-mainnavigation),.navigation.extended .navigation-footer{display:flex}.navigation.extended{height:calc(100vh - var(--header-height));display:flex;flex-direction:column}.navigation.extended ::slotted(post-mainnavigation){flex-grow:1 !important}::slotted(post-mainnavigation){background-color:#fafafa;gap:32px}.navigation-footer{background-color:#f0efed;gap:24px}}@media screen and (max-width: 599.98px){::slotted(post-mainnavigation),.navigation-footer{padding-inline:16px}}";
|
|
8
8
|
const PostHeaderStyle0 = postHeaderCss;
|
|
9
9
|
|
|
10
10
|
const PostHeader$1 = /*@__PURE__*/ proxyCustomElement(class PostHeader extends HTMLElement {
|
|
@@ -34,6 +34,14 @@ const PostHeader$1 = /*@__PURE__*/ proxyCustomElement(class PostHeader extends H
|
|
|
34
34
|
componentDidLoad() {
|
|
35
35
|
this.updateLocalHeaderHeight();
|
|
36
36
|
}
|
|
37
|
+
// Clean up possible side effects when post-header is disconnected
|
|
38
|
+
disconnectedCallback() {
|
|
39
|
+
this.mobileMenuExtended = false;
|
|
40
|
+
document.body.style.overflow = '';
|
|
41
|
+
this.host.removeEventListener('keydown', e => {
|
|
42
|
+
this.keyboardHandler(e);
|
|
43
|
+
});
|
|
44
|
+
}
|
|
37
45
|
get host() { return this; }
|
|
38
46
|
frozeBody(isMobileMenuExtended) {
|
|
39
47
|
document.body.style.overflow = isMobileMenuExtended ? 'hidden' : '';
|
|
@@ -134,7 +142,7 @@ const PostHeader$1 = /*@__PURE__*/ proxyCustomElement(class PostHeader extends H
|
|
|
134
142
|
updateLocalHeaderHeight() {
|
|
135
143
|
requestAnimationFrame(() => {
|
|
136
144
|
const mhh = this.host.shadowRoot.querySelector('.local-header')?.clientHeight || 0;
|
|
137
|
-
this.host.style.setProperty('--
|
|
145
|
+
this.host.style.setProperty('--local-header-height', `${mhh}px`);
|
|
138
146
|
});
|
|
139
147
|
}
|
|
140
148
|
handleResize() {
|
|
@@ -179,7 +187,7 @@ const PostHeader$1 = /*@__PURE__*/ proxyCustomElement(class PostHeader extends H
|
|
|
179
187
|
return (h("div", { ref: el => (this.mobileMenu = el), class: navigationClasses.join(' ') }, h("slot", { name: "post-mainnavigation" }), (this.device === 'mobile' || this.device === 'tablet') && (h("div", { class: "navigation-footer" }, h("slot", { name: "meta-navigation" }), h("slot", { name: "post-language-switch" })))));
|
|
180
188
|
}
|
|
181
189
|
render() {
|
|
182
|
-
return (h(Host, { key: '
|
|
190
|
+
return (h(Host, { key: '45452d2c2f6ac9a067ce71330ea898a797040cca', version: version }, h("div", { key: 'c50478141de45d0a718b18c0edc416eb9c832fde', class: "global-header" }, h("div", { key: 'a2ddc2de9a94fb3b16928fe9c1ac3b3ae61ff9bf', class: "global-sub" }, h("div", { key: '30083683ff7683202118471473f2a0ed98a1c920', class: "logo" }, h("slot", { key: '028bd4a8f03a228378b09a80dce8654d52c30e5c', name: "post-logo" }))), h("div", { key: '853bcf2e6c8a95d88f62795cef8d8e58c8996811', class: "global-sub" }, this.device === 'desktop' && h("slot", { key: '40e3027a4e4358b7a614558ed7e1f59fa65ed312', name: "meta-navigation" }), h("slot", { key: '31c141cc45aa12441557d9b817630328df3d3778', name: "global-controls" }), this.device === 'desktop' && h("slot", { key: 'afe4b2c3123a89c1a4390578c22e89dfff7be655', name: "post-language-switch" }), h("div", { key: 'aea74d0c7f25288afa18b5aeb3e557216d695ec3', onClick: () => this.toggleMobileMenu(), class: "mobile-toggle" }, h("slot", { key: '1efed8b7c823ef49b89120ed2e23f151c64b9c0e', name: "post-togglebutton" })))), h("div", { key: 'e09df2136d01c0516d0166f505055615cf1d70d3', class: 'local-header ' + (this.mobileMenuExtended ? 'local-header-mobile-extended' : '') }, h("slot", { key: '491f9bbcb2743519f544b24ae6f00405be85e589', name: "title" }), h("div", { key: 'e85c0a76597832a6966e989111b4508579fb9c4d', class: "local-sub" }, h("slot", { key: 'f2d504ea6a3d7592a15551e6be8cb0c1ba220fbc', name: "local-controls" }), h("slot", { key: 'e0dd0f9c12e0c6bf5d5d66cb29139af59f7c0b4d' })), this.device === 'desktop' && this.renderNavigation()), this.device !== 'desktop' && this.renderNavigation()));
|
|
183
191
|
}
|
|
184
192
|
static get watchers() { return {
|
|
185
193
|
"mobileMenuExtended": ["frozeBody"]
|
package/loaders/post-icon2.js
CHANGED
|
@@ -7,7 +7,7 @@ import { c as checkType } from './check-type.js';
|
|
|
7
7
|
const postIconCss = ":host{display:inline-block;width:1em;height:1em;vertical-align:-0.15em}span{display:block;width:100%;height:100%;fill:currentColor;forced-color-adjust:preserve-parent-color;background-color:currentColor;-webkit-mask-position:center center;mask-position:center center;-webkit-mask-repeat:no-repeat;mask-repeat:no-repeat;-webkit-mask-size:100%;mask-size:100%}:host([flip-h]:not([flip-h=false])){scale:-1 1}:host([flip-v]:not([flip-v=false])){scale:1 -1}:host([flip-h][flip-v]:not([flip-h=false],[flip-v=false])){scale:-1}:host([animation]){transform-origin:center}:host([animation=cylon]){animation:icon-animation-cylon .75s ease-in-out infinite alternate}:host([animation=cylon-vertical]){animation:icon-animation-cylon-vertical .75s ease-in-out infinite alternate}:host([animation=spin]){animation:icon-animation-spin 2s linear infinite normal}:host([animation=spin-reverse]){animation:icon-animation-spin 2s linear infinite reverse}:host([animation=fade]){animation:icon-animation-fade .75s ease-in-out infinite alternate}:host([animation=throb]){animation:icon-animation-throb .75s ease-in-out infinite alternate}@keyframes icon-animation-cylon{from{transform:translateX(-25%)}to{transform:translateX(25%)}}@keyframes icon-animation-cylon-vertical{from{transform:translateY(25%)}to{transform:translateY(-25%)}}@keyframes icon-animation-fade{from{opacity:.1}to{opacity:1}}@keyframes icon-animation-spin{from{transform:rotate(0deg)}to{transform:rotate(359deg)}}@keyframes icon-animation-throb{from{opacity:.5;transform:scale(0.5)}to{opacity:1;transform:scale(1)}}";
|
|
8
8
|
const PostIconStyle0 = postIconCss;
|
|
9
9
|
|
|
10
|
-
const CDN_URL = 'https://unpkg.com/@swisspost/design-system-icons/public/post-icons';
|
|
10
|
+
const CDN_URL = 'https://unpkg.com/@swisspost/design-system-icons/public/post-icons/';
|
|
11
11
|
const ANIMATION_NAMES = [
|
|
12
12
|
'cylon',
|
|
13
13
|
'cylon-vertical',
|
|
@@ -30,6 +30,7 @@ const PostIcon = /*@__PURE__*/ proxyCustomElement(class PostIcon extends HTMLEle
|
|
|
30
30
|
this.rotate = null;
|
|
31
31
|
this.scale = null;
|
|
32
32
|
}
|
|
33
|
+
isSSR = typeof window === 'undefined';
|
|
33
34
|
get host() { return this; }
|
|
34
35
|
validateAnimation(newValue = this.animation) {
|
|
35
36
|
if (newValue !== undefined)
|
|
@@ -56,50 +57,53 @@ const PostIcon = /*@__PURE__*/ proxyCustomElement(class PostIcon extends HTMLEle
|
|
|
56
57
|
}
|
|
57
58
|
// Construct the icon url from different possible sources
|
|
58
59
|
getUrl() {
|
|
60
|
+
let url;
|
|
61
|
+
const file = `${this.name}.svg`;
|
|
59
62
|
// the first definition object which defines a domain, will be used to set the domain of the file url
|
|
60
63
|
// the first definition object which defines a slug, will be used to set the slug of the file url
|
|
61
|
-
const urlDefinitions = [
|
|
62
|
-
|
|
63
|
-
getUrlDefinition(document.head
|
|
64
|
+
const urlDefinitions = [this.getUrlDefinition(this.base, 'both')];
|
|
65
|
+
if (!this.isSSR) {
|
|
66
|
+
urlDefinitions.push(this.getUrlDefinition(document.head
|
|
64
67
|
.querySelector('meta[name="design-system-settings"][data-post-icon-base]')
|
|
65
|
-
?.getAttribute('data-post-icon-base'), 'relative')
|
|
66
|
-
getUrlDefinition(document.querySelector('base[href]')?.getAttribute('href'), 'both')
|
|
67
|
-
|
|
68
|
-
// in case no
|
|
69
|
-
const origin = urlDefinitions.find(d => d.definesDomain)?.url?.origin
|
|
70
|
-
// in case no
|
|
68
|
+
?.getAttribute('data-post-icon-base'), 'relative'));
|
|
69
|
+
urlDefinitions.push(this.getUrlDefinition(document.querySelector('base[href]')?.getAttribute('href'), 'both'));
|
|
70
|
+
}
|
|
71
|
+
// in case no definition defines a domain, a relative url is used to load the icon
|
|
72
|
+
const origin = urlDefinitions.find(d => d.definesDomain)?.url?.origin;
|
|
73
|
+
// in case no definition defines a slug either, the cdn url is used as a fallback
|
|
71
74
|
const slug = urlDefinitions.find(d => d.definesSlug)?.url?.pathname;
|
|
72
|
-
|
|
73
|
-
|
|
74
|
-
|
|
75
|
-
|
|
75
|
+
if (origin && slug) {
|
|
76
|
+
url = `${origin}${slug}${file}`;
|
|
77
|
+
}
|
|
78
|
+
else if (!origin && slug) {
|
|
79
|
+
url = `${slug}${file}`;
|
|
76
80
|
}
|
|
77
81
|
else {
|
|
78
|
-
url =
|
|
82
|
+
url = `${CDN_URL}${file}`;
|
|
79
83
|
}
|
|
80
84
|
return url;
|
|
81
|
-
|
|
82
|
-
|
|
83
|
-
|
|
84
|
-
|
|
85
|
-
|
|
86
|
-
|
|
87
|
-
|
|
88
|
-
|
|
89
|
-
|
|
90
|
-
|
|
91
|
-
|
|
92
|
-
|
|
93
|
-
}
|
|
94
|
-
}
|
|
95
|
-
function definesDomain(url) {
|
|
96
|
-
return url ? /^https?:\/\//.test(url) : false;
|
|
97
|
-
}
|
|
98
|
-
function definesSlug(url) {
|
|
99
|
-
const urlObject = getUrlObject(url);
|
|
100
|
-
return Boolean(/^\/.+/.test(urlObject?.pathname));
|
|
101
|
-
}
|
|
85
|
+
}
|
|
86
|
+
getUrlDefinition(url, allow) {
|
|
87
|
+
return {
|
|
88
|
+
url: this.getUrlObject(url),
|
|
89
|
+
definesDomain: allow !== 'relative' ? this.definesDomain(url) : false,
|
|
90
|
+
definesSlug: allow !== 'absolute' ? this.definesSlug(url) : false,
|
|
91
|
+
};
|
|
92
|
+
}
|
|
93
|
+
getUrlObject(url) {
|
|
94
|
+
if (url) {
|
|
95
|
+
url = url?.endsWith('/') ? url : `${url}/`;
|
|
96
|
+
return new URL(url, 'https://url.base');
|
|
102
97
|
}
|
|
98
|
+
else {
|
|
99
|
+
return null;
|
|
100
|
+
}
|
|
101
|
+
}
|
|
102
|
+
definesDomain(url) {
|
|
103
|
+
return url ? /^https?:\/\//.test(url) : false;
|
|
104
|
+
}
|
|
105
|
+
definesSlug(url) {
|
|
106
|
+
return Boolean(/^\/.+/.test(this.getUrlObject(url)?.pathname));
|
|
103
107
|
}
|
|
104
108
|
getStyles() {
|
|
105
109
|
const url = this.getUrl();
|
|
@@ -122,7 +126,7 @@ const PostIcon = /*@__PURE__*/ proxyCustomElement(class PostIcon extends HTMLEle
|
|
|
122
126
|
this.validateAnimation();
|
|
123
127
|
}
|
|
124
128
|
render() {
|
|
125
|
-
return (h(Host, { key: '
|
|
129
|
+
return (h(Host, { key: '77c38a8fb35ceca1c5cf63fdd44fd9ab23aee62c', "data-version": version }, h("span", { key: 'cc8072420ff881f0d7531ae09bbafad992400296', style: this.getStyles() })));
|
|
126
130
|
}
|
|
127
131
|
static get watchers() { return {
|
|
128
132
|
"animation": ["validateAnimation"],
|
|
@@ -3,7 +3,7 @@ import { c as checkEmptyOrType } from './index2.js';
|
|
|
3
3
|
import { v as version } from './package.js';
|
|
4
4
|
import { c as checkType } from './check-type.js';
|
|
5
5
|
|
|
6
|
-
const postLanguageOptionCss = "/*!\n * Copyright 2021 by Swiss Post, Information Technology\n */post-language-option{display:inline-block}post-language-option button{padding:0;overflow:visible;border:0;background:none;color:
|
|
6
|
+
const postLanguageOptionCss = "/*!\n * Copyright 2021 by Swiss Post, Information Technology\n */post-language-option{display:inline-block}post-language-option button{padding:0;overflow:visible;border:0;background:none;color:var(--post-scheme-color-interactive-button-secondary-enabled-fg);font:inherit;-webkit-user-select:none;user-select:none;appearance:button}@media (forced-colors: active),(-ms-high-contrast: active),(-ms-high-contrast: white-on-black){post-language-option button{background-color:ButtonFace !important}post-language-option button:hover{background-color:Highlight !important}}post-language-option a{color:inherit;text-decoration:none}post-language-option :is(a,button){cursor:pointer;display:flex;align-items:center;justify-content:center;width:100%;height:100%;border-radius:2px;text-transform:uppercase}post-language-option :is(a,button){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-language-option :is(a,button):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-language-option :is(a,button):is(:focus-visible,:has(:focus-visible),.pretend-focus){outline-color:Highlight !important}}@supports not selector(:has(:focus-visible)){post-language-option :is(a,button):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-language-option :is(a,button):is(:focus-visible,:focus-within,.pretend-focus){outline-color:Highlight !important}}}post-language-option:where([variant=list]) :is(a,button){padding-inline:0;width:40px;height:40px;border-radius:2px}post-language-option:where([variant=list]) :is(a,button):hover{color:#504f4b}post-language-option:where([variant=list]):not([active=false]) :is(a,button){background-color:#050400 !important;color:#fff;pointer-events:none}post-language-option:where([variant=list]):not([active=false]) :hover{color:#fff}post-language-option:where([variant=menu]){width:100%}post-language-option:where([variant=menu]):not([active=false]){display:none}post-language-option:where([variant=menu]) :is(a,button){padding-block:13px;padding-inline:24px;box-sizing:border-box;position:relative;left:-1px;width:calc(100% + 2px)}";
|
|
7
7
|
const PostLanguageOptionStyle0 = postLanguageOptionCss;
|
|
8
8
|
|
|
9
9
|
const PostLanguageOption$1 = /*@__PURE__*/ proxyCustomElement(class PostLanguageOption extends HTMLElement {
|
|
@@ -14,7 +14,6 @@ const PostLanguageOption$1 = /*@__PURE__*/ proxyCustomElement(class PostLanguage
|
|
|
14
14
|
this.code = undefined;
|
|
15
15
|
this.active = undefined;
|
|
16
16
|
this.variant = undefined;
|
|
17
|
-
this.type = undefined;
|
|
18
17
|
this.name = undefined;
|
|
19
18
|
this.url = undefined;
|
|
20
19
|
}
|
|
@@ -64,7 +63,7 @@ const PostLanguageOption$1 = /*@__PURE__*/ proxyCustomElement(class PostLanguage
|
|
|
64
63
|
this.emitChange();
|
|
65
64
|
}
|
|
66
65
|
};
|
|
67
|
-
return (h(Host, { key: '
|
|
66
|
+
return (h(Host, { key: 'e13eda12ed933d86c46be60d883d7007de0ba93e', "data-version": version, role: this.variant ? `${this.variant}item` : null }, this.url ? (h("a", { "aria-current": this.active ? 'page' : undefined, "aria-label": this.name, href: this.url, hrefLang: lang, lang: lang, onClick: () => this.emitChange(), onKeyDown: emitOnKeyDown }, h("slot", null))) : (h("button", { "aria-current": this.active ? 'true' : undefined, "aria-label": this.name, lang: lang, onClick: () => this.emitChange(), onKeyDown: emitOnKeyDown }, h("slot", null)))));
|
|
68
67
|
}
|
|
69
68
|
static get watchers() { return {
|
|
70
69
|
"code": ["validateCode"],
|
|
@@ -77,7 +76,6 @@ const PostLanguageOption$1 = /*@__PURE__*/ proxyCustomElement(class PostLanguage
|
|
|
77
76
|
"code": [1],
|
|
78
77
|
"active": [1540],
|
|
79
78
|
"variant": [1],
|
|
80
|
-
"type": [1],
|
|
81
79
|
"name": [1],
|
|
82
80
|
"url": [1],
|
|
83
81
|
"select": [64]
|
|
@@ -9,9 +9,8 @@ import { d as defineCustomElement$2 } from './post-popovercontainer2.js';
|
|
|
9
9
|
import { c as checkType } from './check-type.js';
|
|
10
10
|
|
|
11
11
|
const SWITCH_VARIANTS = ['list', 'menu'];
|
|
12
|
-
const SWITCH_TYPES = ['language', 'region'];
|
|
13
12
|
|
|
14
|
-
const postLanguageSwitchCss = ":host{display:flex !important;flex-wrap:wrap
|
|
13
|
+
const postLanguageSwitchCss = ":host{display:flex !important;flex-wrap:wrap;gap:.5rem}.post-language-switch-dropdown-container{display:flex;flex-direction:column}.post-language-switch-dropdown-container>*{width:100%}.post-language-switch-trigger{cursor:pointer;text-transform:uppercase;padding:0;overflow:visible;border:0;background:none;color:var(--post-scheme-color-interactive-button-secondary-enabled-fg);font:inherit;-webkit-user-select:none;user-select:none;appearance:button;text-decoration:none;display:inline-flex;align-items:center;gap:6px;border-radius:24px;font-size:16px;padding:3px 10px}@media (forced-colors: active),(-ms-high-contrast: active),(-ms-high-contrast: white-on-black){.post-language-switch-trigger{background-color:ButtonFace !important}.post-language-switch-trigger:hover{background-color:Highlight !important}}.post-language-switch-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-language-switch-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-language-switch-trigger:is(:focus-visible,:has(:focus-visible),.pretend-focus){outline-color:Highlight !important}}@supports not selector(:has(:focus-visible)){.post-language-switch-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-language-switch-trigger:is(:focus-visible,:focus-within,.pretend-focus){outline-color:Highlight !important}}}.post-language-switch-trigger:not(:disabled):hover,.post-language-switch-trigger.pretend-hover{border-color:var(--post-scheme-color-interactive-button-tertiary-hover-stroke);background-color:var(--post-scheme-color-interactive-button-tertiary-hover-bg);color:var(--post-scheme-color-interactive-button-tertiary-hover-fg)}.post-language-switch-trigger post-icon{height:16px;width:16px}";
|
|
15
14
|
const PostLanguageSwitchStyle0 = postLanguageSwitchCss;
|
|
16
15
|
|
|
17
16
|
const PostLanguageSwitch$1 = /*@__PURE__*/ proxyCustomElement(class PostLanguageSwitch extends HTMLElement {
|
|
@@ -22,7 +21,6 @@ const PostLanguageSwitch$1 = /*@__PURE__*/ proxyCustomElement(class PostLanguage
|
|
|
22
21
|
this.caption = undefined;
|
|
23
22
|
this.description = undefined;
|
|
24
23
|
this.variant = 'list';
|
|
25
|
-
this.type = 'language';
|
|
26
24
|
this.activeLang = undefined;
|
|
27
25
|
}
|
|
28
26
|
get host() { return this; }
|
|
@@ -35,25 +33,21 @@ const PostLanguageSwitch$1 = /*@__PURE__*/ proxyCustomElement(class PostLanguage
|
|
|
35
33
|
validateVariant(value = this.variant) {
|
|
36
34
|
checkEmptyOrOneOf(value, SWITCH_VARIANTS, `The "variant" property of the post-language-switch component must be: ${SWITCH_VARIANTS.join(', ')}`);
|
|
37
35
|
}
|
|
38
|
-
validateType(value = this.type) {
|
|
39
|
-
checkEmptyOrOneOf(value, SWITCH_TYPES, `The "type" property of the post-language-switch component must be: ${SWITCH_TYPES.join(', ')}`);
|
|
40
|
-
}
|
|
41
36
|
connectedCallback() {
|
|
42
|
-
this.
|
|
37
|
+
this.updateChildrenVariant();
|
|
43
38
|
// Get the active language based on children's active state
|
|
44
|
-
|
|
45
|
-
|
|
46
|
-
.getAttribute('code');
|
|
39
|
+
const activeLanguageOption = this.host.querySelector('post-language-option[active]:not([active="false"])');
|
|
40
|
+
if (activeLanguageOption)
|
|
41
|
+
this.activeLang = activeLanguageOption.getAttribute('code');
|
|
47
42
|
}
|
|
48
43
|
// Update post-language-option variant to have the correct style
|
|
49
|
-
|
|
44
|
+
updateChildrenVariant() {
|
|
50
45
|
this.host.querySelectorAll('post-language-option').forEach(el => {
|
|
51
46
|
el.setAttribute('variant', this.variant);
|
|
52
|
-
el.setAttribute('type', this.type);
|
|
53
47
|
});
|
|
54
48
|
}
|
|
55
49
|
componentWillUpdate() {
|
|
56
|
-
this.
|
|
50
|
+
this.updateChildrenVariant();
|
|
57
51
|
}
|
|
58
52
|
componentDidLoad() {
|
|
59
53
|
this.validateCaption();
|
|
@@ -80,7 +74,7 @@ const PostLanguageSwitch$1 = /*@__PURE__*/ proxyCustomElement(class PostLanguage
|
|
|
80
74
|
}
|
|
81
75
|
menuId = `p${nanoid(11)}`;
|
|
82
76
|
renderList() {
|
|
83
|
-
return (h(Host, { "data-version": version, role: "list", "aria-label": this.caption }, h("
|
|
77
|
+
return (h(Host, { "data-version": version, role: "list", "aria-label": this.caption }, h("div", { class: "post-language-switch-list", role: "group", "aria-label": this.description }, h("slot", null))));
|
|
84
78
|
}
|
|
85
79
|
renderDropdown() {
|
|
86
80
|
return (h(Host, { "data-version": version }, h("post-menu-trigger", { for: this.menuId }, h("button", { class: "post-language-switch-trigger", "aria-label": this.description }, this.activeLang, h("post-icon", { "aria-hidden": "true", name: "chevrondown" }))), h("post-menu", { id: this.menuId, class: "post-language-switch-dropdown-container", "aria-label": this.caption }, h("slot", null))));
|
|
@@ -91,21 +85,18 @@ const PostLanguageSwitch$1 = /*@__PURE__*/ proxyCustomElement(class PostLanguage
|
|
|
91
85
|
static get watchers() { return {
|
|
92
86
|
"caption": ["validateCaption"],
|
|
93
87
|
"description": ["validateDescription"],
|
|
94
|
-
"variant": ["validateVariant"]
|
|
95
|
-
"type": ["validateType"]
|
|
88
|
+
"variant": ["validateVariant"]
|
|
96
89
|
}; }
|
|
97
90
|
static get style() { return PostLanguageSwitchStyle0; }
|
|
98
91
|
}, [1, "post-language-switch", {
|
|
99
92
|
"caption": [1],
|
|
100
93
|
"description": [1],
|
|
101
94
|
"variant": [1],
|
|
102
|
-
"type": [1],
|
|
103
95
|
"activeLang": [32]
|
|
104
96
|
}, undefined, {
|
|
105
97
|
"caption": ["validateCaption"],
|
|
106
98
|
"description": ["validateDescription"],
|
|
107
|
-
"variant": ["validateVariant"]
|
|
108
|
-
"type": ["validateType"]
|
|
99
|
+
"variant": ["validateVariant"]
|
|
109
100
|
}]);
|
|
110
101
|
function defineCustomElement$1() {
|
|
111
102
|
if (typeof customElements === "undefined") {
|
package/loaders/post-linkarea.js
CHANGED
|
@@ -4,26 +4,24 @@ import { v as version } from './package.js';
|
|
|
4
4
|
const postLinkareaCss = "post-linkarea{display:contents;cursor:pointer}";
|
|
5
5
|
const PostLinkareaStyle0 = postLinkareaCss;
|
|
6
6
|
|
|
7
|
+
const INTERACTIVE_ELEMENTS = ['a'].join(',');
|
|
8
|
+
const INTERACTIVE_ELEMENTS_SELECTOR = `:where(${INTERACTIVE_ELEMENTS})`;
|
|
7
9
|
const PostLinkarea$1 = /*@__PURE__*/ proxyCustomElement(class PostLinkarea extends HTMLElement {
|
|
8
10
|
constructor() {
|
|
9
11
|
super();
|
|
10
12
|
this.__registerHost();
|
|
11
13
|
}
|
|
12
|
-
get
|
|
13
|
-
|
|
14
|
-
const
|
|
15
|
-
|
|
16
|
-
|
|
17
|
-
:
|
|
18
|
-
if (linkElement.href) {
|
|
19
|
-
window.location.href = linkElement.href;
|
|
14
|
+
get host() { return this; }
|
|
15
|
+
dispatchClick({ ctrlKey, shiftKey, altKey, metaKey }) {
|
|
16
|
+
const interactiveElement = this.host.querySelector(`[data-link]${INTERACTIVE_ELEMENTS_SELECTOR}`) ??
|
|
17
|
+
this.host.querySelector(INTERACTIVE_ELEMENTS_SELECTOR);
|
|
18
|
+
if (!interactiveElement) {
|
|
19
|
+
throw new Error(`The \`post-linkarea\` component must contain an interactive element. Possible elements are: ${INTERACTIVE_ELEMENTS}.`);
|
|
20
20
|
}
|
|
21
|
-
|
|
22
|
-
|
|
23
|
-
}
|
|
24
|
-
};
|
|
21
|
+
interactiveElement.dispatchEvent(new MouseEvent('click', { ctrlKey, shiftKey, altKey, metaKey }));
|
|
22
|
+
}
|
|
25
23
|
render() {
|
|
26
|
-
return (h(Host, { key: '
|
|
24
|
+
return (h(Host, { key: 'c27bb1e548eecbef9b981ebadea8a9a30a06a89c', "data-version": version, onClick: e => this.dispatchClick(e), tabindex: "0" }, h("slot", { key: '9e5bd5c6032ed87bc2c6e9eed96dc79f19295325' })));
|
|
27
25
|
}
|
|
28
26
|
static get style() { return PostLinkareaStyle0; }
|
|
29
27
|
}, [4, "post-linkarea"]);
|
package/loaders/post-list.js
CHANGED
|
@@ -26,11 +26,11 @@ const PostList$1 = /*@__PURE__*/ proxyCustomElement(class PostList extends HTMLE
|
|
|
26
26
|
}
|
|
27
27
|
checkTitle() {
|
|
28
28
|
if (!this.titleEl.textContent.trim()) {
|
|
29
|
-
|
|
29
|
+
console.error('Please provide a title to the list component. Title is mandatory for accessibility purposes.');
|
|
30
30
|
}
|
|
31
31
|
}
|
|
32
32
|
render() {
|
|
33
|
-
return (h(Host, { key: '
|
|
33
|
+
return (h(Host, { key: '085a63d7b4cc85461f2c8fd0c7b9d9f48f42055a', "data-version": version }, h("div", { key: 'd13a66ba16b71eff1a86666b04ca2f41957962e1', ref: el => (this.titleEl = el), id: this.titleId, class: `list-title${this.titleHidden ? ' visually-hidden' : ''}` }, h("slot", { key: '0270bcd71c8a3a34390b98b6374a1a2f06e0d606' })), h("div", { key: 'de04b08bf94900435c53f972c8fcd0798c8a5faf', role: "list", "aria-labelledby": this.titleId }, h("slot", { key: 'f7aa9976b3283ee4da3d32d84b36e2549c29e80f', name: "post-list-item" }))));
|
|
34
34
|
}
|
|
35
35
|
static get style() { return PostListStyle0; }
|
|
36
36
|
}, [4, "post-list", {
|