@swisspost/design-system-components 10.0.0-next.47 → 10.0.0-next.48

package/dist/components/post-rating.js

@@ -1,12 +1,12 @@
-import { p as proxyCustomElement, H, c as createEvent, h, a as Host } from './index.js';
-import { v as version } from './p-Z01QMrov.js';
-import { c as checkRequiredAndType } from './p-CV7fm1rW.js';
-import './p-CJ80BZ06.js';
-import { d as defineCustomElement$2 } from './p-Cxrx7SXz.js';
+import { proxyCustomElement, HTMLElement, createEvent, h, Host } from '@stencil/core/internal/client';
+import { v as version } from './package.js';
+import { c as checkRequiredAndType } from './index2.js';
+import './breakpoints.js';
+import { d as defineCustomElement$2 } from './post-icon2.js';
 
 const postRatingCss = "@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{display:inline-block}.rating{display:flex;flex-wrap:wrap;overflow:hidden;margin:0 calc(var(--post-core-dimension-4)*-1);border-radius:4px}.rating .star{--post-rating-star-stroke:hsl(0, 0%, 40%);--post-rating-star-fill:#fff;position:relative;width:2rem;height:2rem;cursor:pointer}.rating .star .stroke,.rating .star .fill{display:block;width:100%;height:100%;transition:all ease 100ms}.rating .star .stroke{position:absolute;inset:auto;z-index:1;color:var(--post-rating-star-stroke)}.rating .star .fill{margin:1px;width:calc(100% - 2px);height:calc(100% - 2px);color:var(--post-rating-star-fill)}.rating .star.before-hover{--post-rating-star-stroke:hsl(0, 0%, 40%);--post-rating-star-fill:#fc0}.rating .star.active{--post-rating-star-stroke:hsl(0, 0%, 20%);--post-rating-star-fill:#fc0}.rating .star.hover{--post-rating-star-stroke:hsl(0, 0%, 40%);--post-rating-star-fill:#fc0}.rating .star.after-active{--post-rating-star-stroke:hsl(0, 0%, 40%);--post-rating-star-fill:hsl(0, 0%, 80%)}.rating :focus{outline:none}.rating:focus-visible{outline-offset:var(--post-core-dimension-2);outline:var(--post-core-dimension-2) solid #1976c8}.rating[aria-readonly=true] .star,.rating[aria-disabled=true] .star{cursor:default}.rating[aria-disabled=true] .star{--post-rating-star-stroke:hsl(0, 0%, 60%);--post-rating-star-fill:#fff}.rating[aria-disabled=true] .star.active{cursor:default;--post-rating-star-stroke:hsl(0, 0%, 60%);--post-rating-star-fill:hsl(0, 0%, 90%)}";
 
-const PostRating$1 = /*@__PURE__*/ proxyCustomElement(class PostRating extends H {
+const PostRating$1 = /*@__PURE__*/ proxyCustomElement(class PostRating extends HTMLElement {
     validateLabel() {
         checkRequiredAndType(this, 'label', 'string');
     }
@@ -25,8 +25,8 @@ const PostRating$1 = /*@__PURE__*/ proxyCustomElement(class PostRating extends H
         super();
         this.__registerHost();
         this.__attachShadow();
-        this.postInput = createEvent(this, "postInput");
-        this.postChange = createEvent(this, "postChange");
+        this.postInput = createEvent(this, "postInput", 7);
+        this.postChange = createEvent(this, "postChange", 7);
         this.hasChanged = false;
         /**
          * Defines a hidden label for the component.
@@ -145,7 +145,6 @@ function defineCustomElement$1() {
             break;
     } });
 }
-defineCustomElement$1();
 
 const PostRating = PostRating$1;
 const defineCustomElement = defineCustomElement$1;

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

@@ -1,12 +1,12 @@
-import { p as proxyCustomElement, H, h, a as Host } from './index.js';
-import { v as version } from './p-Z01QMrov.js';
-import { c as checkRequiredAndType } from './p-CV7fm1rW.js';
-import './p-CJ80BZ06.js';
-import { n as nanoid } from './p-BLchVpF6.js';
+import { proxyCustomElement, HTMLElement, h, Host } from '@stencil/core/internal/client';
+import { v as version } from './package.js';
+import { c as checkRequiredAndType } from './index2.js';
+import './breakpoints.js';
+import { n as nanoid } from './index.browser.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}}@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{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$1 = /*@__PURE__*/ proxyCustomElement(class PostTabHeader extends H {
+const PostTabHeader$1 = /*@__PURE__*/ proxyCustomElement(class PostTabHeader extends HTMLElement {
     constructor() {
         super();
         this.__registerHost();
@@ -45,7 +45,6 @@ function defineCustomElement$1() {
             break;
     } });
 }
-defineCustomElement$1();
 
 const PostTabHeader = PostTabHeader$1;
 const defineCustomElement = defineCustomElement$1;

package/dist/components/post-tab-panel.js

@@ -1,12 +1,12 @@
-import { p as proxyCustomElement, H, h, a as Host } from './index.js';
-import { v as version } from './p-Z01QMrov.js';
-import { n as nanoid } from './p-BLchVpF6.js';
-import { c as checkRequiredAndType } from './p-CV7fm1rW.js';
-import './p-CJ80BZ06.js';
+import { proxyCustomElement, HTMLElement, h, Host } from '@stencil/core/internal/client';
+import { v as version } from './package.js';
+import { n as nanoid } from './index.browser.js';
+import { c as checkRequiredAndType } from './index2.js';
+import './breakpoints.js';
 
 const postTabPanelCss = ":host{display:none}";
 
-const PostTabPanel$1 = /*@__PURE__*/ proxyCustomElement(class PostTabPanel extends H {
+const PostTabPanel$1 = /*@__PURE__*/ proxyCustomElement(class PostTabPanel extends HTMLElement {
     constructor() {
         super();
         this.__registerHost();
@@ -47,7 +47,6 @@ function defineCustomElement$1() {
             break;
     } });
 }
-defineCustomElement$1();
 
 const PostTabPanel = PostTabPanel$1;
 const defineCustomElement = defineCustomElement$1;

package/dist/components/post-tabs.js

@@ -1,7 +1,7 @@
-import { p as proxyCustomElement, H, c as createEvent, h, a as Host } from './index.js';
-import { v as version } from './p-Z01QMrov.js';
-import { f as fadeOut, a as fadeIn } from './p-SbIC4aZX.js';
-import './p-CJ80BZ06.js';
+import { proxyCustomElement, HTMLElement, createEvent, h, Host } from '@stencil/core/internal/client';
+import { v as version } from './package.js';
+import { f as fadeOut, a as fadeIn } from './fade.js';
+import './breakpoints.js';
 
 /**
  * Invoke the `componentOnReady` method if it is available, simulate it otherwise
@@ -26,12 +26,12 @@ function customOnReady(callback) {
 
 const postTabsCss = ".tabs-wrapper{position:relative;padding-top:1rem;border:0;background-color:rgba(0,0,0,.02)}.tabs-wrapper::after{content:\"\";position:absolute;bottom:0;width:100%;height:1px;background-color:#ccc}.tabs-wrapper .tabs{background-color:rgba(0,0,0,0) !important}@media (forced-colors: active),(-ms-high-contrast: active),(-ms-high-contrast: white-on-black){.tabs-wrapper::after{background-color:ButtonBorder}}.tabs{display:flex;flex-wrap:nowrap;overflow-x:auto;overscroll-behavior-x:contain;white-space:nowrap;margin-block:0;padding-inline-start:0;list-style:none}.tabs::after{content:\"\";display:block;flex:1 0 auto;width:1rem}.tab-content{padding-top:1rem}:host{display:block}:host([full-width=true]) .tabs-wrapper{margin-inline:calc(-1*var(--post-container-offset))}:host([full-width=true]) .tabs-wrapper .tabs{padding-inline:var(--post-container-offset)}";
 
-const PostTabs$1 = /*@__PURE__*/ proxyCustomElement(class PostTabs extends H {
+const PostTabs$1 = /*@__PURE__*/ proxyCustomElement(class PostTabs extends HTMLElement {
     constructor() {
         super();
         this.__registerHost();
         this.__attachShadow();
-        this.postChange = createEvent(this, "postChange");
+        this.postChange = createEvent(this, "postChange", 7);
         this.isLoaded = false;
         /**
          * When set to true, this property allows the tabs container to span the
@@ -167,7 +167,7 @@ const PostTabs$1 = /*@__PURE__*/ proxyCustomElement(class PostTabs extends H {
         nextTab.focus();
     }
     render() {
-        return (h(Host, { key: '467959e964a6d7f44ac3eee09f9c7d2b501af4fe', "data-version": version }, h("div", { key: '7ce4c0428360124f6937d123a4664d6f22e1110c', class: "tabs-wrapper", part: "tabs" }, h("div", { key: 'c41b073b855cb12a789c8656d12b0f6e9e20ea6f', class: "tabs", role: "tablist" }, h("slot", { key: '37935aa4c4d1ca4e71931e9e50d91e77075d2b64', name: "tabs", onSlotchange: () => this.enableTabs() }))), h("div", { key: 'bb84a728572c00256e219b5dd28322cbab699932', class: "tab-content", part: "content" }, h("slot", { key: 'e2aa9cf6a9faa9f5ded6018def77b9b818b2b986', onSlotchange: () => this.moveMisplacedTabs() }))));
+        return (h(Host, { key: 'dc7228c840d65e3546e0d13e5bcaa78819b5aeb9', "data-version": version }, h("div", { key: '377d592f7c00f3ec0c7aba2a4a8ca2b88cd37927', class: "tabs-wrapper", part: "tabs" }, h("div", { key: '6e79f33d6cd82d55ba9fad2f09f6163ce7e0a372', class: "tabs", role: "tablist" }, h("slot", { key: '65fbf3cb6525f2f2ae97eb60dad313811db4c585', name: "tabs", onSlotchange: () => this.enableTabs() }))), h("div", { key: '675a59a27e79bad06ea2b70c4fc7b0a6f4b020ff', class: "tab-content", part: "content" }, h("slot", { key: 'b559af0fa652e352673fbabb6829a62a5630e809', onSlotchange: () => this.moveMisplacedTabs() }))));
     }
     get host() { return this; }
     static get style() { return postTabsCss; }
@@ -189,7 +189,6 @@ function defineCustomElement$1() {
             break;
     } });
 }
-defineCustomElement$1();
 
 const PostTabs = PostTabs$1;
 const defineCustomElement = defineCustomElement$1;

package/dist/components/post-togglebutton.js

@@ -1,9 +1,9 @@
-import { p as proxyCustomElement, H, h, a as Host } from './index.js';
-import { v as version } from './p-Z01QMrov.js';
+import { proxyCustomElement, HTMLElement, h, Host } from '@stencil/core/internal/client';
+import { v as version } from './package.js';
 
 const postTogglebuttonCss = ":host{cursor:pointer;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}:host(:focus-visible){outline-style:var(--post-core-border-style-solid) !important}@media (forced-colors: active),(-ms-high-contrast: active),(-ms-high-contrast: white-on-black){:host(:focus-visible){outline-color:Highlight !important}}:host([aria-pressed=true]) ::slotted([data-showwhen=untoggled]){display:none}:host([aria-pressed=false]) ::slotted([data-showwhen=toggled]){display:none}";
 
-const PostTogglebutton$1 = /*@__PURE__*/ proxyCustomElement(class PostTogglebutton extends H {
+const PostTogglebutton$1 = /*@__PURE__*/ proxyCustomElement(class PostTogglebutton extends HTMLElement {
     constructor() {
         super();
         this.__registerHost();
@@ -49,7 +49,6 @@ function defineCustomElement$1() {
             break;
     } });
 }
-defineCustomElement$1();
 
 const PostTogglebutton = PostTogglebutton$1;
 const defineCustomElement = defineCustomElement$1;

package/dist/components/post-tooltip-trigger.js

@@ -1,7 +1,7 @@
-import { p as proxyCustomElement, H, h, a as Host } from './index.js';
-import { I as IS_BROWSER } from './p-CJ80BZ06.js';
-import { e as checkEmptyOrType } from './p-CV7fm1rW.js';
-import { v as version$1 } from './p-Z01QMrov.js';
+import { proxyCustomElement, HTMLElement as HTMLElement$1, h, Host } from '@stencil/core/internal/client';
+import { I as IS_BROWSER } from './breakpoints.js';
+import { e as checkEmptyOrType } from './index2.js';
+import { v as version$1 } from './package.js';
 
 var commonjsGlobal = typeof globalThis !== 'undefined' ? globalThis : typeof window !== 'undefined' ? window : typeof global !== 'undefined' ? global : typeof self !== 'undefined' ? self : {};
 
@@ -5025,10 +5025,10 @@ const postTooltipTriggerCss = "post-tooltip-trigger{vertical-align:top}";
 const TRIGGER_EVENTS = ['pointerenter', 'pointerleave', 'focusin', 'focusout', 'long-press'];
 if (IS_BROWSER) {
     (async () => {
-        await import('./p-C_2k3G1c.js');
+        await import('./long-press-event.js');
     })();
 }
-const PostTooltipTrigger$1 = /*@__PURE__*/ proxyCustomElement(class PostTooltipTrigger extends H {
+const PostTooltipTrigger$1 = /*@__PURE__*/ proxyCustomElement(class PostTooltipTrigger extends HTMLElement$1 {
     constructor() {
         super();
         this.__registerHost();
@@ -5215,7 +5215,6 @@ function defineCustomElement$1() {
             break;
     } });
 }
-defineCustomElement$1();
 
 const PostTooltipTrigger = PostTooltipTrigger$1;
 const defineCustomElement = defineCustomElement$1;

package/dist/components/post-tooltip.js

@@ -1,12 +1,12 @@
-import { p as proxyCustomElement, H, h, a as Host } from './index.js';
-import { v as version } from './p-Z01QMrov.js';
-import { d as checkEmptyOrOneOf } from './p-CV7fm1rW.js';
-import './p-CJ80BZ06.js';
-import { d as defineCustomElement$2, a as PLACEMENT_TYPES } from './p-DP5pj8mq.js';
+import { proxyCustomElement, HTMLElement, h, Host } from '@stencil/core/internal/client';
+import { v as version } from './package.js';
+import { d as checkEmptyOrOneOf } from './index2.js';
+import './breakpoints.js';
+import { a as PLACEMENT_TYPES, d as defineCustomElement$2 } 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{color:var(--post-current-fg);background-color:var(--post-current-bg);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 PostTooltip$1 = /*@__PURE__*/ proxyCustomElement(class PostTooltip extends H {
+const PostTooltip$1 = /*@__PURE__*/ proxyCustomElement(class PostTooltip extends HTMLElement {
     constructor() {
         super();
         this.__registerHost();
@@ -107,7 +107,6 @@ function defineCustomElement$1() {
             break;
     } });
 }
-defineCustomElement$1();
 
 const PostTooltip = PostTooltip$1;
 const defineCustomElement = defineCustomElement$1;

package/dist/components/react/index.d.ts

@@ -0,0 +1,33 @@
+/**
+ * Get the base path to where the assets can be found. Use "setAssetPath(path)"
+ * if the path needs to be customized.
+ */
+export declare const getAssetPath: (path: string) => string;
+
+/**
+ * Used to manually set the base path where assets can be found.
+ * If the script is used as "module", it's recommended to use "import.meta.url",
+ * such as "setAssetPath(import.meta.url)". Other options include
+ * "setAssetPath(document.currentScript.src)", or using a bundler's replace plugin to
+ * dynamically set the path at build time, such as "setAssetPath(process.env.ASSET_PATH)".
+ * But do note that this configuration depends on how your script is bundled, or lack of
+ * bundling, and where your assets can be loaded from. Additionally custom bundling
+ * will have to ensure the static assets are copied to its build directory.
+ */
+export declare const setAssetPath: (path: string) => void;
+
+/**
+ * Used to specify a nonce value that corresponds with an application's CSP.
+ * When set, the nonce will be added to all dynamically created script and style tags at runtime.
+ * Alternatively, the nonce value can be set on a meta tag in the DOM head
+ * (<meta name="csp-nonce" content="{ nonce value here }" />) which
+ * will result in the same behavior.
+ */
+export declare const setNonce: (nonce: string) => void
+
+export interface SetPlatformOptions {
+  raf?: (c: FrameRequestCallback) => number;
+  ael?: (el: EventTarget, eventName: string, listener: EventListenerOrEventListenerObject, options: boolean | AddEventListenerOptions) => void;
+  rel?: (el: EventTarget, eventName: string, listener: EventListenerOrEventListenerObject, options: boolean | AddEventListenerOptions) => void;
+}
+export declare const setPlatformOptions: (opts: SetPlatformOptions) => void;