@swisspost/design-system-components 7.4.1 → 8.0.0
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-f32e5185.js → index-a1440961.js} +15 -2
- package/dist/cjs/{index-1cc8e4e1.js → index-baad16da.js} +8 -17
- package/dist/cjs/index.cjs.js +18 -20
- package/dist/cjs/loader.cjs.js +2 -2
- package/dist/cjs/{package-71dcbbc9.js → package-28cba29c.js} +1 -1
- package/dist/cjs/{post-accordion-2e943f0a.js → post-accordion-fc746a6f.js} +2 -2
- package/dist/cjs/{post-accordion-item-d1fcd3f9.js → post-accordion-item-c0492b73.js} +4 -4
- package/dist/cjs/post-accordion-item.cjs.entry.js +4 -5
- package/dist/cjs/post-accordion.cjs.entry.js +3 -3
- package/dist/cjs/{post-alert-966b3652.js → post-alert-0612ad51.js} +8 -9
- package/dist/cjs/post-alert.cjs.entry.js +4 -5
- package/dist/cjs/{post-card-control-e2cf1596.js → post-card-control-2fd18624.js} +4 -4
- package/dist/cjs/post-card-control.cjs.entry.js +3 -3
- package/dist/cjs/post-collapsible-trigger-8d39196e.js +206 -0
- package/dist/cjs/{post-collapsible-trigger.cjs.entry.js → post-collapsible_2.cjs.entry.js} +7 -5
- package/dist/cjs/post-components.cjs.js +3 -3
- package/dist/cjs/{post-icon-6985373c.js → post-icon-bd260560.js} +5 -6
- package/dist/cjs/post-icon.cjs.entry.js +4 -5
- package/dist/cjs/{post-popover-1282c9b2.js → post-popover-303e76ef.js} +3 -3
- package/dist/cjs/post-popover.cjs.entry.js +3 -3
- package/dist/cjs/{post-popovercontainer-776f4985.js → post-popovercontainer-c64bde39.js} +8 -9
- package/dist/cjs/post-popovercontainer.cjs.entry.js +3 -3
- package/dist/cjs/{post-rating-98917b60.js → post-rating-dc7bd246.js} +3 -3
- package/dist/cjs/post-rating.cjs.entry.js +3 -3
- package/dist/cjs/{post-tab-header-63ea6bb6.js → post-tab-header-06c40218.js} +3 -3
- package/dist/cjs/post-tab-header.cjs.entry.js +3 -3
- package/dist/cjs/{post-tab-panel-01d55249.js → post-tab-panel-54fbdb66.js} +3 -3
- package/dist/cjs/post-tab-panel.cjs.entry.js +3 -3
- package/dist/cjs/{post-tabs-7ec0c376.js → post-tabs-52b9d638.js} +3 -3
- package/dist/cjs/post-tabs.cjs.entry.js +3 -3
- package/dist/cjs/{post-tag-92eaefd1.js → post-tag-4aba2155.js} +3 -3
- package/dist/cjs/post-tag.cjs.entry.js +3 -3
- package/dist/cjs/{post-tooltip-69ba6116.js → post-tooltip-3c695f60.js} +4 -4
- package/dist/cjs/post-tooltip.cjs.entry.js +4 -5
- package/dist/collection/collection-manifest.json +1 -1
- package/dist/collection/components/post-accordion-item/post-accordion-item.js +1 -1
- package/dist/collection/components/post-alert/post-alert.js +3 -3
- package/dist/collection/components/post-card-control/post-card-control.js +2 -2
- package/dist/collection/components/post-collapsible/post-collapsible.js +1 -1
- package/dist/collection/components/post-collapsible-trigger/post-collapsible-trigger.js +14 -19
- package/dist/collection/components/post-icon/post-icon.js +1 -1
- package/dist/collection/components/post-popover/post-popover.js +2 -2
- package/dist/collection/components/post-popovercontainer/post-popovercontainer.js +3 -3
- 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 +2 -2
- package/dist/collection/utils/get-root.js +7 -0
- package/dist/collection/utils/index.js +1 -0
- package/dist/components/package.js +1 -1
- package/dist/components/post-accordion-item2.js +9 -3
- package/dist/components/post-alert2.js +3 -3
- package/dist/components/post-card-control2.js +2 -2
- package/dist/components/post-collapsible-trigger2.js +22 -10
- package/dist/components/post-collapsible2.js +1 -1
- package/dist/components/post-icon2.js +1 -1
- package/dist/components/post-popover2.js +1 -1
- package/dist/components/post-popovercontainer2.js +6 -7
- 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 +18 -17
- package/dist/esm/{index-9ace3232.js → index-189d3985.js} +8 -17
- package/dist/esm/{index-29d17d6d.js → index-d1eba94c.js} +14 -2
- package/dist/esm/index.js +17 -19
- package/dist/esm/loader.js +3 -3
- package/dist/esm/{package-130b6199.js → package-3e4546f5.js} +1 -1
- package/dist/esm/{post-accordion-01612666.js → post-accordion-1cbd089a.js} +2 -2
- package/dist/esm/{post-accordion-item-e2e83306.js → post-accordion-item-316ee985.js} +4 -4
- package/dist/esm/post-accordion-item.entry.js +4 -5
- package/dist/esm/post-accordion.entry.js +3 -3
- package/dist/esm/{post-alert-e7b70927.js → post-alert-6fa442b9.js} +6 -7
- package/dist/esm/post-alert.entry.js +4 -5
- package/dist/esm/{post-card-control-262467c4.js → post-card-control-41356aa4.js} +4 -4
- package/dist/esm/post-card-control.entry.js +3 -3
- package/dist/esm/post-collapsible-trigger-6f4ba350.js +203 -0
- package/dist/esm/post-collapsible_2.entry.js +7 -0
- package/dist/esm/post-components.js +4 -4
- package/dist/esm/{post-icon-46602aa6.js → post-icon-fe467f6a.js} +4 -5
- package/dist/esm/post-icon.entry.js +4 -5
- package/dist/esm/{post-popover-927903a2.js → post-popover-c9998136.js} +3 -3
- package/dist/esm/post-popover.entry.js +3 -3
- package/dist/esm/{post-popovercontainer-348970cd.js → post-popovercontainer-62ced3d7.js} +8 -9
- package/dist/esm/post-popovercontainer.entry.js +3 -3
- package/dist/esm/{post-rating-a1832399.js → post-rating-49ace0e9.js} +3 -3
- package/dist/esm/post-rating.entry.js +3 -3
- package/dist/esm/{post-tab-header-9d6e4d52.js → post-tab-header-696a7aae.js} +3 -3
- package/dist/esm/post-tab-header.entry.js +3 -3
- package/dist/esm/{post-tab-panel-0870e77c.js → post-tab-panel-c00910fb.js} +3 -3
- package/dist/esm/post-tab-panel.entry.js +3 -3
- package/dist/esm/{post-tabs-3b8719a9.js → post-tabs-a7990c9e.js} +3 -3
- package/dist/esm/post-tabs.entry.js +3 -3
- package/dist/esm/{post-tag-695a9337.js → post-tag-d9650103.js} +3 -3
- package/dist/esm/post-tag.entry.js +3 -3
- package/dist/esm/{post-tooltip-8486e928.js → post-tooltip-cf07e816.js} +4 -4
- package/dist/esm/post-tooltip.entry.js +4 -5
- package/dist/post-components/index.esm.js +1 -1
- package/dist/post-components/p-0aee269b.entry.js +1 -0
- package/dist/post-components/p-2240981f.entry.js +1 -0
- package/dist/post-components/{p-b91ff66f.js → p-266adbdd.js} +1 -1
- package/dist/post-components/p-27cb2e60.entry.js +1 -0
- package/dist/post-components/p-2c9277b1.entry.js +1 -0
- package/dist/post-components/p-3764a23a.entry.js +1 -0
- package/dist/post-components/{p-33dd9887.js → p-382f85c4.js} +1 -1
- package/dist/post-components/p-48ed21f0.entry.js +1 -0
- package/dist/post-components/p-496cee95.entry.js +1 -0
- package/dist/post-components/p-4ce46830.entry.js +1 -0
- package/dist/post-components/p-5135c965.entry.js +1 -0
- package/dist/post-components/{p-458d8198.js → p-5c4773cb.js} +2 -2
- package/dist/post-components/p-660ecc23.js +1 -0
- package/dist/post-components/p-69145fd2.js +1 -0
- package/dist/post-components/p-6af42a67.entry.js +1 -0
- package/dist/post-components/{p-48fcde73.js → p-6c701d9f.js} +1 -1
- package/dist/post-components/p-7095990e.js +1 -0
- package/dist/post-components/p-7481e37a.entry.js +1 -0
- package/dist/post-components/{p-feb6ff21.js → p-783e67bc.js} +1 -1
- package/dist/post-components/p-8f0ee57c.entry.js +1 -0
- package/dist/post-components/p-90479234.js +1 -0
- package/dist/post-components/p-a4794190.js +1 -0
- package/dist/post-components/{p-a747b0b7.js → p-a4e13e9c.js} +1 -1
- package/dist/post-components/{p-c6e4522d.js → p-ab26873d.js} +1 -1
- package/dist/post-components/p-b08aca79.entry.js +1 -0
- package/dist/post-components/p-beb27e06.js +1 -0
- package/dist/post-components/{p-8c7f0075.js → p-c0f265c8.js} +2 -2
- package/dist/post-components/{p-acec5895.js → p-e024aa18.js} +1 -1
- package/dist/post-components/p-ea063aae.entry.js +1 -0
- package/dist/post-components/p-f732d73c.js +1 -0
- package/dist/post-components/p-f91c0e1b.js +1 -0
- package/dist/post-components/post-components.esm.js +1 -1
- package/dist/types/components/post-collapsible-trigger/post-collapsible-trigger.d.ts +6 -5
- package/dist/types/utils/get-root.d.ts +1 -0
- package/dist/types/utils/index.d.ts +1 -0
- package/package.json +10 -10
- package/dist/cjs/check-type-64af82a9.js +0 -16
- package/dist/cjs/post-collapsible-cff3bb05.js +0 -85
- package/dist/cjs/post-collapsible-trigger-e5616d29.js +0 -115
- package/dist/cjs/post-collapsible.cjs.entry.js +0 -15
- package/dist/esm/check-type-8828dbe4.js +0 -14
- package/dist/esm/post-collapsible-301ba5ad.js +0 -83
- package/dist/esm/post-collapsible-trigger-964d5490.js +0 -113
- package/dist/esm/post-collapsible-trigger.entry.js +0 -6
- package/dist/esm/post-collapsible.entry.js +0 -7
- package/dist/post-components/p-0026e697.js +0 -1
- package/dist/post-components/p-3d1fd819.js +0 -1
- package/dist/post-components/p-4806190f.entry.js +0 -1
- package/dist/post-components/p-49100c44.js +0 -1
- package/dist/post-components/p-4a3f67ab.js +0 -1
- package/dist/post-components/p-50fdd908.js +0 -1
- package/dist/post-components/p-51bb8d8c.entry.js +0 -1
- package/dist/post-components/p-5bfe2065.entry.js +0 -1
- package/dist/post-components/p-5cdfdfed.entry.js +0 -1
- package/dist/post-components/p-627e0231.js +0 -1
- package/dist/post-components/p-6cac6cc0.entry.js +0 -1
- package/dist/post-components/p-6f325f35.entry.js +0 -1
- package/dist/post-components/p-7755c753.entry.js +0 -1
- package/dist/post-components/p-811910a2.js +0 -1
- package/dist/post-components/p-8386ab9c.js +0 -1
- package/dist/post-components/p-8dc5e169.entry.js +0 -1
- package/dist/post-components/p-9828b437.js +0 -1
- package/dist/post-components/p-ac500761.js +0 -1
- package/dist/post-components/p-b1b2f9ee.entry.js +0 -1
- package/dist/post-components/p-bb764dd3.entry.js +0 -1
- package/dist/post-components/p-bdc9668f.entry.js +0 -1
- package/dist/post-components/p-c860a676.entry.js +0 -1
- package/dist/post-components/p-e1456b01.entry.js +0 -1
- package/dist/post-components/p-f31d7fcb.entry.js +0 -1
- package/dist/post-components/p-f52a3908.entry.js +0 -1
|
@@ -0,0 +1 @@
|
|
|
1
|
+
export{P as post_tab_header}from"./p-ab26873d.js";import"./p-c0f265c8.js";import"./p-90479234.js";import"./p-b095519d.js";import"./p-440193f4.js";
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
import{r as i,h as t,H as a,g as e}from"./p-c0f265c8.js";import{c as o,d as n,a as s}from"./p-f91c0e1b.js";import{v as r}from"./p-90479234.js";import{c as l}from"./p-b095519d.js";const m=["cylon","cylon-vertical","spin","spin-reverse","fade","throb"],c=class{constructor(t){i(this,t),this.svgStyles=void 0,this.svgOutput=void 0,this.animation=null,this.base=null,this.flipH=!1,this.flipV=!1,this.name=void 0,this.rotate=null,this.scale=null}validateAnimation(i=this.animation){void 0!==i&&o(i,m,`The post-icon "animation" prop requires one of the following values: ${m.join(", ")}.`)}validateBase(i=this.base){n(i,"string",'The post-icon "base" prop should be a string.')}validateFlipH(i=this.flipH){n(i,"boolean",'The post-icon "flipH" prop should be a boolean.')}validateFlipV(i=this.flipV){n(i,"boolean",'The post-icon "flipV" prop should be a boolean.')}validateName(i=this.name){l(i,'The post-icon "name" prop is required!.'),s(i,"string",'The post-icon "name" prop should be a string.')}validateRotate(i=this.rotate){n(i,"number",'The post-icon "rotate" prop should be a number.')}validateScale(i=this.scale){n(i,"number",'The post-icon "scale" prop should be a number.')}componentWillLoad(){this.validateBase(),this.validateName(),this.validateFlipH(),this.validateFlipV(),this.validateScale(),this.validateRotate(),this.validateAnimation()}componentWillRender(){this.setPath()}setPath(){var i,t,a,e;const o=null!==(t=null===(i=document.head.querySelector('meta[name="design-system-settings"][data-post-icon-base]'))||void 0===i?void 0:i.getAttribute("data-post-icon-base"))&&void 0!==t?t:null,n=`${null!==(e=null!==(a=this.base)&&void 0!==a?a:o)&&void 0!==e?e:"https://unpkg.com/@swisspost/design-system-icons/public/post-icons"}/`.replace(/\/\/$/,"/");this.path=new URL(`${n}${this.name}.svg`,window.location.origin).toString()}render(){const i=Object.entries({"-webkit-mask-image":`url('${this.path}')`,"mask-image":`url('${this.path}')`,transform:(this.scale&&!isNaN(Number(this.scale))?"scale("+this.scale+")":"")+(this.rotate&&!isNaN(Number(this.rotate))?" rotate("+this.rotate+"deg)":"")}).filter((([i,t])=>null!==t)).reduce(((i,[t,a])=>Object.assign(i,{[t]:a})),{});return t(a,{key:"95fa0f7a09d3430bb5d621e01b57188742920eb4","data-version":r},t("span",{key:"c824e3705dc83665bb6f7649381654e6d1e07dfb",style:i}))}get host(){return e(this)}static get watchers(){return{animation:["validateAnimation"],base:["validateBase"],flipH:["validateFlipH"],flipV:["validateFlipV"],name:["validateName"],rotate:["validateRotate"],scale:["validateScale"]}}};c.style=":host{display:inline-block;width:1em;height:1em;vertical-align:-0.15em}span{display:block;width:100%;height:100%;fill:currentColor;forced-color-adjust:preserve-parent-color;background-color:currentColor;-webkit-mask-position:center center;mask-position:center center;-webkit-mask-repeat:no-repeat;mask-repeat:no-repeat;-webkit-mask-size:100%;mask-size:100%}:host([flip-h]:not([flip-h=false])){scale:-1 1}:host([flip-v]:not([flip-v=false])){scale:1 -1}:host([flip-h][flip-v]:not([flip-h=false],[flip-v=false])){scale:-1}:host([animation]){transform-origin:center}:host([animation=cylon]){animation:icon-animation-cylon .75s ease-in-out infinite alternate}:host([animation=cylon-vertical]){animation:icon-animation-cylon-vertical .75s ease-in-out infinite alternate}:host([animation=spin]){animation:icon-animation-spin 2s linear infinite normal}:host([animation=spin-reverse]){animation:icon-animation-spin 2s linear infinite reverse}:host([animation=fade]){animation:icon-animation-fade .75s ease-in-out infinite alternate}:host([animation=throb]){animation:icon-animation-throb .75s ease-in-out infinite alternate}@keyframes icon-animation-cylon{from{transform:translateX(-25%)}to{transform:translateX(25%)}}@keyframes icon-animation-cylon-vertical{from{transform:translateY(25%)}to{transform:translateY(-25%)}}@keyframes icon-animation-fade{from{opacity:.1}to{opacity:1}}@keyframes icon-animation-spin{from{transform:rotate(0deg)}to{transform:rotate(359deg)}}@keyframes icon-animation-throb{from{opacity:.5;transform:scale(0.5)}to{opacity:1;transform:scale(1)}}";export{c as P}
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
import{E as r}from"./p-440193f4.js";import{c as o}from"./p-611b3c41.js";function t(o){return(...t)=>{const n=t[0];r.some((r=>r===n))||o(...t)}}function n(r,o,t){const n="array"===o,s=Array.isArray(r);if(n||s){if(s!==n)throw new Error(t)}else if(typeof r!==o)throw new Error(t)}const s=t(o),f=t((function(r,o,t){if("string"!=typeof r||!o.test(r))throw new Error(t)})),a=t(n);export{n as a,f as b,s as c,a as d}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
import{p as e,b as a}from"./p-
|
|
1
|
+
import{p as e,b as a}from"./p-c0f265c8.js";export{s as setNonce}from"./p-c0f265c8.js";import{g as l}from"./p-e1255160.js";(()=>{const a=import.meta.url,l={};return""!==a&&(l.resourcesUrl=new URL(".",a).href),e(l)})().then((async e=>(await l(),a([["p-4ce46830",[[1,"post-accordion-item",{collapsed:[1028],headingLevel:[2,"heading-level"],id:[32],toggle:[64]},[[2,"postToggle","onCollapseToggle"]],{headingLevel:["validateHeadingLevel"]}]]],["p-2c9277b1",[[1,"post-alert",{dismissible:[4],dismissLabel:[1,"dismiss-label"],fixed:[4],icon:[1],type:[1],alertId:[32],classes:[32],hasActions:[32],hasHeading:[32],onDismissButtonClick:[32],dismiss:[64]},null,{dismissible:["validateDismissible"],dismissLabel:["validateDismissLabel"],fixed:["validateFixed"],icon:["validateIcon"],type:["validateType"]}]]],["p-5135c965",[[65,"post-card-control",{label:[1],description:[1],type:[1],name:[1],value:[1],checked:[1028],disabled:[1028],validity:[1025],icon:[1],focused:[32],reset:[64],groupReset:[64]},null,{label:["validateControlLabel"],type:["validateControlType"],checked:["updateControlChecked"],disabled:["updateControlDisbled"]}]]],["p-48ed21f0",[[4,"post-popovercontainer",{placement:[1],arrow:[4],show:[64],hide:[64],toggle:[64]}]]],["p-2240981f",[[1,"post-popover",{placement:[1],closeButtonCaption:[1,"close-button-caption"],arrow:[4],show:[64],hide:[64],toggle:[64]}]]],["p-27cb2e60",[[1,"post-icon",{animation:[1],base:[1],flipH:[4,"flip-h"],flipV:[4,"flip-v"],name:[1],rotate:[2],scale:[2],svgStyles:[32],svgOutput:[32]},null,{animation:["validateAnimation"],base:["validateBase"],flipH:["validateFlipH"],flipV:["validateFlipV"],name:["validateName"],rotate:["validateRotate"],scale:["validateScale"]}]]],["p-6af42a67",[[1,"post-rating",{label:[1],stars:[2],currentRating:[1026,"current-rating"],readonly:[4],hoveredIndex:[32]}]]],["p-3764a23a",[[1,"post-tag",{variant:[1],size:[1],icon:[1],classes:[32]},null,{variant:["variantChanged"],size:["sizeChanged"]}]]],["p-b08aca79",[[1,"post-tooltip",{placement:[1],arrow:[4],delayed:[4],show:[64],hide:[64],toggle:[64]},null,{delayed:["validateDelayed"]}]]],["p-7481e37a",[[1,"post-accordion",{headingLevel:[2,"heading-level"],multiple:[4],toggle:[64],expandAll:[64],collapseAll:[64]},[[0,"postToggle","collapseToggleHandler"]],{headingLevel:["validateHeadingLevel"]}]]],["p-ea063aae",[[1,"post-tab-header",{panel:[1],tabId:[32]},null,{panel:["validateFor"]}]]],["p-0aee269b",[[1,"post-tab-panel",{name:[1],panelId:[32]}]]],["p-8f0ee57c",[[1,"post-tabs",{activePanel:[1,"active-panel"],show:[64]}]]],["p-496cee95",[[1,"post-collapsible",{collapsed:[1028],toggle:[64]},null,{collapsed:["collapsedChange"]}],[0,"post-collapsible-trigger",{for:[1],update:[64]},null,{for:["setAriaAttributes"]}]]]],e))));
|
|
@@ -1,7 +1,7 @@
|
|
|
1
|
-
import { PostCollapsibleCustomEvent } from "../../components";
|
|
2
1
|
export declare class PostCollapsibleTrigger {
|
|
3
2
|
private trigger?;
|
|
4
3
|
private observer;
|
|
4
|
+
private root?;
|
|
5
5
|
host: HTMLPostCollapsibleTriggerElement;
|
|
6
6
|
/**
|
|
7
7
|
* Link the trigger to a post-collapsible with this id
|
|
@@ -15,6 +15,11 @@ export declare class PostCollapsibleTrigger {
|
|
|
15
15
|
* Initiate a mutation observer that updates the trigger whenever necessary
|
|
16
16
|
*/
|
|
17
17
|
connectedCallback(): void;
|
|
18
|
+
/**
|
|
19
|
+
* Attach a "postToggle" event listener to the root node
|
|
20
|
+
* to update the trigger's "aria-expanded" attribute whenever the controlled post-collapsible is toggled
|
|
21
|
+
*/
|
|
22
|
+
componentWillLoad(): void;
|
|
18
23
|
/**
|
|
19
24
|
* Add the "data-version" to the host element and set the trigger
|
|
20
25
|
*/
|
|
@@ -23,10 +28,6 @@ export declare class PostCollapsibleTrigger {
|
|
|
23
28
|
* Disconnect the mutation observer
|
|
24
29
|
*/
|
|
25
30
|
disconnectedCallback(): void;
|
|
26
|
-
/**
|
|
27
|
-
* Update the "aria-expanded" attribute on the trigger anytime the controlled post-collapsible is toggled
|
|
28
|
-
*/
|
|
29
|
-
setAriaExpanded(e: PostCollapsibleCustomEvent<boolean>): void;
|
|
30
31
|
/**
|
|
31
32
|
* Update the "aria-controls" and "aria-expanded" attributes on the trigger button
|
|
32
33
|
*/
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
export declare function getRoot(element: HTMLElement): Document | ShadowRoot;
|
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@swisspost/design-system-components",
|
|
3
|
-
"version": "
|
|
3
|
+
"version": "8.0.0",
|
|
4
4
|
"description": "A collection of web components built with Stencil JS for the Swiss Post Design System.",
|
|
5
5
|
"license": "Apache-2.0",
|
|
6
6
|
"main": "dist/index.cjs.js",
|
|
@@ -23,34 +23,34 @@
|
|
|
23
23
|
"linkDirectory": true
|
|
24
24
|
},
|
|
25
25
|
"dependencies": {
|
|
26
|
-
"@floating-ui/dom": "1.6.
|
|
26
|
+
"@floating-ui/dom": "1.6.8",
|
|
27
27
|
"@oddbird/popover-polyfill": "0.3.7",
|
|
28
|
-
"@swisspost/design-system-styles": "
|
|
28
|
+
"@swisspost/design-system-styles": "8.0.0",
|
|
29
29
|
"ally.js": "1.4.1",
|
|
30
30
|
"long-press-event": "2.5.0"
|
|
31
31
|
},
|
|
32
32
|
"devDependencies": {
|
|
33
|
-
"@percy/cli": "1.
|
|
33
|
+
"@percy/cli": "1.29.0",
|
|
34
34
|
"@percy/cypress": "3.1.2",
|
|
35
35
|
"@stencil-community/eslint-plugin": "0.7.2",
|
|
36
36
|
"@stencil/angular-output-target": "0.8.4",
|
|
37
|
-
"@stencil/core": "4.19.
|
|
37
|
+
"@stencil/core": "4.19.2",
|
|
38
38
|
"@stencil/react-output-target": "0.5.3",
|
|
39
39
|
"@stencil/sass": "3.0.12",
|
|
40
40
|
"@types/jest": "29.5.12",
|
|
41
|
-
"@types/node": "20.14.
|
|
41
|
+
"@types/node": "20.14.11",
|
|
42
42
|
"@typescript-eslint/eslint-plugin": "5.62.0",
|
|
43
43
|
"@typescript-eslint/parser": "5.62.0",
|
|
44
44
|
"bootstrap": "5.3.3",
|
|
45
|
-
"cypress": "13.13.
|
|
45
|
+
"cypress": "13.13.1",
|
|
46
46
|
"cypress-axe": "1.5.0",
|
|
47
47
|
"cypress-storybook": "1.0.0",
|
|
48
48
|
"eslint": "8.57.0",
|
|
49
|
-
"eslint-plugin-react": "7.
|
|
49
|
+
"eslint-plugin-react": "7.35.0",
|
|
50
50
|
"rimraf": "6.0.1",
|
|
51
51
|
"rollup-plugin-postcss": "4.0.2",
|
|
52
|
-
"sass": "1.77.
|
|
53
|
-
"ts-jest": "29.
|
|
52
|
+
"sass": "1.77.8",
|
|
53
|
+
"ts-jest": "29.2.3",
|
|
54
54
|
"typescript": "5.3.3"
|
|
55
55
|
},
|
|
56
56
|
"keywords": [
|
|
@@ -1,16 +0,0 @@
|
|
|
1
|
-
'use strict';
|
|
2
|
-
|
|
3
|
-
function checkType(value, type, error) {
|
|
4
|
-
const typeIsArray = type === 'array';
|
|
5
|
-
const valueIsArray = Array.isArray(value);
|
|
6
|
-
if (typeIsArray || valueIsArray) {
|
|
7
|
-
if (valueIsArray !== typeIsArray)
|
|
8
|
-
throw new Error(error);
|
|
9
|
-
}
|
|
10
|
-
else {
|
|
11
|
-
if (typeof value !== type)
|
|
12
|
-
throw new Error(error);
|
|
13
|
-
}
|
|
14
|
-
}
|
|
15
|
-
|
|
16
|
-
exports.checkType = checkType;
|
|
@@ -1,85 +0,0 @@
|
|
|
1
|
-
'use strict';
|
|
2
|
-
|
|
3
|
-
const index = require('./index-1cc8e4e1.js');
|
|
4
|
-
const _package = require('./package-71dcbbc9.js');
|
|
5
|
-
const index$1 = require('./index-f32e5185.js');
|
|
6
|
-
|
|
7
|
-
function isMotionReduced() {
|
|
8
|
-
return window.matchMedia('(prefers-reduced-motion: reduce)').matches;
|
|
9
|
-
}
|
|
10
|
-
|
|
11
|
-
const collapseDuration = 350;
|
|
12
|
-
const collapseEasing = 'ease';
|
|
13
|
-
const collapsedKeyframe = { height: '0', overflow: 'hidden' };
|
|
14
|
-
const animationOptions = {
|
|
15
|
-
duration: collapseDuration,
|
|
16
|
-
easing: collapseEasing,
|
|
17
|
-
fill: 'forwards',
|
|
18
|
-
};
|
|
19
|
-
const collapse = (el) => {
|
|
20
|
-
const expandedKeyframe = { height: window.getComputedStyle(el).height };
|
|
21
|
-
return el.animate([expandedKeyframe, collapsedKeyframe], animationOptions);
|
|
22
|
-
};
|
|
23
|
-
const expand = (el) => {
|
|
24
|
-
const expandedKeyframe = { height: `${el.scrollHeight}px`, offset: 1 };
|
|
25
|
-
const finalKeyframe = { height: 'auto' };
|
|
26
|
-
return el.animate([collapsedKeyframe, expandedKeyframe, finalKeyframe], animationOptions);
|
|
27
|
-
};
|
|
28
|
-
|
|
29
|
-
const postCollapsibleCss = ":host{display:block;overflow:hidden}";
|
|
30
|
-
const PostCollapsibleStyle0 = postCollapsibleCss;
|
|
31
|
-
|
|
32
|
-
const PostCollapsible = class {
|
|
33
|
-
constructor(hostRef) {
|
|
34
|
-
index.registerInstance(this, hostRef);
|
|
35
|
-
this.postToggle = index.createEvent(this, "postToggle", 7);
|
|
36
|
-
this.isLoaded = false;
|
|
37
|
-
this.isOpen = true;
|
|
38
|
-
this.collapsed = false;
|
|
39
|
-
}
|
|
40
|
-
collapsedChange() {
|
|
41
|
-
index$1.checkEmptyOrType(this.collapsed, 'boolean', 'The `collapsed` property of the `post-collapsible` must be a boolean.');
|
|
42
|
-
void this.toggle(!this.collapsed);
|
|
43
|
-
}
|
|
44
|
-
componentDidLoad() {
|
|
45
|
-
this.collapsedChange();
|
|
46
|
-
this.isLoaded = true;
|
|
47
|
-
this.updateTriggers();
|
|
48
|
-
}
|
|
49
|
-
/**
|
|
50
|
-
* Triggers the collapse programmatically.
|
|
51
|
-
*
|
|
52
|
-
* If there is a collapsing transition running already, it will be reversed.
|
|
53
|
-
*/
|
|
54
|
-
async toggle(open = !this.isOpen) {
|
|
55
|
-
if (open === this.isOpen)
|
|
56
|
-
return open;
|
|
57
|
-
this.isOpen = open;
|
|
58
|
-
this.collapsed = !open;
|
|
59
|
-
if (this.isLoaded)
|
|
60
|
-
this.postToggle.emit(open);
|
|
61
|
-
const animation = open ? expand(this.host) : collapse(this.host);
|
|
62
|
-
if (!this.isLoaded || isMotionReduced())
|
|
63
|
-
animation.finish();
|
|
64
|
-
await animation.finished;
|
|
65
|
-
animation.commitStyles();
|
|
66
|
-
return open;
|
|
67
|
-
}
|
|
68
|
-
/**
|
|
69
|
-
* Update all post-collapsible-trigger elements referring to the collapsible
|
|
70
|
-
*/
|
|
71
|
-
updateTriggers() {
|
|
72
|
-
const triggers = document.querySelectorAll(`post-collapsible-trigger[for=${this.host.id}]`);
|
|
73
|
-
triggers.forEach(trigger => trigger.update());
|
|
74
|
-
}
|
|
75
|
-
render() {
|
|
76
|
-
return (index.h(index.Host, { key: 'b86f11ba3139c76bb077ef9f634afaaf7ab62ef5', "data-version": _package.version }, index.h("slot", { key: '0f3a8275a8c6a41bfa97b59ee567c3c0da8e84d0' })));
|
|
77
|
-
}
|
|
78
|
-
get host() { return index.getElement(this); }
|
|
79
|
-
static get watchers() { return {
|
|
80
|
-
"collapsed": ["collapsedChange"]
|
|
81
|
-
}; }
|
|
82
|
-
};
|
|
83
|
-
PostCollapsible.style = PostCollapsibleStyle0;
|
|
84
|
-
|
|
85
|
-
exports.PostCollapsible = PostCollapsible;
|
|
@@ -1,115 +0,0 @@
|
|
|
1
|
-
'use strict';
|
|
2
|
-
|
|
3
|
-
const index = require('./index-1cc8e4e1.js');
|
|
4
|
-
const _package = require('./package-71dcbbc9.js');
|
|
5
|
-
const checkType = require('./check-type-64af82a9.js');
|
|
6
|
-
const checkNonEmpty = require('./check-non-empty-eeaa8f77.js');
|
|
7
|
-
|
|
8
|
-
function debounce(callback, timeout = 200) {
|
|
9
|
-
let id;
|
|
10
|
-
return (...args) => {
|
|
11
|
-
if (id)
|
|
12
|
-
clearTimeout(id);
|
|
13
|
-
id = setTimeout(callback, timeout, ...args);
|
|
14
|
-
};
|
|
15
|
-
}
|
|
16
|
-
|
|
17
|
-
const PostCollapsibleTrigger = class {
|
|
18
|
-
constructor(hostRef) {
|
|
19
|
-
index.registerInstance(this, hostRef);
|
|
20
|
-
this.observer = new MutationObserver(() => this.setTrigger());
|
|
21
|
-
this.debouncedUpdate = debounce(() => {
|
|
22
|
-
var _a;
|
|
23
|
-
if (!this.trigger)
|
|
24
|
-
return;
|
|
25
|
-
// add the provided id to the aria-controls list
|
|
26
|
-
const ariaControls = this.trigger.getAttribute('aria-controls');
|
|
27
|
-
if (!(ariaControls === null || ariaControls === void 0 ? void 0 : ariaControls.includes(this.for))) {
|
|
28
|
-
const newAriaControls = ariaControls ? `${ariaControls} ${this.for}` : this.for;
|
|
29
|
-
this.trigger.setAttribute('aria-controls', newAriaControls);
|
|
30
|
-
}
|
|
31
|
-
// set the aria-expanded to `false` if the controlled collapsible is collapsed or undefined, set it to `true` otherwise
|
|
32
|
-
const isCollapsed = (_a = this.collapsible) === null || _a === void 0 ? void 0 : _a.collapsed;
|
|
33
|
-
const newAriaExpanded = isCollapsed !== undefined ? !isCollapsed : undefined;
|
|
34
|
-
this.trigger.setAttribute('aria-expanded', `${newAriaExpanded}`);
|
|
35
|
-
});
|
|
36
|
-
this.for = undefined;
|
|
37
|
-
}
|
|
38
|
-
/**
|
|
39
|
-
* Set the "aria-controls" and "aria-expanded" attributes on the trigger to match the state of the controlled post-collapsible
|
|
40
|
-
*/
|
|
41
|
-
setAriaAttributes() {
|
|
42
|
-
checkNonEmpty.checkNonEmpty(this.for, 'The post-collapsible-trigger "for" prop is required.');
|
|
43
|
-
checkType.checkType(this.for, 'string', 'The post-collapsible-trigger "for" prop should be a id.');
|
|
44
|
-
void this.update();
|
|
45
|
-
}
|
|
46
|
-
/**
|
|
47
|
-
* Initiate a mutation observer that updates the trigger whenever necessary
|
|
48
|
-
*/
|
|
49
|
-
connectedCallback() {
|
|
50
|
-
this.observer.observe(this.host, { childList: true, subtree: true });
|
|
51
|
-
}
|
|
52
|
-
/**
|
|
53
|
-
* Add the "data-version" to the host element and set the trigger
|
|
54
|
-
*/
|
|
55
|
-
componentDidLoad() {
|
|
56
|
-
this.host.setAttribute('data-version', _package.version);
|
|
57
|
-
this.setTrigger();
|
|
58
|
-
if (!this.trigger)
|
|
59
|
-
console.warn('The post-collapsible-trigger must contain a button.');
|
|
60
|
-
}
|
|
61
|
-
/**
|
|
62
|
-
* Disconnect the mutation observer
|
|
63
|
-
*/
|
|
64
|
-
disconnectedCallback() {
|
|
65
|
-
this.observer.disconnect();
|
|
66
|
-
}
|
|
67
|
-
/**
|
|
68
|
-
* Update the "aria-expanded" attribute on the trigger anytime the controlled post-collapsible is toggled
|
|
69
|
-
*/
|
|
70
|
-
setAriaExpanded(e) {
|
|
71
|
-
if (!this.trigger || !e.target.isEqualNode(this.collapsible))
|
|
72
|
-
return;
|
|
73
|
-
this.trigger.setAttribute('aria-expanded', `${e.detail}`);
|
|
74
|
-
}
|
|
75
|
-
/**
|
|
76
|
-
* Update the "aria-controls" and "aria-expanded" attributes on the trigger button
|
|
77
|
-
*/
|
|
78
|
-
async update() {
|
|
79
|
-
this.debouncedUpdate();
|
|
80
|
-
}
|
|
81
|
-
/**
|
|
82
|
-
* Toggle the post-collapsible controlled by the trigger
|
|
83
|
-
*/
|
|
84
|
-
async toggleCollapsible() {
|
|
85
|
-
var _a;
|
|
86
|
-
await ((_a = this.collapsible) === null || _a === void 0 ? void 0 : _a.toggle());
|
|
87
|
-
}
|
|
88
|
-
/**
|
|
89
|
-
* Retrieve the post-collapsible controlled by the trigger
|
|
90
|
-
*/
|
|
91
|
-
get collapsible() {
|
|
92
|
-
const ref = document.getElementById(this.for);
|
|
93
|
-
if (ref && ref.localName === 'post-collapsible') {
|
|
94
|
-
return ref;
|
|
95
|
-
}
|
|
96
|
-
return null;
|
|
97
|
-
}
|
|
98
|
-
/**
|
|
99
|
-
* Find the button and add the proper event listener and ARIA attributes to it
|
|
100
|
-
*/
|
|
101
|
-
setTrigger() {
|
|
102
|
-
const trigger = this.host.querySelector('button');
|
|
103
|
-
if (!trigger || (this.trigger && trigger.isEqualNode(this.trigger)))
|
|
104
|
-
return;
|
|
105
|
-
this.trigger = trigger;
|
|
106
|
-
this.trigger.addEventListener('click', () => this.toggleCollapsible());
|
|
107
|
-
this.setAriaAttributes();
|
|
108
|
-
}
|
|
109
|
-
get host() { return index.getElement(this); }
|
|
110
|
-
static get watchers() { return {
|
|
111
|
-
"for": ["setAriaAttributes"]
|
|
112
|
-
}; }
|
|
113
|
-
};
|
|
114
|
-
|
|
115
|
-
exports.PostCollapsibleTrigger = PostCollapsibleTrigger;
|
|
@@ -1,15 +0,0 @@
|
|
|
1
|
-
'use strict';
|
|
2
|
-
|
|
3
|
-
Object.defineProperty(exports, '__esModule', { value: true });
|
|
4
|
-
|
|
5
|
-
const postCollapsible = require('./post-collapsible-cff3bb05.js');
|
|
6
|
-
require('./index-1cc8e4e1.js');
|
|
7
|
-
require('./package-71dcbbc9.js');
|
|
8
|
-
require('./index-f32e5185.js');
|
|
9
|
-
require('./constants-238701d3.js');
|
|
10
|
-
require('./check-one-of-f4f5d0c0.js');
|
|
11
|
-
require('./check-type-64af82a9.js');
|
|
12
|
-
|
|
13
|
-
|
|
14
|
-
|
|
15
|
-
exports.post_collapsible = postCollapsible.PostCollapsible;
|
|
@@ -1,14 +0,0 @@
|
|
|
1
|
-
function checkType(value, type, error) {
|
|
2
|
-
const typeIsArray = type === 'array';
|
|
3
|
-
const valueIsArray = Array.isArray(value);
|
|
4
|
-
if (typeIsArray || valueIsArray) {
|
|
5
|
-
if (valueIsArray !== typeIsArray)
|
|
6
|
-
throw new Error(error);
|
|
7
|
-
}
|
|
8
|
-
else {
|
|
9
|
-
if (typeof value !== type)
|
|
10
|
-
throw new Error(error);
|
|
11
|
-
}
|
|
12
|
-
}
|
|
13
|
-
|
|
14
|
-
export { checkType as c };
|
|
@@ -1,83 +0,0 @@
|
|
|
1
|
-
import { r as registerInstance, c as createEvent, h, H as Host, g as getElement } from './index-9ace3232.js';
|
|
2
|
-
import { v as version } from './package-130b6199.js';
|
|
3
|
-
import { b as checkEmptyOrType } from './index-29d17d6d.js';
|
|
4
|
-
|
|
5
|
-
function isMotionReduced() {
|
|
6
|
-
return window.matchMedia('(prefers-reduced-motion: reduce)').matches;
|
|
7
|
-
}
|
|
8
|
-
|
|
9
|
-
const collapseDuration = 350;
|
|
10
|
-
const collapseEasing = 'ease';
|
|
11
|
-
const collapsedKeyframe = { height: '0', overflow: 'hidden' };
|
|
12
|
-
const animationOptions = {
|
|
13
|
-
duration: collapseDuration,
|
|
14
|
-
easing: collapseEasing,
|
|
15
|
-
fill: 'forwards',
|
|
16
|
-
};
|
|
17
|
-
const collapse = (el) => {
|
|
18
|
-
const expandedKeyframe = { height: window.getComputedStyle(el).height };
|
|
19
|
-
return el.animate([expandedKeyframe, collapsedKeyframe], animationOptions);
|
|
20
|
-
};
|
|
21
|
-
const expand = (el) => {
|
|
22
|
-
const expandedKeyframe = { height: `${el.scrollHeight}px`, offset: 1 };
|
|
23
|
-
const finalKeyframe = { height: 'auto' };
|
|
24
|
-
return el.animate([collapsedKeyframe, expandedKeyframe, finalKeyframe], animationOptions);
|
|
25
|
-
};
|
|
26
|
-
|
|
27
|
-
const postCollapsibleCss = ":host{display:block;overflow:hidden}";
|
|
28
|
-
const PostCollapsibleStyle0 = postCollapsibleCss;
|
|
29
|
-
|
|
30
|
-
const PostCollapsible = class {
|
|
31
|
-
constructor(hostRef) {
|
|
32
|
-
registerInstance(this, hostRef);
|
|
33
|
-
this.postToggle = createEvent(this, "postToggle", 7);
|
|
34
|
-
this.isLoaded = false;
|
|
35
|
-
this.isOpen = true;
|
|
36
|
-
this.collapsed = false;
|
|
37
|
-
}
|
|
38
|
-
collapsedChange() {
|
|
39
|
-
checkEmptyOrType(this.collapsed, 'boolean', 'The `collapsed` property of the `post-collapsible` must be a boolean.');
|
|
40
|
-
void this.toggle(!this.collapsed);
|
|
41
|
-
}
|
|
42
|
-
componentDidLoad() {
|
|
43
|
-
this.collapsedChange();
|
|
44
|
-
this.isLoaded = true;
|
|
45
|
-
this.updateTriggers();
|
|
46
|
-
}
|
|
47
|
-
/**
|
|
48
|
-
* Triggers the collapse programmatically.
|
|
49
|
-
*
|
|
50
|
-
* If there is a collapsing transition running already, it will be reversed.
|
|
51
|
-
*/
|
|
52
|
-
async toggle(open = !this.isOpen) {
|
|
53
|
-
if (open === this.isOpen)
|
|
54
|
-
return open;
|
|
55
|
-
this.isOpen = open;
|
|
56
|
-
this.collapsed = !open;
|
|
57
|
-
if (this.isLoaded)
|
|
58
|
-
this.postToggle.emit(open);
|
|
59
|
-
const animation = open ? expand(this.host) : collapse(this.host);
|
|
60
|
-
if (!this.isLoaded || isMotionReduced())
|
|
61
|
-
animation.finish();
|
|
62
|
-
await animation.finished;
|
|
63
|
-
animation.commitStyles();
|
|
64
|
-
return open;
|
|
65
|
-
}
|
|
66
|
-
/**
|
|
67
|
-
* Update all post-collapsible-trigger elements referring to the collapsible
|
|
68
|
-
*/
|
|
69
|
-
updateTriggers() {
|
|
70
|
-
const triggers = document.querySelectorAll(`post-collapsible-trigger[for=${this.host.id}]`);
|
|
71
|
-
triggers.forEach(trigger => trigger.update());
|
|
72
|
-
}
|
|
73
|
-
render() {
|
|
74
|
-
return (h(Host, { key: 'b86f11ba3139c76bb077ef9f634afaaf7ab62ef5', "data-version": version }, h("slot", { key: '0f3a8275a8c6a41bfa97b59ee567c3c0da8e84d0' })));
|
|
75
|
-
}
|
|
76
|
-
get host() { return getElement(this); }
|
|
77
|
-
static get watchers() { return {
|
|
78
|
-
"collapsed": ["collapsedChange"]
|
|
79
|
-
}; }
|
|
80
|
-
};
|
|
81
|
-
PostCollapsible.style = PostCollapsibleStyle0;
|
|
82
|
-
|
|
83
|
-
export { PostCollapsible as P };
|
|
@@ -1,113 +0,0 @@
|
|
|
1
|
-
import { r as registerInstance, g as getElement } from './index-9ace3232.js';
|
|
2
|
-
import { v as version } from './package-130b6199.js';
|
|
3
|
-
import { c as checkType } from './check-type-8828dbe4.js';
|
|
4
|
-
import { c as checkNonEmpty } from './check-non-empty-58bd6b17.js';
|
|
5
|
-
|
|
6
|
-
function debounce(callback, timeout = 200) {
|
|
7
|
-
let id;
|
|
8
|
-
return (...args) => {
|
|
9
|
-
if (id)
|
|
10
|
-
clearTimeout(id);
|
|
11
|
-
id = setTimeout(callback, timeout, ...args);
|
|
12
|
-
};
|
|
13
|
-
}
|
|
14
|
-
|
|
15
|
-
const PostCollapsibleTrigger = class {
|
|
16
|
-
constructor(hostRef) {
|
|
17
|
-
registerInstance(this, hostRef);
|
|
18
|
-
this.observer = new MutationObserver(() => this.setTrigger());
|
|
19
|
-
this.debouncedUpdate = debounce(() => {
|
|
20
|
-
var _a;
|
|
21
|
-
if (!this.trigger)
|
|
22
|
-
return;
|
|
23
|
-
// add the provided id to the aria-controls list
|
|
24
|
-
const ariaControls = this.trigger.getAttribute('aria-controls');
|
|
25
|
-
if (!(ariaControls === null || ariaControls === void 0 ? void 0 : ariaControls.includes(this.for))) {
|
|
26
|
-
const newAriaControls = ariaControls ? `${ariaControls} ${this.for}` : this.for;
|
|
27
|
-
this.trigger.setAttribute('aria-controls', newAriaControls);
|
|
28
|
-
}
|
|
29
|
-
// set the aria-expanded to `false` if the controlled collapsible is collapsed or undefined, set it to `true` otherwise
|
|
30
|
-
const isCollapsed = (_a = this.collapsible) === null || _a === void 0 ? void 0 : _a.collapsed;
|
|
31
|
-
const newAriaExpanded = isCollapsed !== undefined ? !isCollapsed : undefined;
|
|
32
|
-
this.trigger.setAttribute('aria-expanded', `${newAriaExpanded}`);
|
|
33
|
-
});
|
|
34
|
-
this.for = undefined;
|
|
35
|
-
}
|
|
36
|
-
/**
|
|
37
|
-
* Set the "aria-controls" and "aria-expanded" attributes on the trigger to match the state of the controlled post-collapsible
|
|
38
|
-
*/
|
|
39
|
-
setAriaAttributes() {
|
|
40
|
-
checkNonEmpty(this.for, 'The post-collapsible-trigger "for" prop is required.');
|
|
41
|
-
checkType(this.for, 'string', 'The post-collapsible-trigger "for" prop should be a id.');
|
|
42
|
-
void this.update();
|
|
43
|
-
}
|
|
44
|
-
/**
|
|
45
|
-
* Initiate a mutation observer that updates the trigger whenever necessary
|
|
46
|
-
*/
|
|
47
|
-
connectedCallback() {
|
|
48
|
-
this.observer.observe(this.host, { childList: true, subtree: true });
|
|
49
|
-
}
|
|
50
|
-
/**
|
|
51
|
-
* Add the "data-version" to the host element and set the trigger
|
|
52
|
-
*/
|
|
53
|
-
componentDidLoad() {
|
|
54
|
-
this.host.setAttribute('data-version', version);
|
|
55
|
-
this.setTrigger();
|
|
56
|
-
if (!this.trigger)
|
|
57
|
-
console.warn('The post-collapsible-trigger must contain a button.');
|
|
58
|
-
}
|
|
59
|
-
/**
|
|
60
|
-
* Disconnect the mutation observer
|
|
61
|
-
*/
|
|
62
|
-
disconnectedCallback() {
|
|
63
|
-
this.observer.disconnect();
|
|
64
|
-
}
|
|
65
|
-
/**
|
|
66
|
-
* Update the "aria-expanded" attribute on the trigger anytime the controlled post-collapsible is toggled
|
|
67
|
-
*/
|
|
68
|
-
setAriaExpanded(e) {
|
|
69
|
-
if (!this.trigger || !e.target.isEqualNode(this.collapsible))
|
|
70
|
-
return;
|
|
71
|
-
this.trigger.setAttribute('aria-expanded', `${e.detail}`);
|
|
72
|
-
}
|
|
73
|
-
/**
|
|
74
|
-
* Update the "aria-controls" and "aria-expanded" attributes on the trigger button
|
|
75
|
-
*/
|
|
76
|
-
async update() {
|
|
77
|
-
this.debouncedUpdate();
|
|
78
|
-
}
|
|
79
|
-
/**
|
|
80
|
-
* Toggle the post-collapsible controlled by the trigger
|
|
81
|
-
*/
|
|
82
|
-
async toggleCollapsible() {
|
|
83
|
-
var _a;
|
|
84
|
-
await ((_a = this.collapsible) === null || _a === void 0 ? void 0 : _a.toggle());
|
|
85
|
-
}
|
|
86
|
-
/**
|
|
87
|
-
* Retrieve the post-collapsible controlled by the trigger
|
|
88
|
-
*/
|
|
89
|
-
get collapsible() {
|
|
90
|
-
const ref = document.getElementById(this.for);
|
|
91
|
-
if (ref && ref.localName === 'post-collapsible') {
|
|
92
|
-
return ref;
|
|
93
|
-
}
|
|
94
|
-
return null;
|
|
95
|
-
}
|
|
96
|
-
/**
|
|
97
|
-
* Find the button and add the proper event listener and ARIA attributes to it
|
|
98
|
-
*/
|
|
99
|
-
setTrigger() {
|
|
100
|
-
const trigger = this.host.querySelector('button');
|
|
101
|
-
if (!trigger || (this.trigger && trigger.isEqualNode(this.trigger)))
|
|
102
|
-
return;
|
|
103
|
-
this.trigger = trigger;
|
|
104
|
-
this.trigger.addEventListener('click', () => this.toggleCollapsible());
|
|
105
|
-
this.setAriaAttributes();
|
|
106
|
-
}
|
|
107
|
-
get host() { return getElement(this); }
|
|
108
|
-
static get watchers() { return {
|
|
109
|
-
"for": ["setAriaAttributes"]
|
|
110
|
-
}; }
|
|
111
|
-
};
|
|
112
|
-
|
|
113
|
-
export { PostCollapsibleTrigger as P };
|
|
@@ -1,7 +0,0 @@
|
|
|
1
|
-
export { P as post_collapsible } from './post-collapsible-301ba5ad.js';
|
|
2
|
-
import './index-9ace3232.js';
|
|
3
|
-
import './package-130b6199.js';
|
|
4
|
-
import './index-29d17d6d.js';
|
|
5
|
-
import './constants-8d548297.js';
|
|
6
|
-
import './check-one-of-6b3ef8eb.js';
|
|
7
|
-
import './check-type-8828dbe4.js';
|
|
@@ -1 +0,0 @@
|
|
|
1
|
-
import{r as t,c as s,h as e,H as o,g as i}from"./p-8c7f0075.js";import{v as a}from"./p-8386ab9c.js";import{b as r}from"./p-ac500761.js";const h={height:"0",overflow:"hidden"},c={duration:350,easing:"ease",fill:"forwards"},n=class{constructor(e){t(this,e),this.postToggle=s(this,"postToggle",7),this.isLoaded=!1,this.isOpen=!0,this.collapsed=!1}collapsedChange(){r(this.collapsed,"boolean","The `collapsed` property of the `post-collapsible` must be a boolean."),this.toggle(!this.collapsed)}componentDidLoad(){this.collapsedChange(),this.isLoaded=!0,this.updateTriggers()}async toggle(t=!this.isOpen){if(t===this.isOpen)return t;this.isOpen=t,this.collapsed=!t,this.isLoaded&&this.postToggle.emit(t);const s=t?(e=this.host).animate([h,{height:`${e.scrollHeight}px`,offset:1},{height:"auto"}],c):(t=>{const s={height:window.getComputedStyle(t).height};return t.animate([s,h],c)})(this.host);var e;return this.isLoaded&&!window.matchMedia("(prefers-reduced-motion: reduce)").matches||s.finish(),await s.finished,s.commitStyles(),t}updateTriggers(){document.querySelectorAll(`post-collapsible-trigger[for=${this.host.id}]`).forEach((t=>t.update()))}render(){return e(o,{key:"b86f11ba3139c76bb077ef9f634afaaf7ab62ef5","data-version":a},e("slot",{key:"0f3a8275a8c6a41bfa97b59ee567c3c0da8e84d0"}))}get host(){return i(this)}static get watchers(){return{collapsed:["collapsedChange"]}}};n.style=":host{display:block;overflow:hidden}";export{n as P}
|
|
@@ -1 +0,0 @@
|
|
|
1
|
-
import{r as i,h as t,H as a,g as e}from"./p-8c7f0075.js";import{c as o,b as n}from"./p-ac500761.js";import{v as s}from"./p-8386ab9c.js";import{c as r}from"./p-b095519d.js";import{c as l}from"./p-4a3f67ab.js";const c=["cylon","cylon-vertical","spin","spin-reverse","fade","throb"],m=class{constructor(t){i(this,t),this.svgStyles=void 0,this.svgOutput=void 0,this.animation=null,this.base=null,this.flipH=!1,this.flipV=!1,this.name=void 0,this.rotate=null,this.scale=null}validateAnimation(i=this.animation){void 0!==i&&o(i,c,`The post-icon "animation" prop requires one of the following values: ${c.join(", ")}.`)}validateBase(i=this.base){n(i,"string",'The post-icon "base" prop should be a string.')}validateFlipH(i=this.flipH){n(i,"boolean",'The post-icon "flipH" prop should be a boolean.')}validateFlipV(i=this.flipV){n(i,"boolean",'The post-icon "flipV" prop should be a boolean.')}validateName(i=this.name){r(i,'The post-icon "name" prop is required!.'),l(i,"string",'The post-icon "name" prop should be a string.')}validateRotate(i=this.rotate){n(i,"number",'The post-icon "rotate" prop should be a number.')}validateScale(i=this.scale){n(i,"number",'The post-icon "scale" prop should be a number.')}componentWillLoad(){this.validateBase(),this.validateName(),this.validateFlipH(),this.validateFlipV(),this.validateScale(),this.validateRotate(),this.validateAnimation()}componentWillRender(){this.setPath()}setPath(){var i,t,a,e;const o=null!==(t=null===(i=document.head.querySelector('meta[name="design-system-settings"][data-post-icon-base]'))||void 0===i?void 0:i.getAttribute("data-post-icon-base"))&&void 0!==t?t:null,n=`${null!==(e=null!==(a=this.base)&&void 0!==a?a:o)&&void 0!==e?e:"https://unpkg.com/@swisspost/design-system-icons/public/post-icons"}/`.replace(/\/\/$/,"/");this.path=new URL(`${n}${this.name}.svg`,window.location.origin).toString()}render(){const i=Object.entries({"-webkit-mask-image":`url('${this.path}')`,"mask-image":`url('${this.path}')`,transform:(this.scale&&!isNaN(Number(this.scale))?"scale("+this.scale+")":"")+(this.rotate&&!isNaN(Number(this.rotate))?" rotate("+this.rotate+"deg)":"")}).filter((([i,t])=>null!==t)).reduce(((i,[t,a])=>Object.assign(i,{[t]:a})),{});return t(a,{key:"c046b74af0d3cc42dcddfbd4aa029ca07be26bf8","data-version":s},t("span",{key:"c49c4d2de0222c665acf1db46f8a13db26f6a26e",style:i}))}get host(){return e(this)}static get watchers(){return{animation:["validateAnimation"],base:["validateBase"],flipH:["validateFlipH"],flipV:["validateFlipV"],name:["validateName"],rotate:["validateRotate"],scale:["validateScale"]}}};m.style=":host{display:inline-block;width:1em;height:1em;vertical-align:-0.15em}span{display:block;width:100%;height:100%;fill:currentColor;forced-color-adjust:preserve-parent-color;background-color:currentColor;-webkit-mask-position:center center;mask-position:center center;-webkit-mask-repeat:no-repeat;mask-repeat:no-repeat;-webkit-mask-size:100%;mask-size:100%}:host([flip-h]:not([flip-h=false])){scale:-1 1}:host([flip-v]:not([flip-v=false])){scale:1 -1}:host([flip-h][flip-v]:not([flip-h=false],[flip-v=false])){scale:-1}:host([animation]){transform-origin:center}:host([animation=cylon]){animation:icon-animation-cylon .75s ease-in-out infinite alternate}:host([animation=cylon-vertical]){animation:icon-animation-cylon-vertical .75s ease-in-out infinite alternate}:host([animation=spin]){animation:icon-animation-spin 2s linear infinite normal}:host([animation=spin-reverse]){animation:icon-animation-spin 2s linear infinite reverse}:host([animation=fade]){animation:icon-animation-fade .75s ease-in-out infinite alternate}:host([animation=throb]){animation:icon-animation-throb .75s ease-in-out infinite alternate}@keyframes icon-animation-cylon{from{transform:translateX(-25%)}to{transform:translateX(25%)}}@keyframes icon-animation-cylon-vertical{from{transform:translateY(25%)}to{transform:translateY(-25%)}}@keyframes icon-animation-fade{from{opacity:.1}to{opacity:1}}@keyframes icon-animation-spin{from{transform:rotate(0deg)}to{transform:rotate(359deg)}}@keyframes icon-animation-throb{from{opacity:.5;transform:scale(0.5)}to{opacity:1;transform:scale(1)}}";export{m as P}
|
|
@@ -1 +0,0 @@
|
|
|
1
|
-
export{P as post_rating}from"./p-48fcde73.js";import"./p-8c7f0075.js";import"./p-8386ab9c.js";
|