@swisspost/design-system-components 9.0.0-next.2 → 9.0.0-next.4
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/{index-c15bd800.js → index-e1f32cce.js} +41 -4
- package/dist/cjs/index.cjs.js +29 -17
- package/dist/cjs/loader.cjs.js +2 -2
- package/dist/cjs/{package-a7150f64.js → package-3f706795.js} +1 -1
- package/dist/cjs/{post-accordion-62d2fd79.js → post-accordion-0391f4c5.js} +2 -2
- package/dist/cjs/post-accordion-item-19ce78d0.js +52 -0
- package/dist/cjs/post-accordion-item.cjs.entry.js +3 -3
- package/dist/cjs/post-accordion.cjs.entry.js +3 -3
- package/dist/cjs/post-alert-278229ad.js +98 -0
- package/dist/cjs/post-alert.cjs.entry.js +3 -3
- package/dist/cjs/post-avatar-ffba1d23.js +148 -0
- package/dist/cjs/post-avatar.cjs.entry.js +13 -0
- package/dist/cjs/post-breadcrumb-item-42466f8a.js +49 -0
- package/dist/cjs/post-breadcrumb-item.cjs.entry.js +14 -0
- package/dist/cjs/post-card-control-37d6a65a.js +272 -0
- package/dist/cjs/post-card-control.cjs.entry.js +3 -3
- package/dist/cjs/post-closebutton-372c1276.js +16 -0
- package/dist/cjs/post-closebutton.cjs.entry.js +11 -0
- package/dist/cjs/{post-collapsible-trigger-9dca8493.js → post-collapsible-trigger-c843f028.js} +7 -5
- package/dist/cjs/post-collapsible_2.cjs.entry.js +3 -3
- package/dist/cjs/post-components.cjs.js +2 -2
- package/dist/cjs/{post-icon-3934be0b.js → post-icon-ca80afce.js} +4 -4
- package/dist/cjs/post-icon.cjs.entry.js +3 -3
- package/dist/cjs/post-language-option-dab6d431.js +67 -0
- package/dist/cjs/post-language-option.cjs.entry.js +14 -0
- package/dist/cjs/post-list-f2c673ef.js +37 -0
- package/dist/cjs/post-list-item-1b6ce0d0.js +22 -0
- package/dist/cjs/post-list-item.cjs.entry.js +10 -0
- package/dist/cjs/post-list.cjs.entry.js +11 -0
- package/dist/cjs/{post-logo-c3603fc7.js → post-logo-ed8e99c0.js} +4 -4
- package/dist/cjs/post-logo.cjs.entry.js +3 -3
- package/dist/cjs/{post-popover-15f9620a.js → post-popover-4457dd58.js} +4 -4
- package/dist/cjs/post-popover.cjs.entry.js +3 -3
- package/dist/cjs/{post-popovercontainer-7d536276.js → post-popovercontainer-1e6be8ad.js} +11 -9
- package/dist/cjs/post-popovercontainer.cjs.entry.js +3 -3
- package/dist/cjs/{post-rating-db5a397a.js → post-rating-236273be.js} +3 -3
- package/dist/cjs/post-rating.cjs.entry.js +3 -3
- package/dist/cjs/post-tab-header-bce47e34.js +32 -0
- package/dist/cjs/post-tab-header.cjs.entry.js +3 -3
- package/dist/cjs/{post-tab-panel-d59cf1ec.js → post-tab-panel-e25974be.js} +3 -3
- package/dist/cjs/post-tab-panel.cjs.entry.js +3 -3
- package/dist/cjs/{post-tabs-7afae61a.js → post-tabs-dc99bddf.js} +4 -4
- package/dist/cjs/post-tabs.cjs.entry.js +3 -3
- package/dist/cjs/{post-tag-b7d0bbff.js → post-tag-a28852a8.js} +3 -3
- package/dist/cjs/post-tag.cjs.entry.js +3 -3
- package/dist/cjs/{post-tooltip-432852c7.js → post-tooltip-78e4129b.js} +3 -3
- package/dist/cjs/post-tooltip.cjs.entry.js +3 -3
- package/dist/collection/collection-manifest.json +7 -1
- package/dist/collection/components/post-accordion-item/post-accordion-item.css +1 -1
- package/dist/collection/components/post-accordion-item/post-accordion-item.js +4 -3
- package/dist/collection/components/post-alert/post-alert.css +2 -2
- package/dist/collection/components/post-alert/post-alert.js +4 -4
- package/dist/collection/components/post-avatar/post-avatar.css +3 -0
- package/dist/collection/components/post-avatar/post-avatar.js +237 -0
- package/dist/collection/components/post-breadcrumb-item/post-breadcrumb-item.css +1 -0
- package/dist/collection/components/post-breadcrumb-item/post-breadcrumb-item.js +83 -0
- package/dist/collection/components/post-card-control/post-card-control.css +1 -1
- package/dist/collection/components/post-card-control/post-card-control.js +2 -2
- package/dist/collection/components/post-closebutton/post-closebutton.js +12 -0
- package/dist/collection/components/post-collapsible/post-collapsible.js +5 -3
- package/dist/collection/components/post-icon/post-icon.js +2 -2
- package/dist/collection/components/post-language-option/post-language-option.css +3 -0
- package/dist/collection/components/post-language-option/post-language-option.js +191 -0
- package/dist/collection/components/post-list/post-list.css +3 -0
- package/dist/collection/components/post-list/post-list.js +87 -0
- package/dist/collection/components/post-list-item/post-list-item.css +1 -0
- package/dist/collection/components/post-list-item/post-list-item.js +25 -0
- package/dist/collection/components/post-logo/post-logo.js +2 -2
- package/dist/collection/components/post-popover/post-popover.css +1 -1
- package/dist/collection/components/post-popover/post-popover.js +1 -1
- package/dist/collection/components/post-popovercontainer/post-popovercontainer.css +1 -1
- package/dist/collection/components/post-popovercontainer/post-popovercontainer.js +26 -6
- package/dist/collection/components/post-rating/post-rating.js +1 -1
- package/dist/collection/components/post-tab-header/post-tab-header.css +1 -1
- package/dist/collection/components/post-tab-header/post-tab-header.js +1 -1
- package/dist/collection/components/post-tab-panel/post-tab-panel.js +1 -1
- package/dist/collection/components/post-tabs/post-tabs.css +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 +6 -0
- package/dist/components/index.js +6 -0
- package/dist/components/index2.js +1 -1
- package/dist/components/package.js +1 -1
- package/dist/components/post-accordion-item2.js +5 -4
- package/dist/components/post-alert2.js +5 -5
- package/dist/components/post-avatar.d.ts +11 -0
- package/dist/components/post-avatar.js +6 -0
- package/dist/components/post-avatar2.js +173 -0
- package/dist/components/post-breadcrumb-item.d.ts +11 -0
- package/dist/components/post-breadcrumb-item.js +6 -0
- package/dist/components/post-breadcrumb-item2.js +72 -0
- package/dist/components/post-card-control2.js +3 -3
- package/dist/components/post-closebutton.d.ts +11 -0
- package/dist/components/post-closebutton.js +6 -0
- package/dist/components/post-closebutton2.js +34 -0
- package/dist/components/post-collapsible2.js +6 -4
- package/dist/components/post-icon2.js +3 -3
- package/dist/components/post-language-option.d.ts +11 -0
- package/dist/components/post-language-option.js +6 -0
- package/dist/components/post-language-option2.js +92 -0
- package/dist/components/post-list-item.d.ts +11 -0
- package/dist/components/post-list-item.js +6 -0
- package/dist/components/post-list-item2.js +35 -0
- package/dist/components/post-list.d.ts +11 -0
- package/dist/components/post-list.js +6 -0
- package/dist/components/post-list2.js +53 -0
- package/dist/components/post-logo2.js +3 -3
- package/dist/components/post-popover2.js +2 -2
- package/dist/components/post-popovercontainer2.js +10 -7
- package/dist/components/post-rating2.js +1 -1
- package/dist/components/post-tab-header2.js +2 -2
- package/dist/components/post-tab-panel2.js +1 -1
- package/dist/components/post-tabs2.js +2 -2
- package/dist/components/post-tag2.js +1 -1
- package/dist/components/post-tooltip2.js +2 -2
- package/dist/docs.json +508 -1
- package/dist/esm/{index-f41b763f.js → index-642cd1f2.js} +1 -1
- package/dist/esm/{index-0b56fc28.js → index-e1b64755.js} +41 -4
- package/dist/esm/index.js +24 -18
- package/dist/esm/loader.js +3 -3
- package/dist/esm/package-aaf62247.js +3 -0
- package/dist/esm/{post-accordion-6f4d2b9a.js → post-accordion-7ef6d6bf.js} +2 -2
- package/dist/esm/post-accordion-item-d98c612f.js +50 -0
- package/dist/esm/post-accordion-item.entry.js +4 -4
- package/dist/esm/post-accordion.entry.js +3 -3
- package/dist/esm/post-alert-2aee0a88.js +96 -0
- package/dist/esm/post-alert.entry.js +4 -4
- package/dist/esm/post-avatar-f743d28e.js +146 -0
- package/dist/esm/post-avatar.entry.js +5 -0
- package/dist/esm/post-breadcrumb-item-e287afe1.js +47 -0
- package/dist/esm/post-breadcrumb-item.entry.js +6 -0
- package/dist/esm/post-card-control-685ca60d.js +270 -0
- package/dist/esm/post-card-control.entry.js +3 -3
- package/dist/esm/post-closebutton-a951a0ba.js +14 -0
- package/dist/esm/post-closebutton.entry.js +3 -0
- package/dist/esm/{post-collapsible-trigger-85c2064a.js → post-collapsible-trigger-1eca7350.js} +8 -6
- package/dist/esm/post-collapsible_2.entry.js +4 -4
- package/dist/esm/post-components.js +3 -3
- package/dist/esm/{post-icon-40929043.js → post-icon-29b33e6a.js} +5 -5
- package/dist/esm/post-icon.entry.js +4 -4
- package/dist/esm/post-language-option-92ce480f.js +65 -0
- package/dist/esm/post-language-option.entry.js +6 -0
- package/dist/esm/post-list-5a17eff9.js +35 -0
- package/dist/esm/post-list-item-12ff4b9c.js +20 -0
- package/dist/esm/post-list-item.entry.js +2 -0
- package/dist/esm/post-list.entry.js +3 -0
- package/dist/esm/{post-logo-c6351ba8.js → post-logo-0a072d4b.js} +5 -5
- package/dist/esm/post-logo.entry.js +4 -4
- package/dist/esm/{post-popover-58149de7.js → post-popover-a82bae79.js} +4 -4
- package/dist/esm/post-popover.entry.js +3 -3
- package/dist/esm/{post-popovercontainer-8bde9fc3.js → post-popovercontainer-409abba0.js} +11 -9
- package/dist/esm/post-popovercontainer.entry.js +3 -3
- package/dist/esm/{post-rating-d9fc0b40.js → post-rating-a6513fc9.js} +3 -3
- package/dist/esm/post-rating.entry.js +3 -3
- package/dist/esm/post-tab-header-2bf36bae.js +30 -0
- package/dist/esm/post-tab-header.entry.js +3 -3
- package/dist/esm/{post-tab-panel-926439f4.js → post-tab-panel-56ad2836.js} +3 -3
- package/dist/esm/post-tab-panel.entry.js +3 -3
- package/dist/esm/{post-tabs-13b2d9a6.js → post-tabs-895b4e96.js} +4 -4
- package/dist/esm/post-tabs.entry.js +3 -3
- package/dist/esm/{post-tag-887d5fbe.js → post-tag-ee91d6a9.js} +3 -3
- package/dist/esm/post-tag.entry.js +3 -3
- package/dist/esm/{post-tooltip-3cde6b53.js → post-tooltip-a4d93fd2.js} +4 -4
- package/dist/esm/post-tooltip.entry.js +4 -4
- package/dist/post-components/index.esm.js +1 -1
- package/dist/post-components/p-065de04e.entry.js +1 -0
- package/dist/post-components/p-0af20b10.entry.js +1 -0
- package/dist/post-components/p-13e6577d.js +1 -0
- package/dist/post-components/p-16ff4451.entry.js +1 -0
- package/dist/post-components/{p-0e09dc41.js → p-1a53bc7d.js} +1 -1
- package/dist/post-components/p-2b777f74.js +1 -0
- package/dist/post-components/p-2caf9469.js +1 -0
- package/dist/post-components/p-3a272de8.entry.js +1 -0
- package/dist/post-components/p-3cc61960.js +1 -0
- package/dist/post-components/p-3eab790d.js +2 -0
- package/dist/post-components/{p-82dcf8c6.js → p-47279ac4.js} +2 -2
- package/dist/post-components/p-49445ef1.entry.js +1 -0
- package/dist/post-components/p-5957a7fa.js +1 -0
- package/dist/post-components/p-5a8157b4.js +1 -0
- package/dist/post-components/p-6ecb14d1.js +1 -0
- package/dist/post-components/p-7986d834.js +1 -0
- package/dist/post-components/{p-2b10e265.js → p-7b0616c6.js} +1 -1
- package/dist/post-components/p-80e5d228.entry.js +1 -0
- package/dist/post-components/p-8618ccea.entry.js +1 -0
- package/dist/post-components/p-8bd32536.js +1 -0
- package/dist/post-components/p-8f36ccda.entry.js +1 -0
- package/dist/post-components/p-9753c9c7.entry.js +1 -0
- package/dist/post-components/p-9cd82521.js +1 -0
- package/dist/post-components/p-a3cc34a3.js +1 -0
- package/dist/post-components/p-a514b746.entry.js +1 -0
- package/dist/post-components/p-a9efdea5.entry.js +1 -0
- package/dist/post-components/p-aae80acd.entry.js +1 -0
- package/dist/post-components/p-b60d2ab7.entry.js +1 -0
- package/dist/post-components/p-b63a3fc2.entry.js +1 -0
- package/dist/post-components/{p-deb4131c.js → p-ba14d022.js} +1 -1
- package/dist/post-components/p-bc7cfb53.js +1 -0
- package/dist/post-components/p-be5b0cdb.entry.js +1 -0
- package/dist/post-components/p-c79c7d00.entry.js +1 -0
- package/dist/post-components/p-cd91c467.entry.js +1 -0
- package/dist/post-components/{p-6a28f8b9.js → p-d176f664.js} +1 -1
- package/dist/post-components/p-d37c6cc3.js +1 -0
- package/dist/post-components/p-d528afb2.entry.js +1 -0
- package/dist/post-components/p-d793c76b.js +1 -0
- package/dist/post-components/p-dd871b55.js +1 -0
- package/dist/post-components/p-e1925cd1.entry.js +1 -0
- package/dist/post-components/p-fb62c672.js +1 -0
- package/dist/post-components/p-fb7a5867.js +1 -0
- package/dist/post-components/p-fda6ce34.js +1 -0
- package/dist/post-components/p-fe602d19.entry.js +1 -0
- package/dist/post-components/p-ffb26d24.entry.js +1 -0
- package/dist/post-components/post-components.esm.js +1 -1
- package/dist/types/components/post-accordion-item/post-accordion-item.d.ts +1 -1
- package/dist/types/components/post-alert/post-alert.d.ts +1 -1
- package/dist/types/components/post-avatar/post-avatar.d.ts +51 -0
- package/dist/types/components/post-breadcrumb-item/post-breadcrumb-item.d.ts +15 -0
- package/dist/types/components/post-closebutton/post-closebutton.d.ts +7 -0
- package/dist/types/components/post-icon/post-icon.d.ts +1 -1
- package/dist/types/components/post-language-option/post-language-option.d.ts +40 -0
- package/dist/types/components/post-list/post-list.d.ts +24 -0
- package/dist/types/components/post-list-item/post-list-item.d.ts +8 -0
- package/dist/types/components/post-logo/post-logo.d.ts +1 -1
- package/dist/types/components/post-popovercontainer/post-popovercontainer.d.ts +4 -0
- package/dist/types/components.d.ts +197 -0
- package/dist/types/index.d.ts +6 -0
- package/loaders/index.d.ts +12 -0
- package/loaders/index.js +6 -0
- package/loaders/package.js +1 -1
- package/loaders/post-accordion-item.js +5 -4
- package/loaders/post-alert.js +5 -5
- package/loaders/post-avatar.d.ts +11 -0
- package/loaders/post-avatar.js +176 -0
- package/loaders/post-breadcrumb-item.d.ts +11 -0
- package/loaders/post-breadcrumb-item.js +75 -0
- package/loaders/post-card-control.js +3 -3
- package/loaders/post-closebutton.d.ts +11 -0
- package/loaders/post-closebutton.js +37 -0
- package/loaders/post-collapsible2.js +5 -3
- package/loaders/post-icon2.js +2 -2
- package/loaders/post-language-option.d.ts +11 -0
- package/loaders/post-language-option.js +95 -0
- package/loaders/post-list-item.d.ts +11 -0
- package/loaders/post-list-item.js +38 -0
- package/loaders/post-list.d.ts +11 -0
- package/loaders/post-list.js +56 -0
- package/loaders/post-logo.js +2 -2
- package/loaders/post-popover.js +2 -2
- package/loaders/post-popovercontainer2.js +10 -7
- package/loaders/post-rating.js +1 -1
- package/loaders/post-tab-header.js +2 -2
- package/loaders/post-tab-panel.js +1 -1
- package/loaders/post-tabs.js +2 -2
- package/loaders/post-tag.js +1 -1
- package/loaders/post-tooltip.js +1 -1
- package/package.json +2 -2
- package/dist/cjs/post-accordion-item-7b348fa5.js +0 -51
- package/dist/cjs/post-alert-fca3a4a3.js +0 -98
- package/dist/cjs/post-card-control-b4e4b4d5.js +0 -272
- package/dist/cjs/post-tab-header-29b8d4e1.js +0 -32
- package/dist/esm/package-3d758f77.js +0 -3
- package/dist/esm/post-accordion-item-6b5a65ad.js +0 -49
- package/dist/esm/post-alert-f19db551.js +0 -96
- package/dist/esm/post-card-control-1b5df6cb.js +0 -270
- package/dist/esm/post-tab-header-ae8feb19.js +0 -30
- package/dist/post-components/p-0b71bf5a.js +0 -1
- package/dist/post-components/p-19e54be9.js +0 -1
- package/dist/post-components/p-1e8f0f36.js +0 -1
- package/dist/post-components/p-22257eff.entry.js +0 -1
- package/dist/post-components/p-249ac168.entry.js +0 -1
- package/dist/post-components/p-3325086e.js +0 -1
- package/dist/post-components/p-3b823fee.entry.js +0 -1
- package/dist/post-components/p-45f4c803.entry.js +0 -1
- package/dist/post-components/p-47935dbb.js +0 -1
- package/dist/post-components/p-486fbbce.entry.js +0 -1
- package/dist/post-components/p-4a7fb0f3.entry.js +0 -1
- package/dist/post-components/p-5f231c2c.js +0 -1
- package/dist/post-components/p-6ed3497a.entry.js +0 -1
- package/dist/post-components/p-820c5c19.entry.js +0 -1
- package/dist/post-components/p-8aeb549f.entry.js +0 -1
- package/dist/post-components/p-92aeec3c.js +0 -1
- package/dist/post-components/p-9a99cfc7.js +0 -1
- package/dist/post-components/p-aa8a08dc.entry.js +0 -1
- package/dist/post-components/p-b99fdec3.js +0 -1
- package/dist/post-components/p-ba40b28a.entry.js +0 -1
- package/dist/post-components/p-c62de925.js +0 -1
- package/dist/post-components/p-d2101b8a.entry.js +0 -1
- package/dist/post-components/p-d2f9de94.js +0 -2
- package/dist/post-components/p-d7a44f45.js +0 -1
- package/dist/post-components/p-db4b8ea1.entry.js +0 -1
- package/dist/post-components/p-eedc6ae8.entry.js +0 -1
- package/dist/post-components/p-f217f420.js +0 -1
- package/dist/post-components/p-f707d163.entry.js +0 -1
|
@@ -0,0 +1,87 @@
|
|
|
1
|
+
import { Host, h } from "@stencil/core";
|
|
2
|
+
import { version } from "../../../../package";
|
|
3
|
+
/**
|
|
4
|
+
* @slot default - Slot for placing the list title.
|
|
5
|
+
* @slot post-list-item - Slot for placing post-list-item components.
|
|
6
|
+
*/
|
|
7
|
+
export class PostList {
|
|
8
|
+
constructor() {
|
|
9
|
+
this.titleId = undefined;
|
|
10
|
+
this.titleHidden = false;
|
|
11
|
+
this.horizontal = false;
|
|
12
|
+
}
|
|
13
|
+
componentWillLoad() {
|
|
14
|
+
/**
|
|
15
|
+
* Get the id set on the host element or use a random id by default
|
|
16
|
+
*/
|
|
17
|
+
this.titleId = `list-${crypto.randomUUID()}`;
|
|
18
|
+
}
|
|
19
|
+
componentDidLoad() {
|
|
20
|
+
this.checkTitle();
|
|
21
|
+
}
|
|
22
|
+
checkTitle() {
|
|
23
|
+
if (!this.titleEl.innerText) {
|
|
24
|
+
throw new Error('Please provide a title to the list component. Title is mandatory for accessibility purposes.');
|
|
25
|
+
}
|
|
26
|
+
}
|
|
27
|
+
render() {
|
|
28
|
+
return (h(Host, { key: '4931dd182e1a0a25704abacf996d7ce3489cb663', "data-version": version }, h("div", { key: '84347e7b815ace536af32f8aabea7b730190bee5', ref: el => (this.titleEl = el), id: this.titleId, class: `list-title${this.titleHidden ? ' visually-hidden' : ''}` }, h("slot", { key: '8778de71facc6b3376af67fcf8493a68bd6001cf' })), h("div", { key: 'f81e8f7fd38d894e31494af05f93c53b8595324d', role: "list", "aria-labelledby": this.titleId }, h("slot", { key: '04df5a2a6e49b9296353e6ea078e2643c8c39a76', name: "post-list-item" }))));
|
|
29
|
+
}
|
|
30
|
+
static get is() { return "post-list"; }
|
|
31
|
+
static get originalStyleUrls() {
|
|
32
|
+
return {
|
|
33
|
+
"$": ["post-list.scss"]
|
|
34
|
+
};
|
|
35
|
+
}
|
|
36
|
+
static get styleUrls() {
|
|
37
|
+
return {
|
|
38
|
+
"$": ["post-list.css"]
|
|
39
|
+
};
|
|
40
|
+
}
|
|
41
|
+
static get properties() {
|
|
42
|
+
return {
|
|
43
|
+
"titleHidden": {
|
|
44
|
+
"type": "boolean",
|
|
45
|
+
"mutable": false,
|
|
46
|
+
"complexType": {
|
|
47
|
+
"original": "boolean",
|
|
48
|
+
"resolved": "boolean",
|
|
49
|
+
"references": {}
|
|
50
|
+
},
|
|
51
|
+
"required": false,
|
|
52
|
+
"optional": false,
|
|
53
|
+
"docs": {
|
|
54
|
+
"tags": [],
|
|
55
|
+
"text": "If `true`, the list title will be hidden. Otherwise, it will be displayed.`"
|
|
56
|
+
},
|
|
57
|
+
"attribute": "title-hidden",
|
|
58
|
+
"reflect": false,
|
|
59
|
+
"defaultValue": "false"
|
|
60
|
+
},
|
|
61
|
+
"horizontal": {
|
|
62
|
+
"type": "boolean",
|
|
63
|
+
"mutable": false,
|
|
64
|
+
"complexType": {
|
|
65
|
+
"original": "boolean",
|
|
66
|
+
"resolved": "boolean",
|
|
67
|
+
"references": {}
|
|
68
|
+
},
|
|
69
|
+
"required": false,
|
|
70
|
+
"optional": false,
|
|
71
|
+
"docs": {
|
|
72
|
+
"tags": [],
|
|
73
|
+
"text": "The list can become horizontal by setting `horizontal=\"true\"` or just `horizontal`"
|
|
74
|
+
},
|
|
75
|
+
"attribute": "horizontal",
|
|
76
|
+
"reflect": false,
|
|
77
|
+
"defaultValue": "false"
|
|
78
|
+
}
|
|
79
|
+
};
|
|
80
|
+
}
|
|
81
|
+
static get states() {
|
|
82
|
+
return {
|
|
83
|
+
"titleId": {}
|
|
84
|
+
};
|
|
85
|
+
}
|
|
86
|
+
static get elementRef() { return "host"; }
|
|
87
|
+
}
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
:host{display:flex}
|
|
@@ -0,0 +1,25 @@
|
|
|
1
|
+
import { Host, h } from "@stencil/core";
|
|
2
|
+
/**
|
|
3
|
+
* @slot default- Slot for placing the content of the list item.
|
|
4
|
+
*/
|
|
5
|
+
export class PostListItem {
|
|
6
|
+
connectedCallback() {
|
|
7
|
+
this.host.setAttribute('slot', 'post-list-item');
|
|
8
|
+
}
|
|
9
|
+
render() {
|
|
10
|
+
return (h(Host, { key: 'ef252634192c180f5af6bda222853e82508c83f8', role: "listitem" }, h("slot", { key: 'c0752b971c7527660fcfa1fe5a8301a9676f5651' })));
|
|
11
|
+
}
|
|
12
|
+
static get is() { return "post-list-item"; }
|
|
13
|
+
static get encapsulation() { return "shadow"; }
|
|
14
|
+
static get originalStyleUrls() {
|
|
15
|
+
return {
|
|
16
|
+
"$": ["post-list-item.scss"]
|
|
17
|
+
};
|
|
18
|
+
}
|
|
19
|
+
static get styleUrls() {
|
|
20
|
+
return {
|
|
21
|
+
"$": ["post-list-item.css"]
|
|
22
|
+
};
|
|
23
|
+
}
|
|
24
|
+
static get elementRef() { return "host"; }
|
|
25
|
+
}
|
|
@@ -11,7 +11,7 @@ export class PostLogo {
|
|
|
11
11
|
validateUrl() {
|
|
12
12
|
checkEmptyOrUrl(this.url, 'The "url" property of the post-logo is invalid');
|
|
13
13
|
}
|
|
14
|
-
|
|
14
|
+
componentDidLoad() {
|
|
15
15
|
this.validateUrl();
|
|
16
16
|
this.checkDescription();
|
|
17
17
|
}
|
|
@@ -23,7 +23,7 @@ export class PostLogo {
|
|
|
23
23
|
render() {
|
|
24
24
|
const logoLink = this.url && (typeof this.url === 'string' ? this.url : this.url.href);
|
|
25
25
|
const LogoTag = logoLink ? 'a' : 'span';
|
|
26
|
-
return (h(Host, { key: '
|
|
26
|
+
return (h(Host, { key: 'b574181a7c53cd9c9902e6ba186cd5a0de94cb3e', "data-version": version }, h(LogoTag, Object.assign({ key: 'a27bf9db453b9b991c4db8d003eca10a28935b73', class: "logo" }, (logoLink ? { href: logoLink } : {})), h("span", { key: '1e464aff7a75b29bd72eb15aed9ac122a3b53765', class: "description" }, h("slot", { key: 'd32bbf03ff0d5343fd05f2c1c31e6b1d1d767926', onSlotchange: () => this.checkDescription() })), h("svg", { key: '3fa62f2304816bc4a7f974a2011e664f39a9a943', xmlns: "http://www.w3.org/2000/svg", viewBox: "0 0 72 72", "aria-hidden": "true" }, h("g", { key: '47dbbc031af1c8f56f0c7c9046ecf1bb2aacbeff', id: "Logo" }, h("rect", { key: '8da0d35310d062d0e1f23bc9eb19fef4fd5f7a96', fill: "#ffcc00", x: "0", y: "0", width: "72", height: "72" }), h("polygon", { key: '7d96cc5f82e35308826e77e5daa94494ef8947e6', fill: "#ff0000", points: "34,32.3 34,19 19.7,19 19.7,29.1 10,29.1 10,42.9 19.7,42.9 19.7,53 34,53 34,39.7 30.6,39.7 30.6,49.8 23.1,49.8 23.1,39.7 13.4,39.7 13.4,32.3 23.1,32.3 23.1,22.2 30.6,22.2 30.6,32.3" }), h("path", { key: '85b88d253f50500662ea6e7689a5cfa8461bd7c1', d: "M53.56234,31.10526c0,2.41272-1.99154,4.29475-4.51723,4.29475H45.2v-8.3h3.84511C51.66802,27.1,53.56234,28.78889,53.56234,31.10526z M50.69666,19H36v34h9.2V42.9h5.49666c6.75131,0,11.9971-5.15137,11.9971-11.8057C62.69376,24.39136,57.35099,19,50.69666,19z" }))))));
|
|
27
27
|
}
|
|
28
28
|
static get is() { return "post-logo"; }
|
|
29
29
|
static get encapsulation() { return "shadow"; }
|
|
@@ -1,3 +1,3 @@
|
|
|
1
1
|
/*!
|
|
2
2
|
* Copyright 2021 by Swiss Post, Information Technology
|
|
3
|
-
*/.btn-close{padding:0;overflow:visible;border:0;background:none;color:inherit;font:inherit;-webkit-user-select:none;user-select:none;appearance:button;border-radius:
|
|
3
|
+
*/.btn-close{padding:0;overflow:visible;border:0;background:none;color:inherit;font:inherit;-webkit-user-select:none;user-select:none;appearance:button;border-radius:var(--post-device-border-radius-round);color:var(--post-gray-80);transition:opacity 250ms,border-color 250ms,background-color 250ms,color 250ms;cursor:pointer}.btn-close{outline-offset:var(--post-device-spacing-padding-2) !important;outline:var(--post-scheme-color-interactive-focus-stroke) none var(--post-device-border-width-focus) !important}.btn-close:is(:focus-visible,:has(:focus-visible),.pretend-focus){outline-style:var(--post-core-border-style-solid) !important;border-radius:4px}@media(forced-colors: active),(-ms-high-contrast: active),(-ms-high-contrast: white-on-black){.btn-close:is(:focus-visible,:has(:focus-visible),.pretend-focus){outline-color:Highlight !important}}@supports not selector(:has(:focus-visible)){.btn-close:is(:focus-visible,:focus-within,.pretend-focus){outline-style:var(--post-core-border-style-solid) !important;border-radius:4px}@media(forced-colors: active),(-ms-high-contrast: active),(-ms-high-contrast: white-on-black){.btn-close:is(:focus-visible,:focus-within,.pretend-focus){outline-color:Highlight !important}}}.btn-close::before{-webkit-mask-image:url("data:image/svg+xml,%3Csvg viewBox='0 0 32 32' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='m16.267 16.667 6.667-6.533-.933-1.067-6.667 6.667-6.667-6.667-.933 1.067 6.667 6.533-6.667 6.667 1.067.933 6.533-6.667 6.667 6.667.933-1.067z'/%3E%3C/svg%3E");mask-image:url("data:image/svg+xml,%3Csvg viewBox='0 0 32 32' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='m16.267 16.667 6.667-6.533-.933-1.067-6.667 6.667-6.667-6.667-.933 1.067 6.667 6.533-6.667 6.667 1.067.933 6.533-6.667 6.667 6.667.933-1.067z'/%3E%3C/svg%3E");background-color:currentColor;color:currentColor;forced-color-adjust:preserve-parent-color;content:"";display:block;height:1.5rem;width:1.5rem}:where(.bg-dark,.bg-black,.bg-primary,.bg-secondary,.bg-success,.bg-error,.alert-primary,post-alert[type=primary],.alert-success,post-alert[type=success],.alert-danger,post-alert[type=danger],.alert-notification,post-alert[type=notification],.alert-error,post-alert[type=error]) .btn-close{color:var(--post-contrast-color)}.btn-close:focus,.btn-close:not(:disabled):hover,.pretend-hover.btn-close{color:var(--post-contrast-color)}.btn-close:disabled{color:var(--post-gray-40)}@media(forced-colors: active),(-ms-high-contrast: active),(-ms-high-contrast: white-on-black){.btn-close{color:CanvasText;forced-color-adjust:none}.btn-close:focus,.btn-close:not(:disabled):hover,.pretend-hover.btn-close{color:Highlight}}.btn-close-white{color:#e6e6e6}.btn-close-white:focus,.btn-close-white:not(:disabled):hover,.btn-close-white.pretend-hover{color:#fff}.btn-close-white:disabled{color:#999}*{box-sizing:border-box}:host{--post-contrast-color: #fff;--post-bg-rgb: 51, 51, 51;display:block}.visually-hidden{position:absolute;width:1px;height:1px;margin:-1px;padding:0;overflow:hidden;clip:rect(0 0 0 0);border:0}.popover-container{display:flex;align-items:self-start;padding:.5em;min-width:160px;max-width:280px}@media(max-width: 599.98px){.popover-container{max-width:100%}}.popover-content{padding:.5em;flex-grow:1}.btn-close{color:inherit}
|
|
@@ -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: 'aef49582e78865ac209f1983d255b44e4e3a4c0a', "data-version": version }, h("post-popovercontainer", { key: 'cd2db53a82b34ea3c6aa3aab07670c6e198f9360', arrow: this.arrow, placement: this.placement, ref: e => (this.popoverRef = e) }, h("div", { key: 'df037f6f7848e0ef87affa73de6a9c2a6af9eade', class: "popover-container" }, h("div", { key: '48c1e44e42c7cc3daf198456f7b49041d86a8e83', class: "popover-content" }, h("slot", { key: '8f4dc6f558bcaa9b83a342fea3a7843c185fc43e' })), h("button", { key: 'e78527134e8e5cbeed240b742aeab7bf0ea41d5b', class: "btn-close", onClick: () => this.hide() }, h("span", { key: 'f56f4c3aa17dd11818d1abd7b422e7c45902c593', class: "visually-hidden" }, this.closeButtonCaption))))));
|
|
92
92
|
}
|
|
93
93
|
static get is() { return "post-popover"; }
|
|
94
94
|
static get encapsulation() { return "shadow"; }
|
|
@@ -1 +1 @@
|
|
|
1
|
-
@layer polyfill{@supports not selector(:popover-open){[popover]:not(.\:popover-open){display:none}}}:where(post-popovercontainer){box-shadow:.5px 3px 4px rgba(0,0,0,.1),2px 4px 10px 4px rgba(0,0,0,.12);position:fixed;z-index:1060;width:max-content;margin:0;padding:0;box-sizing:border-box;color:var(--post-contrast-color);background-color:rgb(var(--post-bg-rgb));border:2px solid rgba(0,0,0,0);border-radius:4px;overflow:visible}:where(post-popovercontainer) .arrow{position:absolute;width:.5825rem;height:.5825rem;background-color:inherit;rotate:45deg;pointer-events:none;z-index:-1}:where(post-popovercontainer) .arrow.top{border-left:2px solid rgba(0,0,0,0);border-top:2px solid rgba(0,0,0,0)}:where(post-popovercontainer) .arrow.right{border-right:2px solid rgba(0,0,0,0);border-top:2px solid rgba(0,0,0,0)}:where(post-popovercontainer) .arrow.left{border-left:2px solid rgba(0,0,0,0);border-bottom:2px solid rgba(0,0,0,0)}:where(post-popovercontainer) .arrow.bottom{border-right:2px solid rgba(0,0,0,0);border-bottom:2px solid rgba(0,0,0,0)}
|
|
1
|
+
@layer polyfill{@supports not selector(:popover-open){[popover]:not(.\:popover-open){display:none}}}:where(post-popovercontainer){box-shadow:.5px 3px 4px rgba(0,0,0,.1),2px 4px 10px 4px rgba(0,0,0,.12);position:fixed;z-index:1060;width:max-content;margin:0;padding:0;box-sizing:border-box;color:var(--post-contrast-color);background-color:rgb(var(--post-bg-rgb));border:2px solid rgba(0,0,0,0);border-radius:4px;overflow:visible}:where(post-popovercontainer)[tooltip]{position:absolute;width:1px;height:1px;margin:-1px;padding:0;overflow:hidden;clip:rect(0 0 0 0);border:0}:where(post-popovercontainer) .arrow{position:absolute;width:.5825rem;height:.5825rem;background-color:inherit;rotate:45deg;pointer-events:none;z-index:-1}:where(post-popovercontainer) .arrow.top{border-left:2px solid rgba(0,0,0,0);border-top:2px solid rgba(0,0,0,0)}:where(post-popovercontainer) .arrow.right{border-right:2px solid rgba(0,0,0,0);border-top:2px solid rgba(0,0,0,0)}:where(post-popovercontainer) .arrow.left{border-left:2px solid rgba(0,0,0,0);border-bottom:2px solid rgba(0,0,0,0)}:where(post-popovercontainer) .arrow.bottom{border-right:2px solid rgba(0,0,0,0);border-bottom:2px solid rgba(0,0,0,0)}
|
|
@@ -15,6 +15,7 @@ const SIDE_MAP = {
|
|
|
15
15
|
export class PostPopovercontainer {
|
|
16
16
|
constructor() {
|
|
17
17
|
this.placement = 'top';
|
|
18
|
+
this.edgeGap = 8;
|
|
18
19
|
this.arrow = false;
|
|
19
20
|
}
|
|
20
21
|
componentDidLoad() {
|
|
@@ -86,11 +87,12 @@ export class PostPopovercontainer {
|
|
|
86
87
|
this.clearAutoUpdate = autoUpdate(this.eventTarget, this.host, this.calculatePosition.bind(this));
|
|
87
88
|
}
|
|
88
89
|
async calculatePosition() {
|
|
90
|
+
const gap = this.edgeGap;
|
|
89
91
|
const middleware = [
|
|
90
92
|
flip(),
|
|
91
93
|
inline(),
|
|
92
94
|
shift({
|
|
93
|
-
padding:
|
|
95
|
+
padding: gap,
|
|
94
96
|
// Prevents shifting away from the anchor too far, while shifting as far as possible
|
|
95
97
|
// https://floating-ui.com/docs/shift#limiter
|
|
96
98
|
limiter: limitShift({
|
|
@@ -100,14 +102,14 @@ export class PostPopovercontainer {
|
|
|
100
102
|
size({
|
|
101
103
|
apply({ availableWidth, elements }) {
|
|
102
104
|
Object.assign(elements.floating.style, {
|
|
103
|
-
maxWidth: `${availableWidth -
|
|
105
|
+
maxWidth: `${availableWidth - gap * 2}px`,
|
|
104
106
|
});
|
|
105
107
|
},
|
|
106
108
|
}),
|
|
107
|
-
offset(this.arrow ?
|
|
109
|
+
offset(this.arrow ? gap + 4 : gap), // 4px outside of element to account for focus outline + ~arrow size
|
|
108
110
|
];
|
|
109
111
|
if (this.arrow) {
|
|
110
|
-
middleware.push(arrow({ element: this.arrowRef, padding:
|
|
112
|
+
middleware.push(arrow({ element: this.arrowRef, padding: gap }));
|
|
111
113
|
}
|
|
112
114
|
const { x, y, middlewareData, placement: currentPlacement, } = await computePosition(this.eventTarget, this.host, {
|
|
113
115
|
placement: this.placement || 'top',
|
|
@@ -135,9 +137,9 @@ export class PostPopovercontainer {
|
|
|
135
137
|
}
|
|
136
138
|
}
|
|
137
139
|
render() {
|
|
138
|
-
return (h(Host, { key: '
|
|
140
|
+
return (h(Host, { key: '786ef435ebc0cdb95a15c0327aee75406d4da6e5', "data-version": version }, this.arrow && (h("span", { key: '3c343daffb966ee54b9c14eb5659910150be7f3f', class: "arrow", ref: el => {
|
|
139
141
|
this.arrowRef = el;
|
|
140
|
-
} })), h("slot", { key: '
|
|
142
|
+
} })), h("slot", { key: 'f2c9fc7c80f794987550388bfe8ad33078685bf1' })));
|
|
141
143
|
}
|
|
142
144
|
static get is() { return "post-popovercontainer"; }
|
|
143
145
|
static get originalStyleUrls() {
|
|
@@ -176,6 +178,24 @@ export class PostPopovercontainer {
|
|
|
176
178
|
"reflect": false,
|
|
177
179
|
"defaultValue": "'top'"
|
|
178
180
|
},
|
|
181
|
+
"edgeGap": {
|
|
182
|
+
"type": "number",
|
|
183
|
+
"mutable": false,
|
|
184
|
+
"complexType": {
|
|
185
|
+
"original": "number",
|
|
186
|
+
"resolved": "number",
|
|
187
|
+
"references": {}
|
|
188
|
+
},
|
|
189
|
+
"required": false,
|
|
190
|
+
"optional": true,
|
|
191
|
+
"docs": {
|
|
192
|
+
"tags": [],
|
|
193
|
+
"text": "Gap between the edge of the page and the popover"
|
|
194
|
+
},
|
|
195
|
+
"attribute": "edge-gap",
|
|
196
|
+
"reflect": false,
|
|
197
|
+
"defaultValue": "8"
|
|
198
|
+
},
|
|
179
199
|
"arrow": {
|
|
180
200
|
"type": "boolean",
|
|
181
201
|
"mutable": false,
|
|
@@ -64,7 +64,7 @@ export class PostRating {
|
|
|
64
64
|
}
|
|
65
65
|
}
|
|
66
66
|
render() {
|
|
67
|
-
return (h(Host, { key: '
|
|
67
|
+
return (h(Host, { key: 'e303ed62ef2f76033e0ca9b693dfe447984a92c7', "data-version": version }, h("div", { key: '7e392823716b6d4d243198a66a637001f5f86690', 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),
|
|
@@ -1,3 +1,3 @@
|
|
|
1
|
-
.tab-title[role=tab]{display:inline-block;cursor:pointer;position:relative;box-sizing:border-box;padding:1rem;transition:background-color 100ms;border-right:1px solid rgba(0,0,0,0);border-left:1px solid rgba(0,0,0,0);outline-color:currentColor;opacity:.7;color:var(--post-contrast-color);text-decoration:none;background-color:rgba(0,0,0,0)}.tab-title[role=tab]:focus{background-color:unset;color:var(--post-contrast-color)}.tab-title[role=tab]:hover{opacity:1;background-color:rgba(var(--post-contrast-color-rgb), 0.6);color:var(--post-contrast-color-inverted)}.tab-title[role=tab]:focus-visible{outline:rgba(0,0,0,0);opacity:1;background-color:rgba(var(--post-contrast-color-rgb), 0.6);color:var(--post-contrast-color-inverted);box-shadow:none}.tab-title[role=tab]:focus-visible::after{content:"";display:block;position:absolute;top:2px;right:1px;bottom:0;left:1px;box-shadow:0 0 0 1px #fff,0 0 0 2px #333}.tab-title[role=tab].active{z-index:1;border-right-color:#ccc;border-left-color:#ccc;opacity:1;background-color:var(--post-contrast-color-inverted);color:var(--post-contrast-color);font-weight:700}.tab-title[role=tab].active::before{content:"";display:block;position:absolute;top:0;right:-1px;left:-1px;height:.25rem;background-color:#fc0}:where(.bg-dark,.bg-black,.bg-primary,.bg-secondary,.bg-success,.bg-error,.
|
|
1
|
+
.tab-title[role=tab]{display:inline-block;cursor:pointer;position:relative;box-sizing:border-box;padding:1rem;transition:background-color 100ms;border-right:1px solid rgba(0,0,0,0);border-left:1px solid rgba(0,0,0,0);outline-color:currentColor;opacity:.7;color:var(--post-contrast-color);text-decoration:none;background-color:rgba(0,0,0,0)}.tab-title[role=tab]:focus{background-color:unset;color:var(--post-contrast-color)}.tab-title[role=tab]:hover{opacity:1;background-color:rgba(var(--post-contrast-color-rgb), 0.6);color:var(--post-contrast-color-inverted)}.tab-title[role=tab]:focus-visible{outline:rgba(0,0,0,0);opacity:1;background-color:rgba(var(--post-contrast-color-rgb), 0.6);color:var(--post-contrast-color-inverted);box-shadow:none}.tab-title[role=tab]:focus-visible::after{content:"";display:block;position:absolute;top:2px;right:1px;bottom:0;left:1px;box-shadow:0 0 0 1px #fff,0 0 0 2px #333}.tab-title[role=tab].active{z-index:1;border-right-color:#ccc;border-left-color:#ccc;opacity:1;background-color:var(--post-contrast-color-inverted);color:var(--post-contrast-color);font-weight:700}.tab-title[role=tab].active::before{content:"";display:block;position:absolute;top:0;right:-1px;left:-1px;height:.25rem;background-color:#fc0}:where(.bg-dark,.bg-black,.bg-primary,.bg-secondary,.bg-success,.bg-error,.alert-primary,post-alert[type=primary],.alert-success,post-alert[type=success],.alert-danger,post-alert[type=danger],.alert-notification,post-alert[type=notification],.alert-error,post-alert[type=error]) .tab-title[role=tab]:hover{background-color:rgba(255,255,255,.2)}:where(.bg-dark,.bg-black,.bg-primary,.bg-secondary,.bg-success,.bg-error,.alert-primary,post-alert[type=primary],.alert-success,post-alert[type=success],.alert-danger,post-alert[type=danger],.alert-notification,post-alert[type=notification],.alert-error,post-alert[type=error]) .tab-title[role=tab]:focus-visible{background-color:rgba(255,255,255,.2)}@media(forced-colors: active),(-ms-high-contrast: active),(-ms-high-contrast: white-on-black){.tab-title[role=tab]{opacity:1;border-left-color:Canvas;border-right-color:Canvas;color:LinkText}.tab-title[role=tab]:hover,.tab-title[role=tab]:focus,.tab-title[role=tab]:focus-within,.tab-title[role=tab]:focus-visible{outline:2px solid Highlight;outline-offset:-0.25rem}.tab-title[role=tab].active{border-left-color:ButtonText;border-right-color:ButtonText;color:Highlight}.tab-title[role=tab].active::before{background-color:Highlight}}.bg-yellow .tab-title{background-color:#fc0}.bg-yellow .tab-title.active{background-color:#fc0}.bg-yellow .nav-item{background-color:#fc0}.bg-white .tab-title{background-color:#fff}.bg-white .tab-title.active{background-color:#fff}.bg-white .nav-item{background-color:#fff}.bg-light .tab-title{background-color:#faf9f8}.bg-light .tab-title.active{background-color:#faf9f8}.bg-light .nav-item{background-color:#faf9f8}.bg-gray .tab-title{background-color:#f4f3f1}.bg-gray .tab-title.active{background-color:#f4f3f1}.bg-gray .nav-item{background-color:#f4f3f1}.bg-dark .tab-title{background-color:#333}.bg-dark .tab-title.active{background-color:#333}.bg-dark .nav-item{background-color:#333}.bg-black .tab-title{background-color:#000}.bg-black .tab-title.active{background-color:#000}.bg-black .nav-item{background-color:#000}.bg-primary .tab-title{background-color:#333}.bg-primary .tab-title.active{background-color:#333}.bg-primary .nav-item{background-color:#333}.bg-secondary .tab-title{background-color:#666}.bg-secondary .tab-title.active{background-color:#666}.bg-secondary .nav-item{background-color:#666}.bg-success .tab-title{background-color:#2c871d}.bg-success .tab-title.active{background-color:#2c871d}.bg-success .nav-item{background-color:#2c871d}.bg-warning .tab-title{background-color:#f49e00}.bg-warning .tab-title.active{background-color:#f49e00}.bg-warning .nav-item{background-color:#f49e00}.bg-error .tab-title{background-color:#a51728}.bg-error .tab-title.active{background-color:#a51728}.bg-error .nav-item{background-color:#a51728}.bg-info .tab-title{background-color:#cce4ee}.bg-info .tab-title.active{background-color:#cce4ee}.bg-info .nav-item{background-color:#cce4ee}.bg-success-background .tab-title{background-color:#c0debb}.bg-success-background .tab-title.active{background-color:#c0debb}.bg-success-background .nav-item{background-color:#c0debb}.bg-warning-background .tab-title{background-color:#fce2b2}.bg-warning-background .tab-title.active{background-color:#fce2b2}.bg-warning-background .nav-item{background-color:#fce2b2}.bg-error-background .tab-title{background-color:#ffdade}.bg-error-background .tab-title.active{background-color:#ffdade}.bg-error-background .nav-item{background-color:#ffdade}[class*=bg-] .tab-title.active:focus::after{background-color:rgba(255,255,255,.2)}@supports selector(*:focus-visible){[class*=bg-] .tab-title.active:focus::after{background-color:unset}[class*=bg-] .tab-title.active:focus-visible::after{background-color:rgba(255,255,255,.2)}}/*!
|
|
2
2
|
* Copyright 2021 by Swiss Post, Information Technology
|
|
3
3
|
*/:host{display:block}.tab-title{padding:0;overflow:visible;border:0;background:none;color:inherit;font:inherit;-webkit-user-select:none;user-select:none;appearance:button}
|
|
@@ -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: '3f6c519aeb28ba7f22de7b7bbb04589bc7c9fc59', id: this.tabId, role: "tab", "data-version": version, "aria-selected": "false", tabindex: "-1", class: "tab-title", slot: "tabs" }, h("slot", { key: '2df9413b24b32956361708d2ef009584ea151c8c' })));
|
|
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: 'be6aea34d94b371364912bc3b20efb33f844b736', "data-version": version, id: this.panelId, role: "tabpanel" }, h("slot", { key: 'aa4b546f2461819b47a8b14b326c79cc13f5f3d2' })));
|
|
17
17
|
}
|
|
18
18
|
static get is() { return "post-tab-panel"; }
|
|
19
19
|
static get encapsulation() { return "shadow"; }
|
|
@@ -1 +1 @@
|
|
|
1
|
-
.tabs-wrapper{position:relative;padding-top:1rem;border:0;background-color:rgba(var(--post-contrast-color-rgb), 0.02)}.tabs-wrapper::after{content:"";position:absolute;bottom:0;width:100%;height:1px;background-color:#ccc}.tabs-wrapper .tabs{background-color:rgba(0,0,0,0) !important}@media(forced-colors: active),(-ms-high-contrast: active),(-ms-high-contrast: white-on-black){.tabs-wrapper::after{background-color:ButtonBorder}}.tabs{margin:0;padding:0;list-style:none;display:flex;flex-wrap:nowrap;overflow-x:auto;overscroll-behavior-x:contain;white-space:nowrap}.tabs::after{content:"";display:block;flex:1 0 auto;width:1rem}.tab-content{padding-top:1rem}.bg-yellow .tabs-wrapper{background-color:#fc0}.bg-white .tabs-wrapper{background-color:#fff}.bg-light .tabs-wrapper{background-color:#faf9f8}.bg-gray .tabs-wrapper{background-color:#f4f3f1}.bg-dark .tabs-wrapper{background-color:#333}.bg-black .tabs-wrapper{background-color:#000}.bg-primary .tabs-wrapper{background-color:#333}.bg-secondary .tabs-wrapper{background-color:#666}.bg-success .tabs-wrapper{background-color:#2c871d}.bg-warning .tabs-wrapper{background-color:#f49e00}.bg-error .tabs-wrapper{background-color:#a51728}.bg-info .tabs-wrapper{background-color:#cce4ee}.bg-success-background .tabs-wrapper{background-color:#c0debb}.bg-warning-background .tabs-wrapper{background-color:#fce2b2}.bg-error-background .tabs-wrapper{background-color:#ffdade}
|
|
1
|
+
.tabs-wrapper{position:relative;padding-top:1rem;border:0;background-color:rgba(var(--post-contrast-color-rgb), 0.02)}.tabs-wrapper::after{content:"";position:absolute;bottom:0;width:100%;height:1px;background-color:#ccc}.tabs-wrapper .tabs{background-color:rgba(0,0,0,0) !important}@media(forced-colors: active),(-ms-high-contrast: active),(-ms-high-contrast: white-on-black){.tabs-wrapper::after{background-color:ButtonBorder}}.tabs{margin:0;padding:0;list-style:none;display:flex;flex-wrap:nowrap;overflow-x:auto;overscroll-behavior-x:contain;white-space:nowrap}.tabs.list-bullet>li{margin:0;padding:0}.tabs.list-bullet>li::before{display:none}.tabs::after{content:"";display:block;flex:1 0 auto;width:1rem}.tab-content{padding-top:1rem}.bg-yellow .tabs-wrapper{background-color:#fc0}.bg-white .tabs-wrapper{background-color:#fff}.bg-light .tabs-wrapper{background-color:#faf9f8}.bg-gray .tabs-wrapper{background-color:#f4f3f1}.bg-dark .tabs-wrapper{background-color:#333}.bg-black .tabs-wrapper{background-color:#000}.bg-primary .tabs-wrapper{background-color:#333}.bg-secondary .tabs-wrapper{background-color:#666}.bg-success .tabs-wrapper{background-color:#2c871d}.bg-warning .tabs-wrapper{background-color:#f49e00}.bg-error .tabs-wrapper{background-color:#a51728}.bg-info .tabs-wrapper{background-color:#cce4ee}.bg-success-background .tabs-wrapper{background-color:#c0debb}.bg-warning-background .tabs-wrapper{background-color:#fce2b2}.bg-error-background .tabs-wrapper{background-color:#ffdade}:host{display:block}
|
|
@@ -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: '8f50b5d2575a248e0a7dc57add5e343e562db015', "data-version": version }, h("div", { key: 'e640efed73aefdb9ff4cd2f138b7bd7a3c64b885', class: "tabs-wrapper", part: "tabs" }, h("div", { key: '2394820f9d187e4d9f123156dec49e5620e0dfcc', class: "tabs", role: "tablist" }, h("slot", { key: 'c2800a38891140881227a01706cfa43095c769ba', name: "tabs", onSlotchange: () => this.enableTabs() }))), h("div", { key: '836b9b2bf4ba05df3e91bc5d3d71e3f2363dea88', class: "tab-content", part: "content" }, h("slot", { key: 'd6cad1f86d39d854b5595ee467f29474b21965ba', 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: '5058456392690e1973575edfe7e8c72f909a80b5', "data-version": version }, h("div", { key: '0995e847c0239d540f1adfb7d1bb8eba3b026a2f', class: this.classes }, this.icon ? h("post-icon", { name: this.icon }) : null, h("div", { key: '7e62db84243af09f7f8aee28cb1a542599e01579', class: "tag-text" }, h("slot", { key: '235b5b43062f41497d246a838e351282d324b060' })))));
|
|
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: 'ad55746e219ca6f52779605a16e0002f18062351', "data-version": version, role: "tooltip", onPointerOver: this.handleInterest, onPointerOut: this.handleInterestLost, onFocusIn: this.handleInterest, onFocusOut: this.handleInterestLost }, h("post-popovercontainer", { key: 'd80bf2dbd80cd71ea0d1ce09dd95e362d8f768f3', class: popoverClass, arrow: this.arrow, placement: this.placement, ref: (el) => (this.popoverRef = el) }, h("slot", { key: 'c58554b173253a65ddba2d06255c955c8223a5ff' }))));
|
|
202
202
|
}
|
|
203
203
|
static get is() { return "post-tooltip"; }
|
|
204
204
|
static get encapsulation() { return "shadow"; }
|
package/dist/collection/index.js
CHANGED
|
@@ -2,10 +2,14 @@
|
|
|
2
2
|
export { PostAccordion } from './components/post-accordion/post-accordion';
|
|
3
3
|
export { PostAccordionItem } from './components/post-accordion-item/post-accordion-item';
|
|
4
4
|
export { PostAlert } from './components/post-alert/post-alert';
|
|
5
|
+
export { PostBreadcrumbItem } from './components/post-breadcrumb-item/post-breadcrumb-item';
|
|
6
|
+
export { PostAvatar } from './components/post-avatar/post-avatar';
|
|
5
7
|
export { PostCardControl } from './components/post-card-control/post-card-control';
|
|
8
|
+
export { PostClosebutton } from './components/post-closebutton/post-closebutton';
|
|
6
9
|
export { PostCollapsible } from './components/post-collapsible/post-collapsible';
|
|
7
10
|
export { PostCollapsibleTrigger } from './components/post-collapsible-trigger/post-collapsible-trigger';
|
|
8
11
|
export { PostIcon } from './components/post-icon/post-icon';
|
|
12
|
+
export { PostLanguageOption } from './components/post-language-option/post-language-option';
|
|
9
13
|
export { PostLogo } from './components/post-logo/post-logo';
|
|
10
14
|
export { PostPopover } from './components/post-popover/post-popover';
|
|
11
15
|
export { PostPopovercontainer } from './components/post-popovercontainer/post-popovercontainer';
|
|
@@ -15,3 +19,5 @@ export { PostTabHeader } from './components/post-tab-header/post-tab-header';
|
|
|
15
19
|
export { PostTabPanel } from './components/post-tab-panel/post-tab-panel';
|
|
16
20
|
export { PostTooltip } from './components/post-tooltip/post-tooltip';
|
|
17
21
|
export { PostTag } from './components/post-tag/post-tag';
|
|
22
|
+
export { PostList } from './components/post-list/post-list';
|
|
23
|
+
export { PostListItem } from './components/post-list-item/post-list-item';
|
package/dist/components/index.js
CHANGED
|
@@ -2,10 +2,14 @@ export { getAssetPath, setAssetPath, setNonce, setPlatformOptions } from '@stenc
|
|
|
2
2
|
export { P as PostAccordion } from './post-accordion2.js';
|
|
3
3
|
export { P as PostAccordionItem } from './post-accordion-item2.js';
|
|
4
4
|
export { P as PostAlert } from './post-alert2.js';
|
|
5
|
+
export { P as PostBreadcrumbItem } from './post-breadcrumb-item2.js';
|
|
6
|
+
export { P as PostAvatar } from './post-avatar2.js';
|
|
5
7
|
export { P as PostCardControl } from './post-card-control2.js';
|
|
8
|
+
export { P as PostClosebutton } from './post-closebutton2.js';
|
|
6
9
|
export { P as PostCollapsible } from './post-collapsible2.js';
|
|
7
10
|
export { P as PostCollapsibleTrigger } from './post-collapsible-trigger2.js';
|
|
8
11
|
export { P as PostIcon } from './post-icon2.js';
|
|
12
|
+
export { P as PostLanguageOption } from './post-language-option2.js';
|
|
9
13
|
export { P as PostLogo } from './post-logo2.js';
|
|
10
14
|
export { P as PostPopover } from './post-popover2.js';
|
|
11
15
|
export { P as PostPopovercontainer } from './post-popovercontainer2.js';
|
|
@@ -15,3 +19,5 @@ export { P as PostTabHeader } from './post-tab-header2.js';
|
|
|
15
19
|
export { P as PostTabPanel } from './post-tab-panel2.js';
|
|
16
20
|
export { P as PostTooltip } from './post-tooltip2.js';
|
|
17
21
|
export { P as PostTag } from './post-tag2.js';
|
|
22
|
+
export { P as PostList } from './post-list2.js';
|
|
23
|
+
export { P as PostListItem } from './post-list-item2.js';
|
|
@@ -31,4 +31,4 @@ const checkEmptyOrPattern = emptyOr(checkPattern);
|
|
|
31
31
|
const checkEmptyOrType = emptyOr(checkType);
|
|
32
32
|
const checkEmptyOrUrl = emptyOr(checkUrl);
|
|
33
33
|
|
|
34
|
-
export { checkEmptyOrPattern as a,
|
|
34
|
+
export { checkEmptyOrPattern as a, checkEmptyOrUrl as b, checkEmptyOrOneOf as c, checkEmptyOrType as d };
|
|
@@ -5,7 +5,7 @@ import { c as checkEmptyOrOneOf } from './index2.js';
|
|
|
5
5
|
import { d as defineCustomElement$2 } from './post-collapsible2.js';
|
|
6
6
|
import { d as defineCustomElement$1 } from './post-collapsible-trigger2.js';
|
|
7
7
|
|
|
8
|
-
const postAccordionItemCss = "post-accordion-item::part(accordion-item),.bg-yellow post-accordion-item::part(accordion-item),.bg-white post-accordion-item::part(accordion-item),.bg-light post-accordion-item::part(accordion-item),.bg-gray post-accordion-item::part(accordion-item),.bg-dark post-accordion-item::part(accordion-item),.bg-black post-accordion-item::part(accordion-item),.bg-primary post-accordion-item::part(accordion-item),.bg-secondary post-accordion-item::part(accordion-item),.bg-success post-accordion-item::part(accordion-item),.bg-warning post-accordion-item::part(accordion-item),.bg-error post-accordion-item::part(accordion-item),.bg-info post-accordion-item::part(accordion-item),.bg-success-background post-accordion-item::part(accordion-item),.bg-warning-background post-accordion-item::part(accordion-item),.bg-error-background post-accordion-item::part(accordion-item),.bg-nightblue post-accordion-item::part(accordion-item),.bg-nightblue-bright post-accordion-item::part(accordion-item),.bg-petrol post-accordion-item::part(accordion-item),.bg-petrol-bright post-accordion-item::part(accordion-item),.bg-coral post-accordion-item::part(accordion-item),.bg-coral-bright post-accordion-item::part(accordion-item),.bg-olive post-accordion-item::part(accordion-item),.bg-olive-bright post-accordion-item::part(accordion-item),.bg-purple post-accordion-item::part(accordion-item),.bg-purple-bright post-accordion-item::part(accordion-item),.bg-aubergine post-accordion-item::part(accordion-item),.bg-aubergine-bright post-accordion-item::part(accordion-item),.accordion-item,.bg-yellow .accordion-item,.bg-white .accordion-item,.bg-light .accordion-item,.bg-gray .accordion-item,.bg-dark .accordion-item,.bg-black .accordion-item,.bg-primary .accordion-item,.bg-secondary .accordion-item,.bg-success .accordion-item,.bg-warning .accordion-item,.bg-error .accordion-item,.bg-info .accordion-item,.bg-success-background .accordion-item,.bg-warning-background .accordion-item,.bg-error-background .accordion-item,.bg-nightblue .accordion-item,.bg-nightblue-bright .accordion-item,.bg-petrol .accordion-item,.bg-petrol-bright .accordion-item,.bg-coral .accordion-item,.bg-coral-bright .accordion-item,.bg-olive .accordion-item,.bg-olive-bright .accordion-item,.bg-purple .accordion-item,.bg-purple-bright .accordion-item,.bg-aubergine .accordion-item,.bg-aubergine-bright .accordion-item{--post-bg-opacity:1;background-color:rgba(var(--post-bg-rgb), var(--post-bg-opacity)) !important;color:var(--post-contrast-color) !important}post-accordion-item::part(accordion-item),.bg-yellow post-accordion-item::part(accordion-item),.bg-white post-accordion-item::part(accordion-item),.bg-light post-accordion-item::part(accordion-item),.bg-gray post-accordion-item::part(accordion-item),.bg-dark post-accordion-item::part(accordion-item),.bg-black post-accordion-item::part(accordion-item),.bg-primary post-accordion-item::part(accordion-item),.bg-secondary post-accordion-item::part(accordion-item),.bg-success post-accordion-item::part(accordion-item),.bg-warning post-accordion-item::part(accordion-item),.bg-error post-accordion-item::part(accordion-item),.bg-info post-accordion-item::part(accordion-item),.bg-success-background post-accordion-item::part(accordion-item),.bg-warning-background post-accordion-item::part(accordion-item),.bg-error-background post-accordion-item::part(accordion-item),.bg-nightblue post-accordion-item::part(accordion-item),.bg-nightblue-bright post-accordion-item::part(accordion-item),.bg-petrol post-accordion-item::part(accordion-item),.bg-petrol-bright post-accordion-item::part(accordion-item),.bg-coral post-accordion-item::part(accordion-item),.bg-coral-bright post-accordion-item::part(accordion-item),.bg-olive post-accordion-item::part(accordion-item),.bg-olive-bright post-accordion-item::part(accordion-item),.bg-purple post-accordion-item::part(accordion-item),.bg-purple-bright post-accordion-item::part(accordion-item),.bg-aubergine post-accordion-item::part(accordion-item),.bg-aubergine-bright post-accordion-item::part(accordion-item),.accordion-item,.bg-yellow .accordion-item,.bg-white .accordion-item,.bg-light .accordion-item,.bg-gray .accordion-item,.bg-dark .accordion-item,.bg-black .accordion-item,.bg-primary .accordion-item,.bg-secondary .accordion-item,.bg-success .accordion-item,.bg-warning .accordion-item,.bg-error .accordion-item,.bg-info .accordion-item,.bg-success-background .accordion-item,.bg-warning-background .accordion-item,.bg-error-background .accordion-item,.bg-nightblue .accordion-item,.bg-nightblue-bright .accordion-item,.bg-petrol .accordion-item,.bg-petrol-bright .accordion-item,.bg-coral .accordion-item,.bg-coral-bright .accordion-item,.bg-olive .accordion-item,.bg-olive-bright .accordion-item,.bg-purple .accordion-item,.bg-purple-bright .accordion-item,.bg-aubergine .accordion-item,.bg-aubergine-bright .accordion-item{--post-contrast-color:#000;--post-focus-color:#1976c8;--post-contrast-color-inverted:#fff;--post-gray-10:hsl(0, 0%, 90%);--post-gray-20:hsl(0, 0%, 80%);--post-gray-40:hsl(0, 0%, 60%);--post-gray-60:hsl(0, 0%, 40%);--post-gray-80:hsl(0, 0%, 20%);--post-yellow:#fc0;--post-white:#fff;--post-light:#faf9f8;--post-gray:#f4f3f1;--post-dark:hsl(0, 0%, 20%);--post-black:#000;--post-primary:hsl(0, 0%, 20%);--post-secondary:hsl(0, 0%, 40%);--post-success:#2c871d;--post-warning:#f49e00;--post-error:#a51728;--post-info:#cce4ee;--post-success-background:#c0debb;--post-warning-background:#fce2b2;--post-error-background:#ffdade;--post-nightblue:#004976;--post-nightblue-bright:#0076a8;--post-petrol:#006d68;--post-petrol-bright:#00968f;--post-coral:#9e2a2f;--post-coral-bright:#e03c31;--post-olive:#716135;--post-olive-bright:#aa9d2e;--post-purple:#80276c;--post-purple-bright:#c5299b;--post-aubergine:#523178;--post-aubergine-bright:#7566a0;--post-contrast-color-rgb:0, 0, 0;--post-contrast-color-inverted-rgb:255, 255, 255;--post-gray-10-rgb:230, 230, 230;--post-gray-20-rgb:204, 204, 204;--post-gray-40-rgb:153, 153, 153;--post-gray-60-rgb:102, 102, 102;--post-gray-80-rgb:51, 51, 51;--post-black-alpha-10-rgba:rgba(0, 0, 0, 0.1);--post-black-alpha-20-rgba:rgba(0, 0, 0, 0.2);--post-black-alpha-40-rgba:rgba(0, 0, 0, 0.4);--post-black-alpha-60-rgba:rgba(0, 0, 0, 0.6);--post-black-alpha-80-rgba:rgba(0, 0, 0, 0.8);--post-white-alpha-10-rgba:rgba(255, 255, 255, 0.1);--post-white-alpha-20-rgba:rgba(255, 255, 255, 0.2);--post-white-alpha-40-rgba:rgba(255, 255, 255, 0.4);--post-white-alpha-60-rgba:rgba(255, 255, 255, 0.6);--post-white-alpha-80-rgba:rgba(255, 255, 255, 0.8);--post-yellow-rgb:255, 204, 0;--post-white-rgb:255, 255, 255;--post-light-rgb:250, 249, 248;--post-gray-rgb:244, 243, 241;--post-dark-rgb:51, 51, 51;--post-black-rgb:0, 0, 0;--post-primary-rgb:51, 51, 51;--post-secondary-rgb:102, 102, 102;--post-success-rgb:44, 135, 29;--post-warning-rgb:244, 158, 0;--post-error-rgb:165, 23, 40;--post-info-rgb:204, 228, 238;--post-success-background-rgb:192, 222, 187;--post-warning-background-rgb:252, 226, 178;--post-error-background-rgb:255, 218, 222;--post-nightblue-rgb:0, 73, 118;--post-nightblue-bright-rgb:0, 118, 168;--post-petrol-rgb:0, 109, 104;--post-petrol-bright-rgb:0, 150, 143;--post-coral-rgb:158, 42, 47;--post-coral-bright-rgb:224, 60, 49;--post-olive-rgb:113, 97, 53;--post-olive-bright-rgb:170, 157, 46;--post-purple-rgb:128, 39, 108;--post-purple-bright-rgb:197, 41, 155;--post-aubergine-rgb:82, 49, 120;--post-aubergine-bright-rgb:117, 102, 160}.accordion-item{border-block:2px solid #666;--post-bg-rgb:244, 243, 241}.bg-yellow .accordion-item{--post-bg-rgb:255, 255, 255}.bg-white .accordion-item{--post-bg-rgb:244, 243, 241}.bg-light .accordion-item{--post-bg-rgb:255, 255, 255}.bg-gray .accordion-item{--post-bg-rgb:255, 255, 255}.bg-dark .accordion-item{--post-bg-rgb:255, 255, 255}.bg-black .accordion-item{--post-bg-rgb:255, 255, 255}.bg-primary .accordion-item{--post-bg-rgb:255, 255, 255}.bg-secondary .accordion-item{--post-bg-rgb:255, 255, 255}.bg-success .accordion-item{--post-bg-rgb:255, 255, 255}.bg-warning .accordion-item{--post-bg-rgb:255, 255, 255}.bg-error .accordion-item{--post-bg-rgb:255, 255, 255}.bg-info .accordion-item{--post-bg-rgb:255, 255, 255}.bg-success-background .accordion-item{--post-bg-rgb:255, 255, 255}.bg-warning-background .accordion-item{--post-bg-rgb:255, 255, 255}.bg-error-background .accordion-item{--post-bg-rgb:255, 255, 255}.bg-nightblue .accordion-item{--post-bg-rgb:255, 255, 255}.bg-nightblue-bright .accordion-item{--post-bg-rgb:255, 255, 255}.bg-petrol .accordion-item{--post-bg-rgb:255, 255, 255}.bg-petrol-bright .accordion-item{--post-bg-rgb:255, 255, 255}.bg-coral .accordion-item{--post-bg-rgb:255, 255, 255}.bg-coral-bright .accordion-item{--post-bg-rgb:255, 255, 255}.bg-olive .accordion-item{--post-bg-rgb:255, 255, 255}.bg-olive-bright .accordion-item{--post-bg-rgb:255, 255, 255}.bg-purple .accordion-item{--post-bg-rgb:255, 255, 255}.bg-purple-bright .accordion-item{--post-bg-rgb:255, 255, 255}.bg-aubergine .accordion-item{--post-bg-rgb:255, 255, 255}.bg-aubergine-bright .accordion-item{--post-bg-rgb:255, 255, 255}.accordion-item+.accordion-item{border-block-start:0}.accordion-header{color:#333;font-size:1rem;font-weight:700;line-height:1.5;margin:0}.accordion-button{padding:0;overflow:visible;border:0;background:none;color:inherit;font:inherit;-webkit-user-select:none;user-select:none;appearance:button;width:100%;position:relative;padding-block:1rem;padding-inline-start:1rem;padding-inline-end:3rem;text-align:start;transition:opacity 250ms,border-color 250ms,background-color 250ms,color 250ms;outline:none}.accordion-button:focus-visible{outline:2px solid #1976c8}.accordion-button:hover{color:#000;background-color:#e6e6e6}.accordion-button:disabled{opacity:.4;pointer-events:none}.accordion-button::after{-webkit-mask-image:url(\"data:image/svg+xml,%3Csvg viewBox='0 0 32 32' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='m23.6 18.3-.9.9-6.7-6.6-6.6 6.6-.9-.9 7.5-7.6z'/%3E%3C/svg%3E\");mask-image:url(\"data:image/svg+xml,%3Csvg viewBox='0 0 32 32' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='m23.6 18.3-.9.9-6.7-6.6-6.6 6.6-.9-.9 7.5-7.6z'/%3E%3C/svg%3E\");background-color:currentColor;color:currentColor;forced-color-adjust:preserve-parent-color;content:\"\";display:block;height:1.5rem;width:1.5rem;position:absolute;inset-inline-end:1rem;inset-block-start:50%;transform:translateY(-50%);transition:transform 250ms cubic-bezier(0.4, 0, 0.2, 1)}.accordion-button.collapsed::after{transform:translateY(-50%) rotate(-180deg)}.accordion-button>.text-truncate{display:block}@media (forced-colors: active),(-ms-high-contrast: active),(-ms-high-contrast: white-on-black){.accordion-button:hover:not(:disabled),.accordion-button:focus-visible:not(:disabled){outline:2px solid Highlight}.accordion-button:disabled{opacity:1 !important}}.accordion-body{padding:.5rem 1rem 1rem;font-weight:400}.accordion-button>*,.accordion-body>:first-child{margin-block-start:0 !important}.accordion-button>*,.accordion-body>:last-child{margin-block-end:0 !important}:host{display:block}.accordion-button{cursor:pointer}.accordion-button>::slotted(.text-truncate){display:block}post-accordion-item::part(accordion-item){--post-bg-rgb:244, 243, 241}.bg-yellow post-accordion-item::part(accordion-item){--post-bg-rgb:255, 255, 255}.bg-white post-accordion-item::part(accordion-item){--post-bg-rgb:244, 243, 241}.bg-light post-accordion-item::part(accordion-item){--post-bg-rgb:255, 255, 255}.bg-gray post-accordion-item::part(accordion-item){--post-bg-rgb:255, 255, 255}.bg-dark post-accordion-item::part(accordion-item){--post-bg-rgb:255, 255, 255}.bg-black post-accordion-item::part(accordion-item){--post-bg-rgb:255, 255, 255}.bg-primary post-accordion-item::part(accordion-item){--post-bg-rgb:255, 255, 255}.bg-secondary post-accordion-item::part(accordion-item){--post-bg-rgb:255, 255, 255}.bg-success post-accordion-item::part(accordion-item){--post-bg-rgb:255, 255, 255}.bg-warning post-accordion-item::part(accordion-item){--post-bg-rgb:255, 255, 255}.bg-error post-accordion-item::part(accordion-item){--post-bg-rgb:255, 255, 255}.bg-info post-accordion-item::part(accordion-item){--post-bg-rgb:255, 255, 255}.bg-success-background post-accordion-item::part(accordion-item){--post-bg-rgb:255, 255, 255}.bg-warning-background post-accordion-item::part(accordion-item){--post-bg-rgb:255, 255, 255}.bg-error-background post-accordion-item::part(accordion-item){--post-bg-rgb:255, 255, 255}.bg-nightblue post-accordion-item::part(accordion-item){--post-bg-rgb:255, 255, 255}.bg-nightblue-bright post-accordion-item::part(accordion-item){--post-bg-rgb:255, 255, 255}.bg-petrol post-accordion-item::part(accordion-item){--post-bg-rgb:255, 255, 255}.bg-petrol-bright post-accordion-item::part(accordion-item){--post-bg-rgb:255, 255, 255}.bg-coral post-accordion-item::part(accordion-item){--post-bg-rgb:255, 255, 255}.bg-coral-bright post-accordion-item::part(accordion-item){--post-bg-rgb:255, 255, 255}.bg-olive post-accordion-item::part(accordion-item){--post-bg-rgb:255, 255, 255}.bg-olive-bright post-accordion-item::part(accordion-item){--post-bg-rgb:255, 255, 255}.bg-purple post-accordion-item::part(accordion-item){--post-bg-rgb:255, 255, 255}.bg-purple-bright post-accordion-item::part(accordion-item){--post-bg-rgb:255, 255, 255}.bg-aubergine post-accordion-item::part(accordion-item){--post-bg-rgb:255, 255, 255}.bg-aubergine-bright post-accordion-item::part(accordion-item){--post-bg-rgb:255, 255, 255}:host(:not(:first-of-type)) .accordion-item{border-block-start:0}";
|
|
8
|
+
const postAccordionItemCss = ".accordion-item,.bg-yellow .accordion-item,.bg-white .accordion-item,.bg-light .accordion-item,.bg-gray .accordion-item,.bg-dark .accordion-item,.bg-black .accordion-item,.bg-primary .accordion-item,.bg-secondary .accordion-item,.bg-success .accordion-item,.bg-warning .accordion-item,.bg-error .accordion-item,.bg-info .accordion-item,.bg-success-background .accordion-item,.bg-warning-background .accordion-item,.bg-error-background .accordion-item,post-accordion-item::part(accordion-item),.bg-yellow post-accordion-item::part(accordion-item),.bg-white post-accordion-item::part(accordion-item),.bg-light post-accordion-item::part(accordion-item),.bg-gray post-accordion-item::part(accordion-item),.bg-dark post-accordion-item::part(accordion-item),.bg-black post-accordion-item::part(accordion-item),.bg-primary post-accordion-item::part(accordion-item),.bg-secondary post-accordion-item::part(accordion-item),.bg-success post-accordion-item::part(accordion-item),.bg-warning post-accordion-item::part(accordion-item),.bg-error post-accordion-item::part(accordion-item),.bg-info post-accordion-item::part(accordion-item),.bg-success-background post-accordion-item::part(accordion-item),.bg-warning-background post-accordion-item::part(accordion-item),.bg-error-background post-accordion-item::part(accordion-item){--post-bg-opacity:1;background-color:rgba(var(--post-bg-rgb), var(--post-bg-opacity)) !important;color:var(--post-contrast-color) !important}.accordion-item,.bg-yellow .accordion-item,.bg-white .accordion-item,.bg-light .accordion-item,.bg-gray .accordion-item,.bg-dark .accordion-item,.bg-black .accordion-item,.bg-primary .accordion-item,.bg-secondary .accordion-item,.bg-success .accordion-item,.bg-warning .accordion-item,.bg-error .accordion-item,.bg-info .accordion-item,.bg-success-background .accordion-item,.bg-warning-background .accordion-item,.bg-error-background .accordion-item,post-accordion-item::part(accordion-item),.bg-yellow post-accordion-item::part(accordion-item),.bg-white post-accordion-item::part(accordion-item),.bg-light post-accordion-item::part(accordion-item),.bg-gray post-accordion-item::part(accordion-item),.bg-dark post-accordion-item::part(accordion-item),.bg-black post-accordion-item::part(accordion-item),.bg-primary post-accordion-item::part(accordion-item),.bg-secondary post-accordion-item::part(accordion-item),.bg-success post-accordion-item::part(accordion-item),.bg-warning post-accordion-item::part(accordion-item),.bg-error post-accordion-item::part(accordion-item),.bg-info post-accordion-item::part(accordion-item),.bg-success-background post-accordion-item::part(accordion-item),.bg-warning-background post-accordion-item::part(accordion-item),.bg-error-background post-accordion-item::part(accordion-item){--post-contrast-color:#000;--post-focus-color:#1976c8;--post-contrast-color-inverted:#fff;--post-gray-10:hsl(0, 0%, 90%);--post-gray-20:hsl(0, 0%, 80%);--post-gray-40:hsl(0, 0%, 60%);--post-gray-60:hsl(0, 0%, 40%);--post-gray-80:hsl(0, 0%, 20%);--post-yellow:#fc0;--post-white:#fff;--post-light:#faf9f8;--post-gray:#f4f3f1;--post-dark:hsl(0, 0%, 20%);--post-black:#000;--post-primary:hsl(0, 0%, 20%);--post-secondary:hsl(0, 0%, 40%);--post-success:#2c871d;--post-warning:#f49e00;--post-error:#a51728;--post-info:#cce4ee;--post-success-background:#c0debb;--post-warning-background:#fce2b2;--post-error-background:#ffdade;--post-contrast-color-rgb:0, 0, 0;--post-contrast-color-inverted-rgb:255, 255, 255;--post-gray-10-rgb:230, 230, 230;--post-gray-20-rgb:204, 204, 204;--post-gray-40-rgb:153, 153, 153;--post-gray-60-rgb:102, 102, 102;--post-gray-80-rgb:51, 51, 51;--post-black-alpha-10-rgba:rgba(0, 0, 0, 0.1);--post-black-alpha-20-rgba:rgba(0, 0, 0, 0.2);--post-black-alpha-40-rgba:rgba(0, 0, 0, 0.4);--post-black-alpha-60-rgba:rgba(0, 0, 0, 0.6);--post-black-alpha-80-rgba:rgba(0, 0, 0, 0.8);--post-white-alpha-10-rgba:rgba(255, 255, 255, 0.1);--post-white-alpha-20-rgba:rgba(255, 255, 255, 0.2);--post-white-alpha-40-rgba:rgba(255, 255, 255, 0.4);--post-white-alpha-60-rgba:rgba(255, 255, 255, 0.6);--post-white-alpha-80-rgba:rgba(255, 255, 255, 0.8);--post-yellow-rgb:255, 204, 0;--post-white-rgb:255, 255, 255;--post-light-rgb:250, 249, 248;--post-gray-rgb:244, 243, 241;--post-dark-rgb:51, 51, 51;--post-black-rgb:0, 0, 0;--post-primary-rgb:51, 51, 51;--post-secondary-rgb:102, 102, 102;--post-success-rgb:44, 135, 29;--post-warning-rgb:244, 158, 0;--post-error-rgb:165, 23, 40;--post-info-rgb:204, 228, 238;--post-success-background-rgb:192, 222, 187;--post-warning-background-rgb:252, 226, 178;--post-error-background-rgb:255, 218, 222}.accordion-item{border-block:2px solid #666;--post-bg-rgb:244, 243, 241}.bg-yellow .accordion-item{--post-bg-rgb:255, 255, 255}.bg-white .accordion-item{--post-bg-rgb:244, 243, 241}.bg-light .accordion-item{--post-bg-rgb:255, 255, 255}.bg-gray .accordion-item{--post-bg-rgb:255, 255, 255}.bg-dark .accordion-item{--post-bg-rgb:255, 255, 255}.bg-black .accordion-item{--post-bg-rgb:255, 255, 255}.bg-primary .accordion-item{--post-bg-rgb:255, 255, 255}.bg-secondary .accordion-item{--post-bg-rgb:255, 255, 255}.bg-success .accordion-item{--post-bg-rgb:255, 255, 255}.bg-warning .accordion-item{--post-bg-rgb:255, 255, 255}.bg-error .accordion-item{--post-bg-rgb:255, 255, 255}.bg-info .accordion-item{--post-bg-rgb:255, 255, 255}.bg-success-background .accordion-item{--post-bg-rgb:255, 255, 255}.bg-warning-background .accordion-item{--post-bg-rgb:255, 255, 255}.bg-error-background .accordion-item{--post-bg-rgb:255, 255, 255}.accordion-item+.accordion-item{border-block-start:0}.accordion-header{color:#333;font-size:1rem;font-weight:700;line-height:1.5;margin:0}.accordion-button{padding:0;overflow:visible;border:0;background:none;color:inherit;font:inherit;-webkit-user-select:none;user-select:none;appearance:button;width:100%;position:relative;padding-block:1rem;padding-inline-start:1rem;padding-inline-end:3rem;text-align:start;transition:opacity 250ms,border-color 250ms,background-color 250ms,color 250ms;outline:none}.accordion-button:focus-visible{outline:2px solid #1976c8}.accordion-button:hover{color:#000;background-color:#e6e6e6}.accordion-button:disabled{opacity:.4;pointer-events:none}.accordion-button::after{-webkit-mask-image:url(\"data:image/svg+xml,%3Csvg viewBox='0 0 32 32' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='m23.6 18.3-.9.9-6.7-6.6-6.6 6.6-.9-.9 7.5-7.6z'/%3E%3C/svg%3E\");mask-image:url(\"data:image/svg+xml,%3Csvg viewBox='0 0 32 32' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='m23.6 18.3-.9.9-6.7-6.6-6.6 6.6-.9-.9 7.5-7.6z'/%3E%3C/svg%3E\");background-color:currentColor;color:currentColor;forced-color-adjust:preserve-parent-color;content:\"\";display:block;height:1.5rem;width:1.5rem;position:absolute;inset-inline-end:1rem;inset-block-start:50%;transform:translateY(-50%);transition:transform 250ms cubic-bezier(0.4, 0, 0.2, 1)}.accordion-button.collapsed::after{transform:translateY(-50%) rotate(-180deg)}.accordion-button>.text-truncate{display:block}@media (forced-colors: active),(-ms-high-contrast: active),(-ms-high-contrast: white-on-black){.accordion-button:hover:not(:disabled),.accordion-button:focus-visible:not(:disabled){outline:2px solid Highlight}.accordion-button:disabled{opacity:1 !important}}.accordion-body{padding:.5rem 1rem 1rem;font-weight:400}.accordion-button>*,.accordion-body>:first-child{margin-block-start:0 !important}.accordion-button>*,.accordion-body>:last-child{margin-block-end:0 !important}:host{display:block}.accordion-button{cursor:pointer}.accordion-button>::slotted(.text-truncate){display:block}post-accordion-item::part(accordion-item){--post-bg-rgb:244, 243, 241}.bg-yellow post-accordion-item::part(accordion-item){--post-bg-rgb:255, 255, 255}.bg-white post-accordion-item::part(accordion-item){--post-bg-rgb:244, 243, 241}.bg-light post-accordion-item::part(accordion-item){--post-bg-rgb:255, 255, 255}.bg-gray post-accordion-item::part(accordion-item){--post-bg-rgb:255, 255, 255}.bg-dark post-accordion-item::part(accordion-item){--post-bg-rgb:255, 255, 255}.bg-black post-accordion-item::part(accordion-item){--post-bg-rgb:255, 255, 255}.bg-primary post-accordion-item::part(accordion-item){--post-bg-rgb:255, 255, 255}.bg-secondary post-accordion-item::part(accordion-item){--post-bg-rgb:255, 255, 255}.bg-success post-accordion-item::part(accordion-item){--post-bg-rgb:255, 255, 255}.bg-warning post-accordion-item::part(accordion-item){--post-bg-rgb:255, 255, 255}.bg-error post-accordion-item::part(accordion-item){--post-bg-rgb:255, 255, 255}.bg-info post-accordion-item::part(accordion-item){--post-bg-rgb:255, 255, 255}.bg-success-background post-accordion-item::part(accordion-item){--post-bg-rgb:255, 255, 255}.bg-warning-background post-accordion-item::part(accordion-item){--post-bg-rgb:255, 255, 255}.bg-error-background post-accordion-item::part(accordion-item){--post-bg-rgb:255, 255, 255}:host(:not(:first-of-type)) .accordion-item{border-block-start:0}";
|
|
9
9
|
const PostAccordionItemStyle0 = postAccordionItemCss;
|
|
10
10
|
|
|
11
11
|
const PostAccordionItem = /*@__PURE__*/ proxyCustomElement(class PostAccordionItem extends HTMLElement {
|
|
@@ -20,7 +20,7 @@ const PostAccordionItem = /*@__PURE__*/ proxyCustomElement(class PostAccordionIt
|
|
|
20
20
|
validateHeadingLevel(newValue = this.headingLevel) {
|
|
21
21
|
checkEmptyOrOneOf(newValue, HEADING_LEVELS, 'The `heading-level` property of the `post-accordion-item` must be a number between 1 and 6.');
|
|
22
22
|
}
|
|
23
|
-
|
|
23
|
+
componentDidLoad() {
|
|
24
24
|
this.validateHeadingLevel();
|
|
25
25
|
}
|
|
26
26
|
componentWillLoad() {
|
|
@@ -28,7 +28,8 @@ const PostAccordionItem = /*@__PURE__*/ proxyCustomElement(class PostAccordionIt
|
|
|
28
28
|
}
|
|
29
29
|
// capture to make sure the "collapsed" property is updated before the event is consumed
|
|
30
30
|
onCollapseToggle(event) {
|
|
31
|
-
if (event.target === this.host &&
|
|
31
|
+
if (event.target === this.host &&
|
|
32
|
+
event.target.localName === 'post-accordion-item') {
|
|
32
33
|
this.collapsed = !event.detail;
|
|
33
34
|
}
|
|
34
35
|
}
|
|
@@ -41,7 +42,7 @@ const PostAccordionItem = /*@__PURE__*/ proxyCustomElement(class PostAccordionIt
|
|
|
41
42
|
render() {
|
|
42
43
|
var _a;
|
|
43
44
|
const HeadingTag = `h${(_a = this.headingLevel) !== null && _a !== void 0 ? _a : 2}`;
|
|
44
|
-
return (h(Host, { key: '
|
|
45
|
+
return (h(Host, { key: '3d2740ab4942832231737f1c26c075f37590bf53', id: this.id, "data-version": version }, h("div", { key: 'cba3f09d50db4ad285cc20a051763e7d843ab36d', part: "accordion-item", class: "accordion-item" }, h("post-collapsible-trigger", { key: '87e7da5bfaee393fdf8423e8521448b976125daa', for: `${this.id}--collapse` }, h(HeadingTag, { key: '89d218bd032caddc6b484edab1f8d3d912c73c17', class: "accordion-header", id: `${this.id}--header` }, h("button", { key: '2f4597376234c64fec882ecdac76c2e3f541474c', type: "button", class: `accordion-button${this.collapsed ? ' collapsed' : ''}` }, h("slot", { key: '573e3a196c71548868698066c1220f56f5c39181', name: "header" })))), h("post-collapsible", { key: '6e07f4dfe240e52aad4d8e7b176ca2ec9476d605', id: `${this.id}--collapse`, collapsed: this.collapsed, ref: el => (this.collapsible = el) }, h("div", { key: 'f7f10770fbd1ae6ac867fb1ff255a303fd42c461', class: "accordion-body" }, h("slot", { key: 'dc0d49c7484481b57e7665e25761c425db3247b4' }))))));
|
|
45
46
|
}
|
|
46
47
|
get host() { return this; }
|
|
47
48
|
static get watchers() { return {
|