@swisspost/design-system-components 10.0.0-next.55 → 10.0.0-next.57

package/dist/components/react/p-CYkf_7Y5.js

@@ -1,89 +0,0 @@
-const EMPTY_VALUES = [undefined, null, '', NaN];
-
-function isValueEmpty(value) {
-    return EMPTY_VALUES.some(v => v === value);
-}
-
-function requiredAnd(check) {
-    return (component, prop, ...extraArgs) => {
-        const componentName = component.host.localName;
-        const value = component[prop];
-        const message = `The prop \`${String(prop)}\` of the \`${componentName}\` component is not defined.`;
-        if (isValueEmpty(value)) {
-            throw new Error(message);
-        }
-        else {
-            check(component, prop, ...extraArgs);
-        }
-    };
-}
-
-function checkOneOf(component, prop, possibleValues) {
-    const componentName = component.host.localName;
-    const value = component[prop];
-    const message = `The prop \`${String(prop)}\` of the \`${componentName}\` component must be one of the following values: ${possibleValues.join(', ')}.`;
-    if (!possibleValues.includes(value)) {
-        console.error(message);
-    }
-}
-
-function checkPattern(component, prop, pattern) {
-    const componentName = component.host.localName;
-    const value = component[prop];
-    const message = `The prop \`${String(prop)}\` of the \`${componentName}\` component must follow the format \`${pattern}\`.`;
-    if (typeof value !== 'string' || !pattern.test(value)) {
-        console.error(message);
-    }
-}
-
-function checkType(component, prop, type) {
-    const componentName = component.host.localName;
-    const value = component[prop];
-    const typeIsArray = type === 'array';
-    const valueIsArray = Array.isArray(value);
-    const message = `The prop \`${String(prop)}\` of the \`${componentName}\` component must be of type \`${type}\`.`;
-    if (typeIsArray || valueIsArray) {
-        if (valueIsArray !== typeIsArray) {
-            console.error(message);
-        }
-    }
-    else if (typeof value !== type) {
-        console.error(message);
-    }
-}
-
-function checkUrl(component, prop) {
-    const componentName = component.host.localName;
-    const value = component[prop];
-    const message = `The prop \`${String(prop)}\` of the \`${componentName}\` component is invalid.`;
-    if (typeof value !== 'string' && !(value instanceof URL)) {
-        console.error(message);
-        return;
-    }
-    try {
-        new URL(value, 'https://www.post.ch');
-    }
-    catch {
-        console.error(message);
-    }
-}
-
-function emptyOr(check) {
-    return (component, prop, ...extraArgs) => {
-        const value = component[prop];
-        if (!isValueEmpty(value)) {
-            check(component, prop, ...extraArgs);
-        }
-    };
-}
-
-const checkEmptyOrOneOf = emptyOr(checkOneOf);
-const checkEmptyOrPattern = emptyOr(checkPattern);
-const checkEmptyOrType = emptyOr(checkType);
-const checkEmptyOrUrl = emptyOr(checkUrl);
-const checkRequiredAndOneOf = requiredAnd(checkOneOf);
-const checkRequiredAndPattern = requiredAnd(checkPattern);
-const checkRequiredAndType = requiredAnd(checkType);
-const checkRequiredAndUrl = requiredAnd(checkUrl);
-
-export { checkEmptyOrUrl as a, checkRequiredAndOneOf as b, checkRequiredAndType as c, checkEmptyOrOneOf as d, checkEmptyOrType as e, checkRequiredAndPattern as f, checkEmptyOrPattern as g, checkRequiredAndUrl as h };

package/dist/components/react/p-Ccrl2AQn.js

@@ -1,111 +0,0 @@
-import { p as proxyCustomElement, H, c as createEvent, h, a as Host } from './index.js';
-import { v as version } from './p-BhxZzOEC.js';
-import { I as IS_BROWSER } from './p-CJ80BZ06.js';
-import { e as checkEmptyOrType } from './p-CYkf_7Y5.js';
-
-function isMotionReduced() {
-    return IS_BROWSER ? window.matchMedia('(prefers-reduced-motion: reduce)').matches : false;
-}
-
-const collapseDuration = 350;
-const collapseEasing = 'ease';
-const collapsedKeyframe = { height: '0', overflow: 'hidden' };
-const animationOptions = {
-    duration: collapseDuration,
-    easing: collapseEasing,
-    fill: 'forwards',
-};
-function collapse(el) {
-    const elHeight = IS_BROWSER ? window.getComputedStyle(el).height : `${el.scrollHeight}px`;
-    const expandedKeyframe = { height: elHeight };
-    return el.animate([expandedKeyframe, collapsedKeyframe], animationOptions);
-}
-function expand(el) {
-    const expandedKeyframe = { height: `${el.scrollHeight}px`, offset: 1 };
-    const finalKeyframe = { height: 'auto', overflow: 'visible' };
-    return el.animate([collapsedKeyframe, expandedKeyframe, finalKeyframe], animationOptions);
-}
-
-const postCollapsibleCss = ":host{display:block;position:relative;overflow:hidden}";
-
-const PostCollapsible = /*@__PURE__*/ proxyCustomElement(class PostCollapsible extends H {
-    constructor() {
-        super();
-        this.__registerHost();
-        this.__attachShadow();
-        this.postToggle = createEvent(this, "postToggle");
-        this.isLoaded = false;
-        this.isOpen = true;
-        /**
-         * If `true`, the element is collapsed otherwise it is displayed.
-         */
-        this.collapsed = false;
-    }
-    collapsedChange() {
-        checkEmptyOrType(this, 'collapsed', 'boolean');
-        void this.toggle(!this.collapsed);
-    }
-    componentDidLoad() {
-        this.collapsedChange();
-        this.isLoaded = true;
-        this.updateTriggers();
-    }
-    /**
-     * Triggers the collapse programmatically.
-     *
-     * If there is a collapsing transition running already, it will be reversed.
-     */
-    async toggle(open = !this.isOpen) {
-        if (open === this.isOpen)
-            return open;
-        this.isOpen = open;
-        this.collapsed = !open;
-        if (this.isLoaded)
-            this.postToggle.emit(open);
-        const animation = open ? expand(this.host) : collapse(this.host);
-        if (!this.isLoaded || isMotionReduced())
-            animation.finish();
-        await animation.finished;
-        const isHostRendered = this.host.offsetParent;
-        if (isHostRendered)
-            animation.commitStyles();
-        this.updateTriggers();
-        return open;
-    }
-    /**
-     * Update all post-collapsible-trigger elements referring to the collapsible
-     */
-    updateTriggers() {
-        const triggers = document.querySelectorAll(`post-collapsible-trigger[for="${this.host.id}"]`);
-        triggers.forEach(trigger => trigger.update());
-    }
-    render() {
-        return (h(Host, { key: '3a11f1a60c536544881def998bcdf81f6d248837', "data-version": version, tabindex: this.collapsed ? -1 : undefined }, h("slot", { key: '6ea66375cdffefd02c8293aa1542c4cbfce905a4' })));
-    }
-    get host() { return this; }
-    static get watchers() { return {
-        "collapsed": ["collapsedChange"]
-    }; }
-    static get style() { return postCollapsibleCss; }
-}, [1, "post-collapsible", {
-        "collapsed": [1028],
-        "toggle": [64]
-    }, undefined, {
-        "collapsed": ["collapsedChange"]
-    }]);
-function defineCustomElement() {
-    if (typeof customElements === "undefined") {
-        return;
-    }
-    const components = ["post-collapsible"];
-    components.forEach(tagName => { switch (tagName) {
-        case "post-collapsible":
-            if (!customElements.get(tagName)) {
-                customElements.define(tagName, PostCollapsible);
-            }
-            break;
-    } });
-}
-defineCustomElement();
-
-export { PostCollapsible as P, defineCustomElement as d };

package/dist/components/react/p-CewRvBtg.js

@@ -1,139 +0,0 @@
-import { p as proxyCustomElement, H, h, a as Host } from './index.js';
-import { v as version } from './p-BhxZzOEC.js';
-import { H as HEADING_LEVELS } from './p-r4txK0AC.js';
-import { b as checkRequiredAndOneOf } from './p-CYkf_7Y5.js';
-import './p-CJ80BZ06.js';
-import { E as EventFrom } from './p-CzIKqBrS.js';
-
-const postAccordionCss = ":host{display:block}::slotted(post-accordion-item){display:block}::slotted(post-accordion-item:not(:only-of-type:first-of-type)){margin-block-start:calc(var(--post-device-border-width-default)*-1)}";
-
-var __decorate = (undefined && undefined.__decorate) || function (decorators, target, key, desc) {
-    var c = arguments.length, r = c < 3 ? target : desc === null ? desc = Object.getOwnPropertyDescriptor(target, key) : desc, d;
-    if (typeof Reflect === "object" && typeof Reflect.decorate === "function")
-        r = Reflect.decorate(decorators, target, key, desc);
-    else
-        for (var i = decorators.length - 1; i >= 0; i--)
-            if (d = decorators[i])
-                r = (c < 3 ? d(r) : c > 3 ? d(target, key, r) : d(target, key)) || r;
-    return c > 3 && r && Object.defineProperty(target, key, r), r;
-};
-const PostAccordion = /*@__PURE__*/ proxyCustomElement(class PostAccordion extends H {
-    constructor() {
-        super();
-        this.__registerHost();
-        this.__attachShadow();
-        this.expandedItems = new Set();
-        /**
-         * If `true`, multiple `post-accordion-item` can be open at the same time.
-         */
-        this.multiple = false;
-    }
-    validateHeadingLevel() {
-        checkRequiredAndOneOf(this, 'headingLevel', HEADING_LEVELS);
-        this.accordionItems.forEach(item => {
-            item.setAttribute('heading-level', String(this.headingLevel));
-        });
-    }
-    componentWillLoad() {
-        this.registerAccordionItems();
-    }
-    componentDidLoad() {
-        this.validateHeadingLevel();
-    }
-    collapseToggleHandler(event) {
-        const toggledAccordionItem = event.target;
-        const isClosing = this.expandedItems.has(toggledAccordionItem);
-        if (isClosing) {
-            this.expandedItems.delete(toggledAccordionItem);
-        }
-        else {
-            this.expandedItems.add(toggledAccordionItem);
-        }
-        if (this.multiple || isClosing)
-            return;
-        // Close other open accordion items to ensure only one is open at a time
-        Array.from(this.expandedItems.values())
-            .filter(item => item !== toggledAccordionItem)
-            .forEach(item => {
-            item.toggle(false);
-        });
-    }
-    /**
-     * Toggles the `post-accordion-item` with the given id.
-     */
-    async toggle(id) {
-        const itemToToggle = this.accordionItems.find(item => item.id === id);
-        if (!itemToToggle)
-            throw new Error(`No post-accordion-item found with id #${id}.`);
-        await itemToToggle.toggle();
-    }
-    /**
-     * Expands all `post-accordion-item`.
-     *
-     * If `multiple="true"` is not set and all items are closed, it will open the first one.
-     * Otherwise, it will keep the opened one.
-     */
-    async expandAll() {
-        if (this.multiple) {
-            await Promise.all(this.accordionItems.map(item => item.toggle(true)));
-        }
-        else if (!this.expandedItems.size) {
-            await this.accordionItems[0].toggle(true);
-        }
-    }
-    /**
-     * Collapses all `post-accordion-item`.
-     */
-    async collapseAll() {
-        await Promise.all(this.accordionItems.map(item => item.toggle(false)));
-    }
-    registerAccordionItems() {
-        this.accordionItems = Array.from(this.host.querySelectorAll('post-accordion-item'));
-        this.accordionItems
-            .filter(item => {
-            return !item.collapsed || this.expandedItems.has(item);
-        })
-            .forEach((item, index) => {
-            if (!this.multiple && index !== 0) {
-                item.setAttribute('collapsed', '');
-                return;
-            }
-            this.expandedItems.add(item);
-        });
-    }
-    render() {
-        return (h(Host, { key: '470d8a7646796044df8f9cf1ebfc113e5c8db960', "data-version": version }, h("div", { key: '360ad1fe885dbb3c61a5c026ea253e7fba81ef9e', class: "accordion" }, h("slot", { key: '9e14d7906cba560a848986787159f56c961c78db', onSlotchange: () => this.registerAccordionItems() }))));
-    }
-    get host() { return this; }
-    static get watchers() { return {
-        "headingLevel": ["validateHeadingLevel"]
-    }; }
-    static get style() { return postAccordionCss; }
-}, [1, "post-accordion", {
-        "headingLevel": [514, "heading-level"],
-        "multiple": [4],
-        "toggle": [64],
-        "expandAll": [64],
-        "collapseAll": [64]
-    }, [[0, "postToggle", "collapseToggleHandler"]], {
-        "headingLevel": ["validateHeadingLevel"]
-    }]);
-__decorate([
-    EventFrom('post-accordion-item')
-], PostAccordion.prototype, "collapseToggleHandler", null);
-function defineCustomElement() {
-    if (typeof customElements === "undefined") {
-        return;
-    }
-    const components = ["post-accordion"];
-    components.forEach(tagName => { switch (tagName) {
-        case "post-accordion":
-            if (!customElements.get(tagName)) {
-                customElements.define(tagName, PostAccordion);
-            }
-            break;
-    } });
-}
-defineCustomElement();
-
-export { PostAccordion as P, defineCustomElement as d };

package/dist/components/react/p-Cwiv86_f.js

@@ -1,111 +0,0 @@
-import { p as proxyCustomElement, H, h, a as Host } from './index.js';
-import { v as version } from './p-BhxZzOEC.js';
-import { c as checkRequiredAndType } from './p-CYkf_7Y5.js';
-import './p-CJ80BZ06.js';
-import { g as getRoot } from './p-CBFgkSgY.js';
-
-const postMenuTriggerCss = ":host{display:inline-block}";
-
-const PostMenuTrigger = /*@__PURE__*/ proxyCustomElement(class PostMenuTrigger extends H {
-    constructor() {
-        super();
-        this.__registerHost();
-        /**
-         * Manages the accessibility attribute `aria-expanded` to indicate whether the associated menu is expanded or collapsed.
-         */
-        this.ariaExpanded = false;
-        /**
-         * Reference to the slotted button within the trigger, if present.
-         * Used to manage click and key events for menu control.
-         */
-        this.slottedButton = null;
-        this.handleKeyDown = (e) => {
-            if (e.key === 'ArrowUp' || e.key === 'ArrowDown') {
-                e.preventDefault();
-                this.handleToggle();
-            }
-        };
-    }
-    /**
-     * Watch for changes to the `for` property to validate its type and ensure it is a string.
-     * @param forValue - The new value of the `for` property.
-     */
-    validateControlFor() {
-        checkRequiredAndType(this, 'for', 'string');
-    }
-    get menu() {
-        const ref = this.root.getElementById(this.for);
-        return ref && ref.localName === 'post-menu' ? ref : null;
-    }
-    handleToggle() {
-        if (this.menu) {
-            this.menu.toggle(this.host);
-        }
-        else {
-            console.warn(`No post-menu found with ID: ${this.for}`);
-        }
-    }
-    connectedCallback() {
-        this.root = getRoot(this.host);
-    }
-    componentDidLoad() {
-        this.validateControlFor();
-        this.slottedButton = this.host.querySelector('button');
-        // Check if the slottedButton is within a web component
-        if (!this.slottedButton) {
-            const webComponent = this.host.querySelector('.menu-trigger-webc');
-            if (webComponent?.shadowRoot) {
-                const slottedButton = webComponent.shadowRoot.querySelector('button');
-                if (slottedButton) {
-                    this.slottedButton = slottedButton;
-                }
-            }
-        }
-        if (this.slottedButton) {
-            this.slottedButton.setAttribute('aria-haspopup', 'menu');
-            // Listen to the `toggleMenu` event emitted by the `post-menu` component
-            if (this.menu && this.slottedButton) {
-                this.menu.addEventListener('toggleMenu', (event) => {
-                    this.ariaExpanded = event.detail;
-                    this.slottedButton.setAttribute('aria-expanded', this.ariaExpanded.toString());
-                });
-            }
-            this.slottedButton.addEventListener('click', () => {
-                this.handleToggle();
-            });
-            this.slottedButton.addEventListener('keydown', this.handleKeyDown);
-        }
-        else {
-            console.warn('No button found within post-menu-trigger');
-        }
-    }
-    render() {
-        return (h(Host, { key: '14592f9564fdb09b2e809374d5794bf71f576dbb', "data-version": version, "tab-index": "-1" }, h("slot", { key: 'a0f463000420df39035cc5a48369d230394b5e04' })));
-    }
-    get host() { return this; }
-    static get watchers() { return {
-        "for": ["validateControlFor"]
-    }; }
-    static get style() { return postMenuTriggerCss; }
-}, [4, "post-menu-trigger", {
-        "for": [513],
-        "ariaExpanded": [32]
-    }, undefined, {
-        "for": ["validateControlFor"]
-    }]);
-function defineCustomElement() {
-    if (typeof customElements === "undefined") {
-        return;
-    }
-    const components = ["post-menu-trigger"];
-    components.forEach(tagName => { switch (tagName) {
-        case "post-menu-trigger":
-            if (!customElements.get(tagName)) {
-                customElements.define(tagName, PostMenuTrigger);
-            }
-            break;
-    } });
-}
-defineCustomElement();
-
-export { PostMenuTrigger as P, defineCustomElement as d };

package/dist/components/react/p-D2waO0Zc.js

@@ -1,31 +0,0 @@
-import { p as proxyCustomElement, H, h, a as Host } from './index.js';
-import { v as version } from './p-BhxZzOEC.js';
-
-const postMenuItemCss = "post-menu-item button{padding:0;overflow:visible;border:0;background:none;color:var(--post-scheme-color-interactive-button-secondary-enabled-fg);font:inherit;-webkit-user-select:none;user-select:none;appearance:button}@media (forced-colors: active),(-ms-high-contrast: active),(-ms-high-contrast: white-on-black){post-menu-item button{background-color:ButtonFace !important}post-menu-item button:hover{background-color:Highlight !important}}post-menu-item a{text-decoration:none}post-menu-item button,post-menu-item a{position:relative;display:flex;width:100%;align-items:center;padding:.5rem .75rem .5rem 1rem;gap:.75rem;font-size:.875rem;color:#050400;border-radius:0}post-menu-item button post-icon,post-menu-item a post-icon{width:1rem;height:1rem;margin-block:.25rem}@media screen and (min-width: 780px){post-menu-item button,post-menu-item a{font-size:1rem;padding-block:.75rem;gap:1rem}post-menu-item button post-icon,post-menu-item a post-icon{width:1.5rem;height:1.5rem;margin:0}}@media screen and (min-width: 1024px){post-menu-item button,post-menu-item a{font-size:1.25rem;padding-block:.8125rem}}post-menu-item button:focus-visible,post-menu-item a:focus-visible{outline-offset:2px !important;border-radius:4px}post-menu-item button:hover,post-menu-item a:hover{background-color:#504f4b;color:#fff}";
-
-const PostMenuItem = /*@__PURE__*/ proxyCustomElement(class PostMenuItem extends H {
-    constructor() {
-        super();
-        this.__registerHost();
-    }
-    render() {
-        return (h(Host, { key: '9d6015291b82728739de4263a62a59ad4a99c94d', "data-version": version }, h("slot", { key: '51f5ff356cddffc806639cc343437500f898065e' })));
-    }
-    static get style() { return postMenuItemCss; }
-}, [4, "post-menu-item"]);
-function defineCustomElement() {
-    if (typeof customElements === "undefined") {
-        return;
-    }
-    const components = ["post-menu-item"];
-    components.forEach(tagName => { switch (tagName) {
-        case "post-menu-item":
-            if (!customElements.get(tagName)) {
-                customElements.define(tagName, PostMenuItem);
-            }
-            break;
-    } });
-}
-defineCustomElement();
-
-export { PostMenuItem as P, defineCustomElement as d };

package/dist/components/react/p-DBPOV12C.js

@@ -1,160 +0,0 @@
-import { p as proxyCustomElement, H, h, a as Host } from './index.js';
-import { I as IS_BROWSER } from './p-CJ80BZ06.js';
-import { d as checkEmptyOrOneOf, e as checkEmptyOrType, c as checkRequiredAndType } from './p-CYkf_7Y5.js';
-import { v as version } from './p-BhxZzOEC.js';
-
-const postIconCss = ":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)}}";
-
-const CDN_URL = `https://unpkg.com/@swisspost/design-system-icons@${version}/public/post-icons/`;
-const ANIMATION_NAMES = [
-    'cylon',
-    'cylon-vertical',
-    'spin',
-    'spin-reverse',
-    'fade',
-    'throb',
-];
-const ANIMATION_KEYS = [...ANIMATION_NAMES];
-const PostIcon = /*@__PURE__*/ proxyCustomElement(class PostIcon extends H {
-    constructor() {
-        super();
-        this.__registerHost();
-        this.__attachShadow();
-        /**
-         * When set to `true`, the icon will be flipped horizontally.
-         */
-        this.flipH = false;
-        /**
-         * When set to `true`, the icon will be flipped vertically.
-         */
-        this.flipV = false;
-    }
-    validateAnimation() {
-        checkEmptyOrOneOf(this, 'animation', ANIMATION_KEYS);
-    }
-    validateBase() {
-        checkEmptyOrType(this, 'base', 'string');
-    }
-    validateName() {
-        checkRequiredAndType(this, 'name', 'string');
-    }
-    validateRotate() {
-        checkEmptyOrType(this, 'rotate', 'number');
-    }
-    validateScale() {
-        checkEmptyOrType(this, 'scale', 'number');
-    }
-    /**
-     * Construct the icon URL according to the following rules:
-     * 1. `@base` (absolute URL) → use directly.
-     * 2. `@base` (relative URL) → resolve with `base href` and/or `origin`
-     *  - If `base href` is absolute → use just that.
-     *  - If `base href` is relative → prepend with `origin`.
-     *  - If `base href` does not exist → use only `origin`.
-     * 3. `@meta` (absolute URL) → use directly.
-     * 4. `@meta` (relative URL) → resolve with `base href` and/or `origin`. (same as above)
-     * 5. `CDN_URL` fallback → `https://unpkg.com/...`.
-     **/
-    getUrl() {
-        const fileName = `${this.name}.svg`;
-        if (!IS_BROWSER && !this.base) {
-            return `${CDN_URL}${fileName}`;
-        }
-        const isAbsolute = (url) => /^https?:\/\//.test(url);
-        const normalizeUrl = (url) => (url && !url.endsWith('/') ? `${url}/` : url);
-        const cleanUrl = (url) => url.replace(/([^:])\/\//g, '$1/');
-        const currentDomain = IS_BROWSER ? window.location.origin : '';
-        const baseHref = IS_BROWSER
-            ? document.querySelector('base[href]')?.getAttribute('href') || ''
-            : '';
-        const metaIconBase = IS_BROWSER
-            ? document.querySelector('meta[name="design-system-settings"]')?.getAttribute('data-post-icon-base') || ''
-            : '';
-        // Function to build the first part of the URL when 'this.base' or 'metaIconBase' are relative
-        const buildUrlWithBase = (relativeUrl) => {
-            const normalizedHref = normalizeUrl(baseHref);
-            const normalizedRelative = normalizeUrl(relativeUrl);
-            if (isAbsolute(normalizedHref)) {
-                return `${normalizedHref}${normalizedRelative}`;
-            }
-            return `${currentDomain}${normalizedHref}${normalizedRelative}`;
-        };
-        let url;
-        // Highest Priority is this.base
-        if (this.base) {
-            url = isAbsolute(this.base)
-                ? `${normalizeUrl(this.base)}${fileName}`
-                : `${buildUrlWithBase(this.base)}${fileName}`;
-            return cleanUrl(url);
-        }
-        // Second Priority is metaIconBase
-        if (metaIconBase) {
-            url = isAbsolute(metaIconBase)
-                ? `${normalizeUrl(metaIconBase)}${fileName}`
-                : `${buildUrlWithBase(metaIconBase)}${fileName}`;
-            return cleanUrl(url);
-        }
-        // Fallback to CDN
-        return cleanUrl(`${CDN_URL}${fileName}`);
-    }
-    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();
-        this.validateScale();
-        this.validateRotate();
-        this.validateAnimation();
-    }
-    render() {
-        return (h(Host, { key: '7ce1f627f621201c0f4d6e90ee3d8d6d3c32798a', "data-version": version }, h("span", { key: '987ecd266b8bd68bdbb06cdb500a746b913e79b1', style: this.getStyles() })));
-    }
-    get host() { return this; }
-    static get watchers() { return {
-        "animation": ["validateAnimation"],
-        "base": ["validateBase"],
-        "name": ["validateName"],
-        "rotate": ["validateRotate"],
-        "scale": ["validateScale"]
-    }; }
-    static get style() { return postIconCss; }
-}, [1, "post-icon", {
-        "animation": [1],
-        "base": [1],
-        "flipH": [4, "flip-h"],
-        "flipV": [4, "flip-v"],
-        "name": [513],
-        "rotate": [2],
-        "scale": [2]
-    }, undefined, {
-        "animation": ["validateAnimation"],
-        "base": ["validateBase"],
-        "name": ["validateName"],
-        "rotate": ["validateRotate"],
-        "scale": ["validateScale"]
-    }]);
-function defineCustomElement() {
-    if (typeof customElements === "undefined") {
-        return;
-    }
-    const components = ["post-icon"];
-    components.forEach(tagName => { switch (tagName) {
-        case "post-icon":
-            if (!customElements.get(tagName)) {
-                customElements.define(tagName, PostIcon);
-            }
-            break;
-    } });
-}
-defineCustomElement();
-
-export { PostIcon as P, defineCustomElement as d };