@swisspost/design-system-components 10.0.0-next.50 → 10.0.0-next.52
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/focusable-D6snQLqS.js +5020 -0
- package/dist/cjs/get-focusable-children-Bx63XUQg.js +67 -0
- package/dist/cjs/{index-CpDyH7Ww.js → index-Cb8CTrOz.js} +13 -9
- package/dist/cjs/loader.cjs.js +2 -2
- package/dist/cjs/{package-qtH-QrKv.js → package-B7Ni5Tuu.js} +1 -1
- package/dist/cjs/post-accordion_2.cjs.entry.js +3 -3
- package/dist/cjs/post-avatar.cjs.entry.js +2 -2
- package/dist/cjs/post-back-to-top.cjs.entry.js +3 -3
- package/dist/cjs/post-banner.cjs.entry.js +2 -2
- package/dist/cjs/post-breadcrumb-item_2.cjs.entry.js +5 -5
- package/dist/cjs/post-breadcrumbs.cjs.entry.js +12 -11
- package/dist/cjs/post-card-control.cjs.entry.js +2 -2
- package/dist/cjs/post-closebutton_15.cjs.entry.js +128 -110
- package/dist/cjs/post-collapsible_2.cjs.entry.js +2 -2
- package/dist/cjs/post-components.cjs.js +2 -2
- package/dist/cjs/post-footer.cjs.entry.js +2 -2
- package/dist/cjs/post-linkarea.cjs.entry.js +2 -2
- package/dist/cjs/post-popover-trigger.cjs.entry.js +109 -0
- package/dist/cjs/post-popover.cjs.entry.js +22 -104
- package/dist/cjs/post-rating.cjs.entry.js +4 -8
- package/dist/cjs/post-tab-header.cjs.entry.js +3 -3
- package/dist/cjs/post-tab-panel.cjs.entry.js +3 -3
- package/dist/cjs/post-tabs.cjs.entry.js +3 -3
- package/dist/cjs/post-tooltip-trigger.cjs.entry.js +6 -5022
- package/dist/cjs/post-tooltip.cjs.entry.js +3 -3
- package/dist/collection/collection-manifest.json +1 -0
- package/dist/collection/components/post-accordion-item/post-accordion-item.js +1 -1
- package/dist/collection/components/post-back-to-top/post-back-to-top.js +1 -1
- package/dist/collection/components/post-breadcrumb-item/post-breadcrumb-item.js +1 -1
- package/dist/collection/components/post-breadcrumbs/post-breadcrumbs.js +34 -13
- package/dist/collection/components/post-closebutton/post-closebutton.css +1 -1
- package/dist/collection/components/post-mainnavigation/post-mainnavigation.css +1 -1
- package/dist/collection/components/post-megadropdown/post-megadropdown.css +1 -1
- package/dist/collection/components/post-megadropdown/post-megadropdown.js +9 -2
- package/dist/collection/components/post-megadropdown-trigger/post-megadropdown-trigger.js +1 -1
- package/dist/collection/components/post-menu/post-menu.js +29 -33
- package/dist/collection/components/post-menu-item/post-menu-item.css +1 -1
- 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.js +21 -77
- package/dist/collection/components/post-popover-trigger/post-popover-trigger.css +1 -0
- package/dist/collection/components/post-popover-trigger/post-popover-trigger.js +145 -0
- package/dist/collection/components/post-popovercontainer/post-popovercontainer.js +153 -32
- package/dist/collection/components/post-rating/post-rating.js +4 -9
- 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.css +1 -1
- package/dist/collection/components/post-tooltip-trigger/post-tooltip-trigger.js +1 -1
- package/dist/collection/utils/get-focusable-children.js +34 -5
- package/dist/component-names.json +1 -0
- package/dist/components/focusable.js +5018 -0
- package/dist/components/get-focusable-children.js +35 -6
- package/dist/components/index.d.ts +2 -0
- package/dist/components/index.js +1 -0
- package/dist/components/package.js +1 -1
- package/dist/components/post-accordion-item2.js +1 -1
- package/dist/components/post-back-to-top.js +1 -1
- package/dist/components/post-breadcrumb-item2.js +1 -1
- package/dist/components/post-breadcrumbs.js +14 -11
- package/dist/components/post-closebutton2.js +1 -1
- package/dist/components/post-mainnavigation.js +1 -1
- package/dist/components/post-megadropdown-trigger.js +1 -1
- package/dist/components/post-megadropdown.js +10 -3
- package/dist/components/post-menu-item2.js +2 -2
- package/dist/components/post-menu-trigger2.js +1 -1
- package/dist/components/post-menu2.js +27 -31
- package/dist/components/post-popover-trigger.d.ts +11 -0
- package/dist/components/post-popover-trigger.js +132 -0
- package/dist/components/post-popover.js +17 -99
- package/dist/components/post-popovercontainer2.js +82 -32
- package/dist/components/post-rating.js +2 -6
- package/dist/components/post-tab-header.js +1 -1
- package/dist/components/post-tab-panel.js +1 -1
- package/dist/components/post-tabs.js +1 -1
- package/dist/components/post-togglebutton.js +1 -1
- package/dist/components/post-tooltip-trigger.js +6 -5022
- package/dist/components/post-tooltip.js +1 -1
- package/dist/components/react/index.js +1 -1
- package/dist/components/react/{p-CDsgZHvX.js → p-B35HsBxh.js} +83 -33
- package/dist/components/react/{p-BuKAaKXE.js → p-BL8WEb6K.js} +3 -3
- package/dist/components/react/p-BVXiQdHq.js +64 -0
- package/dist/components/react/{p-BmpB1vs4.js → p-By7jk8fL.js} +1 -1
- package/dist/components/react/{p-BXPcgIqO.js → p-C4zJkcAb.js} +3 -3
- package/dist/components/react/{p-U9MTjvRU.js → p-CQhnMei5.js} +2 -2
- package/dist/components/react/{p-BlOv-NDA.js → p-CrEdcwed.js} +5 -5
- package/dist/components/react/{p-DnHwlsBi.js → p-Dl8clYLV.js} +3 -3
- package/dist/components/react/{p-B9Y7UQKI.js → p-DnhWNGb-.js} +1 -1
- package/dist/components/react/{p-BcVKzjda.js → p-DnqwBx5e.js} +1 -1
- package/dist/components/react/{p-Bw6vnK1I.js → p-Due3yZDR.js} +30 -34
- package/dist/components/react/p-HygIVKXC.js +5018 -0
- package/dist/components/react/p-kxuZ8mOU.js +3 -0
- package/dist/components/react/{p-B392lG2N.js → p-lC8Sp5tg.js} +1 -1
- 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 +1 -1
- package/dist/components/react/post-back-to-top.js +3 -3
- package/dist/components/react/post-banner.js +1 -1
- package/dist/components/react/post-breadcrumb-item.js +1 -1
- package/dist/components/react/post-breadcrumbs.js +21 -18
- package/dist/components/react/post-card-control.js +2 -2
- package/dist/components/react/post-closebutton.js +1 -1
- 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 +6 -6
- package/dist/components/react/post-header.js +2 -2
- package/dist/components/react/post-icon.js +1 -1
- package/dist/components/react/post-language-option.js +1 -1
- package/dist/components/react/post-language-switch.js +5 -5
- package/dist/components/react/post-linkarea.js +1 -1
- package/dist/components/react/post-list-item.js +1 -1
- package/dist/components/react/post-list.js +1 -1
- package/dist/components/react/post-logo.js +1 -1
- package/dist/components/react/post-mainnavigation.js +3 -3
- package/dist/components/react/post-megadropdown-trigger.js +2 -2
- package/dist/components/react/post-megadropdown.js +12 -5
- 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-trigger.d.ts +11 -0
- package/dist/components/react/post-popover-trigger.js +133 -0
- package/dist/components/react/post-popover.js +21 -103
- package/dist/components/react/post-popovercontainer.js +1 -1
- package/dist/components/react/post-rating.js +4 -8
- package/dist/components/react/post-tab-header.js +2 -2
- 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 +4 -5020
- package/dist/components/react/post-tooltip.js +3 -3
- package/dist/docs.json +206 -42
- package/dist/esm/focusable-HygIVKXC.js +5018 -0
- package/dist/esm/get-focusable-children-D9ZHp2FP.js +64 -0
- package/dist/esm/{index-C8a0ddDa.js → index-CFNKgUjL.js} +13 -9
- package/dist/esm/loader.js +3 -3
- package/dist/esm/package-kxuZ8mOU.js +3 -0
- package/dist/esm/post-accordion_2.entry.js +3 -3
- package/dist/esm/post-avatar.entry.js +2 -2
- package/dist/esm/post-back-to-top.entry.js +3 -3
- package/dist/esm/post-banner.entry.js +2 -2
- package/dist/esm/post-breadcrumb-item_2.entry.js +5 -5
- package/dist/esm/post-breadcrumbs.entry.js +13 -12
- package/dist/esm/post-card-control.entry.js +2 -2
- package/dist/esm/post-closebutton_15.entry.js +125 -107
- package/dist/esm/post-collapsible_2.entry.js +2 -2
- package/dist/esm/post-components.js +3 -3
- package/dist/esm/post-footer.entry.js +2 -2
- package/dist/esm/post-linkarea.entry.js +2 -2
- package/dist/esm/post-popover-trigger.entry.js +107 -0
- package/dist/esm/post-popover.entry.js +19 -101
- package/dist/esm/post-rating.entry.js +4 -8
- package/dist/esm/post-tab-header.entry.js +3 -3
- package/dist/esm/post-tab-panel.entry.js +3 -3
- package/dist/esm/post-tabs.entry.js +3 -3
- package/dist/esm/post-tooltip-trigger.entry.js +5 -5021
- package/dist/esm/post-tooltip.entry.js +3 -3
- package/dist/post-components/{p-1253185c.entry.js → p-1096ed89.entry.js} +1 -1
- package/dist/post-components/{p-0a4d9f33.entry.js → p-12183522.entry.js} +1 -1
- package/dist/post-components/{p-b82e7cbe.entry.js → p-173dcaab.entry.js} +1 -1
- package/dist/post-components/p-1d7418ce.entry.js +1 -0
- package/dist/post-components/p-244a47db.entry.js +1 -0
- package/dist/post-components/p-264c5f97.entry.js +1 -0
- package/dist/post-components/{p-e7fbb03d.entry.js → p-290ea78f.entry.js} +1 -1
- package/dist/post-components/p-2f8cad6c.entry.js +1 -0
- package/dist/post-components/p-47e43863.entry.js +1 -0
- package/dist/post-components/{p-5ddde390.entry.js → p-50a5c57f.entry.js} +1 -1
- package/dist/post-components/p-6d8f95de.entry.js +1 -0
- package/dist/post-components/p-72e56701.entry.js +1 -0
- package/dist/post-components/p-81d78878.entry.js +1 -0
- package/dist/post-components/p-8a6467b4.entry.js +1 -0
- package/dist/post-components/{p-15e0d4b8.entry.js → p-9e461598.entry.js} +1 -1
- package/dist/post-components/p-CFNKgUjL.js +2 -0
- package/dist/post-components/p-D9ZHp2FP.js +1 -0
- package/dist/post-components/p-HygIVKXC.js +1 -0
- package/dist/post-components/p-a92b241a.entry.js +1 -0
- package/dist/post-components/{p-f9d044a3.entry.js → p-c84e7f02.entry.js} +1 -1
- package/dist/post-components/{p-048d2c1a.entry.js → p-e37d9a31.entry.js} +1 -1
- package/dist/post-components/p-f62f52d7.entry.js +1 -0
- package/dist/post-components/p-kxuZ8mOU.js +1 -0
- package/dist/post-components/post-components.css +1 -1
- package/dist/post-components/post-components.esm.js +1 -1
- package/dist/types/components/post-breadcrumbs/post-breadcrumbs.d.ts +6 -1
- package/dist/types/components/post-menu/post-menu.d.ts +4 -3
- package/dist/types/components/post-popover/post-popover.d.ts +5 -10
- package/dist/types/components/post-popover-trigger/post-popover-trigger.d.ts +37 -0
- package/dist/types/components/post-popovercontainer/post-popovercontainer.d.ts +34 -5
- package/dist/types/components.d.ts +66 -13
- package/dist/types/utils/get-focusable-children.d.ts +1 -0
- package/hydrate/index.js +6708 -6595
- package/hydrate/index.mjs +6708 -6595
- package/package.json +7 -7
- package/dist/components/react/p-C35MCWIp.js +0 -35
- package/dist/components/react/p-DimG3b3P.js +0 -3
- package/dist/esm/package-DimG3b3P.js +0 -3
- package/dist/post-components/p-11abb64f.entry.js +0 -1
- package/dist/post-components/p-1d4252ba.entry.js +0 -1
- package/dist/post-components/p-3d30eafa.entry.js +0 -1
- package/dist/post-components/p-4114fc83.entry.js +0 -1
- package/dist/post-components/p-89411986.entry.js +0 -1
- package/dist/post-components/p-9bbf7271.entry.js +0 -1
- package/dist/post-components/p-C8a0ddDa.js +0 -2
- package/dist/post-components/p-DimG3b3P.js +0 -1
- package/dist/post-components/p-b034d196.entry.js +0 -1
- package/dist/post-components/p-b36c129a.entry.js +0 -1
- package/dist/post-components/p-f1d53256.entry.js +0 -1
- package/dist/post-components/p-f97f3a19.entry.js +0 -1
|
@@ -1,51 +1,18 @@
|
|
|
1
1
|
'use strict';
|
|
2
2
|
|
|
3
|
-
var index = require('./index-
|
|
4
|
-
var _package = require('./package-
|
|
3
|
+
var index = require('./index-Cb8CTrOz.js');
|
|
4
|
+
var _package = require('./package-B7Ni5Tuu.js');
|
|
5
5
|
var index$1 = require('./index-DtvYdwe1.js');
|
|
6
6
|
var breakpoints = require('./breakpoints-CEkeixld.js');
|
|
7
|
+
var getFocusableChildren = require('./get-focusable-children-Bx63XUQg.js');
|
|
7
8
|
var eventFrom = require('./event-from-CLvtSUKf.js');
|
|
8
9
|
var index_browser = require('./index.browser-Doj636JV.js');
|
|
9
10
|
var placement = require('./placement-qEFR9hmI.js');
|
|
10
11
|
var getRoot = require('./get-root-CyMf3Vsd.js');
|
|
11
12
|
|
|
12
|
-
const focusableSelector = `:where(${[
|
|
13
|
-
'button',
|
|
14
|
-
'input:not([type="hidden"])',
|
|
15
|
-
'[tabindex]',
|
|
16
|
-
'select',
|
|
17
|
-
'textarea',
|
|
18
|
-
'[contenteditable]',
|
|
19
|
-
'a[href]',
|
|
20
|
-
'iframe',
|
|
21
|
-
'audio[controls]',
|
|
22
|
-
'video[controls]',
|
|
23
|
-
'area[href]',
|
|
24
|
-
'details > summary:first-of-type',
|
|
25
|
-
].join(',')})`;
|
|
26
|
-
const focusDisablingSelector = `:where(${[
|
|
27
|
-
'[inert]',
|
|
28
|
-
'[inert] *',
|
|
29
|
-
':disabled',
|
|
30
|
-
'dialog:not([open]) *',
|
|
31
|
-
'[popover]:not(:popover-open) *',
|
|
32
|
-
'details:not([open]) > *:not(details > summary:first-of-type)',
|
|
33
|
-
'details:not([open]) > *:not(details > summary:first-of-type) *',
|
|
34
|
-
'[tabindex^="-"]',
|
|
35
|
-
'[hidden]:not([hidden="false"])',
|
|
36
|
-
].join(',')})`;
|
|
37
|
-
function getFocusableChildren(element) {
|
|
38
|
-
const focusableChildren = element.querySelectorAll(`${focusableSelector}:not(${focusDisablingSelector})`);
|
|
39
|
-
const visibleFocusableChildren = Array.from(focusableChildren).filter(child => {
|
|
40
|
-
const style = window.getComputedStyle(child.parentElement);
|
|
41
|
-
return style.display !== 'none' && style.visibility !== 'hidden';
|
|
42
|
-
});
|
|
43
|
-
return visibleFocusableChildren;
|
|
44
|
-
}
|
|
45
|
-
|
|
46
13
|
const BUTTON_TYPES = ['button', 'submit', 'reset'];
|
|
47
14
|
|
|
48
|
-
const postClosebuttonCss = ".visually-hidden{position:absolute;width:1px;height:1px;margin:-1px;padding:0;overflow:hidden;clip:rect(0 0 0 0);border:0}post-closebutton .btn{padding:0;border:unset;min-height:unset;min-width:unset;width:var(--post-device-sizing-notification-1);height:var(--post-device-sizing-notification-1);border-radius:var(--post-device-border-radius-round);background-color:var(--post-scheme-color-interactive-button-tertiary-enabled-bg);color:var(--post-scheme-color-interactive-button-tertiary-enabled-fg)}post-closebutton .btn>post-icon{min-width:var(--post-device-sizing-interactive-icon-size4);width:var(--post-device-sizing-interactive-icon-size4);height:var(--post-device-sizing-interactive-icon-size4)}post-closebutton .btn:not(:disabled):hover,post-closebutton .btn.pretend-hover{cursor:pointer;background-color:var(--post-scheme-color-interactive-button-tertiary-hover-bg);color:var(--post-scheme-color-interactive-button-tertiary-hover-fg)}@media (forced-colors: active),(-ms-high-contrast: active),(-ms-high-contrast: white-on-black){post-closebutton .btn:not(:disabled):hover,post-closebutton .btn.pretend-hover{color:HighlightText !important}}";
|
|
15
|
+
const postClosebuttonCss = ".visually-hidden{position:absolute;width:1px;height:1px;margin:-1px;padding:0;overflow:hidden;clip:rect(0 0 0 0);border:0}post-closebutton .btn{padding:0;border:unset;min-height:unset;min-width:unset;width:var(--post-device-sizing-notification-1);height:var(--post-device-sizing-notification-1);border-radius:var(--post-device-border-radius-round);background-color:var(--post-scheme-color-interactive-button-tertiary-enabled-bg);color:var(--post-scheme-color-interactive-button-tertiary-enabled-fg);display:flex;align-items:center;justify-content:center}post-closebutton .btn>post-icon{min-width:var(--post-device-sizing-interactive-icon-size4);width:var(--post-device-sizing-interactive-icon-size4);height:var(--post-device-sizing-interactive-icon-size4)}post-closebutton .btn:not(:disabled):hover,post-closebutton .btn.pretend-hover{cursor:pointer;background-color:var(--post-scheme-color-interactive-button-tertiary-hover-bg);color:var(--post-scheme-color-interactive-button-tertiary-hover-fg)}@media (forced-colors: active),(-ms-high-contrast: active),(-ms-high-contrast: white-on-black){post-closebutton .btn:not(:disabled):hover,post-closebutton .btn.pretend-hover{color:HighlightText !important}}";
|
|
49
16
|
|
|
50
17
|
const PostClosebutton = class {
|
|
51
18
|
constructor(hostRef) {
|
|
@@ -287,7 +254,7 @@ const PostHeader = class {
|
|
|
287
254
|
// Add the main toggle menu button to the list of focusable children
|
|
288
255
|
const focusableChildren = [
|
|
289
256
|
this.host.querySelector('post-togglebutton'),
|
|
290
|
-
...focusableEls.flatMap(el => Array.from(getFocusableChildren(el))),
|
|
257
|
+
...focusableEls.flatMap(el => Array.from(getFocusableChildren.getFocusableChildren(el))),
|
|
291
258
|
];
|
|
292
259
|
this.firstFocusableEl = focusableChildren[0];
|
|
293
260
|
this.lastFocusableEl = focusableChildren[focusableChildren.length - 1];
|
|
@@ -759,7 +726,7 @@ const PostLogo = class {
|
|
|
759
726
|
};
|
|
760
727
|
PostLogo.style = postLogoCss;
|
|
761
728
|
|
|
762
|
-
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:flex;overflow:hidden;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;z-index:5;padding:1rem;background:#fff;box-shadow:var(--post-device-elevation-500);line-height:1}post-mainnavigation .scroll-control.scroll-left{margin-inline-end:-3rem}post-mainnavigation .scroll-control.scroll-right{margin-inline-start:-3rem}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.active,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.active,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.active,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.active .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.active .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.active .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.active .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.active .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.active .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(:is(post-closebutton *)),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(:is(post-closebutton *))::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(:is(post-closebutton *)).active,post-mainnavigation post-megadropdown button:not(:is(post-closebutton *))[aria-current=page],post-mainnavigation post-megadropdown button:not(:is(post-closebutton *))[aria-expanded=true],post-mainnavigation post-megadropdown a.active,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(:is(post-closebutton *)):hover,post-mainnavigation post-megadropdown a:hover{background-color:#504f4b;color:#fff}post-mainnavigation post-megadropdown button:not(:is(post-closebutton *)):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.active,post-mainnavigation post-list-item>a[aria-current=page],post-mainnavigation post-list-item>a[aria-expanded=true],post-mainnavigation post-list-item>button.active,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.active,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)}}";
|
|
729
|
+
const postMainnavigationCss = ":root{--post-icon-chevrondown:url(\"data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciPjxkZWZzPjxzeW1ib2wgaWQ9ImktY2hldnJvbmRvd24iPjxzeW1ib2wgaWQ9InMxNiIgdmlld0JveD0iMCAwIDE2IDE2Ij48cGF0aCBkPSJNMi4wMSA1LjIyYzAtLjE5LjA3LS4zOC4yMi0uNTMuMjktLjI5Ljc3LS4yOSAxLjA2IDBsNC43MiA0LjcyIDQuNzItNC43MmMuMjktLjI5Ljc3LS4yOSAxLjA2IDBzLjI5Ljc3IDAgMS4wNmwtNS43OCA1Ljc4LTUuNzgtNS43OGEuNzQuNzQgMCAwIDEtLjIyLS41MyIvPjwvc3ltYm9sPjxzeW1ib2wgaWQ9InMyNCIgdmlld0JveD0iMCAwIDI0IDI0Ij48cGF0aCBkPSJNMy4yNiA3Ljg1YzAtLjIyLjA4LS40NS4yNi0uNjIuMzQtLjM0LjktLjM0IDEuMjQgMGw3LjI2IDcuMjYgNy4yNi03LjI2Yy4zNC0uMzQuOS0uMzQgMS4yNCAwcy4zNC45IDAgMS4yNGwtOC41IDguNS04LjUxLTguNWEuOS45IDAgMCAxLS4yNi0uNjJaIi8+PC9zeW1ib2w+PHN5bWJvbCBpZD0iczMyIiB2aWV3Qm94PSIwIDAgMzIgMzIiPjxwYXRoIGQ9Ik00LjUgMTAuNTRjMC0uMjYuMS0uNTEuMjktLjcxYS45OTYuOTk2IDAgMCAxIDEuNDEgMGw5Ljc5IDkuNzkgOS44LTkuOGEuOTk2Ljk5NiAwIDEgMSAxLjQxIDEuNDFMMTUuOTkgMjIuNDQgNC44IDExLjI1Yy0uMi0uMi0uMjktLjQ1LS4yOS0uNzFaIi8+PC9zeW1ib2w+PHN5bWJvbCBpZD0iczQwIiB2aWV3Qm94PSIwIDAgNDAgNDAiPjxwYXRoIGQ9Ik01LjggMTMuMTdhMS4xMjMgMS4xMjMgMCAwIDEgMS45Mi0uOEwyMC4wNSAyNC43bDEyLjM0LTEyLjM0Yy40NC0uNDQgMS4xNS0uNDQgMS41OSAwcy40NCAxLjE1IDAgMS41OUwyMC4wNSAyNy44OCA2LjEzIDEzLjk3Yy0uMjItLjIyLS4zMy0uNTEtLjMzLS44Ii8+PC9zeW1ib2w+PHN5bWJvbCBpZD0iczQ4IiB2aWV3Qm94PSIwIDAgNDggNDgiPjxwYXRoIGQ9Ik03IDE1Ljg3YzAtLjMyLjEyLS42NC4zNy0uODhhMS4yNSAxLjI1IDAgMCAxIDEuNzcgMGwxNC44NyAxNC44NyAxNC44OC0xNC44OGMuNDktLjQ5IDEuMjgtLjQ5IDEuNzcgMHMuNDkgMS4yOCAwIDEuNzdMMjQuMDIgMzMuMzkgNy4zNyAxNi43NWMtLjI0LS4yNC0uMzctLjU2LS4zNy0uODgiLz48L3N5bWJvbD48c3ltYm9sIGlkPSJzNjQiIHZpZXdCb3g9IjAgMCA2NCA2NCI+PHBhdGggZD0iTTkuNjMgMjEuMjRhMS4zOCAxLjM4IDAgMCAxIDIuMzUtLjk3TDMyLjAxIDQwLjNsMjAuMDQtMjAuMDRjLjU0LS41NCAxLjQxLS41NCAxLjk1IDBzLjU0IDEuNDEgMCAxLjk1TDMyLjAxIDQ0LjE5IDEwLjAzIDIyLjIyYy0uMjctLjI3LS40LS42Mi0uNC0uOTdaTTAgLjAzaDY0djY0SDB6Ii8+PC9zeW1ib2w+PHVzZSBzdHlsZT0iZGlzcGxheTogdmFyKC0tczE2LCBub25lKSIgaHJlZj0iI3MxNiIvPjx1c2Ugc3R5bGU9ImRpc3BsYXk6IHZhcigtLXMyNCwgbm9uZSkiIGhyZWY9IiNzMjQiLz48dXNlIHN0eWxlPSJkaXNwbGF5OiB2YXIoLS1zMzIsIG5vbmUpIiBocmVmPSIjczMyIi8+PHVzZSBzdHlsZT0iZGlzcGxheTogdmFyKC0tczQwLCBub25lKSIgaHJlZj0iI3M0MCIvPjx1c2Ugc3R5bGU9ImRpc3BsYXk6IHZhcigtLXM0OCwgbm9uZSkiIGhyZWY9IiNzNDgiLz48dXNlIHN0eWxlPSJkaXNwbGF5OiB2YXIoLS1zNjQsIG5vbmUpIiBocmVmPSIjczY0Ii8+PC9zeW1ib2w+PC9kZWZzPjxzdHlsZT5AbWVkaWEgKG1heC13aWR0aDogMjMuOThweCkge2d7LS1zMTY6YmxvY2s7fX1AbWVkaWEgKG1pbi13aWR0aDogMjRweCkgYW5kIChtYXgtd2lkdGg6IDMxLjk4cHgpIHtney0tczI0OmJsb2NrO319QG1lZGlhIChtaW4td2lkdGg6IDMycHgpIGFuZCAobWF4LXdpZHRoOiAzOS45OHB4KSB7Z3stLXMzMjpibG9jazt9fUBtZWRpYSAobWluLXdpZHRoOiA0MHB4KSBhbmQgKG1heC13aWR0aDogNDcuOThweCkge2d7LS1zNDA6YmxvY2s7fX1AbWVkaWEgKG1pbi13aWR0aDogNDhweCkgYW5kIChtYXgtd2lkdGg6IDYzLjk4cHgpIHtney0tczQ4OmJsb2NrO319QG1lZGlhIChtaW4td2lkdGg6IDY0cHgpIHtney0tczY0OmJsb2NrO319PC9zdHlsZT48Zz48dXNlIGhyZWY9IiNpLWNoZXZyb25kb3duIi8+PC9nPjwvc3ZnPg==\")}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:var(--post-icon-chevrondown);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:flex;overflow:hidden;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;z-index:5;padding:1rem;background:#fff;box-shadow:var(--post-device-elevation-500);line-height:1}post-mainnavigation .scroll-control.scroll-left{margin-inline-end:-3rem}post-mainnavigation .scroll-control.scroll-right{margin-inline-start:-3rem}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.active,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.active,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.active,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.active .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.active .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.active .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.active .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.active .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.active .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(:is(post-closebutton *)),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(:is(post-closebutton *))::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(:is(post-closebutton *)).active,post-mainnavigation post-megadropdown button:not(:is(post-closebutton *))[aria-current=page],post-mainnavigation post-megadropdown button:not(:is(post-closebutton *))[aria-expanded=true],post-mainnavigation post-megadropdown a.active,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(:is(post-closebutton *)):hover,post-mainnavigation post-megadropdown a:hover{background-color:#504f4b;color:#fff}post-mainnavigation post-megadropdown button:not(:is(post-closebutton *)):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.active,post-mainnavigation post-list-item>a[aria-current=page],post-mainnavigation post-list-item>a[aria-expanded=true],post-mainnavigation post-list-item>button.active,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.active,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)}}";
|
|
763
730
|
|
|
764
731
|
const SCROLL_REPEAT_INTERVAL = 100; // Interval for repeated scrolling when holding down scroll button
|
|
765
732
|
const NAVBAR_DISABLE_DURATION = 400; // Duration to temporarily disable navbar interactions during scrolling
|
|
@@ -909,7 +876,7 @@ const PostMainnavigation = class {
|
|
|
909
876
|
};
|
|
910
877
|
PostMainnavigation.style = postMainnavigationCss;
|
|
911
878
|
|
|
912
|
-
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.active,.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}}";
|
|
879
|
+
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 [slot=megadropdown-overview-link]{text-decoration:none;border-radius:0;padding-block:13px 12px;margin-block-end:16px;display:flex;align-items:center;min-height:56px;width:100%;min-width:100%;height:48px;padding-inline:8px 12px;gap:16px;font-weight:400;position:relative;height:unset}.megadropdown [slot=megadropdown-overview-link]::before{content:\"\";background-color:#050400;bottom:0;width:100%;height:1px;position:absolute;left:0}.megadropdown [slot=megadropdown-overview-link].active,.megadropdown [slot=megadropdown-overview-link][aria-current=page],.megadropdown [slot=megadropdown-overview-link][aria-expanded=true]{background-color:#050400;color:#fff}.megadropdown [slot=megadropdown-overview-link]:hover{background-color:#504f4b;color:#fff}.megadropdown [slot=megadropdown-overview-link]:hover::before{background-color:#504f4b}@media screen and (max-width: 1023.98px){.megadropdown [slot=megadropdown-overview-link]{padding-block:12px 11px;min-height:unset}}@media screen and (max-width: 599.98px){.megadropdown [slot=megadropdown-overview-link]{padding-block:10px 9px}}.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.active,.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}}";
|
|
913
880
|
|
|
914
881
|
const PostMegadropdown = class {
|
|
915
882
|
constructor(hostRef) {
|
|
@@ -946,7 +913,9 @@ const PostMegadropdown = class {
|
|
|
946
913
|
}
|
|
947
914
|
get megadropdownTrigger() {
|
|
948
915
|
const hostId = this.host.getAttribute('id');
|
|
949
|
-
return hostId
|
|
916
|
+
return hostId
|
|
917
|
+
? document.querySelector(`post-megadropdown-trigger[for="${hostId}"] > button`)
|
|
918
|
+
: null;
|
|
950
919
|
}
|
|
951
920
|
connectedCallback() {
|
|
952
921
|
window.addEventListener('postBreakpoint:device', this.breakpointChange.bind(this));
|
|
@@ -1049,7 +1018,12 @@ const PostMegadropdown = class {
|
|
|
1049
1018
|
}
|
|
1050
1019
|
getFocusableElements() {
|
|
1051
1020
|
const focusableEls = Array.from(this.host.querySelectorAll('post-list-item, h3, .back-button'));
|
|
1052
|
-
const focusableChildren = focusableEls.flatMap(el => Array.from(getFocusableChildren(el)));
|
|
1021
|
+
const focusableChildren = focusableEls.flatMap(el => Array.from(getFocusableChildren.getFocusableChildren(el)));
|
|
1022
|
+
// Check for an overview link
|
|
1023
|
+
const overviewLink = this.host.querySelector('a[slot="megadropdown-overview-link"]');
|
|
1024
|
+
if (overviewLink) {
|
|
1025
|
+
focusableChildren.unshift(overviewLink);
|
|
1026
|
+
}
|
|
1053
1027
|
this.firstFocusableEl = focusableChildren[0];
|
|
1054
1028
|
this.lastFocusableEl = focusableChildren[focusableChildren.length - 1];
|
|
1055
1029
|
}
|
|
@@ -1127,7 +1101,7 @@ const PostMegadropdown = class {
|
|
|
1127
1101
|
}
|
|
1128
1102
|
render() {
|
|
1129
1103
|
const containerStyle = this.isVisible ? {} : { display: 'none' };
|
|
1130
|
-
return (index.h(index.Host, { key: '
|
|
1104
|
+
return (index.h(index.Host, { key: '341ea7fd69a095bc0f18b0f73c3ac5247784dd33', version: _package.version }, index.h("div", { key: '078435c707ec6b2e0d51f8adad5502729513af63', class: `megadropdown-container ${this.animationClass || ''}`, style: containerStyle, onAnimationEnd: () => this.handleAnimationEnd() }, index.h("div", { key: 'ad92234d06bccbc60a2e1a6cc63634535646c4f7', class: "megadropdown" }, index.h("slot", { key: 'f9779e130c7709912c12d30b554ff8f478840628', name: "megadropdown-title" }), index.h("slot", { key: 'e079e0381a0ce7e3ab7efd974cdf36e6938a378d', name: "megadropdown-overview-link" }), index.h("div", { key: '508d4e9bddb727e960aa6f2dc15515f1718aa2b9', class: "megadropdown-content" }, index.h("slot", { key: '442bb0b169824ed66ae5e7da9acd6bb7d759b6f5' })), index.h("div", { key: 'cc278c0b5680019270206fbde4ce7a83341a029a', onClick: () => this.hide(true), class: "back-button" }, index.h("slot", { key: '9c42fa29e89f60af62ab5d04d01e1764b36ebec4', name: "back-button" })), index.h("div", { key: '62bcc5bcc348cb45289ded98273804ab547471ef', onClick: () => this.hide(true), class: "close-button" }, index.h("slot", { key: '2cdf1d72f62a162bfb1596507063315430953096', name: "close-button" }))))));
|
|
1131
1105
|
}
|
|
1132
1106
|
get host() { return index.getElement(this); }
|
|
1133
1107
|
};
|
|
@@ -1230,7 +1204,7 @@ const PostMegadropdownTrigger = class {
|
|
|
1230
1204
|
document.removeEventListener('postToggleMegadropdown', this.handleToggleMegadropdown);
|
|
1231
1205
|
}
|
|
1232
1206
|
render() {
|
|
1233
|
-
return (index.h(index.Host, { key: '
|
|
1207
|
+
return (index.h(index.Host, { key: '838bff4fe3feac679b522c2f7a166ac7aa5c2bf9', "data-version": _package.version, "tab-index": "-1" }, index.h("button", { key: 'b5a90298610863e46447198642b5a27b8702aefc' }, index.h("slot", { key: '14c83456eb056f48143edcd2c532bca017c60171' }))));
|
|
1234
1208
|
}
|
|
1235
1209
|
get host() { return index.getElement(this); }
|
|
1236
1210
|
static get watchers() { return {
|
|
@@ -1291,35 +1265,32 @@ const PostMenu = class {
|
|
|
1291
1265
|
this.controlKeyDownHandler(e);
|
|
1292
1266
|
}
|
|
1293
1267
|
};
|
|
1294
|
-
this.
|
|
1268
|
+
this.handlePostShown = (event) => {
|
|
1269
|
+
// Only for the first open
|
|
1270
|
+
if (event.detail.first) {
|
|
1271
|
+
// Add "menu" and "menuitem" aria roles and aria-label
|
|
1272
|
+
this.host.setAttribute('role', 'menu');
|
|
1273
|
+
const menuItems = this.getSlottedItems();
|
|
1274
|
+
for (const item of menuItems) {
|
|
1275
|
+
item.setAttribute('role', 'menuitem');
|
|
1276
|
+
}
|
|
1277
|
+
if (this.label)
|
|
1278
|
+
this.host.setAttribute('aria-label', this.label);
|
|
1279
|
+
}
|
|
1280
|
+
};
|
|
1281
|
+
this.handlePostToggled = (event) => {
|
|
1295
1282
|
this.isVisible = event.detail.isOpen;
|
|
1296
1283
|
this.toggleMenu.emit(this.isVisible);
|
|
1297
|
-
|
|
1298
|
-
|
|
1299
|
-
|
|
1300
|
-
|
|
1301
|
-
if (event.detail.first) {
|
|
1302
|
-
if (menuItems.length > 0) {
|
|
1303
|
-
// Add role="menu" to the popovercontainer
|
|
1304
|
-
this.host.setAttribute('role', 'menu');
|
|
1305
|
-
// Add role="menuitem" to the focusable elements
|
|
1306
|
-
menuItems.forEach(item => {
|
|
1307
|
-
item.setAttribute('role', 'menuitem');
|
|
1308
|
-
});
|
|
1309
|
-
// Add aria-label to the menu
|
|
1310
|
-
if (this.label)
|
|
1311
|
-
this.host.setAttribute('aria-label', this.label);
|
|
1312
|
-
}
|
|
1313
|
-
}
|
|
1284
|
+
if (this.isVisible) {
|
|
1285
|
+
this.lastFocusedElement = this.root?.activeElement;
|
|
1286
|
+
const menuItems = this.getSlottedItems();
|
|
1287
|
+
if (menuItems.length > 0) {
|
|
1314
1288
|
menuItems[0].focus();
|
|
1315
1289
|
}
|
|
1316
|
-
|
|
1317
|
-
|
|
1318
|
-
|
|
1319
|
-
|
|
1320
|
-
}, 0);
|
|
1321
|
-
}
|
|
1322
|
-
});
|
|
1290
|
+
}
|
|
1291
|
+
else if (this.lastFocusedElement) {
|
|
1292
|
+
this.lastFocusedElement.focus();
|
|
1293
|
+
}
|
|
1323
1294
|
};
|
|
1324
1295
|
this.handleClick = (e) => {
|
|
1325
1296
|
const target = e.target;
|
|
@@ -1342,14 +1313,10 @@ const PostMenu = class {
|
|
|
1342
1313
|
disconnectedCallback() {
|
|
1343
1314
|
this.host.removeEventListener('keydown', this.handleKeyDown);
|
|
1344
1315
|
this.host.removeEventListener('click', this.handleClick);
|
|
1345
|
-
this.popoverRef?.removeEventListener('postToggle', this.handlePostToggle);
|
|
1346
1316
|
}
|
|
1347
1317
|
componentDidLoad() {
|
|
1348
1318
|
this.validatePlacement();
|
|
1349
1319
|
this.validateLabel();
|
|
1350
|
-
if (this.popoverRef) {
|
|
1351
|
-
this.popoverRef.addEventListener('postToggle', this.handlePostToggle);
|
|
1352
|
-
}
|
|
1353
1320
|
}
|
|
1354
1321
|
/**
|
|
1355
1322
|
* Toggles the menu visibility based on its current state.
|
|
@@ -1430,10 +1397,10 @@ const PostMenu = class {
|
|
|
1430
1397
|
// If the element is a slot, get the assigned elements
|
|
1431
1398
|
.flatMap(el => (el instanceof HTMLSlotElement ? el.assignedElements() : el))
|
|
1432
1399
|
// For each menu item, get any focusable children (e.g., buttons, links)
|
|
1433
|
-
.flatMap(el => Array.from(getFocusableChildren(el))));
|
|
1400
|
+
.flatMap(el => Array.from(getFocusableChildren.getFocusableChildren(el))));
|
|
1434
1401
|
}
|
|
1435
1402
|
render() {
|
|
1436
|
-
return (index.h(index.Host, { key: '
|
|
1403
|
+
return (index.h(index.Host, { key: '092a180331d50cfe701ad440569e0e6bd4bcd0c8', "data-version": _package.version }, index.h("post-popovercontainer", { key: '96f33df1a47d2fb1f6f862a7d7f97def5fd8b642', onPostShow: this.handlePostShown, onPostToggle: this.handlePostToggled, placement: this.placement, ref: e => (this.popoverRef = e) }, index.h("div", { key: '5d23d1059dd1cf68ac817acc8227129267a3c5a4', part: "menu" }, index.h("slot", { key: '020fbf8912393d85cd5a6fd9f65fdf264f2ba6f6', name: "header" }), index.h("slot", { key: '07cd9cb978ec85dd7fbbaed527520b97484e2030' })))));
|
|
1437
1404
|
}
|
|
1438
1405
|
get host() { return index.getElement(this); }
|
|
1439
1406
|
static get watchers() { return {
|
|
@@ -1443,7 +1410,10 @@ const PostMenu = class {
|
|
|
1443
1410
|
};
|
|
1444
1411
|
__decorate([
|
|
1445
1412
|
eventFrom.EventFrom('post-popovercontainer')
|
|
1446
|
-
], PostMenu.prototype, "
|
|
1413
|
+
], PostMenu.prototype, "handlePostShown", void 0);
|
|
1414
|
+
__decorate([
|
|
1415
|
+
eventFrom.EventFrom('post-popovercontainer')
|
|
1416
|
+
], PostMenu.prototype, "handlePostToggled", void 0);
|
|
1447
1417
|
PostMenu.style = postMenuCss;
|
|
1448
1418
|
|
|
1449
1419
|
const postMenuTriggerCss = ":host{display:inline-block}";
|
|
@@ -1521,7 +1491,7 @@ const PostMenuTrigger = class {
|
|
|
1521
1491
|
}
|
|
1522
1492
|
}
|
|
1523
1493
|
render() {
|
|
1524
|
-
return (index.h(index.Host, { key: '
|
|
1494
|
+
return (index.h(index.Host, { key: 'fc962802089652073c19cc35a511e48b0cab43b7', "data-version": _package.version, "tab-index": "-1" }, index.h("slot", { key: 'd3a8b40c0a88c44092b56ca4aa1c74f880bebb20' })));
|
|
1525
1495
|
}
|
|
1526
1496
|
get host() { return index.getElement(this); }
|
|
1527
1497
|
static get watchers() { return {
|
|
@@ -2835,14 +2805,9 @@ function getWindowScrollBarX(element, rect) {
|
|
|
2835
2805
|
return rect.left + leftScroll;
|
|
2836
2806
|
}
|
|
2837
2807
|
|
|
2838
|
-
function getHTMLOffset(documentElement, scroll
|
|
2839
|
-
if (ignoreScrollbarX === void 0) {
|
|
2840
|
-
ignoreScrollbarX = false;
|
|
2841
|
-
}
|
|
2808
|
+
function getHTMLOffset(documentElement, scroll) {
|
|
2842
2809
|
const htmlRect = documentElement.getBoundingClientRect();
|
|
2843
|
-
const x = htmlRect.left + scroll.scrollLeft - (
|
|
2844
|
-
// RTL <body> scrollbar.
|
|
2845
|
-
getWindowScrollBarX(documentElement, htmlRect));
|
|
2810
|
+
const x = htmlRect.left + scroll.scrollLeft - getWindowScrollBarX(documentElement, htmlRect);
|
|
2846
2811
|
const y = htmlRect.top + scroll.scrollTop;
|
|
2847
2812
|
return {
|
|
2848
2813
|
x,
|
|
@@ -2881,7 +2846,7 @@ function convertOffsetParentRelativeRectToViewportRelativeRect(_ref) {
|
|
|
2881
2846
|
offsets.y = offsetRect.y + offsetParent.clientTop;
|
|
2882
2847
|
}
|
|
2883
2848
|
}
|
|
2884
|
-
const htmlOffset = documentElement && !isOffsetParentAnElement && !isFixed ? getHTMLOffset(documentElement, scroll
|
|
2849
|
+
const htmlOffset = documentElement && !isOffsetParentAnElement && !isFixed ? getHTMLOffset(documentElement, scroll) : createCoords(0);
|
|
2885
2850
|
return {
|
|
2886
2851
|
width: rect.width * scale.x,
|
|
2887
2852
|
height: rect.height * scale.y,
|
|
@@ -2915,6 +2880,10 @@ function getDocumentRect(element) {
|
|
|
2915
2880
|
};
|
|
2916
2881
|
}
|
|
2917
2882
|
|
|
2883
|
+
// Safety check: ensure the scrollbar space is reasonable in case this
|
|
2884
|
+
// calculation is affected by unusual styles.
|
|
2885
|
+
// Most scrollbars leave 15-18px of space.
|
|
2886
|
+
const SCROLLBAR_MAX = 25;
|
|
2918
2887
|
function getViewportRect(element, strategy) {
|
|
2919
2888
|
const win = getWindow(element);
|
|
2920
2889
|
const html = getDocumentElement(element);
|
|
@@ -2932,6 +2901,24 @@ function getViewportRect(element, strategy) {
|
|
|
2932
2901
|
y = visualViewport.offsetTop;
|
|
2933
2902
|
}
|
|
2934
2903
|
}
|
|
2904
|
+
const windowScrollbarX = getWindowScrollBarX(html);
|
|
2905
|
+
// <html> `overflow: hidden` + `scrollbar-gutter: stable` reduces the
|
|
2906
|
+
// visual width of the <html> but this is not considered in the size
|
|
2907
|
+
// of `html.clientWidth`.
|
|
2908
|
+
if (windowScrollbarX <= 0) {
|
|
2909
|
+
const doc = html.ownerDocument;
|
|
2910
|
+
const body = doc.body;
|
|
2911
|
+
const bodyStyles = getComputedStyle(body);
|
|
2912
|
+
const bodyMarginInline = doc.compatMode === 'CSS1Compat' ? parseFloat(bodyStyles.marginLeft) + parseFloat(bodyStyles.marginRight) || 0 : 0;
|
|
2913
|
+
const clippingStableScrollbarWidth = Math.abs(html.clientWidth - body.clientWidth - bodyMarginInline);
|
|
2914
|
+
if (clippingStableScrollbarWidth <= SCROLLBAR_MAX) {
|
|
2915
|
+
width -= clippingStableScrollbarWidth;
|
|
2916
|
+
}
|
|
2917
|
+
} else if (windowScrollbarX <= SCROLLBAR_MAX) {
|
|
2918
|
+
// If the <body> scrollbar is on the left, the width needs to be extended
|
|
2919
|
+
// by the scrollbar amount so there isn't extra space on the right.
|
|
2920
|
+
width += windowScrollbarX;
|
|
2921
|
+
}
|
|
2935
2922
|
return {
|
|
2936
2923
|
width,
|
|
2937
2924
|
height,
|
|
@@ -4239,8 +4226,12 @@ const postPopovercontainerCss = "@layer polyfill{@supports not selector(:popover
|
|
|
4239
4226
|
const PostPopovercontainer = class {
|
|
4240
4227
|
constructor(hostRef) {
|
|
4241
4228
|
index.registerInstance(this, hostRef);
|
|
4229
|
+
this.postBeforeShow = index.createEvent(this, "postBeforeShow");
|
|
4230
|
+
this.postShow = index.createEvent(this, "postShow");
|
|
4231
|
+
this.postHide = index.createEvent(this, "postHide");
|
|
4232
|
+
this.postBeforeToggle = index.createEvent(this, "postBeforeToggle");
|
|
4242
4233
|
this.postToggle = index.createEvent(this, "postToggle");
|
|
4243
|
-
this.
|
|
4234
|
+
this.hasOpenedOnce = true;
|
|
4244
4235
|
/**
|
|
4245
4236
|
* Defines the placement of the popovercontainer according to the floating-ui options available at https://floating-ui.com/docs/computePosition#placement.
|
|
4246
4237
|
* Popovercontainers are automatically flipped to the opposite side if there is not enough available space and are shifted
|
|
@@ -4294,36 +4285,79 @@ const PostPopovercontainer = class {
|
|
|
4294
4285
|
if (typeof this.clearAutoUpdate === 'function') {
|
|
4295
4286
|
this.clearAutoUpdate();
|
|
4296
4287
|
}
|
|
4288
|
+
this.host.removeEventListener('beforetoggle', this.handleToggle.bind(this));
|
|
4297
4289
|
}
|
|
4298
4290
|
/**
|
|
4299
4291
|
* Programmatically display the popovercontainer
|
|
4300
|
-
* @param target
|
|
4292
|
+
* @param target A focusable element inside the <post-popover-trigger> component that controls the popover
|
|
4301
4293
|
*/
|
|
4302
4294
|
async show(target) {
|
|
4303
4295
|
if (this.toggleTimeoutId)
|
|
4304
4296
|
return;
|
|
4305
4297
|
this.eventTarget = target;
|
|
4298
|
+
if (this.toggleTimeoutId)
|
|
4299
|
+
return;
|
|
4306
4300
|
this.calculatePosition();
|
|
4307
4301
|
this.host.showPopover();
|
|
4308
4302
|
}
|
|
4303
|
+
/**
|
|
4304
|
+
* Handles the popover opening process and emits related events.
|
|
4305
|
+
*/
|
|
4306
|
+
async open() {
|
|
4307
|
+
const content = this.host.querySelector('.popover-content');
|
|
4308
|
+
this.startAutoupdates();
|
|
4309
|
+
if (content) {
|
|
4310
|
+
const animation = popIn(content);
|
|
4311
|
+
if (animation?.playState === 'running') {
|
|
4312
|
+
this.postBeforeToggle.emit({ willOpen: true });
|
|
4313
|
+
this.postBeforeShow.emit({ first: this.hasOpenedOnce });
|
|
4314
|
+
}
|
|
4315
|
+
animation?.finished.then(() => {
|
|
4316
|
+
this.postToggle.emit({ isOpen: true });
|
|
4317
|
+
this.postShow.emit({ first: this.hasOpenedOnce });
|
|
4318
|
+
if (this.hasOpenedOnce)
|
|
4319
|
+
this.hasOpenedOnce = false;
|
|
4320
|
+
});
|
|
4321
|
+
}
|
|
4322
|
+
if (this.safeSpace) {
|
|
4323
|
+
window.addEventListener('mousemove', this.mouseTrackingHandler.bind(this));
|
|
4324
|
+
}
|
|
4325
|
+
}
|
|
4326
|
+
/**
|
|
4327
|
+
* Handles the popover closing process and emits related events.
|
|
4328
|
+
*/
|
|
4329
|
+
async close() {
|
|
4330
|
+
if (typeof this.clearAutoUpdate === 'function') {
|
|
4331
|
+
this.clearAutoUpdate();
|
|
4332
|
+
}
|
|
4333
|
+
if (this.safeSpace) {
|
|
4334
|
+
window.removeEventListener('mousemove', this.mouseTrackingHandler.bind(this));
|
|
4335
|
+
}
|
|
4336
|
+
this.postToggle.emit({ isOpen: false });
|
|
4337
|
+
this.postHide.emit();
|
|
4338
|
+
}
|
|
4309
4339
|
/**
|
|
4310
4340
|
* Programmatically hide the popovercontainer
|
|
4311
4341
|
*/
|
|
4312
4342
|
async hide() {
|
|
4313
4343
|
if (!this.toggleTimeoutId) {
|
|
4344
|
+
if (this.eventTarget && this.eventTarget instanceof HTMLElement) {
|
|
4345
|
+
this.eventTarget.focus();
|
|
4346
|
+
}
|
|
4314
4347
|
this.eventTarget = null;
|
|
4315
4348
|
this.host.hidePopover();
|
|
4349
|
+
this.postHide.emit();
|
|
4316
4350
|
}
|
|
4317
4351
|
}
|
|
4318
4352
|
/**
|
|
4319
4353
|
* Toggle popovercontainer display
|
|
4320
|
-
* @param target
|
|
4354
|
+
* @param target A focusable element inside the <post-popover-trigger> component that controls the popover
|
|
4321
4355
|
* @param force Pass true to always show or false to always hide
|
|
4322
4356
|
*/
|
|
4323
4357
|
async toggle(target, force) {
|
|
4358
|
+
this.eventTarget = target;
|
|
4324
4359
|
// Prevent instant double toggle
|
|
4325
4360
|
if (!this.toggleTimeoutId) {
|
|
4326
|
-
this.eventTarget = target;
|
|
4327
4361
|
this.calculatePosition();
|
|
4328
4362
|
this.host.togglePopover(force);
|
|
4329
4363
|
this.toggleTimeoutId = null;
|
|
@@ -4340,27 +4374,11 @@ const PostPopovercontainer = class {
|
|
|
4340
4374
|
this.toggleTimeoutId = window.setTimeout(() => (this.toggleTimeoutId = null), 10);
|
|
4341
4375
|
const isOpen = e.newState === 'open';
|
|
4342
4376
|
if (isOpen) {
|
|
4343
|
-
|
|
4344
|
-
this.startAutoupdates();
|
|
4345
|
-
if (content && this.animation === 'pop-in') {
|
|
4346
|
-
popIn(content);
|
|
4347
|
-
}
|
|
4348
|
-
if (this.safeSpace)
|
|
4349
|
-
window.addEventListener('mousemove', this.mouseTrackingHandler.bind(this));
|
|
4350
|
-
// Emit event with `first` flag only true on the first open
|
|
4351
|
-
if (this.firstOpen) {
|
|
4352
|
-
this.postToggle.emit({ isOpen, first: this.firstOpen });
|
|
4353
|
-
this.firstOpen = false;
|
|
4354
|
-
return;
|
|
4355
|
-
}
|
|
4377
|
+
this.open();
|
|
4356
4378
|
}
|
|
4357
4379
|
else {
|
|
4358
|
-
|
|
4359
|
-
this.clearAutoUpdate();
|
|
4360
|
-
if (this.safeSpace)
|
|
4361
|
-
window.removeEventListener('mousemove', this.mouseTrackingHandler.bind(this));
|
|
4380
|
+
this.close();
|
|
4362
4381
|
}
|
|
4363
|
-
this.postToggle.emit({ isOpen: isOpen, first: false });
|
|
4364
4382
|
}
|
|
4365
4383
|
/**
|
|
4366
4384
|
* Start listening for DOM updates, scroll events etc. that have
|
|
@@ -4491,9 +4509,9 @@ const PostPopovercontainer = class {
|
|
|
4491
4509
|
}
|
|
4492
4510
|
}
|
|
4493
4511
|
render() {
|
|
4494
|
-
return (index.h(index.Host, { key: '
|
|
4512
|
+
return (index.h(index.Host, { key: 'cdb25a25fbd5e411e380175a8d3789cec83e2755', "data-version": _package.version, popover: this.manualClose ? 'manual' : 'auto' }, index.h("div", { key: 'e99bcc4d5123b335b4b8be7044a80b2913ab6fce', class: "popover-content" }, this.arrow && (index.h("span", { key: '3c228829cc7e5bd83d7f1759ef163407ebcd10c5', class: "arrow", ref: el => {
|
|
4495
4513
|
this.arrowRef = el;
|
|
4496
|
-
} })), index.h("slot", { key: '
|
|
4514
|
+
} })), index.h("slot", { key: '6a213deed5ccfec47d4dee903c7544d30a3f5748' }))));
|
|
4497
4515
|
}
|
|
4498
4516
|
get host() { return index.getElement(this); }
|
|
4499
4517
|
static get watchers() { return {
|
|
@@ -4550,7 +4568,7 @@ const PostTogglebutton = class {
|
|
|
4550
4568
|
this.host.addEventListener('keydown', (e) => this.handleKeydown(e));
|
|
4551
4569
|
}
|
|
4552
4570
|
render() {
|
|
4553
|
-
return (index.h(index.Host, { key: '
|
|
4571
|
+
return (index.h(index.Host, { key: 'f56832bfbfacc23923ac06d8455fffcdafa8a7ec', "data-version": _package.version, role: "button", tabindex: "0", "aria-pressed": this.toggled.toString() }, index.h("slot", { key: '7adc9ed579b6badeb08c7599ceb95892d68f027f' })));
|
|
4554
4572
|
}
|
|
4555
4573
|
get host() { return index.getElement(this); }
|
|
4556
4574
|
};
|
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
'use strict';
|
|
2
2
|
|
|
3
|
-
var index = require('./index-
|
|
4
|
-
var _package = require('./package-
|
|
3
|
+
var index = require('./index-Cb8CTrOz.js');
|
|
4
|
+
var _package = require('./package-B7Ni5Tuu.js');
|
|
5
5
|
var breakpoints = require('./breakpoints-CEkeixld.js');
|
|
6
6
|
var index$1 = require('./index-DtvYdwe1.js');
|
|
7
7
|
var eventFrom = require('./event-from-CLvtSUKf.js');
|
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
'use strict';
|
|
2
2
|
|
|
3
|
-
var index = require('./index-
|
|
3
|
+
var index = require('./index-Cb8CTrOz.js');
|
|
4
4
|
|
|
5
5
|
var _documentCurrentScript = typeof document !== 'undefined' ? document.currentScript : null;
|
|
6
6
|
/*
|
|
@@ -18,7 +18,7 @@ var patchBrowser = () => {
|
|
|
18
18
|
|
|
19
19
|
patchBrowser().then(async (options) => {
|
|
20
20
|
await index.globalScripts();
|
|
21
|
-
return index.bootstrapLazy([["post-breadcrumbs.cjs",[[1,"post-breadcrumbs",{"homeUrl":[1,"home-url"],"homeText":[1,"home-text"],"menuLabel":[1,"menu-label"],"breadcrumbItems":[32],"isConcatenated":[32],"lastWindowWidth":[32]},null,{"homeUrl":["validateHomeUrl"],"homeText":["validateHomeText"],"
|
|
21
|
+
return index.bootstrapLazy([["post-breadcrumbs.cjs",[[1,"post-breadcrumbs",{"homeUrl":[1,"home-url"],"homeText":[1,"home-text"],"label":[1],"menuLabel":[1,"menu-label"],"breadcrumbItems":[32],"isConcatenated":[32],"lastWindowWidth":[32]},null,{"homeUrl":["validateHomeUrl"],"homeText":["validateHomeText"],"label":["validateLabel"],"menuLabel":["validateMenuLabel"]}]]],["post-footer.cjs",[[1,"post-footer",{"label":[1],"device":[32],"gridSlotDisplayed":[32]},null,{"label":["validateLabel"]}]]],["post-popover.cjs",[[1,"post-popover",{"placement":[1],"closeButtonCaption":[1,"close-button-caption"],"arrow":[4],"show":[64],"hide":[64],"toggle":[64]},null,{"placement":["validatePlacement"],"closeButtonCaption":["validateCloseButtonCaption"]}]]],["post-back-to-top.cjs",[[1,"post-back-to-top",{"label":[513],"belowFold":[32]},null,{"label":["validateLabel"],"belowFold":["watchBelowFold"]}]]],["post-card-control.cjs",[[65,"post-card-control",{"label":[513],"description":[1],"type":[1],"name":[1],"value":[1],"checked":[1028],"disabled":[1028],"validity":[1028],"icon":[1],"focused":[32],"reset":[64],"groupReset":[64]},null,{"label":["validateControlLabel"],"description":["validateControlDescription"],"type":["validateControlType"],"name":["validateControlName"],"value":["validateControlValue"],"icon":["validateControlIcon"],"checked":["updateControlChecked"],"disabled":["updateControlDisabled"]}]]],["post-rating.cjs",[[1,"post-rating",{"label":[1],"stars":[2],"currentRating":[1026,"current-rating"],"readonly":[4],"hoveredIndex":[32]},null,{"label":["validateLabel"],"stars":["validateStars"],"currentRating":["validateCurrentRating"]}]]],["post-tooltip.cjs",[[1,"post-tooltip",{"placement":[1],"arrow":[4],"animation":[1],"open":[1540],"show":[64],"hide":[64],"toggle":[64]},null,{"placement":["validatePlacement"]}]]],["post-avatar.cjs",[[1,"post-avatar",{"firstname":[513],"lastname":[1],"userid":[1],"email":[1],"description":[1],"slottedImage":[32],"avatarType":[32],"imageUrl":[32],"imageAlt":[32],"initials":[32],"storageKey":[32]},null,{"firstname":["validateFirstname"],"lastname":["validateLastname"],"userid":["updateUserid"],"email":["updateEmail"],"description":["validateDescription"]}]]],["post-banner.cjs",[[1,"post-banner",{"type":[513],"hasActions":[32],"dismiss":[64]},[[0,"click","onCloseButtonClick"]],{"type":["validateType"]}]]],["post-linkarea.cjs",[[1,"post-linkarea",{"interactiveElements":[32]}]]],["post-popover-trigger.cjs",[[1,"post-popover-trigger",{"for":[513],"ariaExpanded":[32],"popoverOpen":[32]},null,{"popoverOpen":["syncAriaExpanded"],"for":["validateFor"]}]]],["post-tab-header.cjs",[[1,"post-tab-header",{"panel":[513],"tabId":[32]},null,{"panel":["validateFor"]}]]],["post-tab-panel.cjs",[[1,"post-tab-panel",{"name":[513],"panelId":[32]},null,{"name":["validateName"]}]]],["post-tabs.cjs",[[1,"post-tabs",{"activePanel":[1,"active-panel"],"fullWidth":[516,"full-width"],"show":[64]}]]],["post-tooltip-trigger.cjs",[[1,"post-tooltip-trigger",{"for":[513],"delay":[2]},null,{"for":["validateControlFor"]}]]],["post-collapsible_2.cjs",[[1,"post-collapsible",{"collapsed":[1028],"toggle":[64]},null,{"collapsed":["collapsedChange"]}],[1,"post-collapsible-trigger",{"for":[513],"update":[64]},null,{"for":["validateAriaAttributes"]}]]],["post-closebutton_15.cjs",[[1,"post-language-switch",{"caption":[1],"description":[1],"variant":[1],"activeLang":[32]},[[0,"postChange","handlePostChange"],[0,"postLanguageOptionInitiallyActive","handleInitiallyActive"]],{"caption":["validateCaption"],"description":["validateDescription"],"variant":["validateVariant"]}],[4,"post-mainnavigation",{"canScrollLeft":[32],"canScrollRight":[32]},[[9,"mouseup","stopScrolling"],[9,"mouseleave","stopScrolling"]]],[1,"post-header",{"device":[32],"hasNavigation":[32],"hasTitle":[32],"mobileMenuExtended":[32],"megadropdownOpen":[32],"toggleMobileMenu":[64]},null,{"device":["lockBody"],"mobileMenuExtended":["lockBody"]}],[4,"post-language-option",{"code":[1],"active":[1540],"variant":[1],"name":[1],"url":[1],"select":[64]},null,{"code":["validateCode"],"variant":["validateVariant"],"name":["validateName"],"url":["validateUrl"]}],[4,"post-list",{"titleHidden":[4,"title-hidden"],"horizontal":[516],"titleId":[32]}],[1,"post-list-item"],[1,"post-logo",{"url":[1]},null,{"url":["validateUrl"]}],[4,"post-megadropdown",{"device":[32],"isVisible":[32],"trigger":[32],"animationClass":[32],"toggle":[64],"show":[64],"hide":[64],"focusFirst":[64]}],[4,"post-megadropdown-trigger",{"for":[1],"ariaExpanded":[32]},null,{"for":["validateControlFor"]}],[1,"post-togglebutton",{"toggled":[1028]}],[4,"post-closebutton",{"buttonType":[1,"button-type"]},null,{"buttonType":["validateButtonType"]}],[1,"post-menu",{"placement":[1],"label":[1],"isVisible":[32],"toggle":[64],"show":[64],"hide":[64]},null,{"placement":["validatePlacement"],"label":["validateLabel"]}],[4,"post-menu-trigger",{"for":[513],"ariaExpanded":[32]},null,{"for":["validateControlFor"]}],[4,"post-popovercontainer",{"placement":[1],"edgeGap":[2,"edge-gap"],"animation":[1],"arrow":[4],"manualClose":[4,"manual-close"],"safeSpace":[513,"safe-space"],"show":[64],"open":[64],"close":[64],"hide":[64],"toggle":[64]},null,{"placement":["validatePlacement"],"edgeGap":["validateEdgeGap"],"safeSpace":["validateSafeSpace"]}],[1,"post-icon",{"animation":[1],"base":[1],"flipH":[4,"flip-h"],"flipV":[4,"flip-v"],"name":[513],"rotate":[2],"scale":[2]},null,{"animation":["validateAnimation"],"base":["validateBase"],"name":["validateName"],"rotate":["validateRotate"],"scale":["validateScale"]}]]],["post-accordion_2.cjs",[[1,"post-accordion-item",{"collapsed":[1028],"headingLevel":[2,"heading-level"],"id":[32],"slottedLogo":[32],"toggle":[64]},[[2,"postToggle","onCollapseToggle"]],{"headingLevel":["validateHeadingLevel"]}],[1,"post-accordion",{"headingLevel":[2,"heading-level"],"multiple":[4],"toggle":[64],"expandAll":[64],"collapseAll":[64]},[[0,"postToggle","collapseToggleHandler"]],{"headingLevel":["validateHeadingLevel"]}]]],["post-breadcrumb-item_2.cjs",[[1,"post-breadcrumb-item",{"url":[1],"fullUrl":[32]},null,{"url":["validateUrl"]}],[4,"post-menu-item"]]]], options);
|
|
22
22
|
});
|
|
23
23
|
|
|
24
24
|
exports.setNonce = index.setNonce;
|
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
'use strict';
|
|
2
2
|
|
|
3
|
-
var index$1 = require('./index-
|
|
4
|
-
var _package = require('./package-
|
|
3
|
+
var index$1 = require('./index-Cb8CTrOz.js');
|
|
4
|
+
var _package = require('./package-B7Ni5Tuu.js');
|
|
5
5
|
var index = require('./index-DtvYdwe1.js');
|
|
6
6
|
var breakpoints = require('./breakpoints-CEkeixld.js');
|
|
7
7
|
|
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
'use strict';
|
|
2
2
|
|
|
3
|
-
var index = require('./index-
|
|
4
|
-
var _package = require('./package-
|
|
3
|
+
var index = require('./index-Cb8CTrOz.js');
|
|
4
|
+
var _package = require('./package-B7Ni5Tuu.js');
|
|
5
5
|
|
|
6
6
|
const postLinkareaCss = ":host{display:block;cursor:pointer}";
|
|
7
7
|
|