@swisspost/design-system-components 10.0.0-next.39 → 10.0.0-next.41

package/dist/components/post-tooltip2.js

@@ -1,102 +0,0 @@
-import { proxyCustomElement, HTMLElement, h, Host } from '@stencil/core/internal/client';
-import { v as version } from './package.js';
-import { a as checkEmptyOrOneOf } from './index2.js';
-import './breakpoints.js';
-import { a as PLACEMENT_TYPES, d as defineCustomElement$1 } from './post-popovercontainer2.js';
-
-const postTooltipCss = ":host{display:none}:host([open]){display:contents}post-popovercontainer[arrow]::after{position:absolute;content:\"\";inset:-13px;z-index:-1}post-popovercontainer>div{padding:var(--post-core-dimension-4) var(--post-core-dimension-8);max-width:280px;min-height:32px;word-wrap:break-word;white-space:normal}";
-const PostTooltipStyle0 = postTooltipCss;
-
-const PostTooltip = /*@__PURE__*/ proxyCustomElement(class PostTooltip extends HTMLElement {
-    constructor() {
-        super();
-        this.__registerHost();
-        this.__attachShadow();
-        this.placement = 'top';
-        this.arrow = false;
-        this.animation = undefined;
-        this.open = false;
-    }
-    validatePlacement() {
-        checkEmptyOrOneOf(this, 'placement', PLACEMENT_TYPES);
-    }
-    componentWillLoad() {
-        this.validatePlacement();
-    }
-    componentDidLoad() {
-        if (!this.host.id) {
-            console.error(
-            /*prettier-ignore*/
-            'No id set: <post-tooltip> must have an id, linking it to it\'s target element with a <post-tooltip-trigger> element.');
-        }
-    }
-    /**
-     * Programmatically display the tooltip.
-     * @param target An element where the tooltip should be shown
-     */
-    async show(target) {
-        if (this.open)
-            return;
-        this.popoverRef.show(target);
-    }
-    /**
-     * Programmatically hide this tooltip.
-     */
-    async hide() {
-        this.popoverRef.hide();
-    }
-    /**
-     * Toggle tooltip display.
-     * @param target An element where the tooltip should be shown
-     * @param [force] Pass true to always show or false to always hide
-     */
-    async toggle(target, force) {
-        this.popoverRef.toggle(target, force);
-    }
-    /**
-     * Set the open state based on the toggle event.
-     * @param e Popovercontainer toggle event
-     */
-    handleToggle(e) {
-        this.open = e.detail;
-    }
-    render() {
-        const popoverClass = `${this.arrow ? 'has-arrow' : ''}`;
-        return (h(Host, { key: 'e6bb167dd89c7549f4bed625dbeb652eac871ce5', "data-version": version, role: "tooltip" }, h("post-popovercontainer", { key: 'f5dc041dc440f7dc5410e9ee020f51a974ff3e83', safeSpace: "trapezoid", class: popoverClass, arrow: this.arrow, animation: this.animation, placement: this.placement, onPostToggle: e => this.handleToggle(e), ref: (el) => (this.popoverRef = el) }, h("slot", { key: 'e1ee7b0cfb57dc927a96574b10af50c3bd12328c' }))));
-    }
-    get host() { return this; }
-    static get watchers() { return {
-        "placement": ["validatePlacement"]
-    }; }
-    static get style() { return PostTooltipStyle0; }
-}, [1, "post-tooltip", {
-        "placement": [1],
-        "arrow": [4],
-        "animation": [1],
-        "open": [1540],
-        "show": [64],
-        "hide": [64],
-        "toggle": [64]
-    }, undefined, {
-        "placement": ["validatePlacement"]
-    }]);
-function defineCustomElement() {
-    if (typeof customElements === "undefined") {
-        return;
-    }
-    const components = ["post-tooltip", "post-popovercontainer"];
-    components.forEach(tagName => { switch (tagName) {
-        case "post-tooltip":
-            if (!customElements.get(tagName)) {
-                customElements.define(tagName, PostTooltip);
-            }
-            break;
-        case "post-popovercontainer":
-            if (!customElements.get(tagName)) {
-                defineCustomElement$1();
-            }
-            break;
-    } });
-}
-
-export { PostTooltip as P, defineCustomElement as d };

package/dist/esm/app-globals-0f993ce5.js

@@ -1,3 +0,0 @@
-const globalScripts = () => {};
-
-export { globalScripts as g };

package/dist/esm/breakpoints-7812702e.js

@@ -1,56 +0,0 @@
-const IS_SERVER = typeof window === 'undefined';
-const IS_BROWSER = !IS_SERVER;
-
-class Breakpoint {
-    constructor() {
-        this.current = {
-            key: '',
-            name: '',
-        };
-        if (IS_BROWSER && !this.breakpointMap) {
-            const keys = this.getStyles('--post-breakpoint-keys');
-            const names = this.getStyles('--post-breakpoint-names');
-            const widths = this.getStyles('--post-breakpoint-widths');
-            this.breakpointMap = widths
-                .map((width, i) => ({
-                minWidth: Number(width),
-                key: keys[i],
-                name: names[i],
-            }))
-                .reverse();
-            window.addEventListener('resize', () => this.updateHandler(), { passive: true });
-        }
-    }
-    getStyles(propertyName) {
-        const styles = getComputedStyle(document.documentElement);
-        return (styles
-            .getPropertyValue(propertyName)
-            ?.split(',')
-            .map(w => w.trim()) ?? []);
-    }
-    updateHandler(emitEvents = true) {
-        const calculated = this.breakpointMap.find(({ minWidth }) => innerWidth >= minWidth);
-        if (this.current.key !== calculated.key) {
-            this.current.key = calculated.key;
-            if (emitEvents)
-                this.dispatchEvent('key');
-        }
-        if (this.current.name !== calculated.name) {
-            this.current.name = calculated.name;
-            if (emitEvents)
-                this.dispatchEvent('name');
-        }
-    }
-    dispatchEvent(type) {
-        if (IS_BROWSER) {
-            window.dispatchEvent(new CustomEvent(`postBreakpoint:${type}`, { detail: this.current[type] }));
-        }
-    }
-    get(type) {
-        this.updateHandler(false);
-        return this.current[type];
-    }
-}
-const breakpoint = new Breakpoint();
-
-export { IS_BROWSER as I, breakpoint as b };

package/dist/esm/event-guard-538ee077.js

@@ -1,45 +0,0 @@
-function eventGuard(host, event, options, callback) {
-    const target = event.target;
-    if (!target)
-        return;
-    if (target.localName === options.targetLocalName) {
-        if (!options.delegatorSelector || shadowClosest(target, options.delegatorSelector) === host) {
-            callback();
-        }
-    }
-}
-/**
- * Traverses up the DOM (including crossing shadow DOM boundaries) starting from the given element
- * to find and return the closest ancestor that matches the specified CSS selector.
- * If no matching element is found, returns null.
- *
- * @param element - The starting element from which the search begins.
- * @param selector - The CSS selector used to test each ancestor element.
- * @returns The closest matching ancestor element or null if none is found.
- */
-function shadowClosest(element, selector) {
-    let currentElement = element;
-    while (currentElement) {
-        if (currentElement.matches(selector)) {
-            return currentElement;
-        }
-        const parent = currentElement.parentElement;
-        if (parent) {
-            currentElement = parent;
-        }
-        else {
-            const parentNode = currentElement.parentNode;
-            // When no parentElement exists, check if the current element is inside a shadow DOM.
-            // If so, move up to the shadow host to continue the search outside the shadow boundary.
-            if (parentNode instanceof ShadowRoot) {
-                currentElement = parentNode.host;
-            }
-            else {
-                currentElement = null;
-            }
-        }
-    }
-    return null;
-}
-
-export { eventGuard as e };

package/dist/esm/get-root-1b1af46f.js

@@ -1,15 +0,0 @@
-import { I as IS_BROWSER } from './breakpoints-7812702e.js';
-
-/**
- * getRootNode() can only be used after the element has been attached to the document!
- * So use it for example in the componentDidLoad lifecycle hook.
- */
-function getRoot(element) {
-    const root = IS_BROWSER ? element.getRootNode() : element;
-    if (root instanceof Document || root instanceof ShadowRoot) {
-        return root;
-    }
-    throw new Error('Attempting to access root node before the element is attached to the document or shadow tree.');
-}
-
-export { getRoot as g };

package/dist/esm/heading-levels-5b7b4349.js

@@ -1,3 +0,0 @@
-const HEADING_LEVELS = [1, 2, 3, 4, 5, 6];
-
-export { HEADING_LEVELS as H };

package/dist/esm/package-8503eaa8.js

@@ -1,3 +0,0 @@
-const version = "10.0.0-next.39";
-
-export { version as v };

package/dist/esm/post-accordion-9365faca.js

@@ -1,103 +0,0 @@
-import { r as registerInstance, h, H as Host, g as getElement } from './index-f4d19816.js';
-import { v as version } from './package-8503eaa8.js';
-import { H as HEADING_LEVELS } from './heading-levels-5b7b4349.js';
-import { c as checkRequiredAndOneOf } from './index-ffccd040.js';
-import './breakpoints-7812702e.js';
-import { e as eventGuard } from './event-guard-538ee077.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)}::slotted(post-accordion-item:not(:only-of-type):first-of-type){--post-accordion-button-border-top:var(--post-device-border-width-default) var(--post-core-border-style-solid) var(--post-scheme-color-interactive-primary-enabled-stroke)}";
-const PostAccordionStyle0 = postAccordionCss;
-
-const PostAccordion = class {
-    constructor(hostRef) {
-        registerInstance(this, hostRef);
-        this.expandedItems = new Set();
-        this.headingLevel = undefined;
-        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) {
-        eventGuard(this.host, event, { targetLocalName: 'post-accordion-item', delegatorSelector: 'post-accordion' }, () => {
-            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: '7057a6926f2279f7fc86d7f8539dd3ca884a3d70', "data-version": version }, h("div", { key: 'a6d337471d1d16c09d7e6af950d39c58fc6f2880', class: "accordion" }, h("slot", { key: '9687babb4b539f6e54468555b4057a2b378e1e10', onSlotchange: () => this.registerAccordionItems() }))));
-    }
-    get host() { return getElement(this); }
-    static get watchers() { return {
-        "headingLevel": ["validateHeadingLevel"]
-    }; }
-};
-PostAccordion.style = PostAccordionStyle0;
-
-export { PostAccordion as P };

package/dist/esm/post-accordion-item-2dc8e3b7.js

@@ -1,62 +0,0 @@
-import { r as registerInstance, h, H as Host, g as getElement } from './index-f4d19816.js';
-import { v as version } from './package-8503eaa8.js';
-import { H as HEADING_LEVELS } from './heading-levels-5b7b4349.js';
-import { a as checkEmptyOrOneOf } from './index-ffccd040.js';
-import './breakpoints-7812702e.js';
-import { e as eventGuard } from './event-guard-538ee077.js';
-import { n as nanoid } from './index.browser-ff103197.js';
-
-const postAccordionItemCss = ".accordion-item::after{display:block;content:\"\";margin-block-start:calc(var(--post-device-border-width-default)*-1);border-block-end:var(--post-device-border-width-default) var(--post-core-border-style-solid) var(--post-scheme-color-interactive-primary-enabled-stroke)}.accordion-item:has(.accordion-button:hover)::after{border-color:var(--post-scheme-color-interactive-primary-hover-stroke)}@media (forced-colors: active),(-ms-high-contrast: active),(-ms-high-contrast: white-on-black){.accordion-item:has(.accordion-button:hover)::after{border-color:Highlight}}.accordion-header{color:var(--post-scheme-color-interactive-primary-enabled-fg1);font-size:var(--post-device-font-size-5);margin:0;line-height:var(--post-device-line-height-heading);font-weight:var(--post-device-font-weight-black)}.accordion-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;display:flex;position:relative;width:100%;align-items:center;text-align:start;gap:var(--post-device-spacing-gap-7);padding:calc(var(--post-device-spacing-padding-19) + var(--post-device-border-width-default)) calc(var(--post-device-spacing-padding-5) + var(--post-device-border-width-default));cursor:pointer}@media (forced-colors: active),(-ms-high-contrast: active),(-ms-high-contrast: white-on-black){.accordion-button{background-color:ButtonFace !important}.accordion-button:hover{background-color:Highlight !important}}.accordion-button::before{display:block;position:absolute;content:\"\";inset:0;inset-block-end:auto;border-block-start:var(--post-accordion-button-border-top)}.accordion-button{outline-offset:var(--post-device-spacing-padding-2) !important;outline:var(--post-scheme-color-interactive-focus-stroke) none var(--post-device-border-width-focus) !important}.accordion-button:is(:focus-visible,:has(:focus-visible),.pretend-focus){outline-style:var(--post-core-border-style-solid) !important;border-radius:var(--post-device-border-radius-focus)}@media (forced-colors: active),(-ms-high-contrast: active),(-ms-high-contrast: white-on-black){.accordion-button:is(:focus-visible,:has(:focus-visible),.pretend-focus){outline-color:Highlight !important}}@supports not selector(:has(:focus-visible)){.accordion-button:is(:focus-visible,:focus-within,.pretend-focus){outline-style:var(--post-core-border-style-solid) !important;border-radius:var(--post-device-border-radius-focus)}@media (forced-colors: active),(-ms-high-contrast: active),(-ms-high-contrast: white-on-black){.accordion-button:is(:focus-visible,:focus-within,.pretend-focus){outline-color:Highlight !important}}}.accordion-button slot::slotted(span[slot=header]){flex-grow:1}.accordion-button post-icon{flex:none;width:var(--post-core-dimension-24);aspect-ratio:1;transition:transform 250ms cubic-bezier(0.4, 0, 0.2, 1)}.accordion-button.collapsed{padding-block-start:calc(var(--post-device-spacing-padding-19) + var(--post-device-border-width-default));padding-block-end:calc(var(--post-device-spacing-padding-19) + var(--post-device-border-width-default))}.accordion-button.collapsed post-icon{transform:rotate(-180deg)}.accordion-button:hover{color:var(--post-scheme-color-interactive-primary-hover-fg1)}.accordion-button>::slotted(.text-truncate){display:block}@media (forced-colors: active),(-ms-high-contrast: active),(-ms-high-contrast: white-on-black){.accordion-button:hover,.accordion-button:focus-visible{color:Highlight}}.accordion-body{padding-block-start:var(--post-device-spacing-padding-15);padding-block-end:calc(var(--post-device-spacing-padding-block-25) + var(--post-device-border-width-default));padding-inline:var(--post-device-spacing-padding-5)}.logo-container{display:none;width:var(--post-device-sizing-logo-1);aspect-ratio:1}.logo-container.has-image{display:block}.logo-container slot::slotted(img){display:block;width:100%;height:100%;object-fit:cover}.accordion-button>::slotted(:first-child),.accordion-body>::slotted(:first-child){margin-block-start:0 !important}.accordion-button>::slotted(:last-child),.accordion-body>::slotted(:last-child){margin-block-end:0 !important}";
-const PostAccordionItemStyle0 = postAccordionItemCss;
-
-const PostAccordionItem = class {
-    constructor(hostRef) {
-        registerInstance(this, hostRef);
-        this.id = undefined;
-        this.slottedLogo = undefined;
-        this.collapsed = false;
-        this.headingLevel = undefined;
-    }
-    validateHeadingLevel() {
-        checkEmptyOrOneOf(this, 'headingLevel', HEADING_LEVELS);
-    }
-    componentWillLoad() {
-        this.id = this.host.id || `p${nanoid(6)}`;
-    }
-    componentDidLoad() {
-        this.validateHeadingLevel();
-    }
-    // Capture to make sure the "collapsed" property is updated before the event is consumed
-    onCollapseToggle(event) {
-        eventGuard(this.host, event, { targetLocalName: 'post-collapsible', delegatorSelector: 'post-accordion-item' }, () => {
-            this.collapsed = !event.detail;
-        });
-    }
-    /**
-     * Triggers the collapse programmatically.
-     */
-    async toggle(force) {
-        return this.collapsible.toggle(force);
-    }
-    onSlotLogoChange() {
-        this.slottedLogo = this.host.querySelector('img[slot="logo"]');
-    }
-    componentWillRender() {
-        this.slottedLogo = this.host.querySelector('img[slot="logo"]');
-    }
-    render() {
-        const headingLevel = this.host.closest('post-accordion')?.getAttribute('heading-level');
-        const HeadingTag = `h${headingLevel ?? this.headingLevel ?? 2}`;
-        return (h(Host, { key: '4de770633e0c9b9bb92b92a66be9a1481bf0fb3e', id: this.id, "data-version": version }, h("div", { key: '4c2b91b25637cbe284442626d02d0ce6496589a4', part: "accordion-item", class: "accordion-item" }, h("post-collapsible-trigger", { key: '777f8b222b017b765f265296ad2829a027a99c22', for: `${this.id}--collapse` }, h(HeadingTag, { key: 'a646d911ea83c004fbc5490cb1e9dafdf490d09f', class: "accordion-header", id: `${this.id}--header` }, h("button", { key: '0c30a665426b98fff997874c365ffc6b97ecc01c', type: "button", class: `accordion-button${this.collapsed ? ' collapsed' : ''}`, part: "button" }, h("span", { key: '64edd8541af949f87ad929173c4a5210f892b0b6', class: {
-                'logo-container': true,
-                'has-image': !!this.slottedLogo,
-            } }, h("slot", { key: 'a3dfd1796d7c3b854980078673a017d58acb97ea', name: "logo", onSlotchange: this.onSlotLogoChange.bind(this) })), h("slot", { key: 'd008c9aebfd8431afa4eae1af8646dd7de97916b', name: "header" }), h("post-icon", { key: 'ee5150a9cd7693e57f639cf09d9c4f24aae57308', name: "2051" })))), h("post-collapsible", { key: '12d2ef55e0e7615619a0a246268e8af3d3d8e712', id: `${this.id}--collapse`, collapsed: this.collapsed, ref: el => (this.collapsible = el) }, h("div", { key: 'd2cf362418c50ad56f8dee8e43baabbd976682f9', class: "accordion-body", part: "body" }, h("slot", { key: '6792db26a9eab60e113d62e23faf003a6b43685b' }))))));
-    }
-    get host() { return getElement(this); }
-    static get watchers() { return {
-        "headingLevel": ["validateHeadingLevel"]
-    }; }
-};
-PostAccordionItem.style = PostAccordionItemStyle0;
-
-export { PostAccordionItem as P };

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

@@ -1,8 +0,0 @@
-export { P as post_accordion_item } from './post-accordion-item-2dc8e3b7.js';
-import './index-f4d19816.js';
-import './package-8503eaa8.js';
-import './heading-levels-5b7b4349.js';
-import './index-ffccd040.js';
-import './breakpoints-7812702e.js';
-import './event-guard-538ee077.js';
-import './index.browser-ff103197.js';

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

@@ -1,7 +0,0 @@
-export { P as post_accordion } from './post-accordion-9365faca.js';
-import './index-f4d19816.js';
-import './package-8503eaa8.js';
-import './heading-levels-5b7b4349.js';
-import './index-ffccd040.js';
-import './breakpoints-7812702e.js';
-import './event-guard-538ee077.js';

package/dist/esm/post-avatar-4f73dc4d.js

@@ -1,160 +0,0 @@
-import { r as registerInstance, h, H as Host, g as getElement } from './index-f4d19816.js';
-import { v as version } from './package-8503eaa8.js';
-import { b as checkRequiredAndType, d as checkEmptyOrType, e as checkEmptyOrPattern } from './index-ffccd040.js';
-import './breakpoints-7812702e.js';
-
-const postAvatarCss = "@keyframes popIn{from{transform:scale(0.9);opacity:0;transition-property:transform,opacity,overlay,display;transition-behavior:allow-discrete;transition-duration:var(--post-transition-duration, 0.35s);transition-timing-function:linear(0, 0.007, 0.029 2.2%, 0.118 4.7%, 0.625 14.4%, 0.826 19%, 0.902, 0.962, 1.008 26.1%, 1.041 28.7%, 1.064 32.1%, 1.07 36%, 1.061 40.5%, 1.015 53.4%, 0.999 61.6%, 0.995 71.2%, 1)}to{opacity:1;transform:scale(1)}}:host{--post-avatar-bg:var(--post-scheme-color-interactive-primary-enabled-bg2);--post-avatar-fg:var(--post-scheme-color-interactive-primary-enabled-fg3);display:inline-flex;position:relative;width:var(--post-device-sizing-interactive-icon-size3);height:var(--post-device-sizing-interactive-icon-size3);background-color:var(--post-scheme-color-interactive-primary-enabled-stroke3);border:var(--post-device-border-width-default) solid var(--post-scheme-color-interactive-primary-enabled-stroke3);border-radius:var(--post-device-border-radius-round);font-size:var(--post-device-font-size-8);vertical-align:top;line-height:1}:host::after{display:block;content:\"\";position:absolute;inset:0;z-index:1;border-radius:inherit}*,*::before,*::after{box-sizing:border-box}slot,img,::slotted(img){display:block;width:100%;height:100%}img,::slotted(img){border-radius:var(--post-device-border-radius-round)}::slotted(:not(img)){display:none !important}.initials{display:flex;justify-content:center;align-items:center;position:relative;z-index:2;width:100%;height:100%;background-color:var(--post-avatar-bg);border-radius:var(--post-device-border-radius-round);color:var(--post-avatar-fg);text-transform:uppercase}.initials span{width:1px !important;height:1px !important;padding:0 !important;margin:-1px !important;overflow:hidden !important;clip:rect(0, 0, 0, 0) !important;white-space:nowrap !important;border:0 !important}.initials span:not(caption){position:absolute !important}";
-const PostAvatarStyle0 = postAvatarCss;
-
-// https://docs.gravatar.com/api/avatars/images/
-const GRAVATAR_DEFAULT = '404';
-const GRAVATAR_RATING = 'g';
-const GRAVATAR_SIZE = 80;
-const GRAVATAR_BASE_URL = `https://www.gravatar.com/avatar/{email}?s=${GRAVATAR_SIZE}&d=${GRAVATAR_DEFAULT}&r=${GRAVATAR_RATING}`;
-const emailPattern = /^[a-zA-Z0-9._%+-]+@[a-zA-Z0-9.-]+\.[a-zA-Z]{2,}$/;
-var AvatarType;
-(function (AvatarType) {
-    AvatarType["Slotted"] = "slotted";
-    AvatarType["Image"] = "image";
-    AvatarType["Initials"] = "initials";
-    AvatarType[AvatarType["Null"] = null] = "Null";
-})(AvatarType || (AvatarType = {}));
-const PostAvatar = class {
-    constructor(hostRef) {
-        registerInstance(this, hostRef);
-        this.firstname = undefined;
-        this.lastname = undefined;
-        this.userid = undefined;
-        this.email = undefined;
-        this.slottedImage = undefined;
-        this.avatarType = null;
-        this.imageUrl = '';
-        this.imageAlt = '';
-        this.initials = '';
-    }
-    validateFirstname() {
-        checkRequiredAndType(this, 'firstname', 'string');
-    }
-    validateLastname() {
-        checkEmptyOrType(this, 'lastname', 'string');
-    }
-    validateUserid() {
-        checkEmptyOrType(this, 'userid', 'string');
-    }
-    validateEmail() {
-        if (this.email)
-            checkEmptyOrPattern(this, 'email', emailPattern);
-    }
-    async getAvatar() {
-        if (this.slottedImage !== null) {
-            this.avatarType = AvatarType.Slotted;
-        }
-        else {
-            let imageLoaded = false;
-            if (!imageLoaded && this.userid)
-                imageLoaded = await this.getImageByProp(this.userid, this.fetchImageByUserId.bind(this));
-            if (!imageLoaded && this.email)
-                imageLoaded = await this.getImageByProp(this.email, this.fetchImageByEmail.bind(this));
-            if (!imageLoaded)
-                this.getAvatarByInitials();
-        }
-    }
-    async getImageByProp(prop, fetchImage) {
-        if (!prop)
-            return false;
-        const imageResponse = (await this.getStorageItem(prop)) ?? { ok: false, url: '' };
-        if (!imageResponse.ok) {
-            try {
-                const r = await fetchImage();
-                imageResponse.ok = r.ok;
-                imageResponse.url = r.url;
-                this.imageUrl = imageResponse.url;
-                this.imageAlt = `${this.firstname} ${this.lastname} avatar`;
-                this.avatarType = AvatarType.Image;
-                this.setStorageItem(this.userid, JSON.stringify(imageResponse));
-            }
-            catch (error) {
-                this.removeStorageItem(prop);
-                console.info(`Loading avatar by type "${AvatarType.Image}" failed.`);
-            }
-        }
-        return imageResponse.ok;
-    }
-    async fetchImageByUserId() {
-        return await fetch(PostAvatar.INTERNAL_USERID_IMAGE_SRC.replace('{userid}', encodeURIComponent(this.userid)));
-    }
-    async fetchImageByEmail() {
-        const email = await this.cryptify(this.email);
-        const imageUrl = GRAVATAR_BASE_URL.replace('{email}', email);
-        return await fetch(imageUrl);
-    }
-    getAvatarByInitials() {
-        this.initials = this.getInitials();
-        this.avatarType = AvatarType.Initials;
-    }
-    getNames() {
-        return [this.firstname, this.lastname].filter(n => n);
-    }
-    getInitials() {
-        return this.getNames()
-            .map(n => n.charAt(0))
-            .join('')
-            .trim();
-    }
-    async getStorageItem(keyToken) {
-        const key = await this.cryptify(keyToken);
-        const value = window?.sessionStorage?.getItem(key);
-        return value ? JSON.parse(value) : null;
-    }
-    async setStorageItem(keyToken, value) {
-        const key = await this.cryptify(keyToken);
-        window?.sessionStorage?.setItem(key, value);
-    }
-    async removeStorageItem(keyToken) {
-        const key = await this.cryptify(keyToken);
-        window?.sessionStorage?.removeItem(key);
-    }
-    async cryptify(key) {
-        return await crypto.subtle.digest('SHA-256', new TextEncoder().encode(key)).then(buffer => {
-            return Array.from(new Uint8Array(buffer))
-                .map(bytes => bytes.toString(16).padStart(2, '0'))
-                .join('');
-        });
-    }
-    onSlotDefaultChange() {
-        this.slottedImage = this.host.querySelector('img');
-        this.getAvatar();
-    }
-    componentWillRender() {
-        this.slottedImage = this.host.querySelector('img');
-        this.getAvatar();
-    }
-    componentDidLoad() {
-        this.validateFirstname();
-        this.validateLastname();
-        this.validateUserid();
-        this.validateEmail();
-    }
-    render() {
-        const initials = this.getNames().reduce((acc, n, i) => {
-            if (i > 0)
-                acc.push(h("span", null, " "));
-            acc.push(n.charAt(0));
-            acc.push(h("span", null, n.slice(1)));
-            // eslint-disable-next-line @stencil-community/render-returns-host
-            return acc;
-        }, []);
-        return (h(Host, { "data-version": version }, h("slot", { onSlotchange: this.onSlotDefaultChange.bind(this) }, this.avatarType === 'image' && h("img", { src: this.imageUrl, alt: this.imageAlt }), this.avatarType === 'initials' && h("div", { class: "initials" }, initials))));
-    }
-    get host() { return getElement(this); }
-    static get watchers() { return {
-        "firstname": ["validateFirstname"],
-        "lastname": ["validateLastname"],
-        "userid": ["validateUserid"],
-        "email": ["validateEmail"]
-    }; }
-};
-PostAvatar.INTERNAL_USERID_IMAGE_SRC = 'https://web.post.ch/UserProfileImage/{userid}.png';
-PostAvatar.style = PostAvatarStyle0;
-
-export { PostAvatar as P };