@swisspost/design-system-components 1.7.0 → 2.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/README.md +1 -1
- package/dist/cjs/{index-c07c0cdb.js → index-13695f3f.js} +55 -2
- package/dist/cjs/index-13695f3f.js.map +1 -0
- package/dist/cjs/index.cjs.js +12 -12
- package/dist/cjs/loader.cjs.js +2 -2
- package/dist/cjs/package-8152e25e.js +7 -0
- package/dist/cjs/package-8152e25e.js.map +1 -0
- package/dist/cjs/post-accordion-9877919c.js +88 -0
- package/dist/cjs/post-accordion-9877919c.js.map +1 -0
- package/dist/cjs/post-accordion-item.cjs.entry.js +55 -0
- package/dist/cjs/post-accordion-item.cjs.entry.js.map +1 -0
- package/dist/cjs/post-accordion.cjs.entry.js +3 -3
- package/dist/cjs/{post-alert-6d0b5e58.js → post-alert-d87e6132.js} +4 -4
- package/dist/cjs/{post-alert-6d0b5e58.js.map → post-alert-d87e6132.js.map} +1 -1
- package/dist/cjs/post-alert.cjs.entry.js +3 -3
- package/dist/cjs/post-collapsible-ef0561b4.js +84 -0
- package/dist/cjs/post-collapsible-ef0561b4.js.map +1 -0
- package/dist/cjs/post-collapsible.cjs.entry.js +3 -3
- package/dist/cjs/post-components.cjs.js +3 -3
- package/dist/cjs/post-components.cjs.js.map +1 -1
- package/dist/cjs/{post-icon-3dbb7728.js → post-icon-e9dcd643.js} +3 -3
- package/dist/cjs/{post-icon-3dbb7728.js.map → post-icon-e9dcd643.js.map} +1 -1
- package/dist/cjs/post-icon.cjs.entry.js +3 -3
- package/dist/cjs/{post-popover-ea22d235.js → post-popover-e114ebe7.js} +3 -3
- package/dist/cjs/{post-popover-ea22d235.js.map → post-popover-e114ebe7.js.map} +1 -1
- package/dist/cjs/post-popover.cjs.entry.js +3 -3
- package/dist/cjs/{post-popovercontainer-42e4ab15.js → post-popovercontainer-20fb22ee.js} +3 -3
- package/dist/cjs/{post-popovercontainer-42e4ab15.js.map → post-popovercontainer-20fb22ee.js.map} +1 -1
- package/dist/cjs/post-popovercontainer.cjs.entry.js +3 -3
- package/dist/cjs/{post-tab-header-09074905.js → post-tab-header-34c1cc21.js} +3 -3
- package/dist/cjs/{post-tab-header-09074905.js.map → post-tab-header-34c1cc21.js.map} +1 -1
- package/dist/cjs/post-tab-header.cjs.entry.js +3 -3
- package/dist/cjs/{post-tab-panel-9547b9ac.js → post-tab-panel-95cf7092.js} +3 -3
- package/dist/cjs/{post-tab-panel-9547b9ac.js.map → post-tab-panel-95cf7092.js.map} +1 -1
- package/dist/cjs/post-tab-panel.cjs.entry.js +3 -3
- package/dist/cjs/{post-tabs-2ec2778e.js → post-tabs-dbe7c341.js} +3 -3
- package/dist/cjs/{post-tabs-2ec2778e.js.map → post-tabs-dbe7c341.js.map} +1 -1
- package/dist/cjs/post-tabs.cjs.entry.js +3 -3
- package/dist/cjs/{post-tooltip-c802c51f.js → post-tooltip-659af1e3.js} +9 -6
- package/dist/cjs/post-tooltip-659af1e3.js.map +1 -0
- package/dist/cjs/post-tooltip.cjs.entry.js +3 -3
- package/dist/collection/animations/collapse.js +10 -5
- package/dist/collection/animations/collapse.js.map +1 -1
- package/dist/collection/collection-manifest.json +4 -3
- package/dist/collection/components/post-accordion/post-accordion.js +37 -36
- package/dist/collection/components/post-accordion/post-accordion.js.map +1 -1
- package/dist/collection/components/post-accordion-item/heading-levels.js.map +1 -0
- package/dist/collection/components/post-accordion-item/post-accordion-item.css +1 -0
- package/dist/collection/components/post-accordion-item/post-accordion-item.js +142 -0
- package/dist/collection/components/post-accordion-item/post-accordion-item.js.map +1 -0
- package/dist/collection/components/post-alert/post-alert.css +1 -1
- package/dist/collection/components/post-alert/post-alert.js.map +1 -1
- package/dist/collection/components/post-collapsible/post-collapsible.css +1 -1
- package/dist/collection/components/post-collapsible/post-collapsible.js +7 -48
- package/dist/collection/components/post-collapsible/post-collapsible.js.map +1 -1
- package/dist/collection/components/post-popover/post-popover.js.map +1 -1
- package/dist/collection/components/post-popovercontainer/post-popovercontainer.js.map +1 -1
- package/dist/collection/components/post-tabs/post-tabs.js.map +1 -1
- package/dist/collection/components/post-tooltip/post-tooltip.css +1 -1
- package/dist/collection/components/post-tooltip/post-tooltip.js +23 -2
- package/dist/collection/components/post-tooltip/post-tooltip.js.map +1 -1
- package/dist/collection/utils/property-checkers/check-non-empty.js.map +1 -1
- package/dist/collection/utils/property-checkers/check-type.js.map +1 -1
- package/dist/components/package.js +1 -1
- package/dist/components/post-accordion-item.d.ts +11 -0
- package/dist/components/post-accordion-item.js +82 -0
- package/dist/components/post-accordion-item.js.map +1 -0
- package/dist/components/post-accordion2.js +33 -32
- package/dist/components/post-accordion2.js.map +1 -1
- package/dist/components/post-alert2.js +1 -1
- package/dist/components/post-alert2.js.map +1 -1
- package/dist/components/post-collapsible2.js +16 -29
- package/dist/components/post-collapsible2.js.map +1 -1
- package/dist/components/post-tooltip2.js +7 -3
- package/dist/components/post-tooltip2.js.map +1 -1
- package/dist/docs.json +189 -72
- package/dist/esm/{index-35998e08.js → index-74cf5c9d.js} +55 -2
- package/dist/esm/index-74cf5c9d.js.map +1 -0
- package/dist/esm/index.js +12 -12
- package/dist/esm/loader.js +3 -3
- package/dist/esm/package-af0ef704.js +5 -0
- package/dist/esm/package-af0ef704.js.map +1 -0
- package/dist/esm/post-accordion-3b137073.js +86 -0
- package/dist/esm/post-accordion-3b137073.js.map +1 -0
- package/dist/esm/post-accordion-item.entry.js +51 -0
- package/dist/esm/post-accordion-item.entry.js.map +1 -0
- package/dist/esm/post-accordion.entry.js +3 -3
- package/dist/esm/{post-alert-7254a70f.js → post-alert-0dcc6ac7.js} +4 -4
- package/dist/esm/{post-alert-7254a70f.js.map → post-alert-0dcc6ac7.js.map} +1 -1
- package/dist/esm/post-alert.entry.js +3 -3
- package/dist/esm/post-collapsible-a418570f.js +82 -0
- package/dist/esm/post-collapsible-a418570f.js.map +1 -0
- package/dist/esm/post-collapsible.entry.js +3 -3
- package/dist/esm/post-components.js +4 -4
- package/dist/esm/post-components.js.map +1 -1
- package/dist/esm/{post-icon-e0bbf0f5.js → post-icon-302d1767.js} +3 -3
- package/dist/esm/{post-icon-e0bbf0f5.js.map → post-icon-302d1767.js.map} +1 -1
- package/dist/esm/post-icon.entry.js +3 -3
- package/dist/esm/{post-popover-25eb3f76.js → post-popover-5725afc7.js} +3 -3
- package/dist/esm/{post-popover-25eb3f76.js.map → post-popover-5725afc7.js.map} +1 -1
- package/dist/esm/post-popover.entry.js +3 -3
- package/dist/esm/{post-popovercontainer-54117eea.js → post-popovercontainer-1c050e83.js} +3 -3
- package/dist/esm/{post-popovercontainer-54117eea.js.map → post-popovercontainer-1c050e83.js.map} +1 -1
- package/dist/esm/post-popovercontainer.entry.js +3 -3
- package/dist/esm/{post-tab-header-1684b507.js → post-tab-header-ede9f078.js} +3 -3
- package/dist/esm/{post-tab-header-1684b507.js.map → post-tab-header-ede9f078.js.map} +1 -1
- package/dist/esm/post-tab-header.entry.js +3 -3
- package/dist/esm/{post-tab-panel-add26fe5.js → post-tab-panel-16796ee3.js} +3 -3
- package/dist/esm/{post-tab-panel-add26fe5.js.map → post-tab-panel-16796ee3.js.map} +1 -1
- package/dist/esm/post-tab-panel.entry.js +3 -3
- package/dist/esm/{post-tabs-d738e61f.js → post-tabs-16f99043.js} +3 -3
- package/dist/esm/{post-tabs-d738e61f.js.map → post-tabs-16f99043.js.map} +1 -1
- package/dist/esm/post-tabs.entry.js +3 -3
- package/dist/esm/{post-tooltip-57928808.js → post-tooltip-03a6d578.js} +9 -6
- package/dist/esm/post-tooltip-03a6d578.js.map +1 -0
- package/dist/esm/post-tooltip.entry.js +3 -3
- package/dist/post-components/index.esm.js +1 -1
- package/dist/post-components/p-06566f88.js +2 -0
- package/dist/post-components/p-06566f88.js.map +1 -0
- package/dist/post-components/{p-7d32dfb7.js → p-12a0f4b9.js} +2 -2
- package/dist/post-components/{p-7d32dfb7.js.map → p-12a0f4b9.js.map} +1 -1
- package/dist/post-components/{p-09892ad1.js → p-26dad3c3.js} +2 -2
- package/dist/post-components/p-299a3e41.entry.js +2 -0
- package/dist/post-components/p-3241987a.entry.js +2 -0
- package/dist/post-components/p-3fd14a00.js +2 -0
- package/dist/post-components/p-3fd14a00.js.map +1 -0
- package/dist/post-components/p-4b950d70.js +2 -0
- package/dist/post-components/p-503ac49b.entry.js +2 -0
- package/dist/post-components/{p-9bd5f824.js → p-6391f970.js} +2 -2
- package/dist/post-components/p-6d0226cd.entry.js +2 -0
- package/dist/post-components/p-775859cc.entry.js +2 -0
- package/dist/post-components/p-78589fac.entry.js +2 -0
- package/dist/post-components/p-78589fac.entry.js.map +1 -0
- package/dist/post-components/{p-f994dce8.js → p-803284de.js} +3 -3
- package/dist/post-components/{p-f994dce8.js.map → p-803284de.js.map} +1 -1
- package/dist/post-components/p-83cedb31.entry.js +2 -0
- package/dist/post-components/p-88481640.entry.js +2 -0
- package/dist/post-components/p-8f37921c.entry.js +2 -0
- package/dist/post-components/{p-6e3158e8.js → p-91236c61.js} +2 -2
- package/dist/post-components/{p-bd032124.js → p-91f2291a.js} +2 -2
- package/dist/post-components/{p-1f55663e.js → p-93ab273b.js} +2 -2
- package/dist/post-components/{p-81591ad0.js → p-b4f01350.js} +1 -1
- package/dist/post-components/p-b4f01350.js.map +1 -0
- package/dist/post-components/p-d96fbe33.entry.js +2 -0
- package/dist/post-components/p-de4704fc.js +2 -0
- package/dist/post-components/p-fe7650bc.entry.js +2 -0
- package/dist/post-components/post-components.esm.js +1 -1
- package/dist/post-components/post-components.esm.js.map +1 -1
- package/dist/types/components/post-accordion/post-accordion.d.ts +8 -8
- package/dist/types/components/post-accordion-item/post-accordion-item.d.ts +24 -0
- package/dist/types/components/post-collapsible/post-collapsible.d.ts +4 -10
- package/dist/types/components/post-tooltip/post-tooltip.d.ts +4 -0
- package/dist/types/components.d.ts +51 -18
- package/package.json +11 -3
- package/dist/cjs/index-c07c0cdb.js.map +0 -1
- package/dist/cjs/package-cd0e9960.js +0 -7
- package/dist/cjs/package-cd0e9960.js.map +0 -1
- package/dist/cjs/post-accordion-f2e00198.js +0 -87
- package/dist/cjs/post-accordion-f2e00198.js.map +0 -1
- package/dist/cjs/post-collapsible-0b8dce97.js +0 -93
- package/dist/cjs/post-collapsible-0b8dce97.js.map +0 -1
- package/dist/cjs/post-tooltip-c802c51f.js.map +0 -1
- package/dist/collection/components/post-collapsible/heading-levels.js.map +0 -1
- package/dist/esm/index-35998e08.js.map +0 -1
- package/dist/esm/package-337354c3.js +0 -5
- package/dist/esm/package-337354c3.js.map +0 -1
- package/dist/esm/post-accordion-c2013bb3.js +0 -85
- package/dist/esm/post-accordion-c2013bb3.js.map +0 -1
- package/dist/esm/post-collapsible-4464cc98.js +0 -91
- package/dist/esm/post-collapsible-4464cc98.js.map +0 -1
- package/dist/esm/post-tooltip-57928808.js.map +0 -1
- package/dist/post-components/p-05e85f2b.entry.js +0 -2
- package/dist/post-components/p-08abd53e.entry.js +0 -2
- package/dist/post-components/p-1e9ec4a9.entry.js +0 -2
- package/dist/post-components/p-30c60b6c.entry.js +0 -2
- package/dist/post-components/p-38d97f62.entry.js +0 -2
- package/dist/post-components/p-4c188911.entry.js +0 -2
- package/dist/post-components/p-568bb469.entry.js +0 -2
- package/dist/post-components/p-65c8bd5c.entry.js +0 -2
- package/dist/post-components/p-81591ad0.js.map +0 -1
- package/dist/post-components/p-b4b4f59a.js +0 -2
- package/dist/post-components/p-c5858d52.entry.js +0 -2
- package/dist/post-components/p-dbd07f20.js +0 -2
- package/dist/post-components/p-dbd07f20.js.map +0 -1
- package/dist/post-components/p-de493e36.js +0 -2
- package/dist/post-components/p-eaddd6cc.js +0 -2
- package/dist/post-components/p-eaddd6cc.js.map +0 -1
- package/dist/post-components/p-ed73d4c0.entry.js +0 -2
- /package/dist/collection/components/{post-collapsible → post-accordion-item}/heading-levels.js +0 -0
- /package/dist/post-components/{p-09892ad1.js.map → p-26dad3c3.js.map} +0 -0
- /package/dist/post-components/{p-05e85f2b.entry.js.map → p-299a3e41.entry.js.map} +0 -0
- /package/dist/post-components/{p-08abd53e.entry.js.map → p-3241987a.entry.js.map} +0 -0
- /package/dist/post-components/{p-b4b4f59a.js.map → p-4b950d70.js.map} +0 -0
- /package/dist/post-components/{p-1e9ec4a9.entry.js.map → p-503ac49b.entry.js.map} +0 -0
- /package/dist/post-components/{p-9bd5f824.js.map → p-6391f970.js.map} +0 -0
- /package/dist/post-components/{p-30c60b6c.entry.js.map → p-6d0226cd.entry.js.map} +0 -0
- /package/dist/post-components/{p-38d97f62.entry.js.map → p-775859cc.entry.js.map} +0 -0
- /package/dist/post-components/{p-4c188911.entry.js.map → p-83cedb31.entry.js.map} +0 -0
- /package/dist/post-components/{p-568bb469.entry.js.map → p-88481640.entry.js.map} +0 -0
- /package/dist/post-components/{p-65c8bd5c.entry.js.map → p-8f37921c.entry.js.map} +0 -0
- /package/dist/post-components/{p-6e3158e8.js.map → p-91236c61.js.map} +0 -0
- /package/dist/post-components/{p-bd032124.js.map → p-91f2291a.js.map} +0 -0
- /package/dist/post-components/{p-1f55663e.js.map → p-93ab273b.js.map} +0 -0
- /package/dist/post-components/{p-c5858d52.entry.js.map → p-d96fbe33.entry.js.map} +0 -0
- /package/dist/post-components/{p-de493e36.js.map → p-de4704fc.js.map} +0 -0
- /package/dist/post-components/{p-ed73d4c0.entry.js.map → p-fe7650bc.entry.js.map} +0 -0
- /package/dist/types/components/{post-collapsible → post-accordion-item}/heading-levels.d.ts +0 -0
|
@@ -1 +0,0 @@
|
|
|
1
|
-
{"version":3,"names":["postAccordionCss","PostAccordion","this","expandedCollapsibles","Set","componentWillLoad","registerCollapsibles","toggle","id","collapsibleToToggle","collapsibles","find","collapsible","Error","collapseChangeHandler","event","toggledCollapsible","target","isClosing","has","delete","add","multiple","Array","from","values","filter","forEach","expandAll","Promise","all","map","size","collapseAll","host","querySelectorAll","collapsed","index","setAttribute","render","h","Host","version","class","onSlotchange"],"sources":["src/components/post-accordion/post-accordion.scss?tag=post-accordion&encapsulation=shadow","src/components/post-accordion/post-accordion.tsx"],"sourcesContent":[":host {\n display: block;\n}\n","import { Component, Element, h, Host, Listen, Method, Prop } from '@stencil/core';\nimport { version } from '../../../package.json';\n\n@Component({\n tag: 'post-accordion',\n styleUrl: 'post-accordion.scss',\n shadow: true,\n})\nexport class PostAccordion {\n private collapsibles: HTMLPostCollapsibleElement[];\n private expandedCollapsibles = new Set<HTMLPostCollapsibleElement>();\n\n @Element() host: HTMLPostAccordionElement;\n\n /**\n * If `true`, multiple `post-collapsible` can be open at the same time.\n */\n @Prop() readonly multiple: boolean = false;\n\n componentWillLoad() {\n this.registerCollapsibles();\n }\n\n /**\n * Toggles the `post-collapsible` children with the given id.\n */\n @Method()\n async toggle(id: string) {\n const collapsibleToToggle = this.collapsibles\n .find(collapsible => collapsible.id === id);\n\n if (!collapsibleToToggle) throw new Error(`No post-collapsible found with id #${id}.`);\n\n await collapsibleToToggle.toggle();\n }\n\n @Listen('collapseChange')\n collapseChangeHandler(event: CustomEvent) {\n const toggledCollapsible = event.target as HTMLPostCollapsibleElement;\n const isClosing = this.expandedCollapsibles.has(toggledCollapsible);\n\n if (isClosing) {\n this.expandedCollapsibles.delete(toggledCollapsible);\n } else {\n this.expandedCollapsibles.add(toggledCollapsible);\n }\n\n if (this.multiple || isClosing) return;\n\n // close other open collapsible elements to have only one opened at a time\n Array.from(this.expandedCollapsibles.values())\n .filter(collapsible => collapsible !== toggledCollapsible)\n .forEach(collapsible => {\n void collapsible.toggle(false);\n });\n }\n\n /**\n * Expands all `post-collapsible` children.\n *\n * If `close-others` is `true` and all items are closed, it will open the first one.\n * Otherwise, it will keep the opened one.\n */\n @Method()\n async expandAll() {\n if (this.multiple) {\n await Promise.all(\n this.collapsibles.map(collapsible => collapsible.toggle(true))\n );\n } else if (!this.expandedCollapsibles.size) {\n await this.collapsibles[0].toggle(true);\n }\n }\n\n /**\n * Collapses all `post-collapsible` children.\n */\n @Method()\n async collapseAll() {\n await Promise.all(\n this.collapsibles.map(collapsible => collapsible.toggle(false))\n );\n }\n\n private registerCollapsibles() {\n this.collapsibles = Array.from(\n this.host.querySelectorAll('post-collapsible')\n );\n\n this.collapsibles\n .filter(collapsible => {\n return !collapsible.collapsed || this.expandedCollapsibles.has(collapsible);\n }).forEach((collapsible, index) => {\n if (!this.multiple && index !== 0) {\n collapsible.setAttribute('collapsed', '');\n return;\n }\n\n this.expandedCollapsibles.add(collapsible);\n });\n }\n\n render() {\n return (\n <Host data-version={version}>\n <div class=\"accordion\">\n <slot onSlotchange={() => this.registerCollapsibles()}/>\n </div>\n </Host>\n );\n }\n}\n"],"mappings":"6FAAA,MAAMA,EAAmB,uB,MCQZC,EAAa,M,yBAEhBC,KAAAC,qBAAuB,IAAIC,I,cAOE,K,CAErC,iBAAAC,GACEH,KAAKI,sB,CAOP,YAAMC,CAAOC,GACX,MAAMC,EAAsBP,KAAKQ,aAC9BC,MAAKC,GAAeA,EAAYJ,KAAOA,IAE1C,IAAKC,EAAqB,MAAM,IAAII,MAAM,sCAAsCL,YAE1EC,EAAoBF,Q,CAI5B,qBAAAO,CAAsBC,GACpB,MAAMC,EAAqBD,EAAME,OACjC,MAAMC,EAAYhB,KAAKC,qBAAqBgB,IAAIH,GAEhD,GAAIE,EAAW,CACbhB,KAAKC,qBAAqBiB,OAAOJ,E,KAC5B,CACLd,KAAKC,qBAAqBkB,IAAIL,E,CAGhC,GAAId,KAAKoB,UAAYJ,EAAW,OAGhCK,MAAMC,KAAKtB,KAAKC,qBAAqBsB,UAClCC,QAAOd,GAAeA,IAAgBI,IACtCW,SAAQf,SACFA,EAAYL,OAAO,MAAM,G,CAWpC,eAAMqB,GACJ,GAAI1B,KAAKoB,SAAU,OACXO,QAAQC,IACZ5B,KAAKQ,aAAaqB,KAAInB,GAAeA,EAAYL,OAAO,Q,MAErD,IAAKL,KAAKC,qBAAqB6B,KAAM,OACpC9B,KAAKQ,aAAa,GAAGH,OAAO,K,EAQtC,iBAAM0B,SACEJ,QAAQC,IACZ5B,KAAKQ,aAAaqB,KAAInB,GAAeA,EAAYL,OAAO,S,CAIpD,oBAAAD,GACNJ,KAAKQ,aAAea,MAAMC,KACxBtB,KAAKgC,KAAKC,iBAAiB,qBAG7BjC,KAAKQ,aACFgB,QAAOd,IACEA,EAAYwB,WAAalC,KAAKC,qBAAqBgB,IAAIP,KAC9De,SAAQ,CAACf,EAAayB,KACvB,IAAKnC,KAAKoB,UAAYe,IAAU,EAAG,CACjCzB,EAAY0B,aAAa,YAAa,IACtC,M,CAGFpC,KAAKC,qBAAqBkB,IAAIT,EAAY,G,CAIhD,MAAA2B,GACE,OACEC,EAACC,EAAI,gBAAeC,GAClBF,EAAA,OAAKG,MAAM,aACTH,EAAA,QAAMI,aAAc,IAAM1C,KAAKI,0B"}
|
|
@@ -1,2 +0,0 @@
|
|
|
1
|
-
import{r as o,c as t,h as r,H as s,g as e}from"./p-81591ad0.js";import{v as i}from"./p-de493e36.js";import{d as a,b as n}from"./p-96f4ebc4.js";function c(){return window.matchMedia("(prefers-reduced-motion: reduce)").matches}const l=350;const d="ease";const p={height:"0",overflow:"hidden"};const g=o=>{const{height:t}=window.getComputedStyle(o);const r={height:t};return o.animate([r,p],{duration:l,easing:d,fill:"forwards"})};const b=o=>{const t={height:`${o.scrollHeight}px`};return o.animate([p,t],{duration:l,easing:d,fill:"forwards"})};const h=[1,2,3,4,5,6];const u=".accordion-item,.bg-light .accordion-item,.bg-gray .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-light .accordion-item,.bg-gray .accordion-item{--post-contrast-color:#000;--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-light:#faf9f8;--post-gray:#f4f3f1;--post-dark:hsl(0, 0%, 20%);--post-primary:hsl(0, 0%, 20%);--post-white:#fff;--post-black:#000;--post-info:#cce4ee;--post-success:#2c911c;--post-warning:#f49e00;--post-danger:#a51728;--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-success-green:#2c871d;--post-error-red:#a51728;--post-warning-orange:#f49e00;--post-success-background:#c0debb;--post-error-background:#ffdade;--post-warning-background:#fce2b2;--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-yellow-rgb:255, 204, 0;--post-light-rgb:250, 249, 248;--post-gray-rgb:244, 243, 241;--post-dark-rgb:51, 51, 51;--post-primary-rgb:51, 51, 51;--post-white-rgb:255, 255, 255;--post-black-rgb:0, 0, 0;--post-info-rgb:204, 228, 238;--post-success-rgb:44, 145, 28;--post-warning-rgb:244, 158, 0;--post-danger-rgb:165, 23, 40;--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;--post-success-green-rgb:44, 135, 29;--post-error-red-rgb:165, 23, 40;--post-warning-orange-rgb:244, 158, 0;--post-success-background-rgb:192, 222, 187;--post-error-background-rgb:255, 218, 222;--post-warning-background-rgb:252, 226, 178}.accordion-item{border-block:2px solid #666;--post-bg-rgb:244, 243, 241}.accordion-item+.accordion-item{border-block-start:0}.bg-light .accordion-item{--post-bg-rgb:255, 255, 255}.bg-gray .accordion-item{--post-bg-rgb:255, 255, 255}.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;-webkit-appearance:button;appearance:button;outline:none;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}.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 xml:space='preserve' viewBox='0 0 32 32' xmlns='http://www.w3.org/2000/svg'%3E%3Cg id='icon'%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/g%3E%3C/svg%3E\");mask-image:url(\"data:image/svg+xml,%3Csvg xml:space='preserve' viewBox='0 0 32 32' xmlns='http://www.w3.org/2000/svg'%3E%3Cg id='icon'%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/g%3E%3C/svg%3E\");background-color:currentColor;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:300}.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-collapsible+post-collapsible::part(accordion-item){border-block-start:0 !important}";const m=class{constructor(r){o(this,r);this.collapseChange=t(this,"collapseChange",7);this.isLoaded=false;this.id=undefined;this.isOpen=true;this.hasHeader=undefined;this.headingTag=undefined;this.collapsed=false;this.headingLevel=2}validateCollapsed(o=this.collapsed){a(o,"boolean","The `collapsed` property of the `post-collapsible` must be a boolean.")}validateHeadingLevel(o=this.headingLevel){n(o,h,"The `headingLevel` property of the `post-collapsible` must be a number between 1 and 6.")}connectedCallback(){this.validateCollapsed();this.validateHeadingLevel()}componentWillRender(){var o;this.id=this.host.id||`c${crypto.randomUUID()}`;this.hasHeader=this.host.querySelectorAll('[slot="header"]').length>0;this.headingTag=`h${(o=this.headingLevel)!==null&&o!==void 0?o:2}`}componentDidLoad(){if(this.collapsed)void this.toggle(false);this.isLoaded=true}async toggle(o=!this.isOpen){if(o===this.isOpen)return o;this.isOpen=!this.isOpen;if(this.isLoaded)this.collapseChange.emit();const t=o?b(this.collapsible):g(this.collapsible);if(!this.isLoaded||c())t.finish();await t.finished;t.commitStyles();return this.isOpen}render(){const o=r("div",{"aria-labelledby":this.hasHeader?`${this.id}--header`:undefined,class:`collapse${this.hasHeader?" accordion-collapse":""}`,id:`${this.id}--collapse`,ref:o=>this.collapsible=o},this.hasHeader?r("div",{class:"accordion-body"},r("slot",null)):r("slot",null));return r(s,{id:this.id,"data-version":i},this.hasHeader?r("div",{part:"accordion-item",class:"accordion-item"},r(this.headingTag,{class:"accordion-header",id:`${this.id}--header`},r("button",{"aria-controls":`${this.id}--collapse`,"aria-expanded":`${this.isOpen}`,class:`accordion-button${this.isOpen?"":" collapsed"}`,onClick:()=>this.toggle(),type:"button"},r("slot",{name:"header"}))),o):o)}get host(){return e(this)}static get watchers(){return{collapsed:["validateCollapsed"],headingLevel:["validateHeadingLevel"]}}};m.style=u;export{m as P};
|
|
2
|
-
//# sourceMappingURL=p-eaddd6cc.js.map
|
|
@@ -1 +0,0 @@
|
|
|
1
|
-
{"version":3,"names":["isMotionReduced","window","matchMedia","matches","collapseDuration","collapseEasing","collapsedKeyframe","height","overflow","collapse","el","getComputedStyle","expandedKeyframe","animate","duration","easing","fill","expand","scrollHeight","HEADING_LEVELS","postCollapsibleCss","PostCollapsible","this","isLoaded","validateCollapsed","newValue","collapsed","checkEmptyOrType","validateHeadingLevel","headingLevel","checkEmptyOrOneOf","connectedCallback","componentWillRender","id","host","crypto","randomUUID","hasHeader","querySelectorAll","length","headingTag","_a","componentDidLoad","toggle","open","isOpen","collapseChange","emit","animation","collapsible","finish","finished","commitStyles","render","h","undefined","class","ref","Host","version","part","onClick","type","name"],"sources":["src/utils/is-motion-reduced.ts","src/animations/collapse.ts","src/components/post-collapsible/heading-levels.ts","src/components/post-collapsible/post-collapsible.scss?tag=post-collapsible&encapsulation=shadow","src/components/post-collapsible/post-collapsible.tsx"],"sourcesContent":["export function isMotionReduced(): boolean {\n return window.matchMedia('(prefers-reduced-motion: reduce)').matches;\n}\n","const collapseDuration = 350;\nconst collapseEasing = 'ease';\nconst collapsedKeyframe: Keyframe = { height: '0', overflow: 'hidden' };\n\nexport const collapse = (el: HTMLElement): Animation => {\n const { height } = window.getComputedStyle(el);\n const expandedKeyframe: Keyframe = { height };\n\n return el.animate(\n [expandedKeyframe, collapsedKeyframe],\n { duration: collapseDuration, easing: collapseEasing, fill: 'forwards' },\n );\n};\n\nexport const expand = (el: HTMLElement): Animation => {\n const expandedKeyframe: Keyframe = { height: `${el.scrollHeight}px` };\n\n return el.animate(\n [collapsedKeyframe, expandedKeyframe],\n { duration: collapseDuration, easing: collapseEasing, fill: 'forwards' },\n );\n};\n","export const HEADING_LEVELS = [1, 2, 3, 4, 5, 6] as const;\n\nexport type HeadingLevel = typeof HEADING_LEVELS[number];\n","@use '@swisspost/design-system-styles/components/accordion';\n\n:host {\n display: block;\n}\n\n.accordion-button {\n cursor: pointer;\n\n > ::slotted(.text-truncate) {\n display: block;\n }\n}\n\npost-collapsible + post-collapsible::part(accordion-item) {\n border-block-start: 0!important;\n}\n","import {\n Component,\n Element,\n Event,\n EventEmitter,\n h,\n Host,\n Method,\n Prop,\n State,\n Watch,\n} from '@stencil/core';\nimport { version } from '../../../package.json';\nimport { collapse, expand } from '../../animations/collapse';\nimport { checkEmptyOrOneOf, checkEmptyOrType, isMotionReduced } from '../../utils';\nimport { HEADING_LEVELS, HeadingLevel } from './heading-levels';\n\n@Component({\n tag: 'post-collapsible',\n styleUrl: 'post-collapsible.scss',\n shadow: true,\n})\nexport class PostCollapsible {\n private isLoaded = false;\n private collapsible: HTMLElement;\n\n @Element() host: HTMLPostCollapsibleElement;\n\n @State() id: string;\n @State() isOpen = true;\n @State() hasHeader: boolean;\n @State() headingTag: string;\n\n /**\n * If `true`, the element is initially collapsed otherwise it is displayed.\n */\n @Prop() readonly collapsed?: boolean = false;\n\n @Watch('collapsed')\n validateCollapsed(newValue = this.collapsed) {\n checkEmptyOrType(\n newValue,\n 'boolean',\n 'The `collapsed` property of the `post-collapsible` must be a boolean.',\n );\n }\n\n /**\n * Defines the hierarchical level of the collapsible header within the headings structure.\n */\n @Prop() readonly headingLevel?: HeadingLevel = 2;\n\n @Watch('headingLevel')\n validateHeadingLevel(newValue = this.headingLevel) {\n checkEmptyOrOneOf(\n newValue,\n HEADING_LEVELS,\n 'The `headingLevel` property of the `post-collapsible` must be a number between 1 and 6.',\n );\n }\n\n /**\n * An event emitted when the collapse element is shown or hidden, before the transition. It has no payload.\n */\n @Event() collapseChange: EventEmitter<void>;\n\n connectedCallback() {\n this.validateCollapsed();\n this.validateHeadingLevel();\n }\n\n componentWillRender() {\n this.id = this.host.id || `c${crypto.randomUUID()}`;\n this.hasHeader = this.host.querySelectorAll('[slot=\"header\"]').length > 0;\n this.headingTag = `h${this.headingLevel ?? 2}`;\n }\n\n componentDidLoad() {\n if (this.collapsed) void this.toggle(false);\n this.isLoaded = true;\n }\n\n /**\n * Triggers the collapse programmatically.\n *\n * If there is a collapsing transition running already, it will be reversed.\n */\n @Method()\n async toggle(open = !this.isOpen): Promise<boolean> {\n if (open === this.isOpen) return open;\n\n this.isOpen = !this.isOpen;\n if (this.isLoaded) this.collapseChange.emit();\n\n const animation = open ? expand(this.collapsible) : collapse(this.collapsible);\n\n if (!this.isLoaded || isMotionReduced()) animation.finish();\n\n await animation.finished;\n\n animation.commitStyles();\n\n return this.isOpen;\n }\n\n render() {\n const collapse = (\n <div\n aria-labelledby={this.hasHeader ? `${this.id}--header` : undefined}\n class={`collapse${this.hasHeader ? ' accordion-collapse' : ''}`}\n id={`${this.id}--collapse`}\n ref={el => (this.collapsible = el)}\n >\n {this.hasHeader ? (\n <div class=\"accordion-body\">\n <slot />\n </div>\n ) : (\n <slot />\n )}\n </div>\n );\n\n return (\n <Host id={this.id} data-version={version}>\n {this.hasHeader ? (\n <div part=\"accordion-item\" class=\"accordion-item\">\n <this.headingTag class=\"accordion-header\" id={`${this.id}--header`}>\n <button\n aria-controls={`${this.id}--collapse`}\n aria-expanded={`${this.isOpen}`}\n class={`accordion-button${this.isOpen ? '' : ' collapsed'}`}\n onClick={() => this.toggle()}\n type=\"button\"\n >\n <slot name=\"header\" />\n </button>\n </this.headingTag>\n\n {collapse}\n </div>\n ) : (\n collapse\n )}\n </Host>\n );\n }\n}\n"],"mappings":"wJAAgBA,IACd,OAAOC,OAAOC,WAAW,oCAAoCC,OAC/D,CCFA,MAAMC,EAAmB,IACzB,MAAMC,EAAiB,OACvB,MAAMC,EAA8B,CAAEC,OAAQ,IAAKC,SAAU,UAEtD,MAAMC,EAAYC,IACvB,MAAMH,OAAEA,GAAWN,OAAOU,iBAAiBD,GAC3C,MAAME,EAA6B,CAAEL,UAErC,OAAOG,EAAGG,QACR,CAACD,EAAkBN,GACnB,CAAEQ,SAAUV,EAAkBW,OAAQV,EAAgBW,KAAM,YAC7D,EAGI,MAAMC,EAAUP,IACrB,MAAME,EAA6B,CAAEL,OAAQ,GAAGG,EAAGQ,kBAEnD,OAAOR,EAAGG,QACR,CAACP,EAAmBM,GACpB,CAAEE,SAAUV,EAAkBW,OAAQV,EAAgBW,KAAM,YAC7D,ECpBI,MAAMG,EAAiB,CAAC,EAAG,EAAG,EAAG,EAAG,EAAG,GCA9C,MAAMC,EAAqB,8uJ,MCsBdC,EAAe,M,wEAClBC,KAAAC,SAAW,M,8BAMD,K,kEAOqB,M,kBAcQ,C,CAX/C,iBAAAC,CAAkBC,EAAWH,KAAKI,WAChCC,EACEF,EACA,UACA,wE,CAUJ,oBAAAG,CAAqBH,EAAWH,KAAKO,cACnCC,EACEL,EACAN,EACA,0F,CASJ,iBAAAY,GACET,KAAKE,oBACLF,KAAKM,sB,CAGP,mBAAAI,G,MACEV,KAAKW,GAAKX,KAAKY,KAAKD,IAAM,IAAIE,OAAOC,eACrCd,KAAKe,UAAYf,KAAKY,KAAKI,iBAAiB,mBAAmBC,OAAS,EACxEjB,KAAKkB,WAAa,KAAIC,EAAAnB,KAAKO,gBAAY,MAAAY,SAAA,EAAAA,EAAI,G,CAG7C,gBAAAC,GACE,GAAIpB,KAAKI,eAAgBJ,KAAKqB,OAAO,OACrCrB,KAAKC,SAAW,I,CASlB,YAAMoB,CAAOC,GAAQtB,KAAKuB,QACxB,GAAID,IAAStB,KAAKuB,OAAQ,OAAOD,EAEjCtB,KAAKuB,QAAUvB,KAAKuB,OACpB,GAAIvB,KAAKC,SAAUD,KAAKwB,eAAeC,OAEvC,MAAMC,EAAYJ,EAAO3B,EAAOK,KAAK2B,aAAexC,EAASa,KAAK2B,aAElE,IAAK3B,KAAKC,UAAYvB,IAAmBgD,EAAUE,eAE7CF,EAAUG,SAEhBH,EAAUI,eAEV,OAAO9B,KAAKuB,M,CAGd,MAAAQ,GACE,MAAM5C,EACJ6C,EAAA,yBACmBhC,KAAKe,UAAY,GAAGf,KAAKW,aAAesB,UACzDC,MAAO,WAAWlC,KAAKe,UAAY,sBAAwB,KAC3DJ,GAAI,GAAGX,KAAKW,eACZwB,IAAK/C,GAAOY,KAAK2B,YAAcvC,GAE9BY,KAAKe,UACJiB,EAAA,OAAKE,MAAM,kBACTF,EAAA,cAGFA,EAAA,cAKN,OACEA,EAACI,EAAI,CAACzB,GAAIX,KAAKW,GAAE,eAAgB0B,GAC9BrC,KAAKe,UACJiB,EAAA,OAAKM,KAAK,iBAAiBJ,MAAM,kBAC/BF,EAAChC,KAAKkB,WAAU,CAACgB,MAAM,mBAAmBvB,GAAI,GAAGX,KAAKW,cACpDqB,EAAA,0BACiB,GAAGhC,KAAKW,eAAc,gBACtB,GAAGX,KAAKuB,SACvBW,MAAO,mBAAmBlC,KAAKuB,OAAS,GAAK,eAC7CgB,QAAS,IAAMvC,KAAKqB,SACpBmB,KAAK,UAELR,EAAA,QAAMS,KAAK,aAIdtD,GACG,E"}
|
/package/dist/collection/components/{post-collapsible → post-accordion-item}/heading-levels.js
RENAMED
|
File without changes
|
|
File without changes
|
|
File without changes
|
|
File without changes
|
|
File without changes
|
|
File without changes
|
|
File without changes
|
|
File without changes
|
|
File without changes
|
|
File without changes
|
|
File without changes
|
|
File without changes
|
|
File without changes
|
|
File without changes
|
|
File without changes
|
|
File without changes
|
|
File without changes
|
|
File without changes
|
|
File without changes
|