@swisspost/design-system-components 9.0.0-next.4 → 9.0.0-next.5
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/dist/cjs/check-type-64af82a9.js +16 -0
- package/dist/cjs/{index-01f30442.js → index-824d2b71.js} +2 -15
- package/dist/cjs/index-e1f32cce.js +10 -18
- package/dist/cjs/index.cjs.js +35 -29
- package/dist/cjs/loader.cjs.js +1 -1
- package/dist/cjs/{package-3f706795.js → package-53892d3d.js} +1 -1
- package/dist/cjs/{post-accordion-0391f4c5.js → post-accordion-7f627ffd.js} +1 -1
- package/dist/cjs/{post-accordion-item-19ce78d0.js → post-accordion-item-ceb5399f.js} +2 -2
- package/dist/cjs/post-accordion-item.cjs.entry.js +4 -3
- package/dist/cjs/post-accordion.cjs.entry.js +2 -2
- package/dist/cjs/post-alert-5333a23c.js +99 -0
- package/dist/cjs/post-alert.cjs.entry.js +4 -3
- package/dist/cjs/{post-avatar-ffba1d23.js → post-avatar-a8123d38.js} +1 -1
- package/dist/cjs/post-avatar.cjs.entry.js +2 -2
- package/dist/cjs/{post-breadcrumb-item-42466f8a.js → post-breadcrumb-item-6e4704e5.js} +2 -2
- package/dist/cjs/post-breadcrumb-item.cjs.entry.js +4 -3
- package/dist/cjs/{post-card-control-37d6a65a.js → post-card-control-b289ddcf.js} +1 -1
- package/dist/cjs/post-card-control.cjs.entry.js +2 -2
- package/dist/cjs/post-closebutton_10.cjs.entry.js +25 -0
- package/dist/cjs/{post-collapsible-trigger-c843f028.js → post-collapsible-trigger-e4862a5b.js} +4 -3
- package/dist/cjs/post-collapsible_2.cjs.entry.js +4 -3
- package/dist/cjs/post-components.cjs.js +1 -1
- package/dist/cjs/{post-language-option-dab6d431.js → post-language-option-62414842.js} +4 -3
- package/dist/cjs/post-language-option.cjs.entry.js +4 -3
- package/dist/cjs/{post-popovercontainer-1e6be8ad.js → post-megadropdown-trigger-da912fed.js} +516 -15
- package/dist/cjs/post-menu-54fa65d3.js +176 -0
- package/dist/cjs/post-menu-item-8c3090b1.js +20 -0
- package/dist/cjs/post-menu-item.cjs.entry.js +11 -0
- package/dist/cjs/post-menu-trigger-71449876.js +73 -0
- package/dist/cjs/post-menu-trigger.cjs.entry.js +12 -0
- package/dist/cjs/post-menu.cjs.entry.js +11 -0
- package/dist/cjs/{post-popover-4457dd58.js → post-popover-5f639e4f.js} +2 -2
- package/dist/cjs/post-popover.cjs.entry.js +2 -2
- package/dist/cjs/{post-rating-236273be.js → post-rating-3d166fed.js} +2 -2
- package/dist/cjs/post-rating.cjs.entry.js +2 -2
- package/dist/cjs/{post-tab-header-bce47e34.js → post-tab-header-03b20f24.js} +2 -2
- package/dist/cjs/post-tab-header.cjs.entry.js +2 -2
- package/dist/cjs/{post-tab-panel-e25974be.js → post-tab-panel-e5685f3d.js} +2 -2
- package/dist/cjs/post-tab-panel.cjs.entry.js +2 -2
- package/dist/cjs/{post-tabs-dc99bddf.js → post-tabs-e871c911.js} +2 -2
- package/dist/cjs/post-tabs.cjs.entry.js +2 -2
- package/dist/cjs/{post-tag-a28852a8.js → post-tag-62f31d0e.js} +2 -2
- package/dist/cjs/post-tag.cjs.entry.js +2 -2
- package/dist/cjs/{post-tooltip-78e4129b.js → post-tooltip-851c342c.js} +3 -3
- package/dist/cjs/post-tooltip.cjs.entry.js +4 -3
- package/dist/collection/collection-manifest.json +8 -1
- package/dist/collection/components/post-alert/post-alert.css +3 -3
- package/dist/collection/components/post-header/post-header.css +1 -0
- package/dist/collection/components/post-header/post-header.js +103 -0
- package/dist/collection/components/post-list/post-list.js +1 -1
- package/dist/collection/components/post-list-item/post-list-item.js +1 -1
- package/dist/collection/components/post-logo/post-logo.js +1 -1
- package/dist/collection/components/post-mainnavigation/post-mainnavigation.css +1 -0
- package/dist/collection/components/post-mainnavigation/post-mainnavigation.js +61 -0
- package/dist/collection/components/post-megadropdown/post-megadropdown.css +1 -0
- package/dist/collection/components/post-megadropdown/post-megadropdown.js +137 -0
- package/dist/collection/components/post-megadropdown-trigger/post-megadropdown-trigger.css +1 -0
- package/dist/collection/components/post-megadropdown-trigger/post-megadropdown-trigger.js +48 -0
- package/dist/collection/components/post-menu/post-menu.css +3 -0
- package/dist/collection/components/post-menu/post-menu.js +278 -0
- package/dist/collection/components/post-menu-item/post-menu-item.css +1 -0
- package/dist/collection/components/post-menu-item/post-menu-item.js +20 -0
- package/dist/collection/components/post-menu-trigger/post-menu-trigger.css +1 -0
- package/dist/collection/components/post-menu-trigger/post-menu-trigger.js +103 -0
- package/dist/collection/components/post-popover/post-popover.js +1 -1
- package/dist/collection/components/post-popovercontainer/post-popovercontainer.js +2 -2
- package/dist/collection/components/post-rating/post-rating.js +1 -1
- package/dist/collection/components/post-tab-header/post-tab-header.js +1 -1
- package/dist/collection/components/post-tab-panel/post-tab-panel.js +1 -1
- package/dist/collection/components/post-tabs/post-tabs.js +1 -1
- package/dist/collection/components/post-tag/post-tag.js +1 -1
- package/dist/collection/components/post-tooltip/post-tooltip.js +1 -1
- package/dist/collection/index.js +7 -0
- package/dist/collection/utils/is-focusable.js +26 -0
- package/dist/components/index.js +7 -0
- package/dist/components/package.js +1 -1
- package/dist/components/post-alert2.js +1 -1
- package/dist/components/post-header.d.ts +11 -0
- package/dist/components/post-header.js +6 -0
- package/dist/components/post-header2.js +235 -0
- package/dist/components/post-list-item2.js +1 -1
- package/dist/components/post-list2.js +1 -1
- package/dist/components/post-logo2.js +1 -1
- package/dist/components/post-mainnavigation.d.ts +11 -0
- package/dist/components/post-mainnavigation.js +6 -0
- package/dist/components/post-mainnavigation2.js +48 -0
- package/dist/components/post-megadropdown-trigger.d.ts +11 -0
- package/dist/components/post-megadropdown-trigger.js +6 -0
- package/dist/components/post-megadropdown-trigger2.js +39 -0
- package/dist/components/post-megadropdown.d.ts +11 -0
- package/dist/components/post-megadropdown.js +6 -0
- package/dist/components/post-megadropdown2.js +67 -0
- package/dist/components/post-menu-item.d.ts +11 -0
- package/dist/components/post-menu-item.js +6 -0
- package/dist/components/post-menu-item2.js +33 -0
- package/dist/components/post-menu-trigger.d.ts +11 -0
- package/dist/components/post-menu-trigger.js +6 -0
- package/dist/components/post-menu-trigger2.js +90 -0
- package/dist/components/post-menu.d.ts +11 -0
- package/dist/components/post-menu.js +6 -0
- package/dist/components/post-menu2.js +201 -0
- package/dist/components/post-popover2.js +1 -1
- package/dist/components/post-popovercontainer2.js +2 -2
- package/dist/components/post-rating2.js +1 -1
- package/dist/components/post-tab-header2.js +1 -1
- package/dist/components/post-tab-panel2.js +1 -1
- package/dist/components/post-tabs2.js +1 -1
- package/dist/components/post-tag2.js +1 -1
- package/dist/components/post-tooltip2.js +1 -1
- package/dist/docs.json +547 -1
- package/dist/esm/check-type-8828dbe4.js +14 -0
- package/dist/esm/index-e1b64755.js +10 -18
- package/dist/esm/{index-642cd1f2.js → index-f8a00dc0.js} +2 -14
- package/dist/esm/index.js +22 -23
- package/dist/esm/loader.js +1 -1
- package/dist/esm/package-d0380f19.js +3 -0
- package/dist/esm/{post-accordion-7ef6d6bf.js → post-accordion-b2762084.js} +1 -1
- package/dist/esm/{post-accordion-item-d98c612f.js → post-accordion-item-82ef1c4a.js} +2 -2
- package/dist/esm/post-accordion-item.entry.js +4 -3
- package/dist/esm/post-accordion.entry.js +2 -2
- package/dist/esm/post-alert-0679e14b.js +97 -0
- package/dist/esm/post-alert.entry.js +4 -3
- package/dist/esm/{post-avatar-f743d28e.js → post-avatar-e84c49cb.js} +1 -1
- package/dist/esm/post-avatar.entry.js +2 -2
- package/dist/esm/{post-breadcrumb-item-e287afe1.js → post-breadcrumb-item-ff752018.js} +2 -2
- package/dist/esm/post-breadcrumb-item.entry.js +4 -3
- package/dist/esm/{post-card-control-685ca60d.js → post-card-control-53b9ca94.js} +1 -1
- package/dist/esm/post-card-control.entry.js +2 -2
- package/dist/esm/post-closebutton_10.entry.js +8 -0
- package/dist/esm/{post-collapsible-trigger-1eca7350.js → post-collapsible-trigger-34740fa6.js} +3 -2
- package/dist/esm/post-collapsible_2.entry.js +4 -3
- package/dist/esm/post-components.js +1 -1
- package/dist/esm/{post-language-option-92ce480f.js → post-language-option-e2a76752.js} +3 -2
- package/dist/esm/post-language-option.entry.js +4 -3
- package/dist/esm/{post-popovercontainer-409abba0.js → post-megadropdown-trigger-7e577245.js} +509 -17
- package/dist/esm/post-menu-e6337859.js +174 -0
- package/dist/esm/post-menu-item-c10a0a93.js +18 -0
- package/dist/esm/post-menu-item.entry.js +3 -0
- package/dist/esm/post-menu-trigger-5f31ad60.js +71 -0
- package/dist/esm/post-menu-trigger.entry.js +4 -0
- package/dist/esm/post-menu.entry.js +3 -0
- package/dist/esm/{post-popover-a82bae79.js → post-popover-d78547b4.js} +2 -2
- package/dist/esm/post-popover.entry.js +2 -2
- package/dist/esm/{post-rating-a6513fc9.js → post-rating-d04d0349.js} +2 -2
- package/dist/esm/post-rating.entry.js +2 -2
- package/dist/esm/{post-tab-header-2bf36bae.js → post-tab-header-6efc530f.js} +2 -2
- package/dist/esm/post-tab-header.entry.js +2 -2
- package/dist/esm/{post-tab-panel-56ad2836.js → post-tab-panel-d9ecc10e.js} +2 -2
- package/dist/esm/post-tab-panel.entry.js +2 -2
- package/dist/esm/{post-tabs-895b4e96.js → post-tabs-e98a47e8.js} +2 -2
- package/dist/esm/post-tabs.entry.js +2 -2
- package/dist/esm/{post-tag-ee91d6a9.js → post-tag-40a65871.js} +2 -2
- package/dist/esm/post-tag.entry.js +2 -2
- package/dist/esm/{post-tooltip-a4d93fd2.js → post-tooltip-3b1e121c.js} +3 -3
- package/dist/esm/post-tooltip.entry.js +4 -3
- package/dist/post-components/index.esm.js +1 -1
- package/dist/post-components/p-029c91d8.entry.js +1 -0
- package/dist/post-components/p-0338f9da.js +1 -0
- package/dist/post-components/p-03c850fa.entry.js +1 -0
- package/dist/post-components/p-1d8a41d3.js +1 -0
- package/dist/post-components/p-2069e764.js +1 -0
- package/dist/post-components/p-3705d2b4.js +1 -0
- package/dist/post-components/p-3aaea2a7.js +1 -0
- package/dist/post-components/p-3b4342e4.entry.js +1 -0
- package/dist/post-components/p-3b5bd4a4.entry.js +1 -0
- package/dist/post-components/p-3f785d16.entry.js +1 -0
- package/dist/post-components/p-40a57111.entry.js +1 -0
- package/dist/post-components/p-41f5f626.entry.js +1 -0
- package/dist/post-components/p-42c628fd.js +1 -0
- package/dist/post-components/{p-5a8157b4.js → p-43451d07.js} +1 -1
- package/dist/post-components/p-49a42850.js +1 -0
- package/dist/post-components/p-4a3f67ab.js +1 -0
- package/dist/post-components/p-4f1a40dd.entry.js +1 -0
- package/dist/post-components/p-6e7bde44.js +1 -0
- package/dist/post-components/{p-fda6ce34.js → p-70c016ab.js} +1 -1
- package/dist/post-components/{p-1a53bc7d.js → p-75514d7d.js} +1 -1
- package/dist/post-components/p-76dbca34.entry.js +1 -0
- package/dist/post-components/{p-fb7a5867.js → p-77a757d4.js} +1 -1
- package/dist/post-components/p-77af2367.entry.js +1 -0
- package/dist/post-components/{p-5957a7fa.js → p-7a20605b.js} +1 -1
- package/dist/post-components/{p-7b0616c6.js → p-879ae242.js} +1 -1
- package/dist/post-components/{p-d37c6cc3.js → p-976c2742.js} +1 -1
- package/dist/post-components/p-9cda2b0d.entry.js +1 -0
- package/dist/post-components/p-9fab4d3c.js +1 -0
- package/dist/post-components/p-a0226aec.js +1 -0
- package/dist/post-components/p-aa890e24.entry.js +1 -0
- package/dist/post-components/p-ac6d9496.js +1 -0
- package/dist/post-components/p-ad6e41d5.entry.js +1 -0
- package/dist/post-components/{p-bc7cfb53.js → p-af8cfb8e.js} +1 -1
- package/dist/post-components/p-c95813b2.entry.js +1 -0
- package/dist/post-components/p-d3814644.entry.js +1 -0
- package/dist/post-components/p-d5b02b44.entry.js +1 -0
- package/dist/post-components/{p-47279ac4.js → p-e0dc4fac.js} +2 -2
- package/dist/post-components/p-f404d0bb.entry.js +1 -0
- package/dist/post-components/p-f5b933bc.entry.js +1 -0
- package/dist/post-components/p-fbda2556.entry.js +1 -0
- package/dist/post-components/{p-2caf9469.js → p-fc2c7222.js} +1 -1
- package/dist/post-components/post-components.esm.js +1 -1
- package/dist/types/components/post-header/post-header.d.ts +16 -0
- package/dist/types/components/post-mainnavigation/post-mainnavigation.d.ts +10 -0
- package/dist/types/components/post-megadropdown/post-megadropdown.d.ts +23 -0
- package/dist/types/components/post-megadropdown-trigger/post-megadropdown-trigger.d.ts +10 -0
- package/dist/types/components/post-menu/post-menu.d.ts +47 -0
- package/dist/types/components/post-menu-item/post-menu-item.d.ts +4 -0
- package/dist/types/components/post-menu-trigger/post-menu-trigger.d.ts +26 -0
- package/dist/types/components.d.ts +195 -0
- package/dist/types/index.d.ts +7 -0
- package/dist/types/utils/is-focusable.d.ts +1 -0
- package/loaders/index.d.ts +14 -0
- package/loaders/index.js +8 -1
- package/loaders/package.js +1 -1
- package/loaders/post-alert.js +1 -1
- package/loaders/post-header.d.ts +11 -0
- package/loaders/post-header.js +238 -0
- package/loaders/post-list-item.js +1 -1
- package/loaders/post-list.js +1 -1
- package/loaders/post-logo.js +1 -1
- package/loaders/post-mainnavigation.d.ts +11 -0
- package/loaders/post-mainnavigation.js +51 -0
- package/loaders/post-megadropdown-trigger.d.ts +11 -0
- package/loaders/post-megadropdown-trigger.js +42 -0
- package/loaders/post-megadropdown.d.ts +11 -0
- package/loaders/post-megadropdown.js +70 -0
- package/loaders/post-menu-item.d.ts +11 -0
- package/loaders/post-menu-item.js +36 -0
- package/loaders/post-menu-trigger.d.ts +11 -0
- package/loaders/post-menu-trigger.js +93 -0
- package/loaders/post-menu.d.ts +11 -0
- package/loaders/post-menu.js +204 -0
- package/loaders/post-popover.js +1 -1
- package/loaders/post-popovercontainer2.js +2 -2
- package/loaders/post-rating.js +1 -1
- package/loaders/post-tab-header.js +1 -1
- package/loaders/post-tab-panel.js +1 -1
- package/loaders/post-tabs.js +1 -1
- package/loaders/post-tag.js +1 -1
- package/loaders/post-tooltip.js +1 -1
- package/package.json +3 -2
- package/dist/cjs/post-alert-278229ad.js +0 -98
- package/dist/cjs/post-closebutton-372c1276.js +0 -16
- package/dist/cjs/post-closebutton.cjs.entry.js +0 -11
- package/dist/cjs/post-icon-ca80afce.js +0 -104
- package/dist/cjs/post-icon.cjs.entry.js +0 -15
- package/dist/cjs/post-list-f2c673ef.js +0 -37
- package/dist/cjs/post-list-item-1b6ce0d0.js +0 -22
- package/dist/cjs/post-list-item.cjs.entry.js +0 -10
- package/dist/cjs/post-list.cjs.entry.js +0 -11
- package/dist/cjs/post-logo-ed8e99c0.js +0 -39
- package/dist/cjs/post-logo.cjs.entry.js +0 -14
- package/dist/cjs/post-popovercontainer.cjs.entry.js +0 -11
- package/dist/esm/package-aaf62247.js +0 -3
- package/dist/esm/post-alert-2aee0a88.js +0 -96
- package/dist/esm/post-closebutton-a951a0ba.js +0 -14
- package/dist/esm/post-closebutton.entry.js +0 -3
- package/dist/esm/post-icon-29b33e6a.js +0 -102
- package/dist/esm/post-icon.entry.js +0 -7
- package/dist/esm/post-list-5a17eff9.js +0 -35
- package/dist/esm/post-list-item-12ff4b9c.js +0 -20
- package/dist/esm/post-list-item.entry.js +0 -2
- package/dist/esm/post-list.entry.js +0 -3
- package/dist/esm/post-logo-0a072d4b.js +0 -37
- package/dist/esm/post-logo.entry.js +0 -6
- package/dist/esm/post-popovercontainer.entry.js +0 -3
- package/dist/post-components/p-065de04e.entry.js +0 -1
- package/dist/post-components/p-0af20b10.entry.js +0 -1
- package/dist/post-components/p-13e6577d.js +0 -1
- package/dist/post-components/p-16ff4451.entry.js +0 -1
- package/dist/post-components/p-2b777f74.js +0 -1
- package/dist/post-components/p-3a272de8.entry.js +0 -1
- package/dist/post-components/p-3cc61960.js +0 -1
- package/dist/post-components/p-49445ef1.entry.js +0 -1
- package/dist/post-components/p-6ecb14d1.js +0 -1
- package/dist/post-components/p-7986d834.js +0 -1
- package/dist/post-components/p-80e5d228.entry.js +0 -1
- package/dist/post-components/p-8618ccea.entry.js +0 -1
- package/dist/post-components/p-8bd32536.js +0 -1
- package/dist/post-components/p-8f36ccda.entry.js +0 -1
- package/dist/post-components/p-9753c9c7.entry.js +0 -1
- package/dist/post-components/p-9cd82521.js +0 -1
- package/dist/post-components/p-a3cc34a3.js +0 -1
- package/dist/post-components/p-a514b746.entry.js +0 -1
- package/dist/post-components/p-a9efdea5.entry.js +0 -1
- package/dist/post-components/p-aae80acd.entry.js +0 -1
- package/dist/post-components/p-b60d2ab7.entry.js +0 -1
- package/dist/post-components/p-b63a3fc2.entry.js +0 -1
- package/dist/post-components/p-ba14d022.js +0 -1
- package/dist/post-components/p-be5b0cdb.entry.js +0 -1
- package/dist/post-components/p-c79c7d00.entry.js +0 -1
- package/dist/post-components/p-cd91c467.entry.js +0 -1
- package/dist/post-components/p-d176f664.js +0 -1
- package/dist/post-components/p-d528afb2.entry.js +0 -1
- package/dist/post-components/p-d793c76b.js +0 -1
- package/dist/post-components/p-dd871b55.js +0 -1
- package/dist/post-components/p-e1925cd1.entry.js +0 -1
- package/dist/post-components/p-fb62c672.js +0 -1
- package/dist/post-components/p-fe602d19.entry.js +0 -1
- package/dist/post-components/p-ffb26d24.entry.js +0 -1
|
@@ -0,0 +1,278 @@
|
|
|
1
|
+
import { h, Host } from "@stencil/core";
|
|
2
|
+
import { version } from "../../../../package";
|
|
3
|
+
import { isFocusable } from "../../utils/is-focusable";
|
|
4
|
+
export class PostMenu {
|
|
5
|
+
constructor() {
|
|
6
|
+
this.lastFocusedElement = null;
|
|
7
|
+
this.KEYCODES = {
|
|
8
|
+
SPACE: ' ',
|
|
9
|
+
ENTER: 'Enter',
|
|
10
|
+
UP: 'ArrowUp',
|
|
11
|
+
DOWN: 'ArrowDown',
|
|
12
|
+
TAB: 'Tab',
|
|
13
|
+
HOME: 'Home',
|
|
14
|
+
END: 'End',
|
|
15
|
+
ESCAPE: 'Escape'
|
|
16
|
+
};
|
|
17
|
+
this.handleKeyDown = (e) => {
|
|
18
|
+
e.stopPropagation();
|
|
19
|
+
if (e.key === this.KEYCODES.ESCAPE) {
|
|
20
|
+
this.toggle(this.host);
|
|
21
|
+
return;
|
|
22
|
+
}
|
|
23
|
+
if (Object.values(this.KEYCODES).includes(e.key)) {
|
|
24
|
+
this.controlKeyDownHandler(e);
|
|
25
|
+
}
|
|
26
|
+
};
|
|
27
|
+
this.handleClick = (e) => {
|
|
28
|
+
const target = e.target;
|
|
29
|
+
if (['BUTTON', 'A', 'INPUT', 'SELECT', 'TEXTAREA'].includes(target.tagName)) {
|
|
30
|
+
this.toggle(this.host);
|
|
31
|
+
}
|
|
32
|
+
};
|
|
33
|
+
this.placement = 'bottom';
|
|
34
|
+
this.isVisible = false;
|
|
35
|
+
}
|
|
36
|
+
connectedCallback() {
|
|
37
|
+
this.host.addEventListener('keydown', this.handleKeyDown);
|
|
38
|
+
this.host.addEventListener('click', this.handleClick);
|
|
39
|
+
}
|
|
40
|
+
disconnectedCallback() {
|
|
41
|
+
this.host.removeEventListener('keydown', this.handleKeyDown);
|
|
42
|
+
this.host.removeEventListener('click', this.handleClick);
|
|
43
|
+
}
|
|
44
|
+
componentDidLoad() {
|
|
45
|
+
this.popoverRef.addEventListener('postToggle', (event) => {
|
|
46
|
+
this.isVisible = event.detail;
|
|
47
|
+
this.toggleMenu.emit(this.isVisible);
|
|
48
|
+
});
|
|
49
|
+
}
|
|
50
|
+
/**
|
|
51
|
+
* Toggles the menu visibility based on its current state.
|
|
52
|
+
*/
|
|
53
|
+
async toggle(target) {
|
|
54
|
+
this.isVisible ? await this.hide() : await this.show(target);
|
|
55
|
+
}
|
|
56
|
+
/**
|
|
57
|
+
* Displays the popover menu, focusing the first menu item.
|
|
58
|
+
*
|
|
59
|
+
* @param target - The HTML element relative to which the popover menu should be displayed.
|
|
60
|
+
*/
|
|
61
|
+
async show(target) {
|
|
62
|
+
if (this.popoverRef) {
|
|
63
|
+
await this.popoverRef.show(target);
|
|
64
|
+
this.lastFocusedElement = document.activeElement;
|
|
65
|
+
const menuItems = this.getSlottedItems();
|
|
66
|
+
if (menuItems.length > 0) {
|
|
67
|
+
menuItems[0].focus();
|
|
68
|
+
}
|
|
69
|
+
}
|
|
70
|
+
else {
|
|
71
|
+
console.error('show: popoverRef is null or undefined');
|
|
72
|
+
}
|
|
73
|
+
}
|
|
74
|
+
/**
|
|
75
|
+
* Hides the popover menu and restores focus to the previously focused element.
|
|
76
|
+
*/
|
|
77
|
+
async hide() {
|
|
78
|
+
if (this.popoverRef) {
|
|
79
|
+
await this.popoverRef.hide();
|
|
80
|
+
if (this.lastFocusedElement) {
|
|
81
|
+
this.lastFocusedElement.focus();
|
|
82
|
+
}
|
|
83
|
+
}
|
|
84
|
+
else {
|
|
85
|
+
console.error('hide: popoverRef is null or undefined');
|
|
86
|
+
}
|
|
87
|
+
}
|
|
88
|
+
controlKeyDownHandler(e) {
|
|
89
|
+
const menuItems = this.getSlottedItems();
|
|
90
|
+
if (!menuItems.length) {
|
|
91
|
+
return;
|
|
92
|
+
}
|
|
93
|
+
const currentFocusedElement = document.activeElement;
|
|
94
|
+
let currentIndex = menuItems.findIndex(el => el === currentFocusedElement);
|
|
95
|
+
switch (e.key) {
|
|
96
|
+
case this.KEYCODES.UP:
|
|
97
|
+
e.preventDefault();
|
|
98
|
+
currentIndex = (currentIndex - 1 + menuItems.length) % menuItems.length;
|
|
99
|
+
break;
|
|
100
|
+
case this.KEYCODES.DOWN:
|
|
101
|
+
e.preventDefault();
|
|
102
|
+
currentIndex = (currentIndex + 1) % menuItems.length;
|
|
103
|
+
break;
|
|
104
|
+
case this.KEYCODES.HOME:
|
|
105
|
+
currentIndex = 0;
|
|
106
|
+
break;
|
|
107
|
+
case this.KEYCODES.END:
|
|
108
|
+
currentIndex = menuItems.length - 1;
|
|
109
|
+
break;
|
|
110
|
+
case this.KEYCODES.SPACE:
|
|
111
|
+
case this.KEYCODES.ENTER:
|
|
112
|
+
this.toggle(this.host);
|
|
113
|
+
return;
|
|
114
|
+
case this.KEYCODES.TAB:
|
|
115
|
+
this.toggle(this.host);
|
|
116
|
+
break;
|
|
117
|
+
default:
|
|
118
|
+
break;
|
|
119
|
+
}
|
|
120
|
+
if (menuItems[currentIndex]) {
|
|
121
|
+
menuItems[currentIndex].focus();
|
|
122
|
+
}
|
|
123
|
+
}
|
|
124
|
+
getSlottedItems() {
|
|
125
|
+
const slot = this.host.shadowRoot.querySelector('slot');
|
|
126
|
+
const slottedElements = slot ? slot.assignedElements() : [];
|
|
127
|
+
const menuItems = slottedElements
|
|
128
|
+
.filter(el => el.tagName === 'POST-MENU-ITEM')
|
|
129
|
+
.map(el => {
|
|
130
|
+
const slot = el.shadowRoot.querySelector('slot');
|
|
131
|
+
const assignedElements = slot ? slot.assignedElements() : [];
|
|
132
|
+
return assignedElements.filter(isFocusable);
|
|
133
|
+
})
|
|
134
|
+
.flat();
|
|
135
|
+
return menuItems;
|
|
136
|
+
}
|
|
137
|
+
render() {
|
|
138
|
+
return (h(Host, { key: '4447ff6878a1b0f38b533196466b33217f9499d4', "data-version": version }, h("post-popovercontainer", { key: '918e2b8a662cdb64972cb0729b8b077e1bca5e0a', placement: this.placement, ref: e => (this.popoverRef = e) }, h("div", { key: '40b04b6c0d65cc3c10f6b8b037ec3ff24d1b907b', class: "popover-container" }, h("slot", { key: 'e836fdb9e29961f3b6c6c13261e8eef0f874cfb6' })))));
|
|
139
|
+
}
|
|
140
|
+
static get is() { return "post-menu"; }
|
|
141
|
+
static get encapsulation() { return "shadow"; }
|
|
142
|
+
static get originalStyleUrls() {
|
|
143
|
+
return {
|
|
144
|
+
"$": ["post-menu.scss"]
|
|
145
|
+
};
|
|
146
|
+
}
|
|
147
|
+
static get styleUrls() {
|
|
148
|
+
return {
|
|
149
|
+
"$": ["post-menu.css"]
|
|
150
|
+
};
|
|
151
|
+
}
|
|
152
|
+
static get properties() {
|
|
153
|
+
return {
|
|
154
|
+
"placement": {
|
|
155
|
+
"type": "string",
|
|
156
|
+
"mutable": false,
|
|
157
|
+
"complexType": {
|
|
158
|
+
"original": "Placement",
|
|
159
|
+
"resolved": "\"bottom\" | \"bottom-end\" | \"bottom-start\" | \"left\" | \"left-end\" | \"left-start\" | \"right\" | \"right-end\" | \"right-start\" | \"top\" | \"top-end\" | \"top-start\"",
|
|
160
|
+
"references": {
|
|
161
|
+
"Placement": {
|
|
162
|
+
"location": "import",
|
|
163
|
+
"path": "@floating-ui/dom",
|
|
164
|
+
"id": "../../node_modules/.pnpm/@floating-ui+dom@1.6.8/node_modules/@floating-ui/dom/dist/floating-ui.dom.d.ts::Placement"
|
|
165
|
+
}
|
|
166
|
+
}
|
|
167
|
+
},
|
|
168
|
+
"required": false,
|
|
169
|
+
"optional": true,
|
|
170
|
+
"docs": {
|
|
171
|
+
"tags": [],
|
|
172
|
+
"text": "Defines the placement of the tooltip according to the floating-ui options available at https://floating-ui.com/docs/computePosition#placement.\nTooltips are automatically flipped to the opposite side if there is not enough available space and are shifted\ntowards the viewport if they would overlap edge boundaries."
|
|
173
|
+
},
|
|
174
|
+
"attribute": "placement",
|
|
175
|
+
"reflect": false,
|
|
176
|
+
"defaultValue": "'bottom'"
|
|
177
|
+
}
|
|
178
|
+
};
|
|
179
|
+
}
|
|
180
|
+
static get states() {
|
|
181
|
+
return {
|
|
182
|
+
"isVisible": {}
|
|
183
|
+
};
|
|
184
|
+
}
|
|
185
|
+
static get events() {
|
|
186
|
+
return [{
|
|
187
|
+
"method": "toggleMenu",
|
|
188
|
+
"name": "toggleMenu",
|
|
189
|
+
"bubbles": true,
|
|
190
|
+
"cancelable": true,
|
|
191
|
+
"composed": true,
|
|
192
|
+
"docs": {
|
|
193
|
+
"tags": [],
|
|
194
|
+
"text": "Emits when the menu is shown or hidden.\nThe event payload is a boolean: `true` when the menu was opened, `false` when it was closed."
|
|
195
|
+
},
|
|
196
|
+
"complexType": {
|
|
197
|
+
"original": "boolean",
|
|
198
|
+
"resolved": "boolean",
|
|
199
|
+
"references": {}
|
|
200
|
+
}
|
|
201
|
+
}];
|
|
202
|
+
}
|
|
203
|
+
static get methods() {
|
|
204
|
+
return {
|
|
205
|
+
"toggle": {
|
|
206
|
+
"complexType": {
|
|
207
|
+
"signature": "(target: HTMLElement) => Promise<void>",
|
|
208
|
+
"parameters": [{
|
|
209
|
+
"name": "target",
|
|
210
|
+
"type": "HTMLElement",
|
|
211
|
+
"docs": ""
|
|
212
|
+
}],
|
|
213
|
+
"references": {
|
|
214
|
+
"Promise": {
|
|
215
|
+
"location": "global",
|
|
216
|
+
"id": "global::Promise"
|
|
217
|
+
},
|
|
218
|
+
"HTMLElement": {
|
|
219
|
+
"location": "global",
|
|
220
|
+
"id": "global::HTMLElement"
|
|
221
|
+
}
|
|
222
|
+
},
|
|
223
|
+
"return": "Promise<void>"
|
|
224
|
+
},
|
|
225
|
+
"docs": {
|
|
226
|
+
"text": "Toggles the menu visibility based on its current state.",
|
|
227
|
+
"tags": []
|
|
228
|
+
}
|
|
229
|
+
},
|
|
230
|
+
"show": {
|
|
231
|
+
"complexType": {
|
|
232
|
+
"signature": "(target: HTMLElement) => Promise<void>",
|
|
233
|
+
"parameters": [{
|
|
234
|
+
"name": "target",
|
|
235
|
+
"type": "HTMLElement",
|
|
236
|
+
"docs": "- The HTML element relative to which the popover menu should be displayed."
|
|
237
|
+
}],
|
|
238
|
+
"references": {
|
|
239
|
+
"Promise": {
|
|
240
|
+
"location": "global",
|
|
241
|
+
"id": "global::Promise"
|
|
242
|
+
},
|
|
243
|
+
"HTMLElement": {
|
|
244
|
+
"location": "global",
|
|
245
|
+
"id": "global::HTMLElement"
|
|
246
|
+
}
|
|
247
|
+
},
|
|
248
|
+
"return": "Promise<void>"
|
|
249
|
+
},
|
|
250
|
+
"docs": {
|
|
251
|
+
"text": "Displays the popover menu, focusing the first menu item.",
|
|
252
|
+
"tags": [{
|
|
253
|
+
"name": "param",
|
|
254
|
+
"text": "target - The HTML element relative to which the popover menu should be displayed."
|
|
255
|
+
}]
|
|
256
|
+
}
|
|
257
|
+
},
|
|
258
|
+
"hide": {
|
|
259
|
+
"complexType": {
|
|
260
|
+
"signature": "() => Promise<void>",
|
|
261
|
+
"parameters": [],
|
|
262
|
+
"references": {
|
|
263
|
+
"Promise": {
|
|
264
|
+
"location": "global",
|
|
265
|
+
"id": "global::Promise"
|
|
266
|
+
}
|
|
267
|
+
},
|
|
268
|
+
"return": "Promise<void>"
|
|
269
|
+
},
|
|
270
|
+
"docs": {
|
|
271
|
+
"text": "Hides the popover menu and restores focus to the previously focused element.",
|
|
272
|
+
"tags": []
|
|
273
|
+
}
|
|
274
|
+
}
|
|
275
|
+
};
|
|
276
|
+
}
|
|
277
|
+
static get elementRef() { return "host"; }
|
|
278
|
+
}
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
:host{display:block}
|
|
@@ -0,0 +1,20 @@
|
|
|
1
|
+
import { h, Host } from "@stencil/core";
|
|
2
|
+
import { version } from "../../../../package";
|
|
3
|
+
export class PostMenuItem {
|
|
4
|
+
render() {
|
|
5
|
+
return (h(Host, { key: '7984d6be0ae981f54618b4c0d7a80bfcc71f16a3', role: "menuitem", "data-version": version }, h("slot", { key: '7fbb20f1586676b1c8f933e0f067144bbcca825f' })));
|
|
6
|
+
}
|
|
7
|
+
static get is() { return "post-menu-item"; }
|
|
8
|
+
static get encapsulation() { return "shadow"; }
|
|
9
|
+
static get originalStyleUrls() {
|
|
10
|
+
return {
|
|
11
|
+
"$": ["post-menu-item.scss"]
|
|
12
|
+
};
|
|
13
|
+
}
|
|
14
|
+
static get styleUrls() {
|
|
15
|
+
return {
|
|
16
|
+
"$": ["post-menu-item.css"]
|
|
17
|
+
};
|
|
18
|
+
}
|
|
19
|
+
static get elementRef() { return "host"; }
|
|
20
|
+
}
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
:host{display:inline-block}
|
|
@@ -0,0 +1,103 @@
|
|
|
1
|
+
import { h, Host } from "@stencil/core";
|
|
2
|
+
import { version } from "../../../../package";
|
|
3
|
+
import { checkType } from "../../utils/index";
|
|
4
|
+
export class PostMenuTrigger {
|
|
5
|
+
constructor() {
|
|
6
|
+
/**
|
|
7
|
+
* Reference to the slotted button within the trigger, if present.
|
|
8
|
+
* Used to manage click and key events for menu control.
|
|
9
|
+
*/
|
|
10
|
+
this.slottedButton = null;
|
|
11
|
+
this.handleKeyDown = (e) => {
|
|
12
|
+
if (e.key === 'ArrowUp' || e.key === 'ArrowDown') {
|
|
13
|
+
e.preventDefault();
|
|
14
|
+
this.handleToggle();
|
|
15
|
+
}
|
|
16
|
+
};
|
|
17
|
+
this.for = undefined;
|
|
18
|
+
this.ariaExpanded = false;
|
|
19
|
+
}
|
|
20
|
+
/**
|
|
21
|
+
* Watch for changes to the `for` property to validate its type and ensure it is a string.
|
|
22
|
+
* @param forValue - The new value of the `for` property.
|
|
23
|
+
*/
|
|
24
|
+
validateControlFor(forValue = this.for) {
|
|
25
|
+
checkType(forValue, 'string', 'The "for" property is required and should be a string.');
|
|
26
|
+
}
|
|
27
|
+
get menu() {
|
|
28
|
+
const ref = document.getElementById(this.for);
|
|
29
|
+
return ref && ref.localName === 'post-menu' ? ref : null;
|
|
30
|
+
}
|
|
31
|
+
handleToggle() {
|
|
32
|
+
const menu = this.menu;
|
|
33
|
+
if (menu && this.slottedButton) {
|
|
34
|
+
this.ariaExpanded = !this.ariaExpanded;
|
|
35
|
+
this.slottedButton.setAttribute('aria-expanded', this.ariaExpanded.toString());
|
|
36
|
+
menu.toggle(this.host);
|
|
37
|
+
}
|
|
38
|
+
else {
|
|
39
|
+
console.warn(`No post-menu found with ID: ${this.for}`);
|
|
40
|
+
}
|
|
41
|
+
}
|
|
42
|
+
componentDidLoad() {
|
|
43
|
+
this.validateControlFor();
|
|
44
|
+
this.slottedButton = this.host.querySelector('button');
|
|
45
|
+
if (this.slottedButton) {
|
|
46
|
+
this.slottedButton.setAttribute('aria-haspopup', 'menu');
|
|
47
|
+
this.slottedButton.addEventListener('click', () => {
|
|
48
|
+
this.handleToggle();
|
|
49
|
+
});
|
|
50
|
+
this.slottedButton.addEventListener('keydown', this.handleKeyDown);
|
|
51
|
+
}
|
|
52
|
+
else {
|
|
53
|
+
console.warn('No button found within post-menu-trigger');
|
|
54
|
+
}
|
|
55
|
+
}
|
|
56
|
+
render() {
|
|
57
|
+
return (h(Host, { key: 'ce2a30260fae6eecae5b2feb0538ac2ce66b989c', "data-version": version, "tab-index": "-1" }, h("slot", { key: 'a69d7dc4a1a798332bd9881cedb216ef82d279ab' })));
|
|
58
|
+
}
|
|
59
|
+
static get is() { return "post-menu-trigger"; }
|
|
60
|
+
static get originalStyleUrls() {
|
|
61
|
+
return {
|
|
62
|
+
"$": ["post-menu-trigger.scss"]
|
|
63
|
+
};
|
|
64
|
+
}
|
|
65
|
+
static get styleUrls() {
|
|
66
|
+
return {
|
|
67
|
+
"$": ["post-menu-trigger.css"]
|
|
68
|
+
};
|
|
69
|
+
}
|
|
70
|
+
static get properties() {
|
|
71
|
+
return {
|
|
72
|
+
"for": {
|
|
73
|
+
"type": "string",
|
|
74
|
+
"mutable": false,
|
|
75
|
+
"complexType": {
|
|
76
|
+
"original": "string",
|
|
77
|
+
"resolved": "string",
|
|
78
|
+
"references": {}
|
|
79
|
+
},
|
|
80
|
+
"required": true,
|
|
81
|
+
"optional": false,
|
|
82
|
+
"docs": {
|
|
83
|
+
"tags": [],
|
|
84
|
+
"text": "ID of the menu element that this trigger is linked to. Used to open and close the specified menu."
|
|
85
|
+
},
|
|
86
|
+
"attribute": "for",
|
|
87
|
+
"reflect": false
|
|
88
|
+
}
|
|
89
|
+
};
|
|
90
|
+
}
|
|
91
|
+
static get states() {
|
|
92
|
+
return {
|
|
93
|
+
"ariaExpanded": {}
|
|
94
|
+
};
|
|
95
|
+
}
|
|
96
|
+
static get elementRef() { return "host"; }
|
|
97
|
+
static get watchers() {
|
|
98
|
+
return [{
|
|
99
|
+
"propName": "for",
|
|
100
|
+
"methodName": "validateControlFor"
|
|
101
|
+
}];
|
|
102
|
+
}
|
|
103
|
+
}
|
|
@@ -88,7 +88,7 @@ export class PostPopover {
|
|
|
88
88
|
this.triggers.forEach(trigger => trigger.setAttribute('aria-expanded', 'false'));
|
|
89
89
|
}
|
|
90
90
|
render() {
|
|
91
|
-
return (h(Host, { key: '
|
|
91
|
+
return (h(Host, { key: '22964a2be347979d1ebaaec468edfd4b079776ff', "data-version": version }, h("post-popovercontainer", { key: 'a108ed03721a453ce73a850913d93b8bfaf83922', arrow: this.arrow, placement: this.placement, ref: e => (this.popoverRef = e) }, h("div", { key: '943f1a914ada58c3f8b085613b47ed4b7c55e591', class: "popover-container" }, h("div", { key: 'a6a8dec53c9190c48d1b3b217c979d78b2f32995', class: "popover-content" }, h("slot", { key: '555bc4537d6bd62b60186db9700588eb3ec38ac2' })), h("button", { key: 'db0826565312bba9bc48a88cd84636a903eeb94f', class: "btn-close", onClick: () => this.hide() }, h("span", { key: 'aef92ba6e586e02924a09d459e4d753ad18f72f7', class: "visually-hidden" }, this.closeButtonCaption))))));
|
|
92
92
|
}
|
|
93
93
|
static get is() { return "post-popover"; }
|
|
94
94
|
static get encapsulation() { return "shadow"; }
|
|
@@ -137,9 +137,9 @@ export class PostPopovercontainer {
|
|
|
137
137
|
}
|
|
138
138
|
}
|
|
139
139
|
render() {
|
|
140
|
-
return (h(Host, { key: '
|
|
140
|
+
return (h(Host, { key: '97a63bfbf098bd3463eb75678e54ddcc9e4790b3', "data-version": version }, this.arrow && (h("span", { key: 'f6eaa7bd6cd3eb63d15e7d91825365661daae7dd', class: "arrow", ref: el => {
|
|
141
141
|
this.arrowRef = el;
|
|
142
|
-
} })), h("slot", { key: '
|
|
142
|
+
} })), h("slot", { key: '414055000891719b74c2c449fec2c87a60b62047' })));
|
|
143
143
|
}
|
|
144
144
|
static get is() { return "post-popovercontainer"; }
|
|
145
145
|
static get originalStyleUrls() {
|
|
@@ -64,7 +64,7 @@ export class PostRating {
|
|
|
64
64
|
}
|
|
65
65
|
}
|
|
66
66
|
render() {
|
|
67
|
-
return (h(Host, { key: '
|
|
67
|
+
return (h(Host, { key: '0202a629d68bc85d00fb3ccae63073938fb174d3', "data-version": version }, h("div", { key: '7de2c78d498957dbd988472729fde2ea04162490', role: "slider", class: "rating", tabindex: "0", "aria-label": this.label, "aria-valuemin": "0", "aria-valuemax": this.stars, "aria-valuenow": this.currentRating, "aria-valuetext": `${this.currentRating} out of ${this.stars}`, "aria-readonly": this.readonly ? 'true' : 'false', onKeyDown: this.keydownHandler, onBlur: this.blurHandler }, Array.from({ length: this.stars }).map((v, i) => (h("div", { key: `star-${v}`, "aria-hidden": "true", class: {
|
|
68
68
|
'star': true,
|
|
69
69
|
'before-hover': i < this.hoveredIndex,
|
|
70
70
|
'active': i < Math.round(this.currentRating),
|
|
@@ -16,7 +16,7 @@ export class PostTabHeader {
|
|
|
16
16
|
this.tabId = `tab-${this.host.id || crypto.randomUUID()}`;
|
|
17
17
|
}
|
|
18
18
|
render() {
|
|
19
|
-
return (h(Host, { key: '
|
|
19
|
+
return (h(Host, { key: 'f105dabe8a61308d5aa361a6aeaad2f938cf7656', id: this.tabId, role: "tab", "data-version": version, "aria-selected": "false", tabindex: "-1", class: "tab-title", slot: "tabs" }, h("slot", { key: '3abc0c8fab0a0ab1dd538e20831980b4672ae79a' })));
|
|
20
20
|
}
|
|
21
21
|
static get is() { return "post-tab-header"; }
|
|
22
22
|
static get encapsulation() { return "shadow"; }
|
|
@@ -13,7 +13,7 @@ export class PostTabPanel {
|
|
|
13
13
|
this.panelId = `panel-${this.host.id || crypto.randomUUID()}`;
|
|
14
14
|
}
|
|
15
15
|
render() {
|
|
16
|
-
return (h(Host, { key: '
|
|
16
|
+
return (h(Host, { key: '9018d11d85d1ce0b83e74987f8fb96eb1b873a40', "data-version": version, id: this.panelId, role: "tabpanel" }, h("slot", { key: '45e2214fbeb5d4c2b4e5e35eb5ad74d99033a0a3' })));
|
|
17
17
|
}
|
|
18
18
|
static get is() { return "post-tab-panel"; }
|
|
19
19
|
static get encapsulation() { return "shadow"; }
|
|
@@ -142,7 +142,7 @@ export class PostTabs {
|
|
|
142
142
|
nextTab.focus();
|
|
143
143
|
}
|
|
144
144
|
render() {
|
|
145
|
-
return (h(Host, { key: '
|
|
145
|
+
return (h(Host, { key: '3c9d7351fa09531238892f0bd05447379f46fdb4', "data-version": version }, h("div", { key: '1eff106f6324302155e809a58cd3367bb7bdbd76', class: "tabs-wrapper", part: "tabs" }, h("div", { key: 'fc5917d92b577f99fb19fa80ecd1a863ffeaa4d8', class: "tabs", role: "tablist" }, h("slot", { key: 'af35884271ca9d75dbbd113e05fd052c4691c53e', name: "tabs", onSlotchange: () => this.enableTabs() }))), h("div", { key: '4908774e2306e432af65b94a9dd5e1d257569652', class: "tab-content", part: "content" }, h("slot", { key: 'c0eb44e39b0cffe57c42c51dd74e605e74241f70', onSlotchange: () => this.moveMisplacedTabs() }))));
|
|
146
146
|
}
|
|
147
147
|
static get is() { return "post-tabs"; }
|
|
148
148
|
static get encapsulation() { return "shadow"; }
|
|
@@ -30,7 +30,7 @@ export class PostTag {
|
|
|
30
30
|
this.setClasses();
|
|
31
31
|
}
|
|
32
32
|
render() {
|
|
33
|
-
return (h(Host, { key: '
|
|
33
|
+
return (h(Host, { key: '01f369b7c6803f710fb0b5eae652d6d1beb340ed', "data-version": version }, h("div", { key: 'bba40e4deaa43e64c9bc32c2ad4a3e3515bdf8dd', class: this.classes }, this.icon ? h("post-icon", { name: this.icon }) : null, h("div", { key: '9addb054f9555c9a97d8825a148958b2e2b863a7', class: "tag-text" }, h("slot", { key: '315cf79690fa489c61edd6ce6b304b94a3866b8c' })))));
|
|
34
34
|
}
|
|
35
35
|
static get is() { return "post-tag"; }
|
|
36
36
|
static get encapsulation() { return "shadow"; }
|
|
@@ -198,7 +198,7 @@ export class PostTooltip {
|
|
|
198
198
|
}
|
|
199
199
|
render() {
|
|
200
200
|
const popoverClass = `${this.arrow ? ' has-arrow' : ''}`;
|
|
201
|
-
return (h(Host, { key: '
|
|
201
|
+
return (h(Host, { key: '8e2bd1f11a44a0d39ad797f12b880338d59ea006', "data-version": version, role: "tooltip", onPointerOver: this.handleInterest, onPointerOut: this.handleInterestLost, onFocusIn: this.handleInterest, onFocusOut: this.handleInterestLost }, h("post-popovercontainer", { key: 'ff4fdbf72ca4b95d5f4e925fedbfbcf7e281410f', class: popoverClass, arrow: this.arrow, placement: this.placement, ref: (el) => (this.popoverRef = el) }, h("slot", { key: '770a98cff11b963ec37559683a27a216250e8bde' }))));
|
|
202
202
|
}
|
|
203
203
|
static get is() { return "post-tooltip"; }
|
|
204
204
|
static get encapsulation() { return "shadow"; }
|
package/dist/collection/index.js
CHANGED
|
@@ -11,6 +11,9 @@ export { PostCollapsibleTrigger } from './components/post-collapsible-trigger/po
|
|
|
11
11
|
export { PostIcon } from './components/post-icon/post-icon';
|
|
12
12
|
export { PostLanguageOption } from './components/post-language-option/post-language-option';
|
|
13
13
|
export { PostLogo } from './components/post-logo/post-logo';
|
|
14
|
+
export { PostMenu } from './components/post-menu/post-menu';
|
|
15
|
+
export { PostMenuTrigger } from './components/post-menu-trigger/post-menu-trigger';
|
|
16
|
+
export { PostMenuItem } from './components/post-menu-item/post-menu-item';
|
|
14
17
|
export { PostPopover } from './components/post-popover/post-popover';
|
|
15
18
|
export { PostPopovercontainer } from './components/post-popovercontainer/post-popovercontainer';
|
|
16
19
|
export { PostRating } from './components/post-rating/post-rating';
|
|
@@ -21,3 +24,7 @@ export { PostTooltip } from './components/post-tooltip/post-tooltip';
|
|
|
21
24
|
export { PostTag } from './components/post-tag/post-tag';
|
|
22
25
|
export { PostList } from './components/post-list/post-list';
|
|
23
26
|
export { PostListItem } from './components/post-list-item/post-list-item';
|
|
27
|
+
export { PostHeader } from './components/post-header/post-header';
|
|
28
|
+
export { PostMainnavigation } from './components/post-mainnavigation/post-mainnavigation';
|
|
29
|
+
export { PostMegadropdown } from './components/post-megadropdown/post-megadropdown';
|
|
30
|
+
export { PostMegadropdownTrigger } from './components/post-megadropdown-trigger/post-megadropdown-trigger';
|
|
@@ -0,0 +1,26 @@
|
|
|
1
|
+
const focusableSelector = `:where(${[
|
|
2
|
+
'button',
|
|
3
|
+
'input:not([type="hidden"])',
|
|
4
|
+
'[tabindex]',
|
|
5
|
+
'select',
|
|
6
|
+
'textarea',
|
|
7
|
+
'[contenteditable]',
|
|
8
|
+
'a[href]',
|
|
9
|
+
'iframe',
|
|
10
|
+
'audio[controls]',
|
|
11
|
+
'video[controls]',
|
|
12
|
+
'area[href]',
|
|
13
|
+
'details > summary:first-of-type',
|
|
14
|
+
].join(',')})`;
|
|
15
|
+
const focusDisablingSelector = `:where(${[
|
|
16
|
+
'[inert]',
|
|
17
|
+
'[inert] *',
|
|
18
|
+
':disabled',
|
|
19
|
+
'dialog:not([open]) *',
|
|
20
|
+
'[popover]:not(:popover-open) *',
|
|
21
|
+
'details:not([open]) > *:not(details > summary:first-of-type)',
|
|
22
|
+
'details:not([open]) > *:not(details > summary:first-of-type) *',
|
|
23
|
+
].join(',')})`;
|
|
24
|
+
export const isFocusable = (element) => {
|
|
25
|
+
return (element === null || element === void 0 ? void 0 : element.matches(focusableSelector)) && !(element === null || element === void 0 ? void 0 : element.matches(focusDisablingSelector));
|
|
26
|
+
};
|
package/dist/components/index.js
CHANGED
|
@@ -11,6 +11,9 @@ export { P as PostCollapsibleTrigger } from './post-collapsible-trigger2.js';
|
|
|
11
11
|
export { P as PostIcon } from './post-icon2.js';
|
|
12
12
|
export { P as PostLanguageOption } from './post-language-option2.js';
|
|
13
13
|
export { P as PostLogo } from './post-logo2.js';
|
|
14
|
+
export { P as PostMenu } from './post-menu2.js';
|
|
15
|
+
export { P as PostMenuTrigger } from './post-menu-trigger2.js';
|
|
16
|
+
export { P as PostMenuItem } from './post-menu-item2.js';
|
|
14
17
|
export { P as PostPopover } from './post-popover2.js';
|
|
15
18
|
export { P as PostPopovercontainer } from './post-popovercontainer2.js';
|
|
16
19
|
export { P as PostRating } from './post-rating2.js';
|
|
@@ -21,3 +24,7 @@ export { P as PostTooltip } from './post-tooltip2.js';
|
|
|
21
24
|
export { P as PostTag } from './post-tag2.js';
|
|
22
25
|
export { P as PostList } from './post-list2.js';
|
|
23
26
|
export { P as PostListItem } from './post-list-item2.js';
|
|
27
|
+
export { P as PostHeader } from './post-header2.js';
|
|
28
|
+
export { P as PostMainnavigation } from './post-mainnavigation2.js';
|
|
29
|
+
export { P as PostMegadropdown } from './post-megadropdown2.js';
|
|
30
|
+
export { P as PostMegadropdownTrigger } from './post-megadropdown-trigger2.js';
|