@swisspost/design-system-components 7.4.9 → 7.4.11

package/dist/collection/components/post-icon/post-icon.js

@@ -16,8 +16,6 @@ const ANIMATION_KEYS = [...ANIMATION_NAMES];
  */
 export class PostIcon {
     constructor() {
-        this.svgStyles = undefined;
-        this.svgOutput = undefined;
         this.animation = null;
         this.base = null;
         this.flipH = false;
@@ -49,6 +47,64 @@ export class PostIcon {
     validateScale(newValue = this.scale) {
         checkEmptyOrType(newValue, 'number', 'The post-icon "scale" prop should be a number.');
     }
+    // Construct the icon url from different possible sources
+    getUrl() {
+        var _a, _b, _c, _d, _e, _f, _g;
+        // the first definition object which defines a domain, will be used to set the domain of the file url
+        // the first definition object which defines a slug, will be used to set the slug of the file url
+        const urlDefinitions = [
+            getUrlDefinition(this.base, 'both'),
+            getUrlDefinition((_a = document.head
+                .querySelector('meta[name="design-system-settings"][data-post-icon-base]')) === null || _a === void 0 ? void 0 : _a.getAttribute('data-post-icon-base'), 'relative'),
+            getUrlDefinition((_b = document.querySelector('base[href]')) === null || _b === void 0 ? void 0 : _b.getAttribute('href'), 'both'),
+        ];
+        // in case no other definition defines a domain, the current origin is used as a fallback
+        const origin = (_e = (_d = (_c = urlDefinitions.find(d => d.definesDomain)) === null || _c === void 0 ? void 0 : _c.url) === null || _d === void 0 ? void 0 : _d.origin) !== null && _e !== void 0 ? _e : window.location.origin;
+        // in case no other definition defines a slug, the cdn url is used as a fallback
+        const slug = (_g = (_f = urlDefinitions.find(d => d.definesSlug)) === null || _f === void 0 ? void 0 : _f.url) === null || _g === void 0 ? void 0 : _g.pathname;
+        const file = `${this.name}.svg`;
+        let url;
+        if (slug) {
+            url = new URL(`${origin}${slug}/${file}`).toString();
+        }
+        else {
+            url = new URL(`${CDN_URL}/${file}`).toString();
+        }
+        return url;
+        function getUrlDefinition(url, allow) {
+            return {
+                url: getUrlObject(url),
+                definesDomain: allow !== 'relative' ? definesDomain(url) : false,
+                definesSlug: allow !== 'absolute' ? definesSlug(url) : false,
+            };
+            function getUrlObject(url) {
+                if (url) {
+                    return definesDomain(url) ? new URL(url) : new URL(url, window.location.origin);
+                }
+                else {
+                    return null;
+                }
+            }
+            function definesDomain(url) {
+                return url ? /^https?:\/\//.test(url) : false;
+            }
+            function definesSlug(url) {
+                const urlObject = getUrlObject(url);
+                return Boolean(/^\/.+/.test(urlObject === null || urlObject === void 0 ? void 0 : urlObject.pathname));
+            }
+        }
+    }
+    getStyles() {
+        const url = this.getUrl();
+        return Object.entries({
+            '-webkit-mask-image': `url(${url})`,
+            'mask-image': `url('${url}')`,
+            'transform': (this.scale && !isNaN(Number(this.scale)) ? 'scale(' + this.scale + ')' : '') +
+                (this.rotate && !isNaN(Number(this.rotate)) ? ' rotate(' + this.rotate + 'deg)' : ''),
+        })
+            .filter(([_key, value]) => value !== null)
+            .reduce((styles, [key, value]) => Object.assign(styles, { [key]: value }), {});
+    }
     componentDidLoad() {
         this.validateBase();
         this.validateName();
@@ -58,30 +114,8 @@ export class PostIcon {
         this.validateRotate();
         this.validateAnimation();
     }
-    componentWillRender() {
-        this.setPath();
-    }
-    setPath() {
-        var _a, _b, _c, _d;
-        // Construct icon path from different possible sources
-        const metaBase = (_b = (_a = document.head
-            .querySelector('meta[name="design-system-settings"][data-post-icon-base]')) === null || _a === void 0 ? void 0 : _a.getAttribute('data-post-icon-base')) !== null && _b !== void 0 ? _b : null;
-        const fileBase = `${(_d = (_c = this.base) !== null && _c !== void 0 ? _c : metaBase) !== null && _d !== void 0 ? _d : CDN_URL}/`.replace(/\/\/$/, '/');
-        const fileName = `${this.name}.svg`;
-        const filePath = `${fileBase}${fileName}`;
-        this.path = new URL(filePath, window.location.origin).toString();
-    }
     render() {
-        // create inline styles for some properties
-        const svgStyles = 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(([_key, value]) => value !== null)
-            .reduce((styles, [key, value]) => Object.assign(styles, { [key]: value }), {});
-        return (h(Host, { key: 'c4744bef990eef90a7de44312fd349583b295f4c', "data-version": version }, h("span", { key: '0655e0d6ada2b822bf4b3c399dcf63000e26bf46', style: svgStyles })));
+        return (h(Host, { key: 'a38838bcd99af618f660ec4ffef4e869cdab3995', "data-version": version }, h("span", { key: '24ae06bdb0aa65ddca7ac88fac9bb6bb5a12550a', style: this.getStyles() })));
     }
     static get is() { return "post-icon"; }
     static get encapsulation() { return "shadow"; }
@@ -229,12 +263,6 @@ export class PostIcon {
             }
         };
     }
-    static get states() {
-        return {
-            "svgStyles": {},
-            "svgOutput": {}
-        };
-    }
     static get elementRef() { return "host"; }
     static get watchers() {
         return [{

package/dist/components/package.js

@@ -1,3 +1,3 @@
-const version = "7.4.9";
+const version = "7.4.11";
 
 export { version as v };

package/dist/components/post-icon2.js

@@ -22,8 +22,6 @@ const PostIcon = /*@__PURE__*/ proxyCustomElement(class PostIcon extends HTMLEle
         super();
         this.__registerHost();
         this.__attachShadow();
-        this.svgStyles = undefined;
-        this.svgOutput = undefined;
         this.animation = null;
         this.base = null;
         this.flipH = false;
@@ -55,6 +53,64 @@ const PostIcon = /*@__PURE__*/ proxyCustomElement(class PostIcon extends HTMLEle
     validateScale(newValue = this.scale) {
         checkEmptyOrType(newValue, 'number', 'The post-icon "scale" prop should be a number.');
     }
+    // Construct the icon url from different possible sources
+    getUrl() {
+        var _a, _b, _c, _d, _e, _f, _g;
+        // the first definition object which defines a domain, will be used to set the domain of the file url
+        // the first definition object which defines a slug, will be used to set the slug of the file url
+        const urlDefinitions = [
+            getUrlDefinition(this.base, 'both'),
+            getUrlDefinition((_a = document.head
+                .querySelector('meta[name="design-system-settings"][data-post-icon-base]')) === null || _a === void 0 ? void 0 : _a.getAttribute('data-post-icon-base'), 'relative'),
+            getUrlDefinition((_b = document.querySelector('base[href]')) === null || _b === void 0 ? void 0 : _b.getAttribute('href'), 'both'),
+        ];
+        // in case no other definition defines a domain, the current origin is used as a fallback
+        const origin = (_e = (_d = (_c = urlDefinitions.find(d => d.definesDomain)) === null || _c === void 0 ? void 0 : _c.url) === null || _d === void 0 ? void 0 : _d.origin) !== null && _e !== void 0 ? _e : window.location.origin;
+        // in case no other definition defines a slug, the cdn url is used as a fallback
+        const slug = (_g = (_f = urlDefinitions.find(d => d.definesSlug)) === null || _f === void 0 ? void 0 : _f.url) === null || _g === void 0 ? void 0 : _g.pathname;
+        const file = `${this.name}.svg`;
+        let url;
+        if (slug) {
+            url = new URL(`${origin}${slug}/${file}`).toString();
+        }
+        else {
+            url = new URL(`${CDN_URL}/${file}`).toString();
+        }
+        return url;
+        function getUrlDefinition(url, allow) {
+            return {
+                url: getUrlObject(url),
+                definesDomain: allow !== 'relative' ? definesDomain(url) : false,
+                definesSlug: allow !== 'absolute' ? definesSlug(url) : false,
+            };
+            function getUrlObject(url) {
+                if (url) {
+                    return definesDomain(url) ? new URL(url) : new URL(url, window.location.origin);
+                }
+                else {
+                    return null;
+                }
+            }
+            function definesDomain(url) {
+                return url ? /^https?:\/\//.test(url) : false;
+            }
+            function definesSlug(url) {
+                const urlObject = getUrlObject(url);
+                return Boolean(/^\/.+/.test(urlObject === null || urlObject === void 0 ? void 0 : urlObject.pathname));
+            }
+        }
+    }
+    getStyles() {
+        const url = this.getUrl();
+        return Object.entries({
+            '-webkit-mask-image': `url(${url})`,
+            'mask-image': `url('${url}')`,
+            'transform': (this.scale && !isNaN(Number(this.scale)) ? 'scale(' + this.scale + ')' : '') +
+                (this.rotate && !isNaN(Number(this.rotate)) ? ' rotate(' + this.rotate + 'deg)' : ''),
+        })
+            .filter(([_key, value]) => value !== null)
+            .reduce((styles, [key, value]) => Object.assign(styles, { [key]: value }), {});
+    }
     componentDidLoad() {
         this.validateBase();
         this.validateName();
@@ -64,30 +120,8 @@ const PostIcon = /*@__PURE__*/ proxyCustomElement(class PostIcon extends HTMLEle
         this.validateRotate();
         this.validateAnimation();
     }
-    componentWillRender() {
-        this.setPath();
-    }
-    setPath() {
-        var _a, _b, _c, _d;
-        // Construct icon path from different possible sources
-        const metaBase = (_b = (_a = document.head
-            .querySelector('meta[name="design-system-settings"][data-post-icon-base]')) === null || _a === void 0 ? void 0 : _a.getAttribute('data-post-icon-base')) !== null && _b !== void 0 ? _b : null;
-        const fileBase = `${(_d = (_c = this.base) !== null && _c !== void 0 ? _c : metaBase) !== null && _d !== void 0 ? _d : CDN_URL}/`.replace(/\/\/$/, '/');
-        const fileName = `${this.name}.svg`;
-        const filePath = `${fileBase}${fileName}`;
-        this.path = new URL(filePath, window.location.origin).toString();
-    }
     render() {
-        // create inline styles for some properties
-        const svgStyles = 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(([_key, value]) => value !== null)
-            .reduce((styles, [key, value]) => Object.assign(styles, { [key]: value }), {});
-        return (h(Host, { key: 'c4744bef990eef90a7de44312fd349583b295f4c', "data-version": version }, h("span", { key: '0655e0d6ada2b822bf4b3c399dcf63000e26bf46', style: svgStyles })));
+        return (h(Host, { key: 'a38838bcd99af618f660ec4ffef4e869cdab3995', "data-version": version }, h("span", { key: '24ae06bdb0aa65ddca7ac88fac9bb6bb5a12550a', style: this.getStyles() })));
     }
     get host() { return this; }
     static get watchers() { return {
@@ -107,9 +141,7 @@ const PostIcon = /*@__PURE__*/ proxyCustomElement(class PostIcon extends HTMLEle
         "flipV": [4, "flip-v"],
         "name": [1],
         "rotate": [2],
-        "scale": [2],
-        "svgStyles": [32],
-        "svgOutput": [32]
+        "scale": [2]
     }, undefined, {
         "animation": ["validateAnimation"],
         "base": ["validateBase"],

package/dist/docs.json

@@ -1,5 +1,5 @@
 {
-  "timestamp": "2025-01-13T10:58:23",
+  "timestamp": "2025-02-10T09:09:54",
   "compiler": {
     "name": "@stencil/core",
     "version": "4.19.1",

package/dist/esm/index.js

@@ -1,20 +1,20 @@
-export { P as PostAccordion } from './post-accordion-b512017b.js';
-export { P as PostAccordionItem } from './post-accordion-item-d73cbfe0.js';
-export { P as PostAlert } from './post-alert-cbdc31be.js';
-export { P as PostCardControl } from './post-card-control-f052ae55.js';
-export { P as PostCollapsible } from './post-collapsible-66a26663.js';
-export { P as PostCollapsibleTrigger } from './post-collapsible-trigger-8394bbca.js';
-export { P as PostIcon } from './post-icon-02a5642f.js';
-export { P as PostPopover } from './post-popover-f371fc52.js';
-export { P as PostPopovercontainer } from './post-popovercontainer-a93f59dc.js';
-export { P as PostRating } from './post-rating-00af74f1.js';
-export { P as PostTabs } from './post-tabs-aef1b257.js';
-export { P as PostTabHeader } from './post-tab-header-1c89d427.js';
-export { P as PostTabPanel } from './post-tab-panel-c9487339.js';
-export { P as PostTooltip } from './post-tooltip-92c953eb.js';
-export { P as PostTag } from './post-tag-803bfa89.js';
+export { P as PostAccordion } from './post-accordion-e140a9d4.js';
+export { P as PostAccordionItem } from './post-accordion-item-03203ecd.js';
+export { P as PostAlert } from './post-alert-a9791ef2.js';
+export { P as PostCardControl } from './post-card-control-8ef31b10.js';
+export { P as PostCollapsible } from './post-collapsible-fdeee1a8.js';
+export { P as PostCollapsibleTrigger } from './post-collapsible-trigger-bfa217db.js';
+export { P as PostIcon } from './post-icon-27bb7505.js';
+export { P as PostPopover } from './post-popover-77691872.js';
+export { P as PostPopovercontainer } from './post-popovercontainer-e81c8c09.js';
+export { P as PostRating } from './post-rating-23f986bf.js';
+export { P as PostTabs } from './post-tabs-e7b19b56.js';
+export { P as PostTabHeader } from './post-tab-header-ee7a4c4a.js';
+export { P as PostTabPanel } from './post-tab-panel-e4514e2c.js';
+export { P as PostTooltip } from './post-tooltip-f5942d2f.js';
+export { P as PostTag } from './post-tag-83a1f5cd.js';
 import './index-9ace3232.js';
-import './package-db4481b4.js';
+import './package-9d6426d1.js';
 import './heading-levels-5b7b4349.js';
 import './check-one-of-6b3ef8eb.js';
 import './index-29d17d6d.js';

package/dist/esm/loader.js

@@ -5,7 +5,7 @@ import { g as globalScripts } from './app-globals-0f993ce5.js';
 const defineCustomElements = async (win, options) => {
   if (typeof window === 'undefined') return undefined;
   await globalScripts();
-  return bootstrapLazy([["post-accordion-item",[[1,"post-accordion-item",{"collapsed":[1028],"headingLevel":[2,"heading-level"],"id":[32],"toggle":[64]},[[2,"postToggle","onCollapseToggle"]],{"headingLevel":["validateHeadingLevel"]}]]],["post-alert",[[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"]}]]],["post-card-control",[[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"]}]]],["post-popovercontainer",[[4,"post-popovercontainer",{"placement":[1],"arrow":[4],"show":[64],"hide":[64],"toggle":[64]}]]],["post-popover",[[1,"post-popover",{"placement":[1],"closeButtonCaption":[1,"close-button-caption"],"arrow":[4],"show":[64],"hide":[64],"toggle":[64]}]]],["post-rating",[[1,"post-rating",{"label":[1],"stars":[2],"currentRating":[1026,"current-rating"],"readonly":[4],"hoveredIndex":[32]}]]],["post-tag",[[1,"post-tag",{"variant":[1],"size":[1],"icon":[1],"classes":[32]},null,{"variant":["variantChanged"],"size":["sizeChanged"]}]]],["post-tooltip",[[1,"post-tooltip",{"placement":[1],"arrow":[4],"delayed":[4],"show":[64],"hide":[64],"toggle":[64]},null,{"delayed":["validateDelayed"]}]]],["post-accordion",[[1,"post-accordion",{"headingLevel":[2,"heading-level"],"multiple":[4],"toggle":[64],"expandAll":[64],"collapseAll":[64]},[[0,"postToggle","collapseToggleHandler"]],{"headingLevel":["validateHeadingLevel"]}]]],["post-collapsible-trigger",[[0,"post-collapsible-trigger",{"for":[1],"update":[64]},[[4,"postToggle","setAriaExpanded"]],{"for":["setAriaAttributes"]}]]],["post-tab-header",[[1,"post-tab-header",{"panel":[1],"tabId":[32]},null,{"panel":["validateFor"]}]]],["post-tab-panel",[[1,"post-tab-panel",{"name":[1],"panelId":[32]}]]],["post-tabs",[[1,"post-tabs",{"activePanel":[1,"active-panel"],"show":[64]}]]],["post-collapsible",[[1,"post-collapsible",{"collapsed":[1028],"toggle":[64]},null,{"collapsed":["collapsedChange"]}]]],["post-icon",[[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"]}]]]], options);
+  return bootstrapLazy([["post-accordion-item",[[1,"post-accordion-item",{"collapsed":[1028],"headingLevel":[2,"heading-level"],"id":[32],"toggle":[64]},[[2,"postToggle","onCollapseToggle"]],{"headingLevel":["validateHeadingLevel"]}]]],["post-alert",[[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"]}]]],["post-card-control",[[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"]}]]],["post-popovercontainer",[[4,"post-popovercontainer",{"placement":[1],"arrow":[4],"show":[64],"hide":[64],"toggle":[64]}]]],["post-popover",[[1,"post-popover",{"placement":[1],"closeButtonCaption":[1,"close-button-caption"],"arrow":[4],"show":[64],"hide":[64],"toggle":[64]}]]],["post-rating",[[1,"post-rating",{"label":[1],"stars":[2],"currentRating":[1026,"current-rating"],"readonly":[4],"hoveredIndex":[32]}]]],["post-tag",[[1,"post-tag",{"variant":[1],"size":[1],"icon":[1],"classes":[32]},null,{"variant":["variantChanged"],"size":["sizeChanged"]}]]],["post-tooltip",[[1,"post-tooltip",{"placement":[1],"arrow":[4],"delayed":[4],"show":[64],"hide":[64],"toggle":[64]},null,{"delayed":["validateDelayed"]}]]],["post-accordion",[[1,"post-accordion",{"headingLevel":[2,"heading-level"],"multiple":[4],"toggle":[64],"expandAll":[64],"collapseAll":[64]},[[0,"postToggle","collapseToggleHandler"]],{"headingLevel":["validateHeadingLevel"]}]]],["post-collapsible-trigger",[[0,"post-collapsible-trigger",{"for":[1],"update":[64]},[[4,"postToggle","setAriaExpanded"]],{"for":["setAriaAttributes"]}]]],["post-tab-header",[[1,"post-tab-header",{"panel":[1],"tabId":[32]},null,{"panel":["validateFor"]}]]],["post-tab-panel",[[1,"post-tab-panel",{"name":[1],"panelId":[32]}]]],["post-tabs",[[1,"post-tabs",{"activePanel":[1,"active-panel"],"show":[64]}]]],["post-collapsible",[[1,"post-collapsible",{"collapsed":[1028],"toggle":[64]},null,{"collapsed":["collapsedChange"]}]]],["post-icon",[[1,"post-icon",{"animation":[1],"base":[1],"flipH":[4,"flip-h"],"flipV":[4,"flip-v"],"name":[1],"rotate":[2],"scale":[2]},null,{"animation":["validateAnimation"],"base":["validateBase"],"flipH":["validateFlipH"],"flipV":["validateFlipV"],"name":["validateName"],"rotate":["validateRotate"],"scale":["validateScale"]}]]]], options);
 };
 
 export { defineCustomElements };

package/dist/esm/{package-db4481b4.js → package-9d6426d1.js}

@@ -1,3 +1,3 @@
-const version = "7.4.9";
+const version = "7.4.11";
 
 export { version as v };

package/dist/esm/{post-accordion-b512017b.js → post-accordion-e140a9d4.js}

@@ -1,5 +1,5 @@
 import { r as registerInstance, h, H as Host, g as getElement } from './index-9ace3232.js';
-import { v as version } from './package-db4481b4.js';
+import { v as version } from './package-9d6426d1.js';
 import { H as HEADING_LEVELS } from './heading-levels-5b7b4349.js';
 import { c as checkOneOf } from './check-one-of-6b3ef8eb.js';
 

package/dist/esm/{post-accordion-item-d73cbfe0.js → post-accordion-item-03203ecd.js}

@@ -1,5 +1,5 @@
 import { r as registerInstance, h, H as Host, g as getElement } from './index-9ace3232.js';
-import { v as version } from './package-db4481b4.js';
+import { v as version } from './package-9d6426d1.js';
 import { H as HEADING_LEVELS } from './heading-levels-5b7b4349.js';
 import { c as checkEmptyOrOneOf } from './index-29d17d6d.js';
 

package/dist/esm/post-accordion-item.entry.js

@@ -1,6 +1,6 @@
-export { P as post_accordion_item } from './post-accordion-item-d73cbfe0.js';
+export { P as post_accordion_item } from './post-accordion-item-03203ecd.js';
 import './index-9ace3232.js';
-import './package-db4481b4.js';
+import './package-9d6426d1.js';
 import './heading-levels-5b7b4349.js';
 import './index-29d17d6d.js';
 import './constants-8d548297.js';

package/dist/esm/post-accordion.entry.js

@@ -1,5 +1,5 @@
-export { P as post_accordion } from './post-accordion-b512017b.js';
+export { P as post_accordion } from './post-accordion-e140a9d4.js';
 import './index-9ace3232.js';
-import './package-db4481b4.js';
+import './package-9d6426d1.js';
 import './heading-levels-5b7b4349.js';
 import './check-one-of-6b3ef8eb.js';

package/dist/esm/{post-alert-cbdc31be.js → post-alert-a9791ef2.js}

@@ -1,5 +1,5 @@
 import { r as registerInstance, c as createEvent, h, H as Host, g as getElement } from './index-9ace3232.js';
-import { v as version } from './package-db4481b4.js';
+import { v as version } from './package-9d6426d1.js';
 import { f as fadeOut } from './fade-7fd71785.js';
 import { a as checkEmptyOrPattern, c as checkEmptyOrOneOf } from './index-29d17d6d.js';
 import { c as checkType } from './check-type-8828dbe4.js';

package/dist/esm/post-alert.entry.js

@@ -1,6 +1,6 @@
-export { P as post_alert } from './post-alert-cbdc31be.js';
+export { P as post_alert } from './post-alert-a9791ef2.js';
 import './index-9ace3232.js';
-import './package-db4481b4.js';
+import './package-9d6426d1.js';
 import './fade-7fd71785.js';
 import './index-29d17d6d.js';
 import './constants-8d548297.js';

package/dist/esm/{post-card-control-f052ae55.js → post-card-control-8ef31b10.js}

@@ -1,7 +1,7 @@
 import { r as registerInstance, c as createEvent, h, H as Host, g as getElement } from './index-9ace3232.js';
 import { c as checkOneOf } from './check-one-of-6b3ef8eb.js';
 import { c as checkNonEmpty } from './check-non-empty-58bd6b17.js';
-import { v as version } from './package-db4481b4.js';
+import { v as version } from './package-9d6426d1.js';
 
 function parse(scss) {
     return Object.entries(scss).reduce((object, [path, value]) => {

package/dist/esm/post-card-control.entry.js

@@ -1,6 +1,6 @@
-export { P as post_card_control } from './post-card-control-f052ae55.js';
+export { P as post_card_control } from './post-card-control-8ef31b10.js';
 import './index-9ace3232.js';
 import './check-one-of-6b3ef8eb.js';
 import './check-non-empty-58bd6b17.js';
 import './constants-8d548297.js';
-import './package-db4481b4.js';
+import './package-9d6426d1.js';

package/dist/esm/{post-collapsible-66a26663.js → post-collapsible-fdeee1a8.js}

@@ -1,5 +1,5 @@
 import { r as registerInstance, c as createEvent, h, H as Host, g as getElement } from './index-9ace3232.js';
-import { v as version } from './package-db4481b4.js';
+import { v as version } from './package-9d6426d1.js';
 import { b as checkEmptyOrType } from './index-29d17d6d.js';
 
 function isMotionReduced() {

package/dist/esm/{post-collapsible-trigger-8394bbca.js → post-collapsible-trigger-bfa217db.js}

@@ -1,5 +1,5 @@
 import { r as registerInstance, g as getElement } from './index-9ace3232.js';
-import { v as version } from './package-db4481b4.js';
+import { v as version } from './package-9d6426d1.js';
 import { c as checkType } from './check-type-8828dbe4.js';
 import { c as checkNonEmpty } from './check-non-empty-58bd6b17.js';
 

package/dist/esm/post-collapsible-trigger.entry.js

@@ -1,6 +1,6 @@
-export { P as post_collapsible_trigger } from './post-collapsible-trigger-8394bbca.js';
+export { P as post_collapsible_trigger } from './post-collapsible-trigger-bfa217db.js';
 import './index-9ace3232.js';
-import './package-db4481b4.js';
+import './package-9d6426d1.js';
 import './check-type-8828dbe4.js';
 import './check-non-empty-58bd6b17.js';
 import './constants-8d548297.js';

package/dist/esm/post-collapsible.entry.js

@@ -1,6 +1,6 @@
-export { P as post_collapsible } from './post-collapsible-66a26663.js';
+export { P as post_collapsible } from './post-collapsible-fdeee1a8.js';
 import './index-9ace3232.js';
-import './package-db4481b4.js';
+import './package-9d6426d1.js';
 import './index-29d17d6d.js';
 import './constants-8d548297.js';
 import './check-one-of-6b3ef8eb.js';

package/dist/esm/post-components.js

@@ -16,5 +16,5 @@ var patchBrowser = () => {
 
 patchBrowser().then(async (options) => {
   await globalScripts();
-  return bootstrapLazy([["post-accordion-item",[[1,"post-accordion-item",{"collapsed":[1028],"headingLevel":[2,"heading-level"],"id":[32],"toggle":[64]},[[2,"postToggle","onCollapseToggle"]],{"headingLevel":["validateHeadingLevel"]}]]],["post-alert",[[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"]}]]],["post-card-control",[[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"]}]]],["post-popovercontainer",[[4,"post-popovercontainer",{"placement":[1],"arrow":[4],"show":[64],"hide":[64],"toggle":[64]}]]],["post-popover",[[1,"post-popover",{"placement":[1],"closeButtonCaption":[1,"close-button-caption"],"arrow":[4],"show":[64],"hide":[64],"toggle":[64]}]]],["post-rating",[[1,"post-rating",{"label":[1],"stars":[2],"currentRating":[1026,"current-rating"],"readonly":[4],"hoveredIndex":[32]}]]],["post-tag",[[1,"post-tag",{"variant":[1],"size":[1],"icon":[1],"classes":[32]},null,{"variant":["variantChanged"],"size":["sizeChanged"]}]]],["post-tooltip",[[1,"post-tooltip",{"placement":[1],"arrow":[4],"delayed":[4],"show":[64],"hide":[64],"toggle":[64]},null,{"delayed":["validateDelayed"]}]]],["post-accordion",[[1,"post-accordion",{"headingLevel":[2,"heading-level"],"multiple":[4],"toggle":[64],"expandAll":[64],"collapseAll":[64]},[[0,"postToggle","collapseToggleHandler"]],{"headingLevel":["validateHeadingLevel"]}]]],["post-collapsible-trigger",[[0,"post-collapsible-trigger",{"for":[1],"update":[64]},[[4,"postToggle","setAriaExpanded"]],{"for":["setAriaAttributes"]}]]],["post-tab-header",[[1,"post-tab-header",{"panel":[1],"tabId":[32]},null,{"panel":["validateFor"]}]]],["post-tab-panel",[[1,"post-tab-panel",{"name":[1],"panelId":[32]}]]],["post-tabs",[[1,"post-tabs",{"activePanel":[1,"active-panel"],"show":[64]}]]],["post-collapsible",[[1,"post-collapsible",{"collapsed":[1028],"toggle":[64]},null,{"collapsed":["collapsedChange"]}]]],["post-icon",[[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"]}]]]], options);
+  return bootstrapLazy([["post-accordion-item",[[1,"post-accordion-item",{"collapsed":[1028],"headingLevel":[2,"heading-level"],"id":[32],"toggle":[64]},[[2,"postToggle","onCollapseToggle"]],{"headingLevel":["validateHeadingLevel"]}]]],["post-alert",[[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"]}]]],["post-card-control",[[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"]}]]],["post-popovercontainer",[[4,"post-popovercontainer",{"placement":[1],"arrow":[4],"show":[64],"hide":[64],"toggle":[64]}]]],["post-popover",[[1,"post-popover",{"placement":[1],"closeButtonCaption":[1,"close-button-caption"],"arrow":[4],"show":[64],"hide":[64],"toggle":[64]}]]],["post-rating",[[1,"post-rating",{"label":[1],"stars":[2],"currentRating":[1026,"current-rating"],"readonly":[4],"hoveredIndex":[32]}]]],["post-tag",[[1,"post-tag",{"variant":[1],"size":[1],"icon":[1],"classes":[32]},null,{"variant":["variantChanged"],"size":["sizeChanged"]}]]],["post-tooltip",[[1,"post-tooltip",{"placement":[1],"arrow":[4],"delayed":[4],"show":[64],"hide":[64],"toggle":[64]},null,{"delayed":["validateDelayed"]}]]],["post-accordion",[[1,"post-accordion",{"headingLevel":[2,"heading-level"],"multiple":[4],"toggle":[64],"expandAll":[64],"collapseAll":[64]},[[0,"postToggle","collapseToggleHandler"]],{"headingLevel":["validateHeadingLevel"]}]]],["post-collapsible-trigger",[[0,"post-collapsible-trigger",{"for":[1],"update":[64]},[[4,"postToggle","setAriaExpanded"]],{"for":["setAriaAttributes"]}]]],["post-tab-header",[[1,"post-tab-header",{"panel":[1],"tabId":[32]},null,{"panel":["validateFor"]}]]],["post-tab-panel",[[1,"post-tab-panel",{"name":[1],"panelId":[32]}]]],["post-tabs",[[1,"post-tabs",{"activePanel":[1,"active-panel"],"show":[64]}]]],["post-collapsible",[[1,"post-collapsible",{"collapsed":[1028],"toggle":[64]},null,{"collapsed":["collapsedChange"]}]]],["post-icon",[[1,"post-icon",{"animation":[1],"base":[1],"flipH":[4,"flip-h"],"flipV":[4,"flip-v"],"name":[1],"rotate":[2],"scale":[2]},null,{"animation":["validateAnimation"],"base":["validateBase"],"flipH":["validateFlipH"],"flipV":["validateFlipV"],"name":["validateName"],"rotate":["validateRotate"],"scale":["validateScale"]}]]]], options);
 });

package/dist/esm/{post-icon-02a5642f.js → post-icon-27bb7505.js}

@@ -1,6 +1,6 @@
 import { r as registerInstance, h, H as Host, g as getElement } from './index-9ace3232.js';
 import { c as checkEmptyOrOneOf, b as checkEmptyOrType } from './index-29d17d6d.js';
-import { v as version } from './package-db4481b4.js';
+import { v as version } from './package-9d6426d1.js';
 import { c as checkNonEmpty } from './check-non-empty-58bd6b17.js';
 import { c as checkType } from './check-type-8828dbe4.js';
 
@@ -20,8 +20,6 @@ const ANIMATION_KEYS = [...ANIMATION_NAMES];
 const PostIcon = class {
     constructor(hostRef) {
         registerInstance(this, hostRef);
-        this.svgStyles = undefined;
-        this.svgOutput = undefined;
         this.animation = null;
         this.base = null;
         this.flipH = false;
@@ -53,6 +51,64 @@ const PostIcon = class {
     validateScale(newValue = this.scale) {
         checkEmptyOrType(newValue, 'number', 'The post-icon "scale" prop should be a number.');
     }
+    // Construct the icon url from different possible sources
+    getUrl() {
+        var _a, _b, _c, _d, _e, _f, _g;
+        // the first definition object which defines a domain, will be used to set the domain of the file url
+        // the first definition object which defines a slug, will be used to set the slug of the file url
+        const urlDefinitions = [
+            getUrlDefinition(this.base, 'both'),
+            getUrlDefinition((_a = document.head
+                .querySelector('meta[name="design-system-settings"][data-post-icon-base]')) === null || _a === void 0 ? void 0 : _a.getAttribute('data-post-icon-base'), 'relative'),
+            getUrlDefinition((_b = document.querySelector('base[href]')) === null || _b === void 0 ? void 0 : _b.getAttribute('href'), 'both'),
+        ];
+        // in case no other definition defines a domain, the current origin is used as a fallback
+        const origin = (_e = (_d = (_c = urlDefinitions.find(d => d.definesDomain)) === null || _c === void 0 ? void 0 : _c.url) === null || _d === void 0 ? void 0 : _d.origin) !== null && _e !== void 0 ? _e : window.location.origin;
+        // in case no other definition defines a slug, the cdn url is used as a fallback
+        const slug = (_g = (_f = urlDefinitions.find(d => d.definesSlug)) === null || _f === void 0 ? void 0 : _f.url) === null || _g === void 0 ? void 0 : _g.pathname;
+        const file = `${this.name}.svg`;
+        let url;
+        if (slug) {
+            url = new URL(`${origin}${slug}/${file}`).toString();
+        }
+        else {
+            url = new URL(`${CDN_URL}/${file}`).toString();
+        }
+        return url;
+        function getUrlDefinition(url, allow) {
+            return {
+                url: getUrlObject(url),
+                definesDomain: allow !== 'relative' ? definesDomain(url) : false,
+                definesSlug: allow !== 'absolute' ? definesSlug(url) : false,
+            };
+            function getUrlObject(url) {
+                if (url) {
+                    return definesDomain(url) ? new URL(url) : new URL(url, window.location.origin);
+                }
+                else {
+                    return null;
+                }
+            }
+            function definesDomain(url) {
+                return url ? /^https?:\/\//.test(url) : false;
+            }
+            function definesSlug(url) {
+                const urlObject = getUrlObject(url);
+                return Boolean(/^\/.+/.test(urlObject === null || urlObject === void 0 ? void 0 : urlObject.pathname));
+            }
+        }
+    }
+    getStyles() {
+        const url = this.getUrl();
+        return Object.entries({
+            '-webkit-mask-image': `url(${url})`,
+            'mask-image': `url('${url}')`,
+            'transform': (this.scale && !isNaN(Number(this.scale)) ? 'scale(' + this.scale + ')' : '') +
+                (this.rotate && !isNaN(Number(this.rotate)) ? ' rotate(' + this.rotate + 'deg)' : ''),
+        })
+            .filter(([_key, value]) => value !== null)
+            .reduce((styles, [key, value]) => Object.assign(styles, { [key]: value }), {});
+    }
     componentDidLoad() {
         this.validateBase();
         this.validateName();
@@ -62,30 +118,8 @@ const PostIcon = class {
         this.validateRotate();
         this.validateAnimation();
     }
-    componentWillRender() {
-        this.setPath();
-    }
-    setPath() {
-        var _a, _b, _c, _d;
-        // Construct icon path from different possible sources
-        const metaBase = (_b = (_a = document.head
-            .querySelector('meta[name="design-system-settings"][data-post-icon-base]')) === null || _a === void 0 ? void 0 : _a.getAttribute('data-post-icon-base')) !== null && _b !== void 0 ? _b : null;
-        const fileBase = `${(_d = (_c = this.base) !== null && _c !== void 0 ? _c : metaBase) !== null && _d !== void 0 ? _d : CDN_URL}/`.replace(/\/\/$/, '/');
-        const fileName = `${this.name}.svg`;
-        const filePath = `${fileBase}${fileName}`;
-        this.path = new URL(filePath, window.location.origin).toString();
-    }
     render() {
-        // create inline styles for some properties
-        const svgStyles = 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(([_key, value]) => value !== null)
-            .reduce((styles, [key, value]) => Object.assign(styles, { [key]: value }), {});
-        return (h(Host, { key: 'c4744bef990eef90a7de44312fd349583b295f4c', "data-version": version }, h("span", { key: '0655e0d6ada2b822bf4b3c399dcf63000e26bf46', style: svgStyles })));
+        return (h(Host, { key: 'a38838bcd99af618f660ec4ffef4e869cdab3995', "data-version": version }, h("span", { key: '24ae06bdb0aa65ddca7ac88fac9bb6bb5a12550a', style: this.getStyles() })));
     }
     get host() { return getElement(this); }
     static get watchers() { return {

package/dist/esm/post-icon.entry.js

@@ -1,8 +1,8 @@
-export { P as post_icon } from './post-icon-02a5642f.js';
+export { P as post_icon } from './post-icon-27bb7505.js';
 import './index-9ace3232.js';
 import './index-29d17d6d.js';
 import './constants-8d548297.js';
 import './check-one-of-6b3ef8eb.js';
 import './check-type-8828dbe4.js';
-import './package-db4481b4.js';
+import './package-9d6426d1.js';
 import './check-non-empty-58bd6b17.js';

package/dist/esm/{post-popover-f371fc52.js → post-popover-77691872.js}

@@ -1,5 +1,5 @@
 import { r as registerInstance, h, H as Host, g as getElement } from './index-9ace3232.js';
-import { v as version } from './package-db4481b4.js';
+import { v as version } from './package-9d6426d1.js';
 import { g as getAttributeObserver } from './attribute-observer-37fa950a.js';
 
 const postPopoverCss = "/*!\n * Bootstrap Utilities v5.1.3 (https://getbootstrap.com/)\n * Copyright 2011-2021 The Bootstrap Authors\n * Copyright 2011-2021 Twitter, Inc.\n * Licensed under MIT (https://github.com/twbs/bootstrap/blob/main/LICENSE)\n\n * The MIT License (MIT)\n\n * Copyright (c) 2011-2020 Twitter, Inc.\n * Copyright (c) 2011-2020 The Bootstrap Authors\n\n * Permission is hereby granted, free of charge, to any person obtaining a copy\n * of this software and associated documentation files (the \"Software\"), to deal\n * in the Software without restriction, including without limitation the rights\n * to use, copy, modify, merge, publish, distribute, sublicense, and/or sell\n * copies of the Software, and to permit persons to whom the Software is\n * furnished to do so, subject to the following conditions:\n\n * The above copyright notice and this permission notice shall be included in\n * all copies or substantial portions of the Software.\n\n * THE SOFTWARE IS PROVIDED \"AS IS\", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR\n * IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,\n * FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE\n * AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER\n * LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,\n * OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN\n * THE SOFTWARE.\n *//*!\n * Copyright 2021 by Swiss Post, Information Technology\n */.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:4px;color:var(--post-gray-80);transition:opacity 250ms,border-color 250ms,background-color 250ms,color 250ms;cursor:pointer}.btn-close{outline-style:none !important;outline-offset:2px !important;outline-width:2px !important;outline-color:var(--post-focus-color) !important}.btn-close:is(:focus-visible,:has(:focus-visible),.pretend-focus){outline-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: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,.bg-nightblue,.bg-nightblue-bright,.bg-petrol,.bg-coral,.bg-olive,.bg-purple,.bg-purple-bright,.bg-aubergine,.bg-aubergine-bright,.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}";

package/dist/esm/post-popover.entry.js

@@ -1,4 +1,4 @@
-export { P as post_popover } from './post-popover-f371fc52.js';
+export { P as post_popover } from './post-popover-77691872.js';
 import './index-9ace3232.js';
-import './package-db4481b4.js';
+import './package-9d6426d1.js';
 import './attribute-observer-37fa950a.js';

package/dist/esm/{post-popovercontainer-a93f59dc.js → post-popovercontainer-e81c8c09.js}

@@ -1,5 +1,5 @@
 import { r as registerInstance, c as createEvent, h, H as Host, g as getElement } from './index-9ace3232.js';
-import { v as version } from './package-db4481b4.js';
+import { v as version } from './package-9d6426d1.js';
 
 /**
  * Custom positioning reference element.

package/dist/esm/post-popovercontainer.entry.js

@@ -1,3 +1,3 @@
-export { P as post_popovercontainer } from './post-popovercontainer-a93f59dc.js';
+export { P as post_popovercontainer } from './post-popovercontainer-e81c8c09.js';
 import './index-9ace3232.js';
-import './package-db4481b4.js';
+import './package-9d6426d1.js';