@swisspost/design-system-components 10.0.0-next.48 → 10.0.0-next.49
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/loader.cjs.js +1 -1
- package/dist/cjs/{package-CZyXYkIN.js → package-CR0YynRY.js} +1 -1
- package/dist/cjs/post-accordion_2.cjs.entry.js +3 -3
- package/dist/cjs/post-avatar.cjs.entry.js +26 -36
- package/dist/cjs/post-back-to-top.cjs.entry.js +2 -2
- package/dist/cjs/post-banner.cjs.entry.js +2 -2
- package/dist/cjs/post-breadcrumb-item_2.cjs.entry.js +3 -3
- package/dist/cjs/post-breadcrumbs.cjs.entry.js +4 -4
- package/dist/cjs/post-card-control.cjs.entry.js +4 -4
- package/dist/cjs/post-closebutton_15.cjs.entry.js +132 -72
- package/dist/cjs/post-collapsible_2.cjs.entry.js +3 -3
- package/dist/cjs/post-components.cjs.js +1 -1
- package/dist/cjs/post-footer.cjs.entry.js +3 -3
- package/dist/cjs/post-linkarea.cjs.entry.js +19 -8
- package/dist/cjs/post-popover.cjs.entry.js +3 -3
- package/dist/cjs/post-rating.cjs.entry.js +3 -3
- package/dist/cjs/post-tab-header.cjs.entry.js +3 -3
- package/dist/cjs/post-tab-panel.cjs.entry.js +2 -2
- package/dist/cjs/post-tabs.cjs.entry.js +2 -2
- package/dist/cjs/post-tooltip-trigger.cjs.entry.js +2 -2
- package/dist/cjs/post-tooltip.cjs.entry.js +3 -3
- package/dist/collection/animations/pop-in.js +14 -0
- package/dist/collection/components/post-accordion/post-accordion.css +1 -1
- package/dist/collection/components/post-accordion-item/post-accordion-item.css +1 -1
- package/dist/collection/components/post-avatar/post-avatar.css +1 -1
- package/dist/collection/components/post-avatar/post-avatar.js +38 -34
- package/dist/collection/components/post-back-to-top/post-back-to-top.js +1 -1
- package/dist/collection/components/post-banner/post-banner.js +1 -1
- package/dist/collection/components/post-breadcrumb-item/post-breadcrumb-item.js +1 -1
- package/dist/collection/components/post-breadcrumbs/post-breadcrumbs.css +1 -1
- package/dist/collection/components/post-breadcrumbs/post-breadcrumbs.js +2 -2
- package/dist/collection/components/post-card-control/post-card-control.css +1 -1
- package/dist/collection/components/post-card-control/post-card-control.js +2 -2
- package/dist/collection/components/post-closebutton/post-closebutton.js +1 -1
- package/dist/collection/components/post-collapsible/post-collapsible.js +1 -1
- package/dist/collection/components/post-collapsible-trigger/post-collapsible-trigger.js +1 -1
- package/dist/collection/components/post-footer/post-footer.css +1 -1
- package/dist/collection/components/post-footer/post-footer.js +1 -1
- package/dist/collection/components/post-header/post-header.css +1 -1
- package/dist/collection/components/post-header/post-header.js +11 -2
- package/dist/collection/components/post-icon/post-icon.js +39 -33
- 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 -2
- package/dist/collection/components/post-language-switch/post-language-switch.js +1 -2
- package/dist/collection/components/post-linkarea/post-linkarea.css +1 -1
- package/dist/collection/components/post-linkarea/post-linkarea.js +24 -6
- package/dist/collection/components/post-list/post-list.css +1 -1
- package/dist/collection/components/post-list/post-list.js +1 -1
- package/dist/collection/components/post-list-item/post-list-item.js +1 -1
- package/dist/collection/components/post-logo/post-logo.js +1 -1
- package/dist/collection/components/post-mainnavigation/post-mainnavigation.css +1 -1
- package/dist/collection/components/post-mainnavigation/post-mainnavigation.js +1 -1
- package/dist/collection/components/post-megadropdown/post-megadropdown.css +1 -1
- package/dist/collection/components/post-megadropdown/post-megadropdown.js +12 -2
- package/dist/collection/components/post-megadropdown-trigger/post-megadropdown-trigger.js +1 -1
- package/dist/collection/components/post-menu/post-menu.css +1 -1
- package/dist/collection/components/post-menu/post-menu.js +39 -6
- package/dist/collection/components/post-menu-item/post-menu-item.js +1 -1
- package/dist/collection/components/post-menu-trigger/post-menu-trigger.js +1 -1
- package/dist/collection/components/post-popover/post-popover.css +1 -1
- package/dist/collection/components/post-popover/post-popover.js +1 -1
- package/dist/collection/components/post-popovercontainer/post-popovercontainer.css +1 -1
- package/dist/collection/components/post-popovercontainer/post-popovercontainer.js +18 -7
- package/dist/collection/components/post-rating/post-rating.css +1 -1
- 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-togglebutton/post-togglebutton.js +1 -1
- package/dist/collection/components/post-tooltip/post-tooltip.js +2 -2
- package/dist/collection/components/post-tooltip-trigger/post-tooltip-trigger.js +1 -1
- package/dist/component-names.json +39 -0
- package/dist/components/package.js +1 -1
- package/dist/components/post-accordion-item2.js +1 -1
- package/dist/components/post-accordion2.js +1 -1
- package/dist/components/post-avatar.js +28 -36
- package/dist/components/post-back-to-top.js +1 -1
- package/dist/components/post-banner.js +1 -1
- package/dist/components/post-breadcrumb-item2.js +1 -1
- package/dist/components/post-breadcrumbs.js +3 -3
- package/dist/components/post-card-control.js +3 -3
- package/dist/components/post-closebutton.js +1 -1
- package/dist/components/post-collapsible-trigger2.js +1 -1
- package/dist/components/post-collapsible2.js +1 -1
- package/dist/components/post-footer.js +2 -2
- package/dist/components/post-header.js +12 -3
- package/dist/components/post-icon2.js +39 -33
- package/dist/components/post-language-option.js +2 -3
- package/dist/components/post-language-switch.js +1 -2
- package/dist/components/post-linkarea.js +21 -8
- package/dist/components/post-list-item.js +1 -1
- package/dist/components/post-list.js +2 -2
- package/dist/components/post-logo.js +1 -1
- package/dist/components/post-mainnavigation.js +2 -2
- package/dist/components/post-megadropdown-trigger.js +1 -1
- package/dist/components/post-megadropdown.js +13 -3
- package/dist/components/post-menu-item2.js +1 -1
- package/dist/components/post-menu-trigger2.js +1 -1
- package/dist/components/post-menu2.js +21 -6
- package/dist/components/post-popover.js +2 -2
- package/dist/components/post-popovercontainer2.js +30 -5
- package/dist/components/post-rating.js +2 -2
- package/dist/components/post-tab-header.js +2 -2
- package/dist/components/post-tab-panel.js +1 -1
- package/dist/components/post-tabs.js +1 -1
- package/dist/components/post-togglebutton.js +1 -1
- package/dist/components/post-tooltip-trigger.js +1 -1
- package/dist/components/post-tooltip.js +2 -2
- package/dist/components/react/{p-Da5wbVP8.js → p-Amg0f2Yo.js} +40 -34
- package/dist/components/react/{p-Tg0GNTZM.js → p-B6vPT8S3.js} +2 -2
- package/dist/components/react/{p-CGsAj6ij.js → p-BDs0pvkX.js} +2 -2
- package/dist/components/react/{p-q8Fvf8A0.js → p-BMdFdJWl.js} +2 -2
- package/dist/components/react/{p-Ce7jgYmK.js → p-BS0ZqwA-.js} +31 -6
- package/dist/components/react/{p-Dq9F2i7n.js → p-D1oOccKr.js} +2 -2
- package/dist/components/react/{p-JHuJA2Lv.js → p-D50E7y6E.js} +23 -8
- package/dist/components/react/p-DO48NanC.js +3 -0
- package/dist/components/react/{p-38PqL5iD.js → p-DOo9tmN-.js} +2 -2
- package/dist/components/react/{p-DzYquz3e.js → p-Do9awHW7.js} +3 -3
- package/dist/components/react/{p-CiYSngKM.js → p-xelWyg_P.js} +5 -5
- package/dist/components/react/post-accordion-item.js +1 -1
- package/dist/components/react/post-accordion.js +1 -1
- package/dist/components/react/post-avatar.js +29 -37
- package/dist/components/react/post-back-to-top.js +3 -3
- package/dist/components/react/post-banner.js +2 -2
- package/dist/components/react/post-breadcrumb-item.js +1 -1
- package/dist/components/react/post-breadcrumbs.js +10 -10
- package/dist/components/react/post-card-control.js +5 -5
- package/dist/components/react/post-closebutton.js +3 -3
- package/dist/components/react/post-collapsible-trigger.js +1 -1
- package/dist/components/react/post-collapsible.js +1 -1
- package/dist/components/react/post-footer.js +8 -8
- package/dist/components/react/post-header.js +13 -4
- package/dist/components/react/post-icon.js +1 -1
- package/dist/components/react/post-language-option.js +3 -4
- package/dist/components/react/post-language-switch.js +6 -7
- package/dist/components/react/post-linkarea.js +22 -9
- package/dist/components/react/post-list-item.js +2 -2
- package/dist/components/react/post-list.js +3 -3
- package/dist/components/react/post-logo.js +2 -2
- package/dist/components/react/post-mainnavigation.js +4 -4
- package/dist/components/react/post-megadropdown-trigger.js +2 -2
- package/dist/components/react/post-megadropdown.js +14 -4
- package/dist/components/react/post-menu-item.js +1 -1
- package/dist/components/react/post-menu-trigger.js +1 -1
- package/dist/components/react/post-menu.js +1 -1
- package/dist/components/react/post-popover.js +4 -4
- package/dist/components/react/post-popovercontainer.js +1 -1
- package/dist/components/react/post-rating.js +4 -4
- package/dist/components/react/post-tab-header.js +3 -3
- package/dist/components/react/post-tab-panel.js +2 -2
- package/dist/components/react/post-tabs.js +2 -2
- package/dist/components/react/post-togglebutton.js +2 -2
- package/dist/components/react/post-tooltip-trigger.js +2 -2
- package/dist/components/react/post-tooltip.js +4 -4
- package/dist/docs.json +52 -6
- package/dist/esm/loader.js +1 -1
- package/dist/esm/package-DO48NanC.js +3 -0
- package/dist/esm/post-accordion_2.entry.js +3 -3
- package/dist/esm/post-avatar.entry.js +26 -36
- package/dist/esm/post-back-to-top.entry.js +2 -2
- package/dist/esm/post-banner.entry.js +2 -2
- package/dist/esm/post-breadcrumb-item_2.entry.js +3 -3
- package/dist/esm/post-breadcrumbs.entry.js +4 -4
- package/dist/esm/post-card-control.entry.js +4 -4
- package/dist/esm/post-closebutton_15.entry.js +132 -72
- package/dist/esm/post-collapsible_2.entry.js +3 -3
- package/dist/esm/post-components.js +1 -1
- package/dist/esm/post-footer.entry.js +3 -3
- package/dist/esm/post-linkarea.entry.js +19 -8
- package/dist/esm/post-popover.entry.js +3 -3
- package/dist/esm/post-rating.entry.js +3 -3
- package/dist/esm/post-tab-header.entry.js +3 -3
- package/dist/esm/post-tab-panel.entry.js +2 -2
- package/dist/esm/post-tabs.entry.js +2 -2
- package/dist/esm/post-tooltip-trigger.entry.js +2 -2
- package/dist/esm/post-tooltip.entry.js +3 -3
- package/dist/post-components/p-01bc39c2.entry.js +1 -0
- package/dist/post-components/p-0dc1e940.entry.js +1 -0
- package/dist/post-components/p-16da91bc.entry.js +1 -0
- package/dist/post-components/p-26a04741.entry.js +1 -0
- package/dist/post-components/p-2f2f9b22.entry.js +1 -0
- package/dist/post-components/{p-38d3d441.entry.js → p-33008981.entry.js} +1 -1
- package/dist/post-components/p-36358cd4.entry.js +1 -0
- package/dist/post-components/p-71c48d48.entry.js +1 -0
- package/dist/post-components/{p-6777e505.entry.js → p-84395e1d.entry.js} +1 -1
- package/dist/post-components/p-848c10ac.entry.js +1 -0
- package/dist/post-components/{p-d61bb2ff.entry.js → p-8d2e5814.entry.js} +1 -1
- package/dist/post-components/{p-40f21542.entry.js → p-9dbe6595.entry.js} +1 -1
- package/dist/post-components/p-DO48NanC.js +1 -0
- package/dist/post-components/p-a982458f.entry.js +1 -0
- package/dist/post-components/{p-3c71f590.entry.js → p-b0aaa058.entry.js} +1 -1
- package/dist/post-components/{p-16772417.entry.js → p-bdeef760.entry.js} +1 -1
- package/dist/post-components/{p-6add880f.entry.js → p-d221395c.entry.js} +1 -1
- package/dist/post-components/{p-aad86320.entry.js → p-e49aa78e.entry.js} +1 -1
- package/dist/post-components/p-eb405167.entry.js +1 -0
- package/dist/post-components/post-components.esm.js +1 -1
- package/dist/types/animations/pop-in.d.ts +1 -0
- package/dist/types/components/post-avatar/post-avatar.d.ts +5 -4
- package/dist/types/components/post-header/post-header.d.ts +2 -0
- package/dist/types/components/post-icon/post-icon.d.ts +11 -0
- package/dist/types/components/post-linkarea/post-linkarea.d.ts +6 -0
- package/dist/types/components/post-megadropdown/post-megadropdown.d.ts +2 -1
- package/dist/types/components/post-menu/post-menu.d.ts +5 -1
- package/dist/types/components/post-popovercontainer/post-popovercontainer.d.ts +6 -2
- package/dist/types/components.d.ts +19 -3
- package/hydrate/index.js +214 -147
- package/hydrate/index.mjs +214 -147
- package/package.json +8 -6
- package/dist/components/react/p-0Ltezq5O.js +0 -3
- package/dist/esm/package-0Ltezq5O.js +0 -3
- package/dist/post-components/p-0Ltezq5O.js +0 -1
- package/dist/post-components/p-4243cdd1.entry.js +0 -1
- package/dist/post-components/p-4c18cb8c.entry.js +0 -1
- package/dist/post-components/p-51dc7647.entry.js +0 -1
- package/dist/post-components/p-8363fedb.entry.js +0 -1
- package/dist/post-components/p-83998038.entry.js +0 -1
- package/dist/post-components/p-85bb1b5e.entry.js +0 -1
- package/dist/post-components/p-8f4d8685.entry.js +0 -1
- package/dist/post-components/p-95ad536d.entry.js +0 -1
- package/dist/post-components/p-9d806e89.entry.js +0 -1
- package/dist/post-components/p-c3e38acf.entry.js +0 -1
- package/dist/prebuild.js +0 -26
- package/dist/types/home/runner/work/design-system/design-system/packages/components/.stencil/prebuild.d.ts +0 -1
|
@@ -28,7 +28,7 @@ function slideDown(el, translateSize = '-100%') {
|
|
|
28
28
|
});
|
|
29
29
|
}
|
|
30
30
|
|
|
31
|
-
const postHeaderCss = "*,::before,::after{box-sizing:border-box}:host{z-index:1020;position:relative;--post-logo-height:calc(var(--post-global-header-expanded-height) - var(--post-header-scroll-top, 0px));--post-global-header-top:calc( var(--post-global-header-reduced-height) - var(--post-global-header-expanded-height) );--post-local-header-top:calc( var(--post-global-header-reduced-height) + var(--post-local-header-reduced-height) - var(--post-local-header-expanded-height) );--post-global-controls-top:clamp( 1000 * var(--post-global-header-top), calc(-1 * min(var(--post-header-scroll-top, 0px) / 4, var(--post-global-header-reduced-height))), 0px )}@media screen and (min-width: 1024px){:host:has(.global-sub>*:not(.logo):focus-within),:host:has(.local-sub:focus-within){--post-global-header-top:0;--post-local-header-top:var(--post-global-header-expanded-height);--post-logo-height:var(--post-global-header-expanded-height);--post-global-controls-top:0}}
|
|
31
|
+
const postHeaderCss = "*,::before,::after{box-sizing:border-box}:host{z-index:1020;position:relative;--post-logo-height:calc(var(--post-global-header-expanded-height) - var(--post-header-scroll-top, 0px));--post-global-header-top:calc( var(--post-global-header-reduced-height) - var(--post-global-header-expanded-height) );--post-local-header-top:calc( var(--post-global-header-reduced-height) + var(--post-local-header-reduced-height) - var(--post-local-header-expanded-height) );--post-global-controls-top:clamp( 1000 * var(--post-global-header-top), calc(-1 * min(var(--post-header-scroll-top, 0px) / 4, var(--post-global-header-reduced-height))), 0px )}@media screen and (min-width: 1024px){:host:has(.global-sub>*:not(.logo):focus-within),:host:has(.local-sub:focus-within){--post-global-header-top:0;--post-local-header-top:var(--post-global-header-expanded-height);--post-logo-height:var(--post-global-header-expanded-height);--post-global-controls-top:0}}.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(--post-global-header-expanded-height)}@media screen and (max-width: 1023.98px){.global-header{z-index:4;inset-block-start:0}}@media screen and (min-width: 1024px){.global-header{z-index:5;padding-inline-end:8px;inset-block-start:var(--post-global-header-top);transition:inset-block-start .2s ease-in-out}}.global-header:has(+.local-header.no-navigation.no-title){box-shadow:var(--post-device-elevation-300)}.global-sub{display:flex;align-items:center;gap:24px}@media screen and (min-width: 1024px){.global-sub:not(:has(.logo)){position:relative;transition:inset-block-start .2s ease-in-out;inset-block-start:var(--post-global-controls-top)}.global-sub:not(:last-child):not(:first-child){flex-grow:1}}.align-end{align-items:flex-end}.logo{flex:1 0 auto;height:var(--post-global-header-expanded-height);width:var(--post-global-header-expanded-height);min-height:var(--post-global-header-reduced-height);align-self:flex-end}@media screen and (min-width: 1024px){.logo{transition:height .2 ease-in-out;height:var(--post-logo-height)}}::slotted(ul){margin-block:0 !important;list-style:none;display:flex;padding-inline-start:0;gap:1rem;flex-shrink:0 !important}.local-header{display:flex;position:sticky;inset-block-start:var(--post-local-header-top);flex-wrap:wrap;align-items:center;justify-content:space-between;gap:4px;min-height:var(--post-local-header-expanded-min-height);background:#fff;transition:box-shadow .2s ease-in-out}.local-header::after{content:\"\";position:absolute;width:100%;height:1px;background-color:#e1e0dc;inset-block-end:-1px;z-index:1}@media (forced-colors: active),(-ms-high-contrast: active),(-ms-high-contrast: white-on-black){.local-header::after{background-color:Highlight}}@media screen and (min-width: 1024px){.local-header{z-index:3;box-shadow:var(--post-device-elevation-300);transition:box-shadow .2s ease-in-out,inset-block-start .2s ease-in-out}.local-header:not(.no-title){padding-block-start:18px}}@media screen and (max-width: 1023.98px){.local-header{z-index:3;padding-block:8px;flex-wrap:wrap;gap:12px}.local-header.local-header-mobile-extended::after{inset-block-end:0}.local-header:not(.local-header-mobile-extended){box-shadow:var(--post-device-elevation-300)}}.local-header.no-navigation{padding-block:0}.local-header.no-navigation .navigation{display:none}.local-header.no-navigation.no-title{display:none}.local-sub{margin-inline-end:16px}@media screen and (max-width: 1023.98px){.local-sub{margin-inline-end:4px}}::slotted(.list-inline){margin:0 !important;z-index:3 !important;position:relative !important}@media screen and (min-width: 1024px){.mobile-toggle{display:none}}.navigation{width:100%}@media screen and (min-width: 1024px){.navigation{inset-block-start:var(--post-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:sticky;z-index:2;inset-inline:0;inset-block-start:var(--post-header-height)}.mobile-menu{background-color:#fafafa}::slotted(post-mainnavigation),.navigation-footer{padding-block:16px 24px;padding-inline:40px}::slotted(post-mainnavigation),.navigation-footer,.navigation-target-group{display:none;flex-direction:column}.navigation.extended ::slotted(post-mainnavigation),.navigation.extended .navigation-footer,.navigation.extended .navigation-target-group{display:flex}::slotted(post-mainnavigation){padding-block:24px}.navigation.extended>div{display:flex;flex-direction:column;overflow-y:auto;overflow-x:hidden;height:calc(min(var(--post-header-scroll-parent-height, 100dvh),100dvh) - var(--post-header-height))}.navigation.extended.megadropdown-open>div{overflow-y:hidden}.navigation.extended ::slotted(post-mainnavigation){flex-grow:1 !important}.navigation-footer{background-color:#f0efed;gap:24px}.navigation-footer ::slotted(post-language-switch){margin-top:16px}}@media screen and (max-width: 1023.98px)and (max-width: 599.98px){.navigation-footer{gap:16px}}@media screen and (max-width: 599.98px){::slotted(post-mainnavigation),.navigation-footer{padding-inline:16px}}";
|
|
32
32
|
|
|
33
33
|
var __decorate = (undefined && undefined.__decorate) || function (decorators, target, key, desc) {
|
|
34
34
|
var c = arguments.length, r = c < 3 ? target : desc === null ? desc = Object.getOwnPropertyDescriptor(target, key) : desc, d;
|
|
@@ -77,6 +77,7 @@ const PostHeader$1 = /*@__PURE__*/ proxyCustomElement(class PostHeader extends H
|
|
|
77
77
|
this.throttledResize = throttle(50, () => this.updateLocalHeaderHeight());
|
|
78
78
|
this.device = breakpoint.get('device');
|
|
79
79
|
this.hasNavigation = false;
|
|
80
|
+
this.hasTitle = false;
|
|
80
81
|
this.mobileMenuExtended = false;
|
|
81
82
|
this.megadropdownOpen = false;
|
|
82
83
|
this.breakpointChange = (e) => {
|
|
@@ -113,6 +114,7 @@ const PostHeader$1 = /*@__PURE__*/ proxyCustomElement(class PostHeader extends H
|
|
|
113
114
|
this.host.addEventListener('click', this.handleLinkClick);
|
|
114
115
|
window.addEventListener('postBreakpoint:device', this.breakpointChange);
|
|
115
116
|
this.checkNavigationExistence();
|
|
117
|
+
this.checkTitleExistence();
|
|
116
118
|
this.switchLanguageSwitchMode();
|
|
117
119
|
this.handleScrollParentResize();
|
|
118
120
|
this.lockBody(false, this.mobileMenuExtended, 'mobileMenuExtended');
|
|
@@ -150,6 +152,9 @@ const PostHeader$1 = /*@__PURE__*/ proxyCustomElement(class PostHeader extends H
|
|
|
150
152
|
checkNavigationExistence() {
|
|
151
153
|
this.hasNavigation = this.host.querySelectorAll('post-mainnavigation').length > 0;
|
|
152
154
|
}
|
|
155
|
+
checkTitleExistence() {
|
|
156
|
+
this.hasTitle = this.host.querySelectorAll('[slot="title"]').length > 0;
|
|
157
|
+
}
|
|
153
158
|
async closeMobileMenu() {
|
|
154
159
|
this.mobileMenuAnimation.finish();
|
|
155
160
|
const menuButton = this.getMenuButton();
|
|
@@ -289,9 +294,12 @@ const PostHeader$1 = /*@__PURE__*/ proxyCustomElement(class PostHeader extends H
|
|
|
289
294
|
const localHeaderClasses = ['local-header'];
|
|
290
295
|
if (this.mobileMenuExtended)
|
|
291
296
|
localHeaderClasses.push('local-header-mobile-extended');
|
|
292
|
-
if (!this.hasNavigation)
|
|
297
|
+
if (this.device !== 'desktop' || !this.hasNavigation)
|
|
293
298
|
localHeaderClasses.push('no-navigation');
|
|
294
|
-
|
|
299
|
+
if (!this.hasTitle)
|
|
300
|
+
localHeaderClasses.push('no-title');
|
|
301
|
+
return (h(Host, { key: 'd327fc8735749f46cb8b38531a8514978f92c197', "data-version": version, "data-color-scheme": "light" }, h("div", { key: '07b7a4861cc11d55fce5d749a1d074d37900b48f', class: "global-header" }, h("div", { key: 'bb23cf58b62b53e273921bb0a27a2371983bc8a8', class: "global-sub" }, h("div", { key: '0028ff1ba8be25a238d944eaf25f9679b9e163c6', class: "logo" }, h("slot", { key: '98e0584188a391b99df904fbdf463606548859c7', name: "post-logo" }))), h("div", { key: '6da75517e0923191cc4d478a3f0c7e20d89b860d', class: "global-sub" }, this.device === 'desktop' && h("slot", { key: 'bf5730915d734e9accb0e10bcd0d48ee99781930', name: "target-group" })), h("div", { key: '64f3eafd98d8c34248de4fb78619bb7f3147e5e9', class: "global-sub" }, !this.hasMobileMenu && (h("slot", { key: 'c3ad33a44bf25fede0afbea50937626142e69b6e', name: "meta-navigation" })), h("slot", { key: 'e85d50753a40958be785deebfe01ffbee91f120b', name: "global-controls" }), !this.hasMobileMenu && h("slot", { key: 'e423f47daa544cb7bd11ed54f0ecef93a50e6470', name: "post-language-switch" }), this.hasNavigation && (h("div", { key: '96be5d590fbee1986238e1b7b22a1e6928c1c97f', onClick: () => this.toggleMobileMenu(), class: "mobile-toggle" }, h("slot", { key: '4c9db8b0c416cbd2ffa4e1df6b05aea757bdc6a6', name: "post-togglebutton" }))))), h("div", { key: '43285a4032f7ae356145ce6fb62e3c9896ad8542', class: localHeaderClasses.join(' ') }, h("slot", { key: '74c2313baa4da4bf37d13189c07645374df684d1', name: "title", onSlotchange: () => this.checkTitleExistence() }), this.hasTitle &&
|
|
302
|
+
(h("div", { key: '414b5378922221715071a5d8cfc0b7920018a5b3', class: "local-sub" }, h("slot", { key: 'acb09003e517669a50405a04e5dafa983e78b5f2', name: "local-controls" }), h("slot", { key: '8e1043c4d2e25b6b9432a2ba1885d2128abb9f85' }))), this.device === 'desktop' && this.renderNavigation()), this.device !== 'desktop' && this.renderNavigation()));
|
|
295
303
|
}
|
|
296
304
|
get host() { return this; }
|
|
297
305
|
static get watchers() { return {
|
|
@@ -302,6 +310,7 @@ const PostHeader$1 = /*@__PURE__*/ proxyCustomElement(class PostHeader extends H
|
|
|
302
310
|
}, [1, "post-header", {
|
|
303
311
|
"device": [32],
|
|
304
312
|
"hasNavigation": [32],
|
|
313
|
+
"hasTitle": [32],
|
|
305
314
|
"mobileMenuExtended": [32],
|
|
306
315
|
"megadropdownOpen": [32],
|
|
307
316
|
"toggleMobileMenu": [64]
|
|
@@ -44,52 +44,58 @@ const PostIcon = /*@__PURE__*/ proxyCustomElement(class PostIcon extends HTMLEle
|
|
|
44
44
|
validateScale() {
|
|
45
45
|
checkEmptyOrType(this, 'scale', 'number');
|
|
46
46
|
}
|
|
47
|
-
|
|
48
|
-
|
|
49
|
-
|
|
50
|
-
|
|
47
|
+
/**
|
|
48
|
+
* Construct the icon URL according to the following rules:
|
|
49
|
+
* 1. `@base` (absolute URL) → use directly.
|
|
50
|
+
* 2. `@base` (relative URL) → resolve with `base href` and/or `origin`
|
|
51
|
+
* - If `base href` is absolute → use just that.
|
|
52
|
+
* - If `base href` is relative → prepend with `origin`.
|
|
53
|
+
* - If `base href` does not exist → use only `origin`.
|
|
54
|
+
* 3. `@meta` (absolute URL) → use directly.
|
|
55
|
+
* 4. `@meta` (relative URL) → resolve with `base href` and/or `origin`. (same as above)
|
|
56
|
+
* 5. `CDN_URL` fallback → `https://unpkg.com/...`.
|
|
57
|
+
**/
|
|
51
58
|
getUrl() {
|
|
52
59
|
const fileName = `${this.name}.svg`;
|
|
53
60
|
if (!IS_BROWSER && !this.base) {
|
|
54
61
|
return `${CDN_URL}${fileName}`;
|
|
55
62
|
}
|
|
63
|
+
const isAbsolute = (url) => /^https?:\/\//.test(url);
|
|
64
|
+
const normalizeUrl = (url) => (url && !url.endsWith('/') ? `${url}/` : url);
|
|
65
|
+
const cleanUrl = (url) => url.replace(/([^:])\/\//g, '$1/');
|
|
56
66
|
const currentDomain = IS_BROWSER ? window.location.origin : '';
|
|
57
67
|
const baseHref = IS_BROWSER
|
|
58
68
|
? document.querySelector('base[href]')?.getAttribute('href') || ''
|
|
59
69
|
: '';
|
|
60
|
-
const isBaseHrefAbsolute = /^https?:\/\//.test(baseHref);
|
|
61
70
|
const metaIconBase = IS_BROWSER
|
|
62
|
-
? document
|
|
63
|
-
.querySelector('meta[name="design-system-settings"]')
|
|
64
|
-
?.getAttribute('data-post-icon-base') || ''
|
|
71
|
+
? document.querySelector('meta[name="design-system-settings"]')?.getAttribute('data-post-icon-base') || ''
|
|
65
72
|
: '';
|
|
66
|
-
|
|
67
|
-
const
|
|
68
|
-
|
|
69
|
-
|
|
70
|
-
|
|
71
|
-
|
|
72
|
-
|
|
73
|
-
return
|
|
74
|
-
}
|
|
73
|
+
// Function to build the first part of the URL when 'this.base' or 'metaIconBase' are relative
|
|
74
|
+
const buildUrlWithBase = (relativeUrl) => {
|
|
75
|
+
const normalizedHref = normalizeUrl(baseHref);
|
|
76
|
+
const normalizedRelative = normalizeUrl(relativeUrl);
|
|
77
|
+
if (isAbsolute(normalizedHref)) {
|
|
78
|
+
return `${normalizedHref}${normalizedRelative}`;
|
|
79
|
+
}
|
|
80
|
+
return `${currentDomain}${normalizedHref}${normalizedRelative}`;
|
|
81
|
+
};
|
|
75
82
|
let url;
|
|
76
|
-
|
|
77
|
-
|
|
78
|
-
url =
|
|
79
|
-
|
|
80
|
-
|
|
81
|
-
|
|
82
|
-
url = `${normalizedBaseHref}${normalizedIconBase}${fileName}`;
|
|
83
|
-
}
|
|
84
|
-
else if (iconBase || baseHref) {
|
|
85
|
-
// Standard case: domain + baseHref + iconBase
|
|
86
|
-
url = `${currentDomain}${normalizedBaseHref}${normalizedIconBase}${fileName}`;
|
|
83
|
+
// Highest Priority is this.base
|
|
84
|
+
if (this.base) {
|
|
85
|
+
url = isAbsolute(this.base)
|
|
86
|
+
? `${normalizeUrl(this.base)}${fileName}`
|
|
87
|
+
: `${buildUrlWithBase(this.base)}${fileName}`;
|
|
88
|
+
return cleanUrl(url);
|
|
87
89
|
}
|
|
88
|
-
|
|
89
|
-
|
|
90
|
-
url =
|
|
90
|
+
// Second Priority is metaIconBase
|
|
91
|
+
if (metaIconBase) {
|
|
92
|
+
url = isAbsolute(metaIconBase)
|
|
93
|
+
? `${normalizeUrl(metaIconBase)}${fileName}`
|
|
94
|
+
: `${buildUrlWithBase(metaIconBase)}${fileName}`;
|
|
95
|
+
return cleanUrl(url);
|
|
91
96
|
}
|
|
92
|
-
|
|
97
|
+
// Fallback to CDN
|
|
98
|
+
return cleanUrl(`${CDN_URL}${fileName}`);
|
|
93
99
|
}
|
|
94
100
|
getStyles() {
|
|
95
101
|
const url = this.getUrl();
|
|
@@ -110,7 +116,7 @@ const PostIcon = /*@__PURE__*/ proxyCustomElement(class PostIcon extends HTMLEle
|
|
|
110
116
|
this.validateAnimation();
|
|
111
117
|
}
|
|
112
118
|
render() {
|
|
113
|
-
return (h(Host, { key: '
|
|
119
|
+
return (h(Host, { key: '521fb549cef7d0838c999628cf69c5c23e87dfc6', "data-version": version }, h("span", { key: 'cc9ca579bd90fee8cec7868c697bfe59dd677246', style: this.getStyles() })));
|
|
114
120
|
}
|
|
115
121
|
get host() { return this; }
|
|
116
122
|
static get watchers() { return {
|
|
@@ -4,7 +4,7 @@ import './breakpoints.js';
|
|
|
4
4
|
import { v as version } from './package.js';
|
|
5
5
|
import { S as SWITCH_VARIANTS } from './switch-variants.js';
|
|
6
6
|
|
|
7
|
-
const postLanguageOptionCss = "
|
|
7
|
+
const postLanguageOptionCss = "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 button .visually-hidden{position:absolute;width:1px;height:1px;margin:-1px;padding:0;overflow:hidden;clip:rect(0 0 0 0);border:0}post-language-option a{color:var(--post-current-fg);text-decoration:none}post-language-option :is(a,button){cursor:pointer;display:flex;align-items:center;justify-content:center;width:100%;height:100%;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;outline-offset:-2px !important;border-radius:4px}@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;outline-offset:-2px !important;border-radius:4px}@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}@media (forced-colors: active),(-ms-high-contrast: active),(-ms-high-contrast: white-on-black){post-language-option:where([variant=list]) :is(a,button){border:1px solid ButtonBorder;color:ButtonText}}post-language-option:where([variant=list])[active]:not([active=false]) :is(a,button){background-color:#050400 !important;color:#fff;pointer-events:none}@media (forced-colors: active),(-ms-high-contrast: active),(-ms-high-contrast: white-on-black){post-language-option:where([variant=list])[active]:not([active=false]) :is(a,button){background-color:Highlight !important;color:HighlightText}}post-language-option:where([variant=menu]){min-width:72px}post-language-option:where([variant=menu])[active]:not([active=false]){display:none}post-language-option:where([variant=menu]) :is(a,button){padding-block:13px;padding-inline:16px;box-sizing:border-box;justify-content:flex-start;position:relative;border-radius:0}post-language-option:where([variant=menu]) :is(a,button):hover{color:#fff;background-color:#504f4b}post-language-option:where([variant=menu]):first-child :is(a,button){border-start-start-radius:4px;border-start-end-radius:4px}post-language-option:where([variant=menu]):last-child :is(a,button){border-end-start-radius:4px;border-end-end-radius:4px}";
|
|
8
8
|
|
|
9
9
|
const PostLanguageOption$1 = /*@__PURE__*/ proxyCustomElement(class PostLanguageOption extends HTMLElement {
|
|
10
10
|
constructor() {
|
|
@@ -51,13 +51,12 @@ const PostLanguageOption$1 = /*@__PURE__*/ proxyCustomElement(class PostLanguage
|
|
|
51
51
|
}
|
|
52
52
|
render() {
|
|
53
53
|
const lang = this.code.toLowerCase();
|
|
54
|
-
const role = this.variant === 'menu' ? 'menuitem' : undefined;
|
|
55
54
|
const emitOnKeyDown = (e) => {
|
|
56
55
|
if (e.key === 'Enter' || e.key === ' ') {
|
|
57
56
|
this.emitChange();
|
|
58
57
|
}
|
|
59
58
|
};
|
|
60
|
-
return (h(Host, { key: '
|
|
59
|
+
return (h(Host, { key: 'deaee69d7e0c551af5162ae124f78c9418aba062', "data-version": version, role: this.variant === 'list' ? 'listitem' : undefined }, this.url ? (h("a", { "aria-current": this.active ? 'page' : undefined, href: this.url, hrefLang: lang, lang: lang, onClick: () => this.emitChange(), onKeyDown: emitOnKeyDown }, h("slot", null), h("span", { class: "visually-hidden" }, this.name))) : (h("button", { "aria-current": this.active ? 'true' : undefined, lang: lang, onClick: () => this.emitChange(), onKeyDown: emitOnKeyDown }, h("slot", null), h("span", { class: "visually-hidden" }, this.name)))));
|
|
61
60
|
}
|
|
62
61
|
get host() { return this; }
|
|
63
62
|
static get watchers() { return {
|
|
@@ -86,14 +86,13 @@ const PostLanguageSwitch$1 = /*@__PURE__*/ proxyCustomElement(class PostLanguage
|
|
|
86
86
|
updateChildrenVariant() {
|
|
87
87
|
this.languageOptions.forEach(el => {
|
|
88
88
|
el.setAttribute('variant', this.variant);
|
|
89
|
-
el.setAttribute('role', this.variant == 'menu' ? 'menuitem' : 'listitem');
|
|
90
89
|
});
|
|
91
90
|
}
|
|
92
91
|
renderList() {
|
|
93
92
|
return (h(Host, { "data-version": version }, h("div", { class: "post-language-switch-list", role: "list", "aria-label": this.caption, "aria-describedby": this.listSpanId }, h("span", { id: this.listSpanId, class: "visually-hidden" }, this.description), h("slot", null))));
|
|
94
93
|
}
|
|
95
94
|
renderDropdown() {
|
|
96
|
-
return (h(Host, { "data-version": version }, h("post-menu-trigger", { for: this.menuId }, h("button", { class: "post-language-switch-trigger" }, this.activeLang, h("span", { class: "visually-hidden" }, this.caption), h("span", { class: "visually-hidden" }, this.description), h("post-icon", { "aria-hidden": "true", name: "chevrondown" }))), h("post-menu", { id: this.menuId, class: "post-language-switch-dropdown-container"
|
|
95
|
+
return (h(Host, { "data-version": version }, h("post-menu-trigger", { for: this.menuId }, h("button", { class: "post-language-switch-trigger" }, this.activeLang, h("span", { class: "visually-hidden" }, this.caption), h("span", { class: "visually-hidden" }, this.description), h("post-icon", { "aria-hidden": "true", name: "chevrondown" }))), h("post-menu", { id: this.menuId, class: "post-language-switch-dropdown-container" }, h("slot", null))));
|
|
97
96
|
}
|
|
98
97
|
render() {
|
|
99
98
|
return this.variant === 'list' ? this.renderList() : this.renderDropdown();
|
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
import { proxyCustomElement, HTMLElement, h, Host } from '@stencil/core/internal/client';
|
|
2
2
|
import { v as version } from './package.js';
|
|
3
3
|
|
|
4
|
-
const postLinkareaCss = ":host{display:
|
|
4
|
+
const postLinkareaCss = ":host{display:block;cursor:pointer}";
|
|
5
5
|
|
|
6
6
|
const INTERACTIVE_ELEMENTS = ['a'].join(',');
|
|
7
7
|
const INTERACTIVE_ELEMENTS_SELECTOR = `:where(${INTERACTIVE_ELEMENTS})`;
|
|
@@ -10,21 +10,34 @@ const PostLinkarea$1 = /*@__PURE__*/ proxyCustomElement(class PostLinkarea exten
|
|
|
10
10
|
super();
|
|
11
11
|
this.__registerHost();
|
|
12
12
|
this.__attachShadow();
|
|
13
|
+
this.mutationObserver = new MutationObserver(this.checkInteractiveElements.bind(this));
|
|
13
14
|
}
|
|
14
15
|
dispatchClick({ ctrlKey, shiftKey, altKey, metaKey }) {
|
|
15
|
-
|
|
16
|
-
|
|
17
|
-
|
|
18
|
-
|
|
16
|
+
this.interactiveElements[0]?.dispatchEvent(new MouseEvent('click', { ctrlKey, shiftKey, altKey, metaKey }));
|
|
17
|
+
}
|
|
18
|
+
checkInteractiveElements() {
|
|
19
|
+
this.interactiveElements = this.host.querySelectorAll(INTERACTIVE_ELEMENTS_SELECTOR);
|
|
20
|
+
if (this.interactiveElements.length > 1) {
|
|
21
|
+
console.error(`The \`post-linkarea\` currently contains ${this.interactiveElements.length} interactive elements when it should contain only one.`);
|
|
19
22
|
}
|
|
20
|
-
|
|
23
|
+
}
|
|
24
|
+
connectedCallback() {
|
|
25
|
+
this.mutationObserver.observe(this.host, { childList: true });
|
|
26
|
+
}
|
|
27
|
+
componentWillLoad() {
|
|
28
|
+
this.checkInteractiveElements();
|
|
29
|
+
}
|
|
30
|
+
disconnectedCallback() {
|
|
31
|
+
this.mutationObserver.disconnect();
|
|
21
32
|
}
|
|
22
33
|
render() {
|
|
23
|
-
return (h(Host, { key: '
|
|
34
|
+
return (h(Host, { key: '37351b168e654e8c563225061510dacdbda8fef4', "data-version": version, onClick: (e) => this.dispatchClick(e), tabindex: "0" }, h("slot", { key: '26aeb1fc5de5f610ef485396f2cec4c2ba7e5a9a' })));
|
|
24
35
|
}
|
|
25
36
|
get host() { return this; }
|
|
26
37
|
static get style() { return postLinkareaCss; }
|
|
27
|
-
}, [1, "post-linkarea"
|
|
38
|
+
}, [1, "post-linkarea", {
|
|
39
|
+
"interactiveElements": [32]
|
|
40
|
+
}]);
|
|
28
41
|
function defineCustomElement$1() {
|
|
29
42
|
if (typeof customElements === "undefined") {
|
|
30
43
|
return;
|
|
@@ -13,7 +13,7 @@ const PostListItem$1 = /*@__PURE__*/ proxyCustomElement(class PostListItem exten
|
|
|
13
13
|
this.host.setAttribute('slot', 'post-list-item');
|
|
14
14
|
}
|
|
15
15
|
render() {
|
|
16
|
-
return (h(Host, { key: '
|
|
16
|
+
return (h(Host, { key: 'd15e750cd663def9363bedd020f09e634aba14c9', role: "listitem", slot: "post-list-item", version: version }, h("slot", { key: '361853e5c5994de4e5a5884cc32d7c7280b62b56' })));
|
|
17
17
|
}
|
|
18
18
|
get host() { return this; }
|
|
19
19
|
static get style() { return postListItemCss; }
|
|
@@ -2,7 +2,7 @@ import { proxyCustomElement, HTMLElement, h, Host } from '@stencil/core/internal
|
|
|
2
2
|
import { v as version } from './package.js';
|
|
3
3
|
import { n as nanoid } from './index.browser.js';
|
|
4
4
|
|
|
5
|
-
const postListCss = "
|
|
5
|
+
const postListCss = "post-list{display:flex;flex-direction:column;gap:var(--post-list-title-gap, 0)}post-list>[role=list]{display:flex;flex-direction:column;gap:var(--post-list-item-gap, 0)}post-list:where([horizontal]:not([horizontal=false])){flex-direction:row;align-items:center}post-list:where([horizontal]:not([horizontal=false]))>[role=list]{flex-direction:row;align-items:center}post-list>.list-title.visually-hidden{position:absolute;width:1px;height:1px;margin:-1px;padding:0;overflow:hidden;clip:rect(0 0 0 0);border:0}";
|
|
6
6
|
|
|
7
7
|
const PostList$1 = /*@__PURE__*/ proxyCustomElement(class PostList extends HTMLElement {
|
|
8
8
|
constructor() {
|
|
@@ -32,7 +32,7 @@ const PostList$1 = /*@__PURE__*/ proxyCustomElement(class PostList extends HTMLE
|
|
|
32
32
|
}
|
|
33
33
|
}
|
|
34
34
|
render() {
|
|
35
|
-
return (h(Host, { key: '
|
|
35
|
+
return (h(Host, { key: '27dc0177ba3d81149b6b5dce24d6f18b8f57c9e5', "data-version": version }, h("div", { key: 'f860eaeafc60605c67fb0c47e452ecfdbf03d002', ref: el => (this.titleEl = el), id: this.titleId, class: `list-title${this.titleHidden ? ' visually-hidden' : ''}` }, h("slot", { key: '17e20fdcf588649a9d678f873687cdedaef931aa' })), h("div", { key: 'aebdcd2fe4b5a4d232b0fe3de7f6273c93f505f6', role: "list", "aria-labelledby": this.titleId }, h("slot", { key: 'fa15f227e3251d44d1519421960bb5f3056fc371', name: "post-list-item" }))));
|
|
36
36
|
}
|
|
37
37
|
get host() { return this; }
|
|
38
38
|
static get style() { return postListCss; }
|
|
@@ -26,7 +26,7 @@ const PostLogo$1 = /*@__PURE__*/ proxyCustomElement(class PostLogo extends HTMLE
|
|
|
26
26
|
render() {
|
|
27
27
|
const logoLink = this.url && (typeof this.url === 'string' ? this.url : this.url.href);
|
|
28
28
|
const LogoTag = logoLink ? 'a' : 'span';
|
|
29
|
-
return (h(Host, { key: '
|
|
29
|
+
return (h(Host, { key: '1c268056329697baccc5bf65b1e66acd8531d5f3', "data-version": version }, h(LogoTag, { key: '9b73fc4922a5ea0f72d761e82136ef1111eb7e21', class: `logo ${logoLink ? 'logo-link' : ''}`, ...(logoLink ? { href: logoLink } : {}) }, h("span", { key: '4042a64056f3d22a99d6b245201be20d1afe5dc0', class: "description" }, h("slot", { key: 'eb437f087d952b4f4a961bcba0dc18eb6836c6c9', onSlotchange: () => this.checkDescription() })), h("svg", { key: 'b658e94d0e7f63d2f80245e12017f87f50a0b2c9', xmlns: "http://www.w3.org/2000/svg", viewBox: "0 0 72 72", "aria-hidden": "true" }, h("g", { key: '90c0c8f64d0c9023dfa7296e68333232b9023276', id: "Logo" }, h("rect", { key: 'a1dfd6e0bcaedb485398f1896603af36e3f119dc', fill: "#ffcc00", x: "0", y: "0", width: "72", height: "72" }), h("polygon", { key: '44d5ee8e45b7b320d75530e00ab1ff8dc4b8e21c', fill: "#ff0000", points: "34,32.3 34,19 19.7,19 19.7,29.1 10,29.1 10,42.9 19.7,42.9 19.7,53 34,53 34,39.7 30.6,39.7 30.6,49.8 23.1,49.8 23.1,39.7 13.4,39.7 13.4,32.3 23.1,32.3 23.1,22.2 30.6,22.2 30.6,32.3" }), h("path", { key: '788524d12213fdfe0d21712b14d72e30d0195b4d', d: "M53.56234,31.10526c0,2.41272-1.99154,4.29475-4.51723,4.29475H45.2v-8.3h3.84511C51.66802,27.1,53.56234,28.78889,53.56234,31.10526z M50.69666,19H36v34h9.2V42.9h5.49666c6.75131,0,11.9971-5.15137,11.9971-11.8057C62.69376,24.39136,57.35099,19,50.69666,19z" }))))));
|
|
30
30
|
}
|
|
31
31
|
get host() { return this; }
|
|
32
32
|
static get watchers() { return {
|
|
@@ -2,7 +2,7 @@ import { proxyCustomElement, HTMLElement, h, Host } from '@stencil/core/internal
|
|
|
2
2
|
import { v as version } from './package.js';
|
|
3
3
|
import { d as defineCustomElement$2 } from './post-icon2.js';
|
|
4
4
|
|
|
5
|
-
const postMainnavigationCss = "post-mainnavigation post-list-item>a{text-decoration:none;border-radius:0}post-mainnavigation post-list-item post-megadropdown-trigger 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;text-align:start}@media (forced-colors: active),(-ms-high-contrast: active),(-ms-high-contrast: white-on-black){post-mainnavigation post-list-item post-megadropdown-trigger button{background-color:ButtonFace !important}post-mainnavigation post-list-item post-megadropdown-trigger button:hover{background-color:Highlight !important}}post-mainnavigation post-list-item>a,post-mainnavigation post-list-item post-megadropdown-trigger button{flex:0 0 fit-content;white-space:nowrap;display:flex;align-items:center;justify-content:space-between}post-mainnavigation post-list-item>a:hover,post-mainnavigation post-list-item post-megadropdown-trigger button:hover{color:var(--post-scheme-color-interactive-primary-hover-fg1)}post-mainnavigation post-list-item>a:focus-visible,post-mainnavigation post-list-item post-megadropdown-trigger button:focus-visible{border-radius:4px;outline-offset:-2px !important}post-mainnavigation>button::after,post-mainnavigation post-megadropdown-trigger button::after{content:\"\";mask-image:url(\"data:image/svg+xml,%3Csvg viewBox='0 0 32 32' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='m23.6 13.2-7.5 7.6-7.6-7.6.9-.9 6.6 6.6 6.6-6.6z'/%3E%3C/svg%3E\");background-color:currentColor;color:currentColor;forced-color-adjust:preserve-parent-color;height:24px;width:24px}@media (forced-colors: active),(-ms-high-contrast: active),(-ms-high-contrast: white-on-black){post-mainnavigation>button,post-mainnavigation post-megadropdown-trigger button{border:1px solid ButtonBorder !important}post-mainnavigation>button:hover::after,post-mainnavigation>button[aria-expanded=true]::after,post-mainnavigation post-megadropdown-trigger button:hover::after,post-mainnavigation post-megadropdown-trigger button[aria-expanded=true]::after{color:HighlightText}}@media screen and (min-width: 1024px){post-mainnavigation{display:block;position:relative;height:var(--post-main-navigation-height, 0);background:#fff;user-select:none}post-mainnavigation nav{flex:1 1 auto;overflow:hidden;scroll-behavior:smooth}post-mainnavigation .scroll-control{cursor:pointer;position:absolute;inset-block:0;z-index:5;padding:16px;background:#fff;box-shadow:var(--post-device-elevation-500);line-height:1}post-mainnavigation .scroll-control.scroll-left{inset-inline-start:0}post-mainnavigation .scroll-control.scroll-right{inset-inline-end:0}post-mainnavigation .scroll-control.d-none{display:none}post-mainnavigation .scroll-control post-icon{font-size:1rem}post-mainnavigation post-list>[role=list]{flex-direction:row;max-width:100vw}post-mainnavigation post-list-item>a,post-mainnavigation post-list-item>button,post-mainnavigation post-list-item post-megadropdown-trigger button{position:sticky;padding-inline:12px;height:var(--post-main-navigation-height, 0);gap:4px;font-size:16px;z-index:4}}@media screen and (min-width: 1024px)and (max-width: 1023.98px){post-mainnavigation post-list-item>a,post-mainnavigation post-list-item>button,post-mainnavigation post-list-item post-megadropdown-trigger button{z-index:5}}@media screen and (min-width: 1024px){post-mainnavigation post-list-item>a .nav-el-active,post-mainnavigation post-list-item>button .nav-el-active,post-mainnavigation post-list-item post-megadropdown-trigger button .nav-el-active{font-weight:700;text-align:center;opacity:0}}@media screen and (min-width: 1024px){post-mainnavigation post-list-item>a .nav-el-inactive,post-mainnavigation post-list-item>button .nav-el-inactive,post-mainnavigation post-list-item post-megadropdown-trigger button .nav-el-inactive{position:absolute;opacity:1;text-align:center;width:100%;inset-inline-start:0}}@media screen and (min-width: 1024px){post-mainnavigation post-list-item>a.selected,post-mainnavigation post-list-item>a[aria-expanded=true],post-mainnavigation post-list-item>button.selected,post-mainnavigation post-list-item>button[aria-expanded=true],post-mainnavigation post-list-item post-megadropdown-trigger button.selected,post-mainnavigation post-list-item post-megadropdown-trigger button[aria-expanded=true]{background-color:#050400;color:#fff;font-weight:700}post-mainnavigation post-list-item>a.selected .nav-el-active,post-mainnavigation post-list-item>a[aria-expanded=true] .nav-el-active,post-mainnavigation post-list-item>button.selected .nav-el-active,post-mainnavigation post-list-item>button[aria-expanded=true] .nav-el-active,post-mainnavigation post-list-item post-megadropdown-trigger button.selected .nav-el-active,post-mainnavigation post-list-item post-megadropdown-trigger button[aria-expanded=true] .nav-el-active{opacity:1}post-mainnavigation post-list-item>a.selected .nav-el-inactive,post-mainnavigation post-list-item>a[aria-expanded=true] .nav-el-inactive,post-mainnavigation post-list-item>button.selected .nav-el-inactive,post-mainnavigation post-list-item>button[aria-expanded=true] .nav-el-inactive,post-mainnavigation post-list-item post-megadropdown-trigger button.selected .nav-el-inactive,post-mainnavigation post-list-item post-megadropdown-trigger button[aria-expanded=true] .nav-el-inactive{opacity:0}}@media screen and (min-width: 1024px){post-mainnavigation post-list-item>a:hover,post-mainnavigation post-list-item>button:hover,post-mainnavigation post-list-item post-megadropdown-trigger button:hover{background-color:#504f4b;color:#fff}}@media screen and (min-width: 1024px)and (max-width: 599.98px){post-mainnavigation post-list-item>a,post-mainnavigation post-list-item>button,post-mainnavigation post-list-item post-megadropdown-trigger button{font-size:14px}}@media screen and (min-width: 1024px){post-mainnavigation post-list-item>button,post-mainnavigation post-list-item post-megadropdown-trigger button{padding-inline-end:12px;transition:border-block-end-color 250ms cubic-bezier(0.4, 0, 0.2, 1)}post-mainnavigation post-list-item>button .nav-el-inactive,post-mainnavigation post-list-item post-megadropdown-trigger button .nav-el-inactive{width:calc(100% - 28px)}post-mainnavigation post-list-item>button::after,post-mainnavigation post-list-item post-megadropdown-trigger button::after{transition:transform 250ms cubic-bezier(0.4, 0, 0.2, 1)}post-mainnavigation post-list-item>button.selected::after,post-mainnavigation post-list-item>button[aria-expanded=true]::after,post-mainnavigation post-list-item post-megadropdown-trigger button.selected::after,post-mainnavigation post-list-item post-megadropdown-trigger button[aria-expanded=true]::after{transform:rotate(180deg)}}@media screen and (min-width: 1024px){post-mainnavigation post-megadropdown button:not(.btn-icon-close),post-mainnavigation post-megadropdown a{width:100%;min-width:100%;height:48px;padding-inline:8px 12px;gap:16px;font-weight:400;position:relative}post-mainnavigation post-megadropdown button:not(.btn-icon-close)::before,post-mainnavigation post-megadropdown a::before{content:\"\";background-color:#050400;bottom:0;width:100%;height:1px;position:absolute;left:0}post-mainnavigation post-megadropdown button:not(.btn-icon-close).selected,post-mainnavigation post-megadropdown button:not(.btn-icon-close)[aria-expanded=true],post-mainnavigation post-megadropdown a.selected,post-mainnavigation post-megadropdown a[aria-expanded=true]{background-color:#050400;color:#fff}post-mainnavigation post-megadropdown button:not(.btn-icon-close):hover,post-mainnavigation post-megadropdown a:hover{background-color:#504f4b;color:#fff}post-mainnavigation post-megadropdown button:not(.btn-icon-close):hover::before,post-mainnavigation post-megadropdown a:hover::before{background-color:#504f4b}}@media screen and (max-width: 1023.98px){post-mainnavigation nav{transform:none !important}post-mainnavigation .scroll-control{display:none}post-mainnavigation post-list-item>a,post-mainnavigation post-list-item>button,post-mainnavigation post-list-item post-megadropdown-trigger button{width:100%;min-width:100%;height:48px;padding-inline:8px 12px;gap:16px;font-weight:400;position:relative}post-mainnavigation post-list-item>a::before,post-mainnavigation post-list-item>button::before,post-mainnavigation post-list-item post-megadropdown-trigger button::before{content:\"\";background-color:#050400;bottom:0;width:100%;height:1px;position:absolute;left:0}post-mainnavigation post-list-item>a.selected,post-mainnavigation post-list-item>a[aria-expanded=true],post-mainnavigation post-list-item>button.selected,post-mainnavigation post-list-item>button[aria-expanded=true],post-mainnavigation post-list-item post-megadropdown-trigger button.selected,post-mainnavigation post-list-item post-megadropdown-trigger button[aria-expanded=true]{background-color:#050400;color:#fff}post-mainnavigation post-list-item>a:hover,post-mainnavigation post-list-item>button:hover,post-mainnavigation post-list-item post-megadropdown-trigger button:hover{background-color:#504f4b;color:#fff}post-mainnavigation post-list-item>a:hover::before,post-mainnavigation post-list-item>button:hover::before,post-mainnavigation post-list-item post-megadropdown-trigger button:hover::before{background-color:#504f4b}post-mainnavigation post-list-item>a .nav-el-inactive,post-mainnavigation post-list-item>button .nav-el-inactive,post-mainnavigation post-list-item post-megadropdown-trigger button .nav-el-inactive{display:none}post-mainnavigation>button::after,post-mainnavigation post-megadropdown-trigger button::after{transform:rotate(-90deg)}}";
|
|
5
|
+
const postMainnavigationCss = "post-mainnavigation post-list-item>a{text-decoration:none;border-radius:0}post-mainnavigation post-list-item post-megadropdown-trigger 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;text-align:start}@media (forced-colors: active),(-ms-high-contrast: active),(-ms-high-contrast: white-on-black){post-mainnavigation post-list-item post-megadropdown-trigger button{background-color:ButtonFace !important}post-mainnavigation post-list-item post-megadropdown-trigger button:hover{background-color:Highlight !important}}post-mainnavigation post-list-item>a,post-mainnavigation post-list-item post-megadropdown-trigger button{flex:0 0 fit-content;white-space:nowrap;display:flex;align-items:center;justify-content:space-between}post-mainnavigation post-list-item>a:hover,post-mainnavigation post-list-item post-megadropdown-trigger button:hover{color:var(--post-scheme-color-interactive-primary-hover-fg1)}post-mainnavigation post-list-item>a:focus-visible,post-mainnavigation post-list-item post-megadropdown-trigger button:focus-visible{border-radius:4px;outline-offset:-2px !important}post-mainnavigation>button::after,post-mainnavigation post-megadropdown-trigger button::after{content:\"\";mask-image:url(\"data:image/svg+xml,%3Csvg viewBox='0 0 32 32' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='m23.6 13.2-7.5 7.6-7.6-7.6.9-.9 6.6 6.6 6.6-6.6z'/%3E%3C/svg%3E\");background-color:currentColor;color:currentColor;forced-color-adjust:preserve-parent-color;height:24px;width:24px}@media (forced-colors: active),(-ms-high-contrast: active),(-ms-high-contrast: white-on-black){post-mainnavigation>button,post-mainnavigation post-megadropdown-trigger button{border:1px solid ButtonBorder !important}post-mainnavigation>button:hover::after,post-mainnavigation>button[aria-expanded=true]::after,post-mainnavigation post-megadropdown-trigger button:hover::after,post-mainnavigation post-megadropdown-trigger button[aria-expanded=true]::after{color:HighlightText}}@media screen and (min-width: 1024px){post-mainnavigation{display:block;position:relative;height:var(--post-main-navigation-height, 0);background:#fff;user-select:none}post-mainnavigation nav{flex:1 1 auto;overflow:hidden;scroll-behavior:smooth}post-mainnavigation .scroll-control{cursor:pointer;position:absolute;inset-block:0;z-index:5;padding:16px;background:#fff;box-shadow:var(--post-device-elevation-500);line-height:1}post-mainnavigation .scroll-control.scroll-left{inset-inline-start:0}post-mainnavigation .scroll-control.scroll-right{inset-inline-end:0}post-mainnavigation .scroll-control.d-none{display:none}post-mainnavigation .scroll-control post-icon{font-size:1rem}post-mainnavigation post-list>[role=list]{flex-direction:row;max-width:100vw}post-mainnavigation post-list-item>a,post-mainnavigation post-list-item>button,post-mainnavigation post-list-item post-megadropdown-trigger button{position:sticky;padding-inline:12px;height:var(--post-main-navigation-height, 0);gap:4px;font-size:16px;z-index:4}}@media screen and (min-width: 1024px)and (max-width: 1023.98px){post-mainnavigation post-list-item>a,post-mainnavigation post-list-item>button,post-mainnavigation post-list-item post-megadropdown-trigger button{z-index:5}}@media screen and (min-width: 1024px){post-mainnavigation post-list-item>a .nav-el-active,post-mainnavigation post-list-item>button .nav-el-active,post-mainnavigation post-list-item post-megadropdown-trigger button .nav-el-active{font-weight:700;text-align:center;opacity:0}}@media screen and (min-width: 1024px){post-mainnavigation post-list-item>a .nav-el-inactive,post-mainnavigation post-list-item>button .nav-el-inactive,post-mainnavigation post-list-item post-megadropdown-trigger button .nav-el-inactive{position:absolute;opacity:1;text-align:center;width:100%;inset-inline-start:0}}@media screen and (min-width: 1024px){post-mainnavigation post-list-item>a.selected,post-mainnavigation post-list-item>a[aria-current=page]:not(post-megadropdown *),post-mainnavigation post-list-item>a[aria-expanded=true],post-mainnavigation post-list-item>button.selected,post-mainnavigation post-list-item>button[aria-current=page]:not(post-megadropdown *),post-mainnavigation post-list-item>button[aria-expanded=true],post-mainnavigation post-list-item post-megadropdown-trigger button.selected,post-mainnavigation post-list-item post-megadropdown-trigger button[aria-current=page]:not(post-megadropdown *),post-mainnavigation post-list-item post-megadropdown-trigger button[aria-expanded=true]{background-color:#050400;color:#fff;font-weight:700}post-mainnavigation post-list-item>a.selected .nav-el-active,post-mainnavigation post-list-item>a[aria-current=page]:not(post-megadropdown *) .nav-el-active,post-mainnavigation post-list-item>a[aria-expanded=true] .nav-el-active,post-mainnavigation post-list-item>button.selected .nav-el-active,post-mainnavigation post-list-item>button[aria-current=page]:not(post-megadropdown *) .nav-el-active,post-mainnavigation post-list-item>button[aria-expanded=true] .nav-el-active,post-mainnavigation post-list-item post-megadropdown-trigger button.selected .nav-el-active,post-mainnavigation post-list-item post-megadropdown-trigger button[aria-current=page]:not(post-megadropdown *) .nav-el-active,post-mainnavigation post-list-item post-megadropdown-trigger button[aria-expanded=true] .nav-el-active{opacity:1}post-mainnavigation post-list-item>a.selected .nav-el-inactive,post-mainnavigation post-list-item>a[aria-current=page]:not(post-megadropdown *) .nav-el-inactive,post-mainnavigation post-list-item>a[aria-expanded=true] .nav-el-inactive,post-mainnavigation post-list-item>button.selected .nav-el-inactive,post-mainnavigation post-list-item>button[aria-current=page]:not(post-megadropdown *) .nav-el-inactive,post-mainnavigation post-list-item>button[aria-expanded=true] .nav-el-inactive,post-mainnavigation post-list-item post-megadropdown-trigger button.selected .nav-el-inactive,post-mainnavigation post-list-item post-megadropdown-trigger button[aria-current=page]:not(post-megadropdown *) .nav-el-inactive,post-mainnavigation post-list-item post-megadropdown-trigger button[aria-expanded=true] .nav-el-inactive{opacity:0}}@media screen and (min-width: 1024px){post-mainnavigation post-list-item>a:hover,post-mainnavigation post-list-item>button:hover,post-mainnavigation post-list-item post-megadropdown-trigger button:hover{background-color:#504f4b;color:#fff}}@media screen and (min-width: 1024px)and (max-width: 599.98px){post-mainnavigation post-list-item>a,post-mainnavigation post-list-item>button,post-mainnavigation post-list-item post-megadropdown-trigger button{font-size:14px}}@media screen and (min-width: 1024px){post-mainnavigation post-list-item>button,post-mainnavigation post-list-item post-megadropdown-trigger button{padding-inline-end:12px;transition:border-block-end-color 250ms cubic-bezier(0.4, 0, 0.2, 1)}post-mainnavigation post-list-item>button .nav-el-inactive,post-mainnavigation post-list-item post-megadropdown-trigger button .nav-el-inactive{width:calc(100% - 28px)}post-mainnavigation post-list-item>button::after,post-mainnavigation post-list-item post-megadropdown-trigger button::after{transition:transform 250ms cubic-bezier(0.4, 0, 0.2, 1)}post-mainnavigation post-list-item>button[aria-expanded=true]::after,post-mainnavigation post-list-item post-megadropdown-trigger button[aria-expanded=true]::after{transform:rotate(180deg)}}@media screen and (min-width: 1024px){post-mainnavigation post-megadropdown button:not(.btn-icon-close),post-mainnavigation post-megadropdown a{width:100%;min-width:100%;height:48px;padding-inline:8px 12px;gap:16px;font-weight:400;position:relative}post-mainnavigation post-megadropdown button:not(.btn-icon-close)::before,post-mainnavigation post-megadropdown a::before{content:\"\";background-color:#050400;bottom:0;width:100%;height:1px;position:absolute;left:0}post-mainnavigation post-megadropdown button:not(.btn-icon-close).selected,post-mainnavigation post-megadropdown button:not(.btn-icon-close)[aria-current=page],post-mainnavigation post-megadropdown button:not(.btn-icon-close)[aria-expanded=true],post-mainnavigation post-megadropdown a.selected,post-mainnavigation post-megadropdown a[aria-current=page],post-mainnavigation post-megadropdown a[aria-expanded=true]{background-color:#050400;color:#fff}post-mainnavigation post-megadropdown button:not(.btn-icon-close):hover,post-mainnavigation post-megadropdown a:hover{background-color:#504f4b;color:#fff}post-mainnavigation post-megadropdown button:not(.btn-icon-close):hover::before,post-mainnavigation post-megadropdown a:hover::before{background-color:#504f4b}}@media screen and (max-width: 1023.98px){post-mainnavigation nav{transform:none !important}post-mainnavigation .scroll-control{display:none}post-mainnavigation post-list-item>a,post-mainnavigation post-list-item>button,post-mainnavigation post-list-item post-megadropdown-trigger button{width:100%;min-width:100%;height:48px;padding-inline:8px 12px;gap:16px;font-weight:400;position:relative}post-mainnavigation post-list-item>a::before,post-mainnavigation post-list-item>button::before,post-mainnavigation post-list-item post-megadropdown-trigger button::before{content:\"\";background-color:#050400;bottom:0;width:100%;height:1px;position:absolute;left:0}post-mainnavigation post-list-item>a.selected,post-mainnavigation post-list-item>a[aria-current=page],post-mainnavigation post-list-item>a[aria-expanded=true],post-mainnavigation post-list-item>button.selected,post-mainnavigation post-list-item>button[aria-current=page],post-mainnavigation post-list-item>button[aria-expanded=true],post-mainnavigation post-list-item post-megadropdown-trigger button.selected,post-mainnavigation post-list-item post-megadropdown-trigger button[aria-current=page],post-mainnavigation post-list-item post-megadropdown-trigger button[aria-expanded=true]{background-color:#050400;color:#fff}post-mainnavigation post-list-item>a:hover,post-mainnavigation post-list-item>button:hover,post-mainnavigation post-list-item post-megadropdown-trigger button:hover{background-color:#504f4b;color:#fff}post-mainnavigation post-list-item>a:hover::before,post-mainnavigation post-list-item>button:hover::before,post-mainnavigation post-list-item post-megadropdown-trigger button:hover::before{background-color:#504f4b}post-mainnavigation post-list-item>a .nav-el-inactive,post-mainnavigation post-list-item>button .nav-el-inactive,post-mainnavigation post-list-item post-megadropdown-trigger button .nav-el-inactive{display:none}post-mainnavigation>button::after,post-mainnavigation post-megadropdown-trigger button::after{transform:rotate(-90deg)}}";
|
|
6
6
|
|
|
7
7
|
const SCROLL_REPEAT_INTERVAL = 100; // Interval for repeated scrolling when holding down scroll button
|
|
8
8
|
const NAVBAR_DISABLE_DURATION = 400; // Duration to temporarily disable navbar interactions during scrolling
|
|
@@ -148,7 +148,7 @@ const PostMainnavigation$1 = /*@__PURE__*/ proxyCustomElement(class PostMainnavi
|
|
|
148
148
|
}, NAVBAR_DISABLE_DURATION);
|
|
149
149
|
}
|
|
150
150
|
render() {
|
|
151
|
-
return (h(Host, { key: '
|
|
151
|
+
return (h(Host, { key: '1876abaa01a705b5bed07b6f4ab7f795ca994759', slot: "post-mainnavigation", version: version }, h("div", { key: 'c61592c959287dcf329921e11dd0d1414329b15a', "aria-hidden": "true", class: { 'scroll-control scroll-left': true, 'd-none': !this.canScrollLeft }, onMouseDown: e => this.handleScrollButtonClick(e, 'left') }, h("post-icon", { key: '51b460d2bfdb0ce52e2639f7521de67477972fba', "aria-hidden": "true", name: "chevronleft" })), h("nav", { key: '54d8f2a52c935713251d752b30ff163bf7bd8b5f', ref: el => (this.navbar = el) }, h("slot", { key: '749a000aa37381cbcf7a68514f77a4ff3da7e90b' })), h("div", { key: 'a42aa9a06704dfd4ebb2357b3dc1efa21f7ac136', "aria-hidden": "true", class: { 'scroll-control scroll-right': true, 'd-none': !this.canScrollRight }, onMouseDown: e => this.handleScrollButtonClick(e, 'right') }, h("post-icon", { key: '64ef94d58da05da4ea86c9458b7775c431d0461b', "aria-hidden": "true", name: "chevronright" }))));
|
|
152
152
|
}
|
|
153
153
|
static get style() { return postMainnavigationCss; }
|
|
154
154
|
}, [4, "post-mainnavigation", {
|
|
@@ -100,7 +100,7 @@ const PostMegadropdownTrigger$1 = /*@__PURE__*/ proxyCustomElement(class PostMeg
|
|
|
100
100
|
document.removeEventListener('postToggleMegadropdown', this.handleToggleMegadropdown);
|
|
101
101
|
}
|
|
102
102
|
render() {
|
|
103
|
-
return (h(Host, { key: '
|
|
103
|
+
return (h(Host, { key: 'b5194e2160ffc439f3219807ec86196c01f60d31', "data-version": version, "tab-index": "-1" }, h("button", { key: '3bf811bc35c85fc570a0b6ba3af9b5f7765676cb' }, h("slot", { key: '15b6f17c8b812b43b4aec56b5396b4e194ccd711' }))));
|
|
104
104
|
}
|
|
105
105
|
get host() { return this; }
|
|
106
106
|
static get watchers() { return {
|
|
@@ -3,7 +3,7 @@ import { g as getFocusableChildren } from './get-focusable-children.js';
|
|
|
3
3
|
import { v as version } from './package.js';
|
|
4
4
|
import { b as breakpoint } from './breakpoints.js';
|
|
5
5
|
|
|
6
|
-
const postMegadropdownCss = "@keyframes slide-in{0%{transform:translateX(100%)}100%{transform:translateX(0%)}}@keyframes slide-out{from{transform:translateX(0%)}to{transform:translateX(100%)}}@keyframes slide-down{from{transform:translateY(-100%)}to{transform:translateY(0%)}}@keyframes slide-up{0%{transform:translateY(0%)}100%{transform:translateY(-100%)}}*,::before,::after{box-sizing:border-box}.megadropdown-container{box-shadow:0 8px 6px rgba(0,0,0,.16);position:absolute;background-color:#fafafa;border:none;z-index:1;width:100%;inset-block-start:100%;inset-inline-start:0;border-radius:0}@media (forced-colors: active),(-ms-high-contrast: active),(-ms-high-contrast: white-on-black){.megadropdown-container{border-block-end:1px solid CanvasText}}.megadropdown-container.slide-in{animation:slide-down 350ms forwards}.megadropdown-container.slide-out{animation:slide-up 350ms forwards}@media screen and (max-width: 1023.98px){.megadropdown-container{z-index:5;position:fixed;inset-block-start:var(--post-header-navigation-current-inset);inset-inline:0;height:calc(min(var(--post-header-scroll-parent-height, 100dvh),100dvh) - var(--post-header-height));border-block-start:unset;overflow-y:auto;overscroll-behavior:contain}.megadropdown-container.slide-in{animation:slide-in 350ms forwards}.megadropdown-container.slide-out{animation:slide-out 350ms forwards}}@media screen and (min-width: 1024px){.megadropdown-container{max-height:calc(100vh - var(--post-header-height) - 48px);overflow-y:auto}}.megadropdown{padding:31px 40px 40px;background-color:#fafafa}@media screen and (max-width: 1023.98px){.megadropdown{display:flex;flex-direction:column;width:inherit;padding:16px 32px 24px}}@media screen and (max-width: 599.98px){.megadropdown{padding-inline:16px}}.megadropdown .megadropdown-content{gap:1.5rem;display:grid;grid-template-columns:repeat(auto-fit, minmax(min(15vw, 100%), 1fr));grid-auto-rows:1fr auto;grid-auto-flow:dense}@media screen and (max-width: 1023.98px){.megadropdown .megadropdown-content{grid-template-columns:repeat(auto-fit, minmax(min(35vw, 100%), 1fr))}}@media screen and (max-width: 599.98px){.megadropdown .megadropdown-content{grid-template-columns:1fr}}.megadropdown h2{display:none;margin-block:0 8px;font-weight:900}.megadropdown h2 a{text-decoration:none;display:none;font-weight:inherit;border-block:0}@media screen and (max-width: 1023.98px){.megadropdown h2{display:block;font-size:1.25rem}}@media screen and (max-width: 599.98px){.megadropdown h2{font-size:1.125rem}}.megadropdown post-list{display:grid;grid-row:span 2;grid-template-rows:subgrid;row-gap:0px}.megadropdown post-list>[role=list]{flex-direction:unset;display:unset}.megadropdown post-list>*{width:100%}.megadropdown post-list .list-title{display:flex;flex-direction:column-reverse;height:100%}.megadropdown post-list .list-title h3{font-size:20px;display:block;font-weight:900}.megadropdown post-list .list-title h3:not(:has(a)),.megadropdown post-list .list-title h3 a{padding:16px 12px 14px 8px}.megadropdown post-list .list-title h3:not(:has(a)){position:relative}.megadropdown post-list .list-title h3:not(:has(a))::before{content:\"\";background-color:#050400;inset-block-end:0;inset-inline-start:0;width:100%;height:2px;position:absolute}.megadropdown post-list .list-title h3 a{border-radius:0;text-decoration:none;font-size:inherit;display:flex;align-items:center;justify-content:space-between;min-height:53px;width:100%;min-width:100%;height:48px;padding-inline:8px 12px;gap:16px;font-weight:400;position:relative;height:unset;font-weight:900}.megadropdown post-list .list-title h3 a::before{content:\"\";background-color:#050400;bottom:0;width:100%;height:1px;position:absolute;left:0}.megadropdown post-list .list-title h3 a.selected,.megadropdown post-list .list-title h3 a[aria-expanded=true]{background-color:#050400;color:#fff}.megadropdown post-list .list-title h3 a:hover{background-color:#504f4b;color:#fff}.megadropdown post-list .list-title h3 a:hover::before{background-color:#504f4b}.megadropdown post-list .list-title h3 a::before{height:2px}@media screen and (max-width: 1023.98px){.megadropdown post-list .list-title h3{font-size:1rem}.megadropdown post-list .list-title h3:not(:has(a)),.megadropdown post-list .list-title h3 a{padding:14px 12px 12px 8px}}@media screen and (max-width: 599.98px){.megadropdown post-list .list-title h3{font-size:.875rem}}.megadropdown post-list-item>a{padding-block:13px 12px;padding-inline-start:8px;display:flex;text-decoration:none;width:100%;min-width:100%;height:auto;min-height:48px;white-space:normal;word-break:break-word}.megadropdown post-list-item>a:hover{border-block-width:0}@media screen and (min-width: 1024px){.megadropdown post-list-item>a{font-size:1.25rem}}@media screen and (max-width: 1023.98px){.megadropdown post-list-item>a{padding-block:12px 11px}}@media screen and (max-width: 599.98px){.megadropdown post-list-item>a{font-size:.875rem}}.megadropdown .back-button{display:none;margin-block-end:2rem}.megadropdown .back-button .btn{width:auto}@media screen and (max-width: 1023.98px){.megadropdown .back-button{order:-1;display:block}}.megadropdown .close-button{position:absolute;inset-block-start:1rem;inset-inline-end:1rem}@media screen and (max-width: 1023.98px){.megadropdown .close-button{display:none}}";
|
|
6
|
+
const postMegadropdownCss = "@keyframes slide-in{0%{transform:translateX(100%)}100%{transform:translateX(0%)}}@keyframes slide-out{from{transform:translateX(0%)}to{transform:translateX(100%)}}@keyframes slide-down{from{transform:translateY(-100%)}to{transform:translateY(0%)}}@keyframes slide-up{0%{transform:translateY(0%)}100%{transform:translateY(-100%)}}*,::before,::after{box-sizing:border-box}.megadropdown-container{box-shadow:0 8px 6px rgba(0,0,0,.16);position:absolute;background-color:#fafafa;border:none;z-index:1;width:100%;inset-block-start:100%;inset-inline-start:0;border-radius:0}@media (forced-colors: active),(-ms-high-contrast: active),(-ms-high-contrast: white-on-black){.megadropdown-container{border-block-end:1px solid CanvasText}}.megadropdown-container.slide-in{animation:slide-down 350ms forwards}.megadropdown-container.slide-out{animation:slide-up 350ms forwards}@media screen and (max-width: 1023.98px){.megadropdown-container{z-index:5;position:fixed;inset-block-start:var(--post-header-navigation-current-inset);inset-inline:0;height:calc(min(var(--post-header-scroll-parent-height, 100dvh),100dvh) - var(--post-header-height));border-block-start:unset;overflow-y:auto;overscroll-behavior:contain}.megadropdown-container.slide-in{animation:slide-in 350ms forwards}.megadropdown-container.slide-out{animation:slide-out 350ms forwards}}@media screen and (min-width: 1024px){.megadropdown-container{max-height:calc(100vh - var(--post-header-height) - 48px);overflow-y:auto}}.megadropdown{padding:31px 40px 40px;background-color:#fafafa}@media screen and (max-width: 1023.98px){.megadropdown{display:flex;flex-direction:column;width:inherit;padding:16px 32px 24px}}@media screen and (max-width: 599.98px){.megadropdown{padding-inline:16px}}.megadropdown .megadropdown-content{gap:1.5rem;display:grid;grid-template-columns:repeat(auto-fit, minmax(min(15vw, 100%), 1fr));grid-auto-rows:1fr auto;grid-auto-flow:dense}@media screen and (max-width: 1023.98px){.megadropdown .megadropdown-content{grid-template-columns:repeat(auto-fit, minmax(min(35vw, 100%), 1fr))}}@media screen and (max-width: 599.98px){.megadropdown .megadropdown-content{grid-template-columns:1fr}}.megadropdown h2{display:none;margin-block:0 8px;font-weight:900}.megadropdown h2 a{text-decoration:none;display:none;font-weight:inherit;border-block:0}@media screen and (max-width: 1023.98px){.megadropdown h2{display:block;font-size:1.25rem}}@media screen and (max-width: 599.98px){.megadropdown h2{font-size:1.125rem}}.megadropdown post-list{display:grid;grid-row:span 2;grid-template-rows:subgrid;row-gap:0px}.megadropdown post-list>[role=list]{flex-direction:unset;display:unset}.megadropdown post-list>*{width:100%}.megadropdown post-list .list-title{display:flex;flex-direction:column-reverse;height:100%}.megadropdown post-list .list-title h3{font-size:20px;display:block;font-weight:900}.megadropdown post-list .list-title h3:not(:has(a)),.megadropdown post-list .list-title h3 a{padding:16px 12px 14px 8px}.megadropdown post-list .list-title h3:not(:has(a)){position:relative}.megadropdown post-list .list-title h3:not(:has(a))::before{content:\"\";background-color:#050400;inset-block-end:0;inset-inline-start:0;width:100%;height:2px;position:absolute}.megadropdown post-list .list-title h3 a{border-radius:0;text-decoration:none;font-size:inherit;display:flex;align-items:center;justify-content:space-between;min-height:53px;width:100%;min-width:100%;height:48px;padding-inline:8px 12px;gap:16px;font-weight:400;position:relative;height:unset;font-weight:900}.megadropdown post-list .list-title h3 a::before{content:\"\";background-color:#050400;bottom:0;width:100%;height:1px;position:absolute;left:0}.megadropdown post-list .list-title h3 a.selected,.megadropdown post-list .list-title h3 a[aria-current=page],.megadropdown post-list .list-title h3 a[aria-expanded=true]{background-color:#050400;color:#fff}.megadropdown post-list .list-title h3 a:hover{background-color:#504f4b;color:#fff}.megadropdown post-list .list-title h3 a:hover::before{background-color:#504f4b}.megadropdown post-list .list-title h3 a::before{height:2px}@media screen and (max-width: 1023.98px){.megadropdown post-list .list-title h3{font-size:1rem}.megadropdown post-list .list-title h3:not(:has(a)),.megadropdown post-list .list-title h3 a{padding:14px 12px 12px 8px}}@media screen and (max-width: 599.98px){.megadropdown post-list .list-title h3{font-size:.875rem}}.megadropdown post-list-item>a{padding-block:13px 12px;padding-inline-start:8px;display:flex;text-decoration:none;width:100%;min-width:100%;height:auto;min-height:48px;white-space:normal;word-break:break-word}.megadropdown post-list-item>a:hover{border-block-width:0}@media screen and (min-width: 1024px){.megadropdown post-list-item>a{font-size:1.25rem}}@media screen and (max-width: 1023.98px){.megadropdown post-list-item>a{padding-block:12px 11px}}@media screen and (max-width: 599.98px){.megadropdown post-list-item>a{font-size:.875rem}}.megadropdown .back-button{display:none;margin-block-end:2rem}.megadropdown .back-button .btn{width:auto}@media screen and (max-width: 1023.98px){.megadropdown .back-button{order:-1;display:block}}.megadropdown .close-button{position:absolute;inset-block-start:1rem;inset-inline-end:1rem}@media screen and (max-width: 1023.98px){.megadropdown .close-button{display:none}}";
|
|
7
7
|
|
|
8
8
|
const PostMegadropdown$1 = /*@__PURE__*/ proxyCustomElement(class PostMegadropdown extends HTMLElement {
|
|
9
9
|
constructor() {
|
|
@@ -17,6 +17,7 @@ const PostMegadropdown$1 = /*@__PURE__*/ proxyCustomElement(class PostMegadropdo
|
|
|
17
17
|
* and updates automatically when the dropdown is toggled.
|
|
18
18
|
*/
|
|
19
19
|
this.isVisible = false;
|
|
20
|
+
this.trigger = false;
|
|
20
21
|
/** Holds the current animation class. */
|
|
21
22
|
this.animationClass = null;
|
|
22
23
|
this.handleClickOutside = (event) => {
|
|
@@ -51,7 +52,7 @@ const PostMegadropdown$1 = /*@__PURE__*/ proxyCustomElement(class PostMegadropdo
|
|
|
51
52
|
PostMegadropdown.activeDropdown = null;
|
|
52
53
|
}
|
|
53
54
|
}
|
|
54
|
-
|
|
55
|
+
componentDidRender() {
|
|
55
56
|
this.getFocusableElements();
|
|
56
57
|
}
|
|
57
58
|
/**
|
|
@@ -134,6 +135,14 @@ const PostMegadropdown$1 = /*@__PURE__*/ proxyCustomElement(class PostMegadropdo
|
|
|
134
135
|
getFocusableElements() {
|
|
135
136
|
const focusableEls = Array.from(this.host.querySelectorAll('post-list-item, h3, .back-button'));
|
|
136
137
|
const focusableChildren = focusableEls.flatMap(el => Array.from(getFocusableChildren(el)));
|
|
138
|
+
const hostId = this.host.getAttribute('id');
|
|
139
|
+
// Proceed if the host has an ID and one of its focusable children is marked as the current page (`aria-current="page"`)
|
|
140
|
+
if (hostId && focusableChildren.some(el => el.getAttribute('aria-current') === 'page')) {
|
|
141
|
+
// Find the trigger element via its "for" attribute, then locate its button and set `aria-current="page"`
|
|
142
|
+
document
|
|
143
|
+
.querySelector(`post-megadropdown-trigger[for="${hostId}"] > button`)
|
|
144
|
+
.classList.add('selected');
|
|
145
|
+
}
|
|
137
146
|
this.firstFocusableEl = focusableChildren[0];
|
|
138
147
|
this.lastFocusableEl = focusableChildren[focusableChildren.length - 1];
|
|
139
148
|
}
|
|
@@ -161,13 +170,14 @@ const PostMegadropdown$1 = /*@__PURE__*/ proxyCustomElement(class PostMegadropdo
|
|
|
161
170
|
}
|
|
162
171
|
render() {
|
|
163
172
|
const containerStyle = this.isVisible ? {} : { display: 'none' };
|
|
164
|
-
return (h(Host, { key: '
|
|
173
|
+
return (h(Host, { key: '18685d3da311fd0563a3c5a498df1e1fef96b524', version: version }, h("div", { key: 'fb3feb160e46b80ed60c202871152ac3f7862f83', class: `megadropdown-container ${this.animationClass || ''}`, style: containerStyle, onAnimationEnd: () => this.handleAnimationEnd() }, h("div", { key: '34e0d3e68bd9bfbeec8ebe37b8977076c91cfe02', class: "megadropdown" }, h("slot", { key: '67d17ec51f7436f2a8acc1216b37820ff999f985', name: "megadropdown-title" }), h("div", { key: '6671d31fcc17d435991a253f04a83bbe56551942', class: "megadropdown-content" }, h("slot", { key: 'd0d313a98202f2d502e4574bed8802682d4da6f3' })), h("div", { key: 'd42560e7a4f3142cb548a1ffb97ad391fd14871f', onClick: () => this.hide(true), class: "back-button" }, h("slot", { key: '76f0a36d5ca87834b9d857a8f13d53ecb82f9a24', name: "back-button" })), h("div", { key: 'a9ea0c1f24f5c997a1a4c9432f0c7d537b8d6da0', onClick: () => this.hide(true), class: "close-button" }, h("slot", { key: '1c815102d7f4d1e21aaaaffcf277d98454eda17d', name: "close-button" }))))));
|
|
165
174
|
}
|
|
166
175
|
get host() { return this; }
|
|
167
176
|
static get style() { return postMegadropdownCss; }
|
|
168
177
|
}, [4, "post-megadropdown", {
|
|
169
178
|
"device": [32],
|
|
170
179
|
"isVisible": [32],
|
|
180
|
+
"trigger": [32],
|
|
171
181
|
"animationClass": [32],
|
|
172
182
|
"toggle": [64],
|
|
173
183
|
"show": [64],
|
|
@@ -9,7 +9,7 @@ const PostMenuItem = /*@__PURE__*/ proxyCustomElement(class PostMenuItem extends
|
|
|
9
9
|
this.__registerHost();
|
|
10
10
|
}
|
|
11
11
|
render() {
|
|
12
|
-
return (h(Host, { key: '
|
|
12
|
+
return (h(Host, { key: '9d6015291b82728739de4263a62a59ad4a99c94d', "data-version": version }, h("slot", { key: '51f5ff356cddffc806639cc343437500f898065e' })));
|
|
13
13
|
}
|
|
14
14
|
static get style() { return postMenuItemCss; }
|
|
15
15
|
}, [4, "post-menu-item"]);
|
|
@@ -80,7 +80,7 @@ const PostMenuTrigger = /*@__PURE__*/ proxyCustomElement(class PostMenuTrigger e
|
|
|
80
80
|
}
|
|
81
81
|
}
|
|
82
82
|
render() {
|
|
83
|
-
return (h(Host, { key: '
|
|
83
|
+
return (h(Host, { key: '14592f9564fdb09b2e809374d5794bf71f576dbb', "data-version": version, "tab-index": "-1" }, h("slot", { key: 'a0f463000420df39035cc5a48369d230394b5e04' })));
|
|
84
84
|
}
|
|
85
85
|
get host() { return this; }
|
|
86
86
|
static get watchers() { return {
|
|
@@ -7,7 +7,7 @@ import './breakpoints.js';
|
|
|
7
7
|
import { E as EventFrom } from './event-from.js';
|
|
8
8
|
import { g as getRoot } from './get-root.js';
|
|
9
9
|
|
|
10
|
-
const postMenuCss = "
|
|
10
|
+
const postMenuCss = ":host{display:block}:where([part=menu]){display:flex;flex-direction:column;padding-block:.5rem}";
|
|
11
11
|
|
|
12
12
|
var __decorate = (undefined && undefined.__decorate) || function (decorators, target, key, desc) {
|
|
13
13
|
var c = arguments.length, r = c < 3 ? target : desc === null ? desc = Object.getOwnPropertyDescriptor(target, key) : desc, d;
|
|
@@ -59,18 +59,32 @@ const PostMenu = /*@__PURE__*/ proxyCustomElement(class PostMenu extends HTMLEle
|
|
|
59
59
|
}
|
|
60
60
|
};
|
|
61
61
|
this.handlePostToggle = (event) => {
|
|
62
|
-
this.isVisible = event.detail;
|
|
62
|
+
this.isVisible = event.detail.isOpen;
|
|
63
63
|
this.toggleMenu.emit(this.isVisible);
|
|
64
64
|
requestAnimationFrame(() => {
|
|
65
65
|
if (this.isVisible) {
|
|
66
66
|
this.lastFocusedElement = this.root?.activeElement;
|
|
67
67
|
const menuItems = this.getSlottedItems();
|
|
68
|
-
if (
|
|
69
|
-
menuItems
|
|
68
|
+
if (event.detail.first) {
|
|
69
|
+
if (menuItems.length > 0) {
|
|
70
|
+
// Add role="menu" to the popovercontainer
|
|
71
|
+
this.host.setAttribute('role', 'menu');
|
|
72
|
+
// Add role="menuitem" to the focusable elements
|
|
73
|
+
menuItems.forEach(item => {
|
|
74
|
+
item.setAttribute('role', 'menuitem');
|
|
75
|
+
});
|
|
76
|
+
// Add aria-label to the menu
|
|
77
|
+
if (this.label)
|
|
78
|
+
this.host.setAttribute('aria-label', this.label);
|
|
79
|
+
}
|
|
70
80
|
}
|
|
81
|
+
menuItems[0].focus();
|
|
71
82
|
}
|
|
72
83
|
else if (this.lastFocusedElement) {
|
|
73
|
-
|
|
84
|
+
setTimeout(() => {
|
|
85
|
+
// This timeout is added for NVDA to announce the menu as collapsed
|
|
86
|
+
this.lastFocusedElement.focus();
|
|
87
|
+
}, 0);
|
|
74
88
|
}
|
|
75
89
|
});
|
|
76
90
|
};
|
|
@@ -181,7 +195,7 @@ const PostMenu = /*@__PURE__*/ proxyCustomElement(class PostMenu extends HTMLEle
|
|
|
181
195
|
.flatMap(el => Array.from(getFocusableChildren(el))));
|
|
182
196
|
}
|
|
183
197
|
render() {
|
|
184
|
-
return (h(Host, { key: '
|
|
198
|
+
return (h(Host, { key: '7b7fe6fccd27d3ff12eae3094b1a55b9b9778eb1', "data-version": version }, h("post-popovercontainer", { key: '6dae2883febd1e96ae1b34518dd2e9c634fafecb', placement: this.placement, ref: e => (this.popoverRef = e) }, h("div", { key: 'e19c107831b020aa0039ea7a18465e4bb72380c4', part: "menu" }, h("slot", { key: '9d9862e73dd222435d196e67c540bf8266952d94' })))));
|
|
185
199
|
}
|
|
186
200
|
get host() { return this; }
|
|
187
201
|
static get watchers() { return {
|
|
@@ -190,6 +204,7 @@ const PostMenu = /*@__PURE__*/ proxyCustomElement(class PostMenu extends HTMLEle
|
|
|
190
204
|
static get style() { return postMenuCss; }
|
|
191
205
|
}, [1, "post-menu", {
|
|
192
206
|
"placement": [1],
|
|
207
|
+
"label": [1],
|
|
193
208
|
"isVisible": [32],
|
|
194
209
|
"toggle": [64],
|
|
195
210
|
"show": [64],
|