@swisspost/design-system-components 10.0.0-next.51 → 10.0.0-next.53
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-D1eOXW8H.js → package-CTyJAQzZ.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 +4 -4
- 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.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 +1 -1
- 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-BRBszIzq.js → p-BB-k_ccz.js} +30 -34
- package/dist/components/react/p-BVXiQdHq.js +64 -0
- package/dist/components/react/{p-BIslNfKd.js → p-CEP4VRNR.js} +2 -2
- package/dist/components/react/{p-BsuTiCyd.js → p-CJocYMQ7.js} +1 -1
- package/dist/components/react/{p-DC3aZ-Qt.js → p-ClCCjdRt.js} +3 -3
- package/dist/components/react/{p-BVVgwjV0.js → p-ClNlUIJm.js} +83 -33
- package/dist/components/react/{p-2qJcvMt7.js → p-DC1SzgZS.js} +1 -1
- package/dist/components/react/{p-D7N0KPNm.js → p-DZ_1ljyU.js} +2 -2
- package/dist/components/react/{p-WA0BpGMu.js → p-D_8kJXLe.js} +1 -1
- package/dist/components/react/p-DeqIcjvO.js +3 -0
- package/dist/components/react/p-HygIVKXC.js +5018 -0
- package/dist/components/react/{p-Cpz7bn7D.js → p-RFewkSE5.js} +5 -5
- package/dist/components/react/{p-BnCGzVcR.js → p-oXx3C5kr.js} +3 -3
- package/dist/components/react/{p-BcpJoB81.js → p-vCHPi-c4.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-DeqIcjvO.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 +4 -4
- 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-240d3470.entry.js +1 -0
- package/dist/post-components/{p-ef38c78d.entry.js → p-3f9554e1.entry.js} +1 -1
- package/dist/post-components/p-43ea9ba0.entry.js +1 -0
- package/dist/post-components/p-4d84bb4a.entry.js +1 -0
- package/dist/post-components/p-5450bd15.entry.js +1 -0
- package/dist/post-components/{p-2b003617.entry.js → p-5a9885dd.entry.js} +1 -1
- package/dist/post-components/{p-b871aa1b.entry.js → p-5b53b042.entry.js} +1 -1
- package/dist/post-components/p-6b73114c.entry.js +1 -0
- package/dist/post-components/{p-2440cba5.entry.js → p-6de34182.entry.js} +1 -1
- package/dist/post-components/p-87d9de40.entry.js +1 -0
- package/dist/post-components/p-CFNKgUjL.js +2 -0
- package/dist/post-components/p-D9ZHp2FP.js +1 -0
- package/dist/post-components/p-DeqIcjvO.js +1 -0
- package/dist/post-components/p-HygIVKXC.js +1 -0
- package/dist/post-components/p-ac1f1ebb.entry.js +1 -0
- package/dist/post-components/{p-759510e5.entry.js → p-b3bc89ad.entry.js} +1 -1
- package/dist/post-components/{p-e764835b.entry.js → p-be376a2b.entry.js} +1 -1
- package/dist/post-components/p-ce396597.entry.js +1 -0
- package/dist/post-components/{p-0b1143d4.entry.js → p-d288a9b1.entry.js} +1 -1
- package/dist/post-components/p-efdaa2ad.entry.js +1 -0
- package/dist/post-components/p-f1a6e07a.entry.js +1 -0
- package/dist/post-components/p-f4aac83e.entry.js +1 -0
- package/dist/post-components/{p-509ae720.entry.js → p-ff13396a.entry.js} +1 -1
- 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 +6707 -6594
- package/hydrate/index.mjs +6707 -6594
- package/package.json +7 -7
- package/dist/components/react/p-C35MCWIp.js +0 -35
- package/dist/components/react/p-DgSkXfqW.js +0 -3
- package/dist/esm/package-DgSkXfqW.js +0 -3
- package/dist/post-components/p-017fbd63.entry.js +0 -1
- package/dist/post-components/p-2c1e0e21.entry.js +0 -1
- package/dist/post-components/p-C8a0ddDa.js +0 -2
- package/dist/post-components/p-DgSkXfqW.js +0 -1
- package/dist/post-components/p-a9d4dc7f.entry.js +0 -1
- package/dist/post-components/p-d0fea1d7.entry.js +0 -1
- package/dist/post-components/p-d25fc2d8.entry.js +0 -1
- package/dist/post-components/p-d377069a.entry.js +0 -1
- package/dist/post-components/p-ea71d9fd.entry.js +0 -1
- package/dist/post-components/p-efa44b64.entry.js +0 -1
- package/dist/post-components/p-f86fb192.entry.js +0 -1
- package/dist/post-components/p-feed36d6.entry.js +0 -1
|
@@ -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-CTyJAQzZ.js');
|
|
5
5
|
var index$1 = require('./index-DtvYdwe1.js');
|
|
6
6
|
require('./breakpoints-CEkeixld.js');
|
|
7
7
|
var placement = require('./placement-qEFR9hmI.js');
|
|
@@ -71,7 +71,7 @@ const PostTooltip = class {
|
|
|
71
71
|
}
|
|
72
72
|
render() {
|
|
73
73
|
const popoverClass = `${this.arrow ? 'has-arrow' : ''}`;
|
|
74
|
-
return (index.h(index.Host, { key: '
|
|
74
|
+
return (index.h(index.Host, { key: '0755eeba6f7be3cd0d94138369355df9767ca541', "data-version": _package.version }, index.h("post-popovercontainer", { key: '1e1d71a4878e60f9e20b34b5f12588e09a8c7716', safeSpace: "trapezoid", class: popoverClass, role: "tooltip", arrow: this.arrow, animation: this.animation, placement: this.placement, onPostToggle: e => this.handleToggle(e), ref: (el) => (this.popoverRef = el) }, index.h("slot", { key: '25a69d406a91cb0ba8d4c5fadee44d937c84a266' }))));
|
|
75
75
|
}
|
|
76
76
|
get host() { return index.getElement(this); }
|
|
77
77
|
static get watchers() { return {
|
|
@@ -27,6 +27,7 @@
|
|
|
27
27
|
"components/post-menu-item/post-menu-item.js",
|
|
28
28
|
"components/post-menu-trigger/post-menu-trigger.js",
|
|
29
29
|
"components/post-popover/post-popover.js",
|
|
30
|
+
"components/post-popover-trigger/post-popover-trigger.js",
|
|
30
31
|
"components/post-popovercontainer/post-popovercontainer.js",
|
|
31
32
|
"components/post-rating/post-rating.js",
|
|
32
33
|
"components/post-tab-header/post-tab-header.js",
|
|
@@ -58,7 +58,7 @@ export class PostAccordionItem {
|
|
|
58
58
|
return (h(Host, { key: 'b98847d19894430b6f65130aebf8673a45afd1e6', id: this.id, "data-version": version }, h("div", { key: 'f26f9d3a4a1f59db23b4698b321e28e112c3eed0', part: "accordion-item", class: "accordion-item" }, h("post-collapsible-trigger", { key: '14bdacce04d67a03655f600feeaeec065e0fc198', for: `${this.id}--collapse` }, h(HeadingTag, { key: '7a07a70d172306ce37f8bd0143b21ed7ec0cab8a', class: "accordion-header", id: `${this.id}--header` }, h("button", { key: '5ad0698a62df5c4b2c0a77ff622090b20f348e9c', type: "button", class: `accordion-button${this.collapsed ? ' collapsed' : ''}`, part: "button" }, h("span", { key: '6e5fcb0c9efa8a57e05fd162c72b9c170a8210c6', class: {
|
|
59
59
|
'logo-container': true,
|
|
60
60
|
'has-image': !!this.slottedLogo,
|
|
61
|
-
} }, h("slot", { key: '41a1409f723bf52de893324ce45d4e7f31eb8908', name: "logo", onSlotchange: this.onSlotLogoChange.bind(this) })), h("slot", { key: '7186adfe4a4fe67f4dbaeb7569820d0d06c18428', name: "header" }), h("post-icon", { key: '
|
|
61
|
+
} }, h("slot", { key: '41a1409f723bf52de893324ce45d4e7f31eb8908', name: "logo", onSlotchange: this.onSlotLogoChange.bind(this) })), h("slot", { key: '7186adfe4a4fe67f4dbaeb7569820d0d06c18428', name: "header" }), h("post-icon", { key: 'add240b0275b083c537efb28c4a2825ac22e1b47', name: "chevrondown" })))), h("post-collapsible", { key: '4231577c41c7633327c147d2b9adcd847ffc7261', id: `${this.id}--collapse`, collapsed: this.collapsed, ref: el => (this.collapsible = el) }, h("div", { key: '3f3cea3f5468e35f658f7d143db32391fa5fe2f1', class: "accordion-body", part: "body" }, h("slot", { key: '013f6cc755a04b880d91513059e36bcc2be5f412' }))))));
|
|
62
62
|
}
|
|
63
63
|
static get is() { return "post-accordion-item"; }
|
|
64
64
|
static get encapsulation() { return "shadow"; }
|
|
@@ -71,7 +71,7 @@ export class PostBackToTop {
|
|
|
71
71
|
window.removeEventListener('scroll', this.handleScroll);
|
|
72
72
|
}
|
|
73
73
|
render() {
|
|
74
|
-
return (h(Host, { key: '51abef7d1f650da1476689c46d853f49669da856', "data-version": version }, h("button", { key: '9de175f7962448fa3d658e4a24b01a857925a5b7', class: "back-to-top", "aria-hidden": this.belowFold ? 'false' : 'true', tabindex: this.belowFold ? '0' : '-1', onClick: this.scrollToTop }, h("post-icon", { key: '
|
|
74
|
+
return (h(Host, { key: '51abef7d1f650da1476689c46d853f49669da856', "data-version": version }, h("button", { key: '9de175f7962448fa3d658e4a24b01a857925a5b7', class: "back-to-top", "aria-hidden": this.belowFold ? 'false' : 'true', tabindex: this.belowFold ? '0' : '-1', onClick: this.scrollToTop }, h("post-icon", { key: '2913ad9930bccf5f1e72ea611ed3c57a0e4e1ca8', "aria-hidden": "true", name: "arrowup" }), h("span", { key: '44b3f9bf5a16c883282a73bf5cfae77619079c0d', class: "visually-hidden" }, this.label))));
|
|
75
75
|
}
|
|
76
76
|
static get is() { return "post-back-to-top"; }
|
|
77
77
|
static get encapsulation() { return "shadow"; }
|
|
@@ -37,7 +37,7 @@ export class PostBreadcrumbItem {
|
|
|
37
37
|
}
|
|
38
38
|
render() {
|
|
39
39
|
const BreadcrumbTag = this.validUrl ? 'a' : 'span';
|
|
40
|
-
return (h(Host, { key: '9ccdcf67335a106fd70e1d756a941736827454c0', "data-version": version }, h("post-icon", { key: '
|
|
40
|
+
return (h(Host, { key: '9ccdcf67335a106fd70e1d756a941736827454c0', "data-version": version }, h("post-icon", { key: 'c2061015e34cc3c37d343abd872bd8bd3cc82615', name: "chevronright", class: "breadcrumb-item-icon" }), h(BreadcrumbTag, { key: '3e9659ac705d801699167864a06cde461bc84185', class: "breadcrumb-item", ...(this.validUrl ? { href: this.validUrl } : {}), onKeyDown: event => this.handleKeyDown(event) }, h("slot", { key: 'e86e3333db8b0636a9a9635a5f11960c7d839e3d' }))));
|
|
41
41
|
}
|
|
42
42
|
static get is() { return "post-breadcrumb-item"; }
|
|
43
43
|
static get encapsulation() { return "shadow"; }
|
|
@@ -1,12 +1,8 @@
|
|
|
1
1
|
import { h, Host } from "@stencil/core";
|
|
2
2
|
import { version } from "../../../../package";
|
|
3
|
-
import { checkRequiredAndUrl,
|
|
3
|
+
import { checkRequiredAndUrl, debounce, checkRequiredAndType } from "../../utils/index";
|
|
4
4
|
export class PostBreadcrumbs {
|
|
5
5
|
constructor() {
|
|
6
|
-
/**
|
|
7
|
-
* The text label for the home breadcrumb item.
|
|
8
|
-
*/
|
|
9
|
-
this.homeText = 'Home';
|
|
10
6
|
this.breadcrumbItems = [];
|
|
11
7
|
// Waits for breadcrumbs navigation reference to be available
|
|
12
8
|
this.waitForBreadcrumbsRef = debounce(() => {
|
|
@@ -29,9 +25,12 @@ export class PostBreadcrumbs {
|
|
|
29
25
|
checkRequiredAndUrl(this, 'homeUrl');
|
|
30
26
|
}
|
|
31
27
|
validateHomeText() {
|
|
32
|
-
|
|
28
|
+
checkRequiredAndType(this, 'homeText', 'string');
|
|
33
29
|
}
|
|
34
30
|
validateLabel() {
|
|
31
|
+
checkRequiredAndType(this, 'label', 'string');
|
|
32
|
+
}
|
|
33
|
+
validateMenuLabel() {
|
|
35
34
|
checkRequiredAndType(this, 'menuLabel', 'string');
|
|
36
35
|
}
|
|
37
36
|
componentWillLoad() {
|
|
@@ -41,6 +40,7 @@ export class PostBreadcrumbs {
|
|
|
41
40
|
this.validateHomeUrl();
|
|
42
41
|
this.validateHomeText();
|
|
43
42
|
this.validateLabel();
|
|
43
|
+
this.validateMenuLabel();
|
|
44
44
|
window.addEventListener('resize', this.handleResize);
|
|
45
45
|
this.waitForBreadcrumbsRef();
|
|
46
46
|
}
|
|
@@ -88,18 +88,18 @@ export class PostBreadcrumbs {
|
|
|
88
88
|
}
|
|
89
89
|
render() {
|
|
90
90
|
const visibleItems = this.breadcrumbItems.slice(0, -1);
|
|
91
|
-
return (h(Host, { key: '
|
|
91
|
+
return (h(Host, { key: '0c98c8ea09e4f17781fd8c404d445bd42aaacad5', "data-version": version }, h("nav", { key: 'aefa39943fd6ccbfcb2f01b19266785644bb4e32', "aria-label": this.label, class: "breadcrumbs-nav", ref: el => (this.breadcrumbsNavRef = el) }, h("ol", { key: 'd9542316f160f5fc98ca1ddadc27db5f24df78a1', class: "no-list breadcrumbs-list" }, h("li", { key: '3b4c9798492ffa8a6cbc65081efa08c3793a1325' }, h("a", { key: 'f7fd7c962d548a372198b5b1640a9f63fa36a809', href: this.homeUrl, class: "breadcrumb-link" }, h("span", { key: '3aa94c9eca27de39a9e564ec719eea4d821a6692', class: "visually-hidden" }, this.homeText), h("post-icon", { key: '04e54f7e16c21dcf0dcee0d9a8753e09d1382605', name: "home", class: "home-icon" }))), this.isConcatenated ? (h("li", { class: "menu-trigger-wrapper" }, h("post-icon", { name: "chevronright", class: "breadcrumb-item-icon" }), h("div", { class: "actual-menu" }, h("post-menu-trigger", { for: "breadcrumb-menu", tabIndex: 0, onKeyDown: e => {
|
|
92
92
|
if (e.key === 'Enter' || e.key === ' ') {
|
|
93
93
|
e.preventDefault();
|
|
94
94
|
this.handleBreadcrumbItemClick();
|
|
95
95
|
}
|
|
96
|
-
} }, h("
|
|
96
|
+
} }, h("button", { class: "btn", tabIndex: -1 }, "...")), h("post-menu", { id: "breadcrumb-menu", label: this.menuLabel }, visibleItems.map(item => (h("post-menu-item", { key: item.url || item.text, class: "breadcrumb-item", onKeyDown: e => {
|
|
97
97
|
if (e.key === 'Enter' || e.key === ' ') {
|
|
98
98
|
const linkElement = e.currentTarget.querySelector('a');
|
|
99
99
|
linkElement?.click();
|
|
100
100
|
e.preventDefault();
|
|
101
101
|
}
|
|
102
|
-
} }, item.url ? h("a", { href: item.url }, item.text) : h("span", null, item.text)))))))) : (visibleItems.map(item => (h("li", null, h("post-breadcrumb-item", { url: item.url, key: item.url || item.text }, item.text))))), this.lastItem && (h("li", { key: '
|
|
102
|
+
} }, item.url ? h("a", { href: item.url }, item.text) : h("span", null, item.text)))))))) : (visibleItems.map(item => (h("li", null, h("post-breadcrumb-item", { url: item.url, key: item.url || item.text }, item.text))))), this.lastItem && (h("li", { key: '5209d2ddf74d62f792bb472825f699acaf30bc07', "aria-current": "page" }, h("post-breadcrumb-item", { key: '0b8aa3f765e776c2fa971f7c8762280194cc1b0f', url: this.lastItem.url, tabindex: -1 }, this.lastItem.text)))), h("div", { key: '704affacb1515b48e4b129f1ef2c2d314ddd00d6', class: "hidden-items" }, h("a", { key: '2562e65299bff39a0d1c8d4b20d2ecc4d6747f4c', href: this.homeUrl, class: "hidden-breadcrumb-item" }, h("span", { key: '75d352977ecd05fc5fa2bb5f26ed40e809961c3d', class: "visually-hidden" }, this.homeText), h("post-icon", { key: 'b24fbc251d0a519fa03f85dd36413f3c79ece47c', name: "home", class: "home-icon" })), this.breadcrumbItems.map(item => (h("post-breadcrumb-item", { url: item.url, key: `hidden-${item.url || item.text}`, class: "hidden-breadcrumb-item" }, item.text)))))));
|
|
103
103
|
}
|
|
104
104
|
static get is() { return "post-breadcrumbs"; }
|
|
105
105
|
static get encapsulation() { return "shadow"; }
|
|
@@ -143,7 +143,7 @@ export class PostBreadcrumbs {
|
|
|
143
143
|
"resolved": "string",
|
|
144
144
|
"references": {}
|
|
145
145
|
},
|
|
146
|
-
"required":
|
|
146
|
+
"required": true,
|
|
147
147
|
"optional": false,
|
|
148
148
|
"docs": {
|
|
149
149
|
"tags": [],
|
|
@@ -151,8 +151,26 @@ export class PostBreadcrumbs {
|
|
|
151
151
|
},
|
|
152
152
|
"getter": false,
|
|
153
153
|
"setter": false,
|
|
154
|
-
"reflect": false
|
|
155
|
-
|
|
154
|
+
"reflect": false
|
|
155
|
+
},
|
|
156
|
+
"label": {
|
|
157
|
+
"type": "string",
|
|
158
|
+
"attribute": "label",
|
|
159
|
+
"mutable": false,
|
|
160
|
+
"complexType": {
|
|
161
|
+
"original": "string",
|
|
162
|
+
"resolved": "string",
|
|
163
|
+
"references": {}
|
|
164
|
+
},
|
|
165
|
+
"required": true,
|
|
166
|
+
"optional": false,
|
|
167
|
+
"docs": {
|
|
168
|
+
"tags": [],
|
|
169
|
+
"text": "The accessible label for the breadcrumb component."
|
|
170
|
+
},
|
|
171
|
+
"getter": false,
|
|
172
|
+
"setter": false,
|
|
173
|
+
"reflect": false
|
|
156
174
|
},
|
|
157
175
|
"menuLabel": {
|
|
158
176
|
"type": "string",
|
|
@@ -191,8 +209,11 @@ export class PostBreadcrumbs {
|
|
|
191
209
|
"propName": "homeText",
|
|
192
210
|
"methodName": "validateHomeText"
|
|
193
211
|
}, {
|
|
194
|
-
"propName": "
|
|
212
|
+
"propName": "label",
|
|
195
213
|
"methodName": "validateLabel"
|
|
214
|
+
}, {
|
|
215
|
+
"propName": "menuLabel",
|
|
216
|
+
"methodName": "validateMenuLabel"
|
|
196
217
|
}];
|
|
197
218
|
}
|
|
198
219
|
}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
.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}}
|
|
1
|
+
.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}}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
:root{--post-icon-2113: url("data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciPjxkZWZzPjxzeW1ib2wgaWQ9ImktMjExMyIgdmlld0JveD0iMCAwIDMyIDMyIj48cGF0aCBkPSJtMjMuNiAxMy4yLTcuNSA3LjYtNy42LTcuNi45LS45IDYuNiA2LjYgNi42LTYuNnoiLz48L3N5bWJvbD48L2RlZnM+PHVzZSBocmVmPSIjaS0yMTEzIi8+PC9zdmc+")}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-2113);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)}}
|
|
1
|
+
: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)}}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
@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}}
|
|
1
|
+
@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}}
|
|
@@ -35,7 +35,9 @@ export class PostMegadropdown {
|
|
|
35
35
|
}
|
|
36
36
|
get megadropdownTrigger() {
|
|
37
37
|
const hostId = this.host.getAttribute('id');
|
|
38
|
-
return hostId
|
|
38
|
+
return hostId
|
|
39
|
+
? document.querySelector(`post-megadropdown-trigger[for="${hostId}"] > button`)
|
|
40
|
+
: null;
|
|
39
41
|
}
|
|
40
42
|
connectedCallback() {
|
|
41
43
|
window.addEventListener('postBreakpoint:device', this.breakpointChange.bind(this));
|
|
@@ -139,6 +141,11 @@ export class PostMegadropdown {
|
|
|
139
141
|
getFocusableElements() {
|
|
140
142
|
const focusableEls = Array.from(this.host.querySelectorAll('post-list-item, h3, .back-button'));
|
|
141
143
|
const focusableChildren = focusableEls.flatMap(el => Array.from(getFocusableChildren(el)));
|
|
144
|
+
// Check for an overview link
|
|
145
|
+
const overviewLink = this.host.querySelector('a[slot="megadropdown-overview-link"]');
|
|
146
|
+
if (overviewLink) {
|
|
147
|
+
focusableChildren.unshift(overviewLink);
|
|
148
|
+
}
|
|
142
149
|
this.firstFocusableEl = focusableChildren[0];
|
|
143
150
|
this.lastFocusableEl = focusableChildren[focusableChildren.length - 1];
|
|
144
151
|
}
|
|
@@ -216,7 +223,7 @@ export class PostMegadropdown {
|
|
|
216
223
|
}
|
|
217
224
|
render() {
|
|
218
225
|
const containerStyle = this.isVisible ? {} : { display: 'none' };
|
|
219
|
-
return (h(Host, { key: '
|
|
226
|
+
return (h(Host, { key: '341ea7fd69a095bc0f18b0f73c3ac5247784dd33', version: version }, h("div", { key: '078435c707ec6b2e0d51f8adad5502729513af63', class: `megadropdown-container ${this.animationClass || ''}`, style: containerStyle, onAnimationEnd: () => this.handleAnimationEnd() }, h("div", { key: 'ad92234d06bccbc60a2e1a6cc63634535646c4f7', class: "megadropdown" }, h("slot", { key: 'f9779e130c7709912c12d30b554ff8f478840628', name: "megadropdown-title" }), h("slot", { key: 'e079e0381a0ce7e3ab7efd974cdf36e6938a378d', name: "megadropdown-overview-link" }), h("div", { key: '508d4e9bddb727e960aa6f2dc15515f1718aa2b9', class: "megadropdown-content" }, h("slot", { key: '442bb0b169824ed66ae5e7da9acd6bb7d759b6f5' })), h("div", { key: 'cc278c0b5680019270206fbde4ce7a83341a029a', onClick: () => this.hide(true), class: "back-button" }, h("slot", { key: '9c42fa29e89f60af62ab5d04d01e1764b36ebec4', name: "back-button" })), h("div", { key: '62bcc5bcc348cb45289ded98273804ab547471ef', onClick: () => this.hide(true), class: "close-button" }, h("slot", { key: '2cdf1d72f62a162bfb1596507063315430953096', name: "close-button" }))))));
|
|
220
227
|
}
|
|
221
228
|
static get is() { return "post-megadropdown"; }
|
|
222
229
|
static get originalStyleUrls() {
|
|
@@ -93,7 +93,7 @@ export class PostMegadropdownTrigger {
|
|
|
93
93
|
document.removeEventListener('postToggleMegadropdown', this.handleToggleMegadropdown);
|
|
94
94
|
}
|
|
95
95
|
render() {
|
|
96
|
-
return (h(Host, { key: '
|
|
96
|
+
return (h(Host, { key: '838bff4fe3feac679b522c2f7a166ac7aa5c2bf9', "data-version": version, "tab-index": "-1" }, h("button", { key: 'b5a90298610863e46447198642b5a27b8702aefc' }, h("slot", { key: '14c83456eb056f48143edcd2c532bca017c60171' }))));
|
|
97
97
|
}
|
|
98
98
|
static get is() { return "post-megadropdown-trigger"; }
|
|
99
99
|
static get originalStyleUrls() {
|
|
@@ -12,7 +12,7 @@ import { h, Host, } from "@stencil/core";
|
|
|
12
12
|
import { PLACEMENT_TYPES } from "../../types/index";
|
|
13
13
|
import { version } from "../../../../package";
|
|
14
14
|
import { getFocusableChildren } from "../../utils/get-focusable-children";
|
|
15
|
-
import { getRoot, checkEmptyOrOneOf,
|
|
15
|
+
import { getRoot, checkEmptyOrOneOf, checkRequiredAndType, EventFrom } from "../../utils/index";
|
|
16
16
|
/**
|
|
17
17
|
* @part menu - The container element that holds the list of menu items.
|
|
18
18
|
* @slot header - Holds the header part of the menu.
|
|
@@ -52,35 +52,32 @@ export class PostMenu {
|
|
|
52
52
|
this.controlKeyDownHandler(e);
|
|
53
53
|
}
|
|
54
54
|
};
|
|
55
|
-
this.
|
|
55
|
+
this.handlePostShown = (event) => {
|
|
56
|
+
// Only for the first open
|
|
57
|
+
if (event.detail.first) {
|
|
58
|
+
// Add "menu" and "menuitem" aria roles and aria-label
|
|
59
|
+
this.host.setAttribute('role', 'menu');
|
|
60
|
+
const menuItems = this.getSlottedItems();
|
|
61
|
+
for (const item of menuItems) {
|
|
62
|
+
item.setAttribute('role', 'menuitem');
|
|
63
|
+
}
|
|
64
|
+
if (this.label)
|
|
65
|
+
this.host.setAttribute('aria-label', this.label);
|
|
66
|
+
}
|
|
67
|
+
};
|
|
68
|
+
this.handlePostToggled = (event) => {
|
|
56
69
|
this.isVisible = event.detail.isOpen;
|
|
57
70
|
this.toggleMenu.emit(this.isVisible);
|
|
58
|
-
|
|
59
|
-
|
|
60
|
-
|
|
61
|
-
|
|
62
|
-
if (event.detail.first) {
|
|
63
|
-
if (menuItems.length > 0) {
|
|
64
|
-
// Add role="menu" to the popovercontainer
|
|
65
|
-
this.host.setAttribute('role', 'menu');
|
|
66
|
-
// Add role="menuitem" to the focusable elements
|
|
67
|
-
menuItems.forEach(item => {
|
|
68
|
-
item.setAttribute('role', 'menuitem');
|
|
69
|
-
});
|
|
70
|
-
// Add aria-label to the menu
|
|
71
|
-
if (this.label)
|
|
72
|
-
this.host.setAttribute('aria-label', this.label);
|
|
73
|
-
}
|
|
74
|
-
}
|
|
71
|
+
if (this.isVisible) {
|
|
72
|
+
this.lastFocusedElement = this.root?.activeElement;
|
|
73
|
+
const menuItems = this.getSlottedItems();
|
|
74
|
+
if (menuItems.length > 0) {
|
|
75
75
|
menuItems[0].focus();
|
|
76
76
|
}
|
|
77
|
-
|
|
78
|
-
|
|
79
|
-
|
|
80
|
-
|
|
81
|
-
}, 0);
|
|
82
|
-
}
|
|
83
|
-
});
|
|
77
|
+
}
|
|
78
|
+
else if (this.lastFocusedElement) {
|
|
79
|
+
this.lastFocusedElement.focus();
|
|
80
|
+
}
|
|
84
81
|
};
|
|
85
82
|
this.handleClick = (e) => {
|
|
86
83
|
const target = e.target;
|
|
@@ -103,14 +100,10 @@ export class PostMenu {
|
|
|
103
100
|
disconnectedCallback() {
|
|
104
101
|
this.host.removeEventListener('keydown', this.handleKeyDown);
|
|
105
102
|
this.host.removeEventListener('click', this.handleClick);
|
|
106
|
-
this.popoverRef?.removeEventListener('postToggle', this.handlePostToggle);
|
|
107
103
|
}
|
|
108
104
|
componentDidLoad() {
|
|
109
105
|
this.validatePlacement();
|
|
110
106
|
this.validateLabel();
|
|
111
|
-
if (this.popoverRef) {
|
|
112
|
-
this.popoverRef.addEventListener('postToggle', this.handlePostToggle);
|
|
113
|
-
}
|
|
114
107
|
}
|
|
115
108
|
/**
|
|
116
109
|
* Toggles the menu visibility based on its current state.
|
|
@@ -196,7 +189,7 @@ export class PostMenu {
|
|
|
196
189
|
.flatMap(el => Array.from(getFocusableChildren(el))));
|
|
197
190
|
}
|
|
198
191
|
render() {
|
|
199
|
-
return (h(Host, { key: '
|
|
192
|
+
return (h(Host, { key: '092a180331d50cfe701ad440569e0e6bd4bcd0c8', "data-version": version }, h("post-popovercontainer", { key: '96f33df1a47d2fb1f6f862a7d7f97def5fd8b642', onPostShow: this.handlePostShown, onPostToggle: this.handlePostToggled, placement: this.placement, ref: e => (this.popoverRef = e) }, h("div", { key: '5d23d1059dd1cf68ac817acc8227129267a3c5a4', part: "menu" }, h("slot", { key: '020fbf8912393d85cd5a6fd9f65fdf264f2ba6f6', name: "header" }), h("slot", { key: '07cd9cb978ec85dd7fbbaed527520b97484e2030' })))));
|
|
200
193
|
}
|
|
201
194
|
static get is() { return "post-menu"; }
|
|
202
195
|
static get encapsulation() { return "shadow"; }
|
|
@@ -223,7 +216,7 @@ export class PostMenu {
|
|
|
223
216
|
"Placement": {
|
|
224
217
|
"location": "import",
|
|
225
218
|
"path": "@floating-ui/dom",
|
|
226
|
-
"id": "../../node_modules/.pnpm/@floating-ui+dom@1.7.
|
|
219
|
+
"id": "../../node_modules/.pnpm/@floating-ui+dom@1.7.4/node_modules/@floating-ui/dom/dist/floating-ui.dom.d.ts::Placement"
|
|
227
220
|
}
|
|
228
221
|
}
|
|
229
222
|
},
|
|
@@ -369,4 +362,7 @@ export class PostMenu {
|
|
|
369
362
|
}
|
|
370
363
|
__decorate([
|
|
371
364
|
EventFrom('post-popovercontainer')
|
|
372
|
-
], PostMenu.prototype, "
|
|
365
|
+
], PostMenu.prototype, "handlePostShown", void 0);
|
|
366
|
+
__decorate([
|
|
367
|
+
EventFrom('post-popovercontainer')
|
|
368
|
+
], PostMenu.prototype, "handlePostToggled", void 0);
|
|
@@ -2,7 +2,7 @@ import { h, Host } from "@stencil/core";
|
|
|
2
2
|
import { version } from "../../../../package";
|
|
3
3
|
export class PostMenuItem {
|
|
4
4
|
render() {
|
|
5
|
-
return (h(Host, { key: '
|
|
5
|
+
return (h(Host, { key: 'd37c4eed483b46dedcccbc835017ff2415dbd22e', "data-version": version }, h("slot", { key: 'e13d1f35e7883a0aee4d08ceb39caeb97fb960ec' })));
|
|
6
6
|
}
|
|
7
7
|
static get is() { return "post-menu-item"; }
|
|
8
8
|
static get originalStyleUrls() {
|
|
@@ -73,7 +73,7 @@ export class PostMenuTrigger {
|
|
|
73
73
|
}
|
|
74
74
|
}
|
|
75
75
|
render() {
|
|
76
|
-
return (h(Host, { key: '
|
|
76
|
+
return (h(Host, { key: 'fc962802089652073c19cc35a511e48b0cab43b7', "data-version": version, "tab-index": "-1" }, h("slot", { key: 'd3a8b40c0a88c44092b56ca4aa1c74f880bebb20' })));
|
|
77
77
|
}
|
|
78
78
|
static get is() { return "post-menu-trigger"; }
|
|
79
79
|
static get originalStyleUrls() {
|