@swisspost/design-system-components 10.0.0-next.54 → 10.0.0-next.56

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@swisspost/design-system-components",
-  "version": "10.0.0-next.54",
+  "version": "10.0.0-next.56",
   "description": "A collection of web components built with Stencil JS for the Swiss Post Design System.",
   "author": "Swiss Post <design-system@post.ch>",
   "license": "Apache-2.0",
@@ -69,8 +69,8 @@
     "@floating-ui/dom": "1.7.4",
     "@oddbird/popover-polyfill": "0.6.0",
     "@stencil/core": "4.35.0",
-    "@swisspost/design-system-icons": "10.0.0-next.54",
-    "@swisspost/design-system-styles": "10.0.0-next.54",
+    "@swisspost/design-system-icons": "10.0.0-next.56",
+    "@swisspost/design-system-styles": "10.0.0-next.56",
     "ally.js": "1.4.1",
     "long-press-event": "2.5.0",
     "nanoid": "5.1.6"
@@ -81,12 +81,11 @@
     "@percy/cli": "1.31.4",
     "@percy/cypress": "3.1.6",
     "@stencil-community/eslint-plugin": "0.10.0",
-    "@stencil/angular-output-target": "0.10.2",
-    "@stencil/react-output-target": "=0.8.2",
+    "@stencil/angular-output-target": "1.1.1",
+    "@stencil/react-output-target": "1.2.0",
     "@stencil/sass": "3.0.12",
-    "@swisspost/design-system-eslint": "10.0.0-next.54",
+    "@swisspost/design-system-eslint": "10.0.0-next.56",
     "@types/jest": "29.5.14",
-    "@types/mock-fs": "4.13.4",
     "@types/node": "22.10.5",
     "@typescript-eslint/parser": "7.18.0",
     "copyfiles": "2.4.1",
@@ -97,8 +96,8 @@
     "eslint-plugin-cypress": "4.2.0",
     "eslint-plugin-react": "7.37.5",
     "globals": "16.0.0",
-    "mock-fs": "5.5.0",
-    "prettier": "2.8.8",
+    "memfs": "4.51.0",
+    "prettier": "3.6.2",
     "replace": "1.2.2",
     "rimraf": "6.0.1",
     "rollup-plugin-postcss": "4.0.2",
@@ -122,7 +121,7 @@
     "start": "pnpm prebuild:script && stencil build --dev --watch --docs --docs-readme",
     "prebuild": "pnpm clean && pnpm prebuild:script",
     "build": "stencil build --docs-readme",
-    "postbuild": "pnpm copy:component-names && pnpm fix:export:components-react & pnpm copy:styles:components-react & pnpm copy:styles:components-angular",
+    "postbuild": "pnpm copy:component-names & pnpm copy:styles:components-react & pnpm copy:styles:components-angular",
     "clean": "rimraf --glob dist hydrate loader loaders www src/styles/generated src/_generated ../components-react/**/stencil-generated/ ../components-angular/projects/components/src/lib/stencil-generated/",
     "unit": "stencil test --spec",
     "unit:watch": "stencil test --spec --watchAll --silent",
@@ -135,7 +134,6 @@
     "generate": "stencil generate",
     "prebuild:script": "node --loader ts-node/esm prebuild.ts",
     "copy:component-names": "copyfiles -f src/_generated/component-names.json dist/",
-    "fix:export:components-react": "replace './components.server' './components.server.js' ../components-react/src/stencil-generated/server/components.ts",
     "copy:styles:components-react": "copyfiles -f www/build/post-components.css ../components-react/src/stencil-generated/",
     "copy:styles:components-angular": "copyfiles -f www/build/post-components.css ../components-angular/projects/components/src/lib/stencil-generated/"
   }

package/dist/cjs/fade-nS5zzDQS.js

@@ -1,14 +0,0 @@
-'use strict';
-
-const fadeDuration = 200;
-const fadedOutKeyframe = { opacity: '0' };
-const fadedInKeyframe = { opacity: '1' };
-function fadeIn(el) {
-    return el.animate([fadedOutKeyframe, fadedInKeyframe], { duration: fadeDuration });
-}
-function fadeOut(el) {
-    return el.animate([fadedInKeyframe, fadedOutKeyframe], { duration: fadeDuration });
-}
-
-exports.fadeIn = fadeIn;
-exports.fadeOut = fadeOut;

package/dist/cjs/index-DtvYdwe1.js

@@ -1,96 +0,0 @@
-'use strict';
-
-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 checkRequiredAndType = requiredAnd(checkType);
-const checkRequiredAndUrl = requiredAnd(checkUrl);
-
-exports.checkEmptyOrOneOf = checkEmptyOrOneOf;
-exports.checkEmptyOrPattern = checkEmptyOrPattern;
-exports.checkEmptyOrType = checkEmptyOrType;
-exports.checkEmptyOrUrl = checkEmptyOrUrl;
-exports.checkRequiredAndOneOf = checkRequiredAndOneOf;
-exports.checkRequiredAndType = checkRequiredAndType;
-exports.checkRequiredAndUrl = checkRequiredAndUrl;

package/dist/cjs/post-tab-header.cjs.entry.js

@@ -1,31 +0,0 @@
-'use strict';
-
-var index = require('./index-Cb8CTrOz.js');
-var _package = require('./package-CvZxvdTJ.js');
-var index$1 = require('./index-DtvYdwe1.js');
-require('./breakpoints-CEkeixld.js');
-var index_browser = require('./index.browser-Doj636JV.js');
-
-const postTabHeaderCss = ".tab-title[role=tab]{display:inline-block;cursor:pointer;position:relative;box-sizing:border-box;padding:1rem;transition:background-color 100ms;border-right:1px solid rgba(0,0,0,0);border-left:1px solid rgba(0,0,0,0);outline-color:currentColor;opacity:.7;color:#000;text-decoration:none;background-color:rgba(0,0,0,0)}.tab-title[role=tab]:focus{background-color:unset;color:#000}.tab-title[role=tab]:hover{opacity:1;background-color:rgba(0,0,0,.6);color:#fff}.tab-title[role=tab]:focus-visible{outline:rgba(0,0,0,0);opacity:1;background-color:rgba(0,0,0,.6);color:#fff;box-shadow:none}.tab-title[role=tab]:focus-visible::after{content:\"\";display:block;position:absolute;top:2px;right:1px;bottom:0;left:1px;box-shadow:0 0 0 1px #fff,0 0 0 2px #333}.tab-title[role=tab].active{z-index:1;border-right-color:#ccc;border-left-color:#ccc;opacity:1;background-color:#fff;color:#000;font-weight:700}.tab-title[role=tab].active::before{content:\"\";display:block;position:absolute;top:0;right:-1px;left:-1px;height:var(--post-core-dimension-4);background-color:#fc0}:where(.bg-dark,.bg-black,.bg-primary,.bg-secondary,.bg-success,.bg-error) .tab-title[role=tab]:hover{background-color:rgba(255,255,255,.2)}:where(.bg-dark,.bg-black,.bg-primary,.bg-secondary,.bg-success,.bg-error) .tab-title[role=tab]:focus-visible{background-color:rgba(255,255,255,.2)}@media (forced-colors: active),(-ms-high-contrast: active),(-ms-high-contrast: white-on-black){.tab-title[role=tab]{opacity:1;border-left-color:Canvas;border-right-color:Canvas;color:LinkText}.tab-title[role=tab]:hover,.tab-title[role=tab]:focus,.tab-title[role=tab]:focus-within,.tab-title[role=tab]:focus-visible{outline:var(--post-core-dimension-2) solid Highlight;outline-offset:calc(var(--post-core-dimension-4)*-1)}.tab-title[role=tab].active{border-left-color:ButtonText;border-right-color:ButtonText;color:Highlight}.tab-title[role=tab].active::before{background-color:Highlight}}:host{display:block}.tab-title{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){.tab-title{background-color:ButtonFace !important}.tab-title:hover{background-color:Highlight !important}}";
-
-const PostTabHeader = class {
-    constructor(hostRef) {
-        index.registerInstance(this, hostRef);
-    }
-    validateFor() {
-        index$1.checkRequiredAndType(this, 'panel', 'string');
-    }
-    componentWillLoad() {
-        this.tabId = `tab-${this.host.id || index_browser.nanoid(6)}`;
-    }
-    render() {
-        return (index.h(index.Host, { key: '5d9cfad4e62285e8b64a5f597e3d38d451dd493f', id: this.tabId, role: "tab", "data-version": _package.version, "aria-selected": "false", tabindex: "-1", class: "tab-title", slot: "tabs" }, index.h("slot", { key: '679874586fb55510af17838ef73403c8b7a33ddc' })));
-    }
-    get host() { return index.getElement(this); }
-    static get watchers() { return {
-        "panel": ["validateFor"]
-    }; }
-};
-PostTabHeader.style = postTabHeaderCss;
-
-exports.post_tab_header = PostTabHeader;

package/dist/collection/animations/slide-and-fade.js

@@ -1,25 +0,0 @@
-// Define common animation options
-const easing = 'ease';
-const defaultDuration = 500;
-const fill = 'forwards';
-function createSlideFadeAnimation(el, keyframes, duration = defaultDuration) {
-    return el.animate(keyframes, {
-        duration: duration,
-        easing,
-        fill,
-    });
-}
-export function slideUpAndFadeOut(el, translateY = '-100%', duration = defaultDuration) {
-    const keyframes = [
-        { transform: 'translateY(0)', opacity: '1' },
-        { transform: `translateY(${translateY})`, opacity: '0' },
-    ];
-    return createSlideFadeAnimation(el, keyframes, duration);
-}
-export function slideDownAndFadeIn(el, translateY = '-100%', duration = defaultDuration) {
-    const keyframes = [
-        { transform: `translateY(${translateY})`, opacity: '0' },
-        { transform: 'translateY(0)', opacity: '1' },
-    ];
-    return createSlideFadeAnimation(el, keyframes, duration);
-}

package/dist/collection/components/post-language-option/post-language-option.css

@@ -1 +0,0 @@
-post-language-option{display:inline-block}post-language-option 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-language-option button{background-color:ButtonFace !important}post-language-option button:hover{background-color:Highlight !important}}post-language-option button .visually-hidden{position:absolute;width:1px;height:1px;margin:-1px;padding:0;overflow:hidden;clip:rect(0 0 0 0);border:0}post-language-option a{color:var(--post-current-fg);text-decoration:none}post-language-option :is(a,button){cursor:pointer;display:flex;align-items:center;justify-content:center;width:100%;height:100%;text-transform:uppercase}post-language-option :is(a,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}post-language-option :is(a,button):is(:focus-visible,:has(:focus-visible),.pretend-focus){outline-style:var(--post-core-border-style-solid) !important;outline-offset:-2px !important;border-radius:4px}@media(forced-colors: active),(-ms-high-contrast: active),(-ms-high-contrast: white-on-black){post-language-option :is(a,button):is(:focus-visible,:has(:focus-visible),.pretend-focus){outline-color:Highlight !important}}@supports not selector(:has(:focus-visible)){post-language-option :is(a,button):is(:focus-visible,:focus-within,.pretend-focus){outline-style:var(--post-core-border-style-solid) !important;outline-offset:-2px !important;border-radius:4px}@media(forced-colors: active),(-ms-high-contrast: active),(-ms-high-contrast: white-on-black){post-language-option :is(a,button):is(:focus-visible,:focus-within,.pretend-focus){outline-color:Highlight !important}}}post-language-option:where([variant=list]) :is(a,button){padding-inline:0;width:40px;height:40px;border-radius:2px}post-language-option:where([variant=list]) :is(a,button):hover{color:#504f4b}@media(forced-colors: active),(-ms-high-contrast: active),(-ms-high-contrast: white-on-black){post-language-option:where([variant=list]) :is(a,button){border:1px solid ButtonBorder;color:ButtonText}}post-language-option:where([variant=list])[active]:not([active=false]) :is(a,button){background-color:#050400 !important;color:#fff;pointer-events:none}@media(forced-colors: active),(-ms-high-contrast: active),(-ms-high-contrast: white-on-black){post-language-option:where([variant=list])[active]:not([active=false]) :is(a,button){background-color:Highlight !important;color:HighlightText}}post-language-option:where([variant=menu]){min-width:72px}post-language-option:where([variant=menu])[active]:not([active=false]){display:none}post-language-option:where([variant=menu]) :is(a,button){padding-block:13px;padding-inline:16px;box-sizing:border-box;justify-content:flex-start;position:relative;border-radius:0}post-language-option:where([variant=menu]) :is(a,button):hover{color:#fff;background-color:#504f4b}post-language-option:where([variant=menu]):first-child :is(a,button){border-start-start-radius:4px;border-start-end-radius:4px}post-language-option:where([variant=menu]):last-child :is(a,button){border-end-start-radius:4px;border-end-end-radius:4px}

package/dist/collection/components/post-language-switch/post-language-switch.css

@@ -1 +0,0 @@
-:host{display:flex !important;flex-wrap:wrap;gap:.5rem}.visually-hidden{position:absolute;width:1px;height:1px;margin:-1px;padding:0;overflow:hidden;clip:rect(0 0 0 0);border:0}.post-language-switch-dropdown-container{display:flex;flex-direction:column}.post-language-switch-trigger{cursor:pointer;text-transform:uppercase;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;text-decoration:none;display:inline-flex;align-items:center;gap:6px;border-radius:24px;font-size:16px;padding:3px 10px}@media(forced-colors: active),(-ms-high-contrast: active),(-ms-high-contrast: white-on-black){.post-language-switch-trigger{background-color:ButtonFace !important}.post-language-switch-trigger:hover{background-color:Highlight !important}}.post-language-switch-trigger{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}.post-language-switch-trigger:is(:focus-visible,:has(:focus-visible),.pretend-focus){outline-style:var(--post-core-border-style-solid) !important}@media(forced-colors: active),(-ms-high-contrast: active),(-ms-high-contrast: white-on-black){.post-language-switch-trigger:is(:focus-visible,:has(:focus-visible),.pretend-focus){outline-color:Highlight !important}}@supports not selector(:has(:focus-visible)){.post-language-switch-trigger:is(:focus-visible,:focus-within,.pretend-focus){outline-style:var(--post-core-border-style-solid) !important}@media(forced-colors: active),(-ms-high-contrast: active),(-ms-high-contrast: white-on-black){.post-language-switch-trigger:is(:focus-visible,:focus-within,.pretend-focus){outline-color:Highlight !important}}}.post-language-switch-trigger:not(:disabled):hover,.post-language-switch-trigger.pretend-hover{border-color:var(--post-scheme-color-interactive-button-tertiary-hover-stroke);background-color:var(--post-scheme-color-interactive-button-tertiary-hover-bg);color:var(--post-scheme-color-interactive-button-tertiary-hover-fg)}.post-language-switch-trigger post-icon{height:24px;width:24px}.post-language-switch-trigger[aria-expanded=true]{background-color:#050400;color:#fff}.post-language-switch-trigger[aria-expanded=true] post-icon{transform:rotate(180deg)}.post-language-switch-trigger[aria-expanded=true]:hover{background-color:#504f4b;color:#fff}@media(forced-colors: active),(-ms-high-contrast: active),(-ms-high-contrast: white-on-black){.post-language-switch-trigger{border:1px solid ButtonBorder}.post-language-switch-trigger[aria-expanded=true] post-icon,.post-language-switch-trigger:hover post-icon{color:HighlightText}}post-menu::part(menu){padding-block:0}

package/dist/collection/components/post-list/post-list.css

@@ -1 +0,0 @@
-post-list{display:flex;flex-direction:column;gap:var(--post-list-title-gap, 0)}post-list>[role=list]{display:flex;flex-direction:column;gap:var(--post-list-item-gap, 0)}post-list:where([horizontal]:not([horizontal=false])){flex-direction:row;align-items:center}post-list:where([horizontal]:not([horizontal=false]))>[role=list]{flex-direction:row;align-items:center}post-list>.list-title.visually-hidden{position:absolute;width:1px;height:1px;margin:-1px;padding:0;overflow:hidden;clip:rect(0 0 0 0);border:0}

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

@@ -1,97 +0,0 @@
-import { Host, h } from "@stencil/core";
-import { version } from "../../../../package";
-import { nanoid } from "nanoid";
-/**
- * @slot default - Slot for placing the list title.
- * @slot post-list-item - Slot for placing post-list-item components.
- */
-export class PostList {
-    constructor() {
-        /**
-         * If `true`, the list title will be hidden. Otherwise, it will be displayed.`
-         */
-        this.titleHidden = false;
-        /**
-         * The list can become horizontal by setting `horizontal="true"` or just `horizontal`
-         */
-        this.horizontal = false;
-    }
-    componentWillLoad() {
-        /**
-         * Get the id set on the host element or use a random id by default
-         */
-        this.titleId = `title-${this.host.id || nanoid(6)}`;
-    }
-    componentDidLoad() {
-        this.checkTitle();
-    }
-    checkTitle() {
-        if (!this.titleEl.textContent.trim()) {
-            console.error('Please provide a title to the list component. Title is mandatory for accessibility purposes.');
-        }
-    }
-    render() {
-        return (h(Host, { key: '908588a3f1261efbb85dbefade9f85f8ec6f16f8', "data-version": version }, h("div", { key: '44b224379be814dab98e16ad12a3ca0f10e61ac0', ref: el => (this.titleEl = el), id: this.titleId, class: `list-title${this.titleHidden ? ' visually-hidden' : ''}` }, h("slot", { key: '1aed36b7c286796a4d617643e7606e63bc2dd95a' })), h("div", { key: '3e1d137712b3e7616bab450426964f6c9334198e', role: "list", "aria-labelledby": this.titleId }, h("slot", { key: 'fd5abb2fca95d32295fbfa158795413264200ae8', name: "post-list-item" }))));
-    }
-    static get is() { return "post-list"; }
-    static get originalStyleUrls() {
-        return {
-            "$": ["post-list.scss"]
-        };
-    }
-    static get styleUrls() {
-        return {
-            "$": ["post-list.css"]
-        };
-    }
-    static get properties() {
-        return {
-            "titleHidden": {
-                "type": "boolean",
-                "attribute": "title-hidden",
-                "mutable": false,
-                "complexType": {
-                    "original": "boolean",
-                    "resolved": "boolean",
-                    "references": {}
-                },
-                "required": false,
-                "optional": false,
-                "docs": {
-                    "tags": [],
-                    "text": "If `true`, the list title will be hidden. Otherwise, it will be displayed.`"
-                },
-                "getter": false,
-                "setter": false,
-                "reflect": false,
-                "defaultValue": "false"
-            },
-            "horizontal": {
-                "type": "boolean",
-                "attribute": "horizontal",
-                "mutable": false,
-                "complexType": {
-                    "original": "boolean",
-                    "resolved": "boolean",
-                    "references": {}
-                },
-                "required": false,
-                "optional": false,
-                "docs": {
-                    "tags": [],
-                    "text": "The list can become horizontal by setting `horizontal=\"true\"` or just `horizontal`"
-                },
-                "getter": false,
-                "setter": false,
-                "reflect": true,
-                "defaultValue": "false"
-            }
-        };
-    }
-    static get states() {
-        return {
-            "titleId": {}
-        };
-    }
-    static get elementRef() { return "host"; }
-}

package/dist/collection/components/post-list-item/post-list-item.css

@@ -1 +0,0 @@
-:host{display:flex}

package/dist/collection/components/post-list-item/post-list-item.js

@@ -1,26 +0,0 @@
-import { Host, h } from "@stencil/core";
-import { version } from "../../../../package";
-/**
- * @slot default- Slot for placing the content of the list item.
- */
-export class PostListItem {
-    connectedCallback() {
-        this.host.setAttribute('slot', 'post-list-item');
-    }
-    render() {
-        return (h(Host, { key: '67204f0c31a6bc4cad3359030a8da57a045de7c5', role: "listitem", slot: "post-list-item", version: version }, h("slot", { key: '0c68073c601a3792880fc0e68af24a4a204548ed' })));
-    }
-    static get is() { return "post-list-item"; }
-    static get encapsulation() { return "shadow"; }
-    static get originalStyleUrls() {
-        return {
-            "$": ["post-list-item.scss"]
-        };
-    }
-    static get styleUrls() {
-        return {
-            "$": ["post-list-item.css"]
-        };
-    }
-    static get elementRef() { return "host"; }
-}

package/dist/collection/components/post-tab-header/post-tab-header.css

@@ -1 +0,0 @@
-.tab-title[role=tab]{display:inline-block;cursor:pointer;position:relative;box-sizing:border-box;padding:1rem;transition:background-color 100ms;border-right:1px solid rgba(0,0,0,0);border-left:1px solid rgba(0,0,0,0);outline-color:currentColor;opacity:.7;color:#000;text-decoration:none;background-color:rgba(0,0,0,0)}.tab-title[role=tab]:focus{background-color:unset;color:#000}.tab-title[role=tab]:hover{opacity:1;background-color:rgba(0,0,0,.6);color:#fff}.tab-title[role=tab]:focus-visible{outline:rgba(0,0,0,0);opacity:1;background-color:rgba(0,0,0,.6);color:#fff;box-shadow:none}.tab-title[role=tab]:focus-visible::after{content:"";display:block;position:absolute;top:2px;right:1px;bottom:0;left:1px;box-shadow:0 0 0 1px #fff,0 0 0 2px #333}.tab-title[role=tab].active{z-index:1;border-right-color:#ccc;border-left-color:#ccc;opacity:1;background-color:#fff;color:#000;font-weight:700}.tab-title[role=tab].active::before{content:"";display:block;position:absolute;top:0;right:-1px;left:-1px;height:var(--post-core-dimension-4);background-color:#fc0}:where(.bg-dark,.bg-black,.bg-primary,.bg-secondary,.bg-success,.bg-error) .tab-title[role=tab]:hover{background-color:rgba(255,255,255,.2)}:where(.bg-dark,.bg-black,.bg-primary,.bg-secondary,.bg-success,.bg-error) .tab-title[role=tab]:focus-visible{background-color:rgba(255,255,255,.2)}@media(forced-colors: active),(-ms-high-contrast: active),(-ms-high-contrast: white-on-black){.tab-title[role=tab]{opacity:1;border-left-color:Canvas;border-right-color:Canvas;color:LinkText}.tab-title[role=tab]:hover,.tab-title[role=tab]:focus,.tab-title[role=tab]:focus-within,.tab-title[role=tab]:focus-visible{outline:var(--post-core-dimension-2) solid Highlight;outline-offset:calc(var(--post-core-dimension-4)*-1)}.tab-title[role=tab].active{border-left-color:ButtonText;border-right-color:ButtonText;color:Highlight}.tab-title[role=tab].active::before{background-color:Highlight}}:host{display:block}.tab-title{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){.tab-title{background-color:ButtonFace !important}.tab-title:hover{background-color:Highlight !important}}

package/dist/collection/components/post-tab-header/post-tab-header.js

@@ -1,65 +0,0 @@
-import { h, Host } from "@stencil/core";
-import { version } from "../../../../package";
-import { checkRequiredAndType } from "../../utils/index";
-import { nanoid } from "nanoid";
-/**
- * @slot default - Slot for the content of the tab header.
- */
-export class PostTabHeader {
-    validateFor() {
-        checkRequiredAndType(this, 'panel', 'string');
-    }
-    componentWillLoad() {
-        this.tabId = `tab-${this.host.id || nanoid(6)}`;
-    }
-    render() {
-        return (h(Host, { key: '5d9cfad4e62285e8b64a5f597e3d38d451dd493f', id: this.tabId, role: "tab", "data-version": version, "aria-selected": "false", tabindex: "-1", class: "tab-title", slot: "tabs" }, h("slot", { key: '679874586fb55510af17838ef73403c8b7a33ddc' })));
-    }
-    static get is() { return "post-tab-header"; }
-    static get encapsulation() { return "shadow"; }
-    static get originalStyleUrls() {
-        return {
-            "$": ["post-tab-header.scss"]
-        };
-    }
-    static get styleUrls() {
-        return {
-            "$": ["post-tab-header.css"]
-        };
-    }
-    static get properties() {
-        return {
-            "panel": {
-                "type": "string",
-                "attribute": "panel",
-                "mutable": false,
-                "complexType": {
-                    "original": "string",
-                    "resolved": "string",
-                    "references": {}
-                },
-                "required": true,
-                "optional": false,
-                "docs": {
-                    "tags": [],
-                    "text": "The name of the panel controlled by the tab header."
-                },
-                "getter": false,
-                "setter": false,
-                "reflect": true
-            }
-        };
-    }
-    static get states() {
-        return {
-            "tabId": {}
-        };
-    }
-    static get elementRef() { return "host"; }
-    static get watchers() {
-        return [{
-                "propName": "panel",
-                "methodName": "validateFor"
-            }];
-    }
-}

package/dist/components/index2.js

@@ -1,88 +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 checkRequiredAndType = requiredAnd(checkType);
-const checkRequiredAndUrl = requiredAnd(checkUrl);
-
-export { checkEmptyOrUrl as a, checkRequiredAndOneOf as b, checkRequiredAndType as c, checkEmptyOrOneOf as d, checkEmptyOrType as e, checkEmptyOrPattern as f, checkRequiredAndUrl as g };

package/dist/components/post-language-option.d.ts

@@ -1,11 +0,0 @@
-import type { Components, JSX } from "../types/components";
-
-interface PostLanguageOption extends Components.PostLanguageOption, HTMLElement {}
-export const PostLanguageOption: {
-    prototype: PostLanguageOption;
-    new (): PostLanguageOption;
-};
-/**
- * Used to define this component and all nested components recursively.
- */
-export const defineCustomElement: () => void;