@nectary/components 5.42.5-rc.0 → 5.43.1

package/input/index.js

@@ -1,11 +1,11 @@
-import { C as Context, s as subscribeContext } from "../context.js";
-import { j as getBooleanAttribute, i as getAttribute, y as updateAttribute, s as isAttrEqual, t as isAttrTrue, z as updateBooleanAttribute, C as updateLiteralAttribute, o as getLiteralAttribute, w as setClass } from "../dom.js";
-import { d as defineCustomElement, N as NectaryElement } from "../element.js";
-import { i as isElementFocused } from "../slot.js";
-import { g as getReactEventHandler } from "../get-react-event-handler.js";
-import { s as setFormValue, r as requestSubmitForm } from "../form.js";
-import { s as sizeValues, D as DEFAULT_SIZE } from "../size.js";
-import { s as splitValueAndMask, i as inputTypes, b as beginMaskedComposition, e as endMaskedComposition, d as deleteContentForward, a as deleteContentBackward, c as insertFromPaste, f as insertText, g as getMergedValueSliced, h as getMaskSymbols } from "../utils19.js";
+import { Context, subscribeContext } from "../utils/context.js";
+import { getBooleanAttribute, getAttribute, updateAttribute, isAttrEqual, isAttrTrue, updateBooleanAttribute, updateLiteralAttribute, getLiteralAttribute, setClass } from "../utils/dom.js";
+import { defineCustomElement, NectaryElement } from "../utils/element.js";
+import { isElementFocused } from "../utils/slot.js";
+import { getReactEventHandler } from "../utils/get-react-event-handler.js";
+import { setFormValue, requestSubmitForm } from "../utils/form.js";
+import { sizeValues, DEFAULT_SIZE } from "../utils/size.js";
+import { splitValueAndMask, inputTypes, beginMaskedComposition, endMaskedComposition, deleteContentForward, deleteContentBackward, insertFromPaste, insertText, getMergedValueSliced, getMaskSymbols } from "./utils.js";
 const templateHTML = '<style>:host{all:initial;display:inline-block;vertical-align:middle}#wrapper{position:relative;display:flex;flex-direction:row;align-items:center;box-sizing:border-box;border-radius:var(--sinch-local-shape-radius);width:100%;height:var(--sinch-local-size);background-color:var(--sinch-comp-input-color-default-background-initial);--sinch-local-size:var(--sinch-comp-input-size-container-m);--sinch-local-padding:var(--sinch-comp-input-spacing-padding-m, 12px);--sinch-local-icon-gap:var(--sinch-comp-input-spacing-icon-gap-m, 8px);--sinch-local-slot-gap:var(--sinch-comp-input-spacing-slot-gap-m, 4px);--sinch-local-slot-padding:var(--sinch-comp-input-spacing-slot-padding-m, 4px);--sinch-global-size-icon:var(--sinch-comp-input-size-icon-m);--sinch-local-shape-radius:var(--sinch-comp-input-shape-radius-size-m)}:host([data-size="l"])>#wrapper{--sinch-local-size:var(--sinch-comp-input-size-container-l);--sinch-local-padding:var(--sinch-comp-input-spacing-padding-l, 12px);--sinch-local-icon-gap:var(--sinch-comp-input-spacing-icon-gap-l, 8px);--sinch-local-slot-gap:var(--sinch-comp-input-spacing-slot-gap-l, 4px);--sinch-local-slot-padding:var(--sinch-comp-input-spacing-slot-padding-l, 4px);--sinch-global-size-icon:var(--sinch-comp-input-size-icon-l);--sinch-local-shape-radius:var(--sinch-comp-input-shape-radius-size-l)}:host([data-size="m"])>#wrapper{--sinch-local-size:var(--sinch-comp-input-size-container-m);--sinch-local-padding:var(--sinch-comp-input-spacing-padding-m, 12px);--sinch-local-icon-gap:var(--sinch-comp-input-spacing-icon-gap-m, 8px);--sinch-local-slot-gap:var(--sinch-comp-input-spacing-slot-gap-m, 4px);--sinch-local-slot-padding:var(--sinch-comp-input-spacing-slot-padding-m, 4px);--sinch-global-size-icon:var(--sinch-comp-input-size-icon-m);--sinch-local-shape-radius:var(--sinch-comp-input-shape-radius-size-m)}:host([data-size="s"])>#wrapper{--sinch-local-size:var(--sinch-comp-input-size-container-s);--sinch-local-padding:var(--sinch-comp-input-spacing-padding-s, 12px);--sinch-local-icon-gap:var(--sinch-comp-input-spacing-icon-gap-s, 8px);--sinch-local-slot-gap:var(--sinch-comp-input-spacing-slot-gap-s, 4px);--sinch-local-slot-padding:var(--sinch-comp-input-spacing-slot-padding-s, 4px);--sinch-global-size-icon:var(--sinch-comp-input-size-icon-s);--sinch-local-shape-radius:var(--sinch-comp-input-shape-radius-size-s)}#input-wrapper{position:relative;flex:1;flex-basis:0;min-width:0;align-self:stretch}#input{all:initial;width:100%;height:100%;padding:0 var(--sinch-local-padding);box-sizing:border-box;font:var(--sinch-comp-input-font-input);color:var(--sinch-comp-input-color-default-text-initial)}#input::placeholder{font:var(--sinch-comp-input-font-placeholder)!important;color:var(--sinch-comp-input-color-default-text-placeholder);opacity:1}#input:disabled{color:var(--sinch-comp-input-color-disabled-text-initial);-webkit-text-fill-color:var(--sinch-comp-input-color-disabled-text-initial)}#input-mask{display:none;position:absolute;inset:0;padding:0 var(--sinch-local-padding);pointer-events:none;color:var(--sinch-comp-input-color-default-text-placeholder);white-space:pre;height:fit-content;margin:auto 0;overflow:hidden}#border{position:absolute;border:1px solid var(--sinch-comp-input-color-default-border-initial);border-radius:var(--sinch-local-shape-radius);inset:0;pointer-events:none}:host([disabled]) #border{border-color:var(--sinch-comp-input-color-disabled-border-initial)}#input-wrapper:focus-within+#border{border-color:var(--sinch-comp-input-color-default-border-focus);border-width:2px}#input-mask,:host([mask]) #input{font:var(--sinch-sys-font-body-monospace-m)}:host([mask]) #input-mask{display:block}:host([invalid]:not([disabled])) #input-wrapper:not(:focus-within)+#border{border-color:var(--sinch-comp-input-color-invalid-border-initial)}#input[type=password]:not(:placeholder-shown){letter-spacing:.1em}:host(:not([enforce-consistent-font-size])) #input[type=password]:not(:placeholder-shown){font-size:1.5em}:host([enforce-consistent-font-size]) #input[type=password]:not(:placeholder-shown){font-size:inherit}#icon-wrapper{position:relative;height:100%}#icon{position:absolute;display:flex;align-items:center;left:var(--sinch-local-padding);top:0;bottom:0;pointer-events:none;--sinch-global-color-icon:var(--sinch-comp-input-color-default-icon-initial)}:host([disabled]) #icon{--sinch-global-color-icon:var(--sinch-comp-input-color-disabled-icon-initial)}#icon-wrapper.empty{display:none}#icon-wrapper.empty~#input-wrapper>#input,#icon-wrapper.empty~#input-wrapper>#input-mask{padding-left:var(--sinch-local-padding)}#icon-wrapper:not(.empty)~#input-wrapper>#input,#icon-wrapper:not(.empty)~#input-wrapper>#input-mask{padding-left:calc(var(--sinch-local-padding) + var(--sinch-global-size-icon) + var(--sinch-local-icon-gap))}#right{display:flex;flex-direction:row;align-self:stretch;align-items:center;gap:var(--sinch-local-slot-gap);padding-right:var(--sinch-local-slot-padding)}#right.empty{display:none}#left{display:flex;flex-direction:row;align-self:stretch;align-items:center;gap:var(--sinch-local-slot-gap);padding-left:var(--sinch-local-slot-padding)}#left.empty{display:none}</style><div id="wrapper"><div id="left"><slot name="left"></slot></div><div id="icon-wrapper"><div id="icon"><slot name="icon"></slot></div></div><div id="input-wrapper"><div id="input-mask"></div><input id="input" type="text"></div><div id="border"></div><div id="right"><slot name="right"></slot></div></div>';
 const template = document.createElement("template");
 template.innerHTML = templateHTML;

package/link/global/index.js

@@ -1,2 +1,2 @@
-import { d as defineCustomElement } from "../../element.js";
+import { defineCustomElement } from "../../utils/element.js";
 defineCustomElement("sinch-link");

package/link/index.d.ts

@@ -16,8 +16,8 @@ export declare class Link extends NectaryElement {
     set contentAsCode(value: boolean);
     get href(): string;
     set href(value: string);
-    set 'use-history'(value: boolean);
-    get 'use-history'(): boolean;
+    set useHistory(value: boolean);
+    get useHistory(): boolean;
     set disabled(isDisabled: boolean);
     get disabled(): boolean;
     set external(isExternal: boolean);

package/link/index.js

@@ -1,9 +1,9 @@
-import "../index.d9.js";
-import "../index.d3.js";
-import { i as getAttribute, j as getBooleanAttribute, s as isAttrEqual, C as updateLiteralAttribute, y as updateAttribute, z as updateBooleanAttribute, t as isAttrTrue, o as getLiteralAttribute } from "../dom.js";
-import { d as defineCustomElement, N as NectaryElement } from "../element.js";
-import { g as getReactEventHandler } from "../get-react-event-handler.js";
-import { l as linkTypeValues } from "../utils20.js";
+import "../code-tag/index.js";
+import "../icon/index.js";
+import { getAttribute, getBooleanAttribute, isAttrEqual, updateLiteralAttribute, updateAttribute, updateBooleanAttribute, isAttrTrue, getLiteralAttribute } from "../utils/dom.js";
+import { defineCustomElement, NectaryElement } from "../utils/element.js";
+import { getReactEventHandler } from "../utils/get-react-event-handler.js";
+import { linkTypeValues } from "./utils.js";
 const templateHTML = '<style>:host{display:inline}:host(:not([type])) a{font:var(--sinch-comp-link-default-font-initial);font-size:inherit;line-height:inherit;text-decoration:var(--sinch-comp-link-default-text-decoration-initial);color:var(--sinch-comp-link-color-default-text-initial);border-radius:.5em;white-space:nowrap;--sinch-global-color-icon:var(--sinch-comp-link-color-default-icon-initial)}:host(:not([type])) a:hover{text-decoration:var(--sinch-comp-link-default-text-decoration-hover);color:var(--sinch-comp-link-color-default-text-hover);--sinch-global-color-icon:var(--sinch-comp-link-color-default-icon-hover)}:host(:not([type])) a:focus-visible{outline:2px solid var(--sinch-comp-link-color-default-outline-focus);outline-offset:2px}:host(:not([type])[standalone]){display:block}:host(:not([type])[standalone]) a{display:block;font:var(--sinch-comp-link-standalone-font-initial);font-size:inherit;line-height:inherit;text-decoration:none;width:fit-content}#external-icon,#standalone-icon{display:none;height:1em}#icon-prefix{display:none;margin-left:-.25em}:host(:not([type])[external]:not([standalone])) #external-icon{display:inline-block;margin-left:.25em;vertical-align:-.2em;--sinch-global-size-icon:1em}:host(:not([type])[standalone][external]) #external-icon{display:inline-block;vertical-align:-.4em;--sinch-global-size-icon:1.5em}:host(:not([type])[standalone]) #icon-prefix{display:inline}:host(:not([type])[standalone]:not([external])) #standalone-icon{display:inline-block;vertical-align:-.4em;--sinch-global-size-icon:1.5em}:host(:not([type])[disabled]) a{color:var(--sinch-comp-link-color-disabled-text-initial);pointer-events:none;cursor:initial;text-decoration:var(--sinch-comp-link-default-text-decoration-disabled);--sinch-global-color-icon:var(--sinch-comp-link-color-disabled-icon-initial)}#content{white-space:var(--sinch-global-text-white-space,normal)}:host(:not([type])) button{display:none;border:none;background:0 0;padding:0;margin:0;cursor:pointer;font:var(--sinch-comp-link-default-font-initial);font-size:inherit;line-height:inherit;text-decoration:var(--sinch-comp-link-default-text-decoration-initial);color:var(--sinch-comp-link-color-default-text-initial);border-radius:.5em;white-space:nowrap}:host(:not([type])) button:hover{text-decoration:var(--sinch-comp-link-default-text-decoration-hover);color:var(--sinch-comp-link-color-default-text-hover)}:host(:not([type])) button:focus-visible{outline:2px solid var(--sinch-comp-link-color-default-outline-focus);outline-offset:2px}:host(:not([type])[disabled]) button{color:var(--sinch-comp-link-color-disabled-text-initial);pointer-events:none;cursor:initial;text-decoration:var(--sinch-comp-link-default-text-decoration-disabled)}#button-content{white-space:var(--sinch-global-text-white-space,normal)}:host([preventdefault]:not([use-history])) a{display:none}:host([preventdefault]:not([use-history])) button{display:inline}:host([type]){display:inline-block;vertical-align:middle;outline:0;cursor:pointer;user-select:none;--sinch-button-shape-radius-base:var(--sinch-comp-button-shape-radius-size-m);--sinch-button-set-size-shape-radius:var(--sinch-comp-button-shape-radius-size-m);--sinch-local-shadow:var(--sinch-comp-button-shadow-secondary-initial);--sinch-button-border:1px solid;--sinch-button-border-top:var(--sinch-button-border);--sinch-button-border-bottom:var(--sinch-button-border);--sinch-button-border-left:var(--sinch-button-border);--sinch-button-border-right:var(--sinch-button-border);--sinch-button-shape-radius-top-right:unset;--sinch-button-shape-radius-top-left:unset;--sinch-button-shape-radius-bottom-right:unset;--sinch-button-shape-radius-bottom-left:unset;--sinch-local-size:var(--sinch-comp-button-size-container-m);--sinch-local-padding:var(--sinch-comp-button-spacing-padding-m, 16px);--sinch-local-gap:var(--sinch-comp-button-spacing-gap-m, 12px);--sinch-local-font:var(--sinch-comp-button-font-size-m-text);--sinch-global-size-icon:var(--sinch-comp-button-size-icon-m)}:host([type][disabled]){cursor:initial}:host([type]) a,:host([type]) button{position:relative;display:inline-flex;align-items:center;justify-content:center;box-sizing:border-box;min-height:var(--sinch-local-size);padding:0 var(--sinch-local-padding);border:none;margin:0;background:0 0;text-decoration:none;white-space:nowrap;cursor:pointer;font:inherit;color:inherit}:host([type]) a::before,:host([type]) button::before{content:"";position:absolute;inset:0;background-color:var(--sinch-local-color-background);border-top:var(--sinch-button-border-top);border-bottom:var(--sinch-button-border-bottom);border-right:var(--sinch-button-border-right);border-left:var(--sinch-button-border-left);border-color:var(--sinch-local-color-border);border-top-right-radius:var(--sinch-button-shape-radius-top-right,var(--sinch-button-set-size-shape-radius,var(--sinch-button-shape-radius-base)));border-top-left-radius:var(--sinch-button-shape-radius-top-left,var(--sinch-button-set-size-shape-radius,var(--sinch-button-shape-radius-base)));border-bottom-right-radius:var(--sinch-button-shape-radius-bottom-right,var(--sinch-button-set-size-shape-radius,var(--sinch-button-shape-radius-base)));border-bottom-left-radius:var(--sinch-button-shape-radius-bottom-left,var(--sinch-button-set-size-shape-radius,var(--sinch-button-shape-radius-base)));box-shadow:var(--sinch-local-shadow);pointer-events:none}:host([type]:not([disabled]):active) a::before,:host([type]:not([disabled]):active) button::before{border-width:2px}:host([type]) a:focus-visible,:host([type]) button:focus-visible{outline:0}:host([type]) a:focus-visible::after,:host([type]) button:focus-visible::after{position:absolute;content:"";inset:-3px;border:2px solid var(--sinch-local-color-outline-focus);border-top-right-radius:calc(var(--sinch-button-shape-radius-top-right,var(--sinch-button-set-size-shape-radius,var(--sinch-button-shape-radius-base))) + 3px);border-top-left-radius:calc(var(--sinch-button-shape-radius-top-left,var(--sinch-button-set-size-shape-radius,var(--sinch-button-shape-radius-base))) + 3px);border-bottom-right-radius:calc(var(--sinch-button-shape-radius-bottom-right,var(--sinch-button-set-size-shape-radius,var(--sinch-button-shape-radius-base))) + 3px);border-bottom-left-radius:calc(var(--sinch-button-shape-radius-bottom-left,var(--sinch-button-set-size-shape-radius,var(--sinch-button-shape-radius-base))) + 3px);pointer-events:none}:host([type]) #button-content,:host([type]) #content{position:relative;font:var(--sinch-local-font);color:var(--sinch-local-color-text);overflow:hidden;white-space:nowrap;text-overflow:ellipsis;flex-shrink:1;min-width:0}:host([type]) #external-icon,:host([type]) #icon-prefix,:host([type]) #standalone-icon{display:none}:host([type][disabled]) a,:host([type][disabled]) button{pointer-events:none;cursor:initial}:host([type=primary]){--sinch-local-color-background:var(--sinch-comp-button-color-primary-default-background-initial);--sinch-local-color-border:var(--sinch-comp-button-color-primary-default-border-initial);--sinch-local-color-text:var(--sinch-comp-button-color-primary-default-text-initial);--sinch-local-color-icon:var(--sinch-comp-button-color-primary-default-icon-initial);--sinch-local-color-outline-focus:var(--sinch-comp-button-color-primary-default-outline-focus);--sinch-local-shadow:var(--sinch-comp-button-shadow-primary-initial)}:host([type=secondary]){--sinch-local-color-background:var(--sinch-comp-button-color-secondary-default-background-initial);--sinch-local-color-border:var(--sinch-comp-button-color-secondary-default-border-initial);--sinch-local-color-outline-focus:var(--sinch-comp-button-color-secondary-default-outline-focus);--sinch-local-color-text:var(--sinch-comp-button-color-secondary-default-text-initial);--sinch-local-color-icon:var(--sinch-comp-button-color-secondary-default-icon-initial)}:host([type=subtle-primary]){--sinch-local-color-background:var(--sinch-comp-button-color-subtle-primary-default-background-initial);--sinch-local-color-border:var(--sinch-comp-button-color-subtle-primary-default-border-initial);--sinch-local-color-outline-focus:var(--sinch-comp-button-color-subtle-primary-default-outline-focus);--sinch-local-color-text:var(--sinch-comp-button-color-subtle-primary-default-text-initial);--sinch-local-color-icon:var(--sinch-comp-button-color-subtle-primary-default-icon-initial);--sinch-local-shadow:var(--sinch-comp-button-shadow-subtle-initial)}:host([type=subtle-secondary]){--sinch-local-color-background:var(--sinch-comp-button-color-subtle-secondary-default-background-initial);--sinch-local-color-border:var(--sinch-comp-button-color-subtle-secondary-default-border-initial);--sinch-local-color-outline-focus:var(--sinch-comp-button-color-subtle-secondary-default-outline-focus);--sinch-local-color-text:var(--sinch-comp-button-color-subtle-secondary-default-text-initial);--sinch-local-color-icon:var(--sinch-comp-button-color-subtle-secondary-default-icon-initial);--sinch-local-shadow:var(--sinch-comp-button-shadow-subtle-initial)}:host([type=cta-primary]){--sinch-local-color-background:var(--sinch-comp-button-color-cta-primary-default-background-initial);--sinch-local-color-border:var(--sinch-comp-button-color-cta-primary-default-border-initial);--sinch-local-color-outline-focus:var(--sinch-comp-button-color-cta-primary-default-outline-focus);--sinch-local-color-text:var(--sinch-comp-button-color-cta-primary-default-text-initial);--sinch-local-color-icon:var(--sinch-comp-button-color-cta-primary-default-icon-initial);--sinch-local-shadow:var(--sinch-comp-button-shadow-cta-primary-initial)}:host([type=cta-secondary]){--sinch-local-color-background:var(--sinch-comp-button-color-cta-secondary-default-background-initial);--sinch-local-color-border:var(--sinch-comp-button-color-cta-secondary-default-border-initial);--sinch-local-color-outline-focus:var(--sinch-comp-button-color-cta-secondary-default-outline-focus);--sinch-local-color-text:var(--sinch-comp-button-color-cta-secondary-default-text-initial);--sinch-local-color-icon:var(--sinch-comp-button-color-cta-secondary-default-icon-initial);--sinch-local-shadow:var(--sinch-comp-button-shadow-cta-secondary-initial)}:host([type=destructive]){--sinch-local-color-background:var(--sinch-comp-button-color-danger-default-background-initial);--sinch-local-color-border:var(--sinch-comp-button-color-danger-default-border-initial);--sinch-local-color-text:var(--sinch-comp-button-color-danger-default-text-initial);--sinch-local-color-outline-focus:var(--sinch-comp-button-color-danger-default-outline-focus);--sinch-local-shadow:var(--sinch-comp-button-shadow-danger-initial);--sinch-global-color-icon:var(--sinch-comp-button-color-danger-default-icon-initial)}:host([type=primary]:focus-visible){--sinch-local-shadow:var(--sinch-comp-button-shadow-primary-focus)}:host([type=secondary]:focus-visible){--sinch-local-shadow:var(--sinch-comp-button-shadow-secondary-focus)}:host([type=subtle-primary]:focus-visible){--sinch-local-shadow:var(--sinch-comp-button-shadow-subtle-focus)}:host([type=subtle-secondary]:focus-visible){--sinch-local-shadow:var(--sinch-comp-button-shadow-subtle-focus)}:host([type=cta-primary]:focus-visible){--sinch-local-shadow:var(--sinch-comp-button-shadow-cta-primary-focus)}:host([type=cta-secondary]:focus-visible){--sinch-local-shadow:var(--sinch-comp-button-shadow-cta-secondary-focus)}:host([type=destructive]:focus-visible){--sinch-local-shadow:var(--sinch-comp-button-shadow-danger-focus)}:host([type=primary]:hover){--sinch-local-color-background:var(--sinch-comp-button-color-primary-default-background-hover);--sinch-local-shadow:var(--sinch-comp-button-shadow-primary-hover)}:host([type=primary]:active){--sinch-local-color-background:var(--sinch-comp-button-color-primary-default-background-active);--sinch-local-shadow:var(--sinch-comp-button-shadow-primary-active)}:host([type=secondary]:hover){--sinch-local-color-background:var(--sinch-comp-button-color-secondary-default-background-hover);--sinch-local-shadow:var(--sinch-comp-button-shadow-secondary-hover)}:host([type=secondary]:active){--sinch-local-color-background:var(--sinch-comp-button-color-secondary-default-background-active)}:host([type=subtle-primary]:hover){--sinch-local-color-background:var(--sinch-comp-button-color-subtle-primary-default-background-hover);--sinch-local-shadow:var(--sinch-comp-button-shadow-subtle-hover)}:host([type=subtle-primary]:active){--sinch-local-color-background:var(--sinch-comp-button-color-subtle-primary-default-background-active);--sinch-local-shadow:var(--sinch-comp-button-shadow-subtle-active)}:host([type=subtle-secondary]:hover){--sinch-local-color-background:var(--sinch-comp-button-color-subtle-secondary-default-background-hover);--sinch-local-shadow:var(--sinch-comp-button-shadow-subtle-hover)}:host([type=subtle-secondary]:active){--sinch-local-color-background:var(--sinch-comp-button-color-subtle-secondary-default-background-active);--sinch-local-shadow:var(--sinch-comp-button-shadow-subtle-active)}:host([type=cta-primary]:hover){--sinch-local-color-background:var(--sinch-comp-button-color-cta-primary-default-background-hover);--sinch-local-shadow:var(--sinch-comp-button-shadow-cta-primary-hover)}:host([type=cta-primary]:active){--sinch-local-color-background:var(--sinch-comp-button-color-cta-primary-default-background-active);--sinch-local-shadow:var(--sinch-comp-button-shadow-cta-primary-active)}:host([type=cta-secondary]:hover){--sinch-local-color-background:var(--sinch-comp-button-color-cta-secondary-default-background-hover);--sinch-local-shadow:var(--sinch-comp-button-shadow-cta-secondary-hover)}:host([type=cta-secondary]:active){--sinch-local-color-background:var(--sinch-comp-button-color-cta-secondary-default-background-active);--sinch-local-shadow:var(--sinch-comp-button-shadow-cta-secondary-active)}:host([type=destructive]:hover){--sinch-local-color-background:var(--sinch-comp-button-color-danger-default-background-hover);--sinch-local-shadow:var(--sinch-comp-button-shadow-danger-hover)}:host([type=destructive]:active){--sinch-local-color-background:var(--sinch-comp-button-color-danger-default-background-active);--sinch-local-shadow:var(--sinch-comp-button-shadow-danger-active)}:host([type=primary][disabled]){--sinch-local-color-background:var(--sinch-comp-button-color-primary-disabled-background-initial);--sinch-local-color-border:var(--sinch-comp-button-color-primary-disabled-border-initial);--sinch-local-color-text:var(--sinch-comp-button-color-primary-disabled-text-initial);--sinch-local-shadow:var(--sinch-comp-button-shadow-primary-disabled);--sinch-global-color-icon:var(--sinch-comp-button-color-primary-disabled-icon-initial)}:host([type=secondary][disabled]){--sinch-local-color-background:var(--sinch-comp-button-color-secondary-disabled-background-initial);--sinch-local-color-border:var(--sinch-comp-button-color-secondary-disabled-border-initial);--sinch-local-color-text:var(--sinch-comp-button-color-secondary-disabled-text-initial);--sinch-local-shadow:var(--sinch-comp-button-shadow-secondary-disabled);--sinch-global-color-icon:var(--sinch-comp-button-color-secondary-disabled-icon-initial)}:host([type=subtle-primary][disabled]){--sinch-local-color-background:var(--sinch-comp-button-color-subtle-primary-disabled-background-initial);--sinch-local-color-border:var(--sinch-comp-button-color-subtle-primary-disabled-border-initial);--sinch-local-color-text:var(--sinch-comp-button-color-subtle-primary-disabled-text-initial);--sinch-local-shadow:var(--sinch-comp-button-shadow-subtle-disabled);--sinch-global-color-icon:var(--sinch-comp-button-color-subtle-primary-disabled-icon-initial)}:host([type=subtle-secondary][disabled]){--sinch-local-color-background:var(--sinch-comp-button-color-subtle-secondary-disabled-background-initial);--sinch-local-color-border:var(--sinch-comp-button-color-subtle-secondary-disabled-border-initial);--sinch-local-color-text:var(--sinch-comp-button-color-subtle-secondary-disabled-text-initial);--sinch-local-shadow:var(--sinch-comp-button-shadow-subtle-disabled);--sinch-global-color-icon:var(--sinch-comp-button-color-subtle-secondary-disabled-icon-initial)}:host([type=cta-primary][disabled]){--sinch-local-color-background:var(--sinch-comp-button-color-cta-primary-disabled-background-initial);--sinch-local-color-border:var(--sinch-comp-button-color-cta-primary-disabled-border-initial);--sinch-local-color-text:var(--sinch-comp-button-color-cta-primary-disabled-text-initial);--sinch-local-shadow:var(--sinch-comp-button-shadow-cta-primary-disabled);--sinch-global-color-icon:var(--sinch-comp-button-color-cta-primary-disabled-icon-initial)}:host([type=cta-secondary][disabled]){--sinch-local-color-background:var(--sinch-comp-button-color-cta-secondary-disabled-background-initial);--sinch-local-color-border:var(--sinch-comp-button-color-cta-secondary-disabled-border-initial);--sinch-local-color-text:var(--sinch-comp-button-color-cta-secondary-disabled-text-initial);--sinch-local-shadow:var(--sinch-comp-button-shadow-cta-secondary-disabled);--sinch-global-color-icon:var(--sinch-comp-button-color-cta-secondary-disabled-icon-initial)}:host([type=destructive][disabled]){--sinch-local-color-background:var(--sinch-comp-button-color-danger-disabled-background-initial);--sinch-local-color-border:var(--sinch-comp-button-color-danger-disabled-border-initial);--sinch-local-color-text:var(--sinch-comp-button-color-danger-disabled-text-initial);--sinch-global-color-icon:var(--sinch-comp-button-color-danger-disabled-icon-initial)}:host([type]) button{display:none}:host([type][preventdefault]:not([use-history])) a{display:none}:host([type][preventdefault]:not([use-history])) button{display:inline-flex}</style><a referrerpolicy="no-referer"><span id="content"></span> <span id="icon-prefix">&nbsp;</span><sinch-icon icons-version="2" name="fa-arrow-up-right" id="external-icon"></sinch-icon><sinch-icon icons-version="2" name="fa-arrow-right" id="standalone-icon"></sinch-icon></a><button type="button"><span id="button-content"></span></button>';
 const template = document.createElement("template");
 template.innerHTML = templateHTML;
@@ -133,10 +133,10 @@ class Link extends NectaryElement {
   set href(value) {
     updateAttribute(this, "href", value);
   }
-  set "use-history"(value) {
+  set useHistory(value) {
     updateBooleanAttribute(this, "use-history", value);
   }
-  get "use-history"() {
+  get useHistory() {
     return getBooleanAttribute(this, "use-history");
   }
   set disabled(isDisabled) {
@@ -170,7 +170,7 @@ class Link extends NectaryElement {
     return getBooleanAttribute(this, "preventdefault");
   }
   get #$activeElement() {
-    return this.preventDefault && !this["use-history"] ? this.#$button : this.#$anchor;
+    return this.preventDefault && !this.useHistory ? this.#$button : this.#$anchor;
   }
   get focusable() {
     return true;
@@ -190,7 +190,7 @@ class Link extends NectaryElement {
   #onAnchorClick = (e) => {
     if (this.preventDefault) {
       e.preventDefault();
-      if (this["use-history"]) {
+      if (this.useHistory) {
         history.pushState({}, "", this.href);
       }
     }

package/link/types.d.ts

@@ -3,31 +3,31 @@ export type TSinchLinkType = 'primary' | 'secondary' | 'subtle-primary' | 'subtl
 export type TSinchLinkProps = {
     /** Text content of hyperlink */
     text: string;
-    /** URL that hyperlink point to */
+    /** URL that hyperlink points to */
     href: string;
     /** Renders the link with button visuals matching the given button type. Omit for default inline link styling. */
     type?: TSinchLinkType;
     /** Replaces the anchor tag behaviour to use history instead */
     'use-history'?: boolean;
-    /** Disabled */
+    /** Whether the link is disabled or not */
     disabled?: boolean;
-    /** Sets `target="_blank" and a special external icon on the left side */
+    /** Sets `target="_blank"` and a special external icon on the left side */
     external?: boolean;
     /** Special standalone (`display: block`) mode with an arrow icon on the right side */
     standalone?: boolean;
     /** Prevents default behaviour on hyperlink click */
     preventDefault?: boolean;
-    /** Render link text as code (e.g. for Markdown `` [`word`](url) ``) */
-    contentAsCode?: boolean;
+    /** Render link text as code */
+    'content-as-code'?: boolean;
     /** Label that is used for a11y – might be different from `text` */
     'aria-label': string;
 };
 export type TSinchLinkEvents = {
-    /** Click even handler */
+    /** Click event handler */
     '-click'?: (e: CustomEvent<void>) => void;
-    /** Focus even handler */
+    /** Focus event handler */
     '-focus'?: (e: CustomEvent<void>) => void;
-    /** Blur even handler */
+    /** Blur event handler */
     '-blur'?: (e: CustomEvent<void>) => void;
 };
 export type TSinchLinkStyle = {

package/list/global/index.js

@@ -1,2 +1,2 @@
-import { d as defineCustomElement } from "../../element.js";
+import { defineCustomElement } from "../../utils/element.js";
 defineCustomElement("sinch-list");

package/list/index.js

@@ -1,4 +1,4 @@
-import { d as defineCustomElement, N as NectaryElement } from "../element.js";
+import { defineCustomElement, NectaryElement } from "../utils/element.js";
 const templateHTML = '<style>:host{display:block;height:100%}#wrapper{display:flex;flex-direction:column;box-sizing:border-box;width:100%;height:100%;overflow-y:auto}</style><div id="wrapper"><slot></slot></div>';
 const template = document.createElement("template");
 template.innerHTML = templateHTML;

package/list-item/global/index.js

@@ -1,2 +1,2 @@
-import { d as defineCustomElement } from "../../element.js";
+import { defineCustomElement } from "../../utils/element.js";
 defineCustomElement("sinch-list-item");

package/list-item/index.js

@@ -1,4 +1,4 @@
-import { d as defineCustomElement, N as NectaryElement } from "../element.js";
+import { defineCustomElement, NectaryElement } from "../utils/element.js";
 const templateHTML = '<style>:host{display:block;outline:0}#wrapper{width:100%;height:100%;box-sizing:border-box;overflow:hidden;padding:8px 0;background-color:var(--sinch-comp-list-color-default-background-initial);border-bottom:1px solid var(--sinch-comp-list-color-default-border-initial)}:host(:last-child)>#wrapper{border-bottom:none}:host(:hover)>#wrapper{background-color:var(--sinch-comp-list-color-default-background-hover)}</style><div id="wrapper"><slot name="content"></slot></div>';
 const template = document.createElement("template");
 template.innerHTML = templateHTML;

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@nectary/components",
-  "version": "5.42.5-rc.0",
+  "version": "5.43.1",
   "files": [
     "**/*/*.css",
     "**/*/*.json",
@@ -18,9 +18,13 @@
   "publishConfig": {
     "access": "public"
   },
+  "scripts": {
+    "build": "rm -rf utils/shared && cp -r ../shared utils/shared && npx tsx ../scripts/minify-html.ts && vite build && vite build --mode bundle && npx tsc --declaration --emitDeclarationOnly && npx tsx ../scripts/tsc-alias.ts --alias '@nectary/shared=./utils/shared'",
+    "dev": "vite build --watch"
+  },
   "dependencies": {
     "@babel/runtime": "^7.22.15",
-    "@nectary/assets": "3.0.0"
+    "@nectary/assets": "3.6.14"
   },
   "devDependencies": {
     "@babel/cli": "^7.22.15",
@@ -30,16 +34,12 @@
     "@babel/preset-typescript": "^7.22.15",
     "@types/node": "22.12.0",
     "@types/react": "^18.2.21",
+    "babel-plugin-html-inline-minifier": "workspace:*",
     "dts-bundle-generator": "^9.5.1",
     "typescript": "^5.2.2",
-    "vite": "^7.0.6",
-    "babel-plugin-html-inline-minifier": "0.0.0"
+    "vite": "^7.0.6"
   },
   "peerDependencies": {
-    "@nectary/theme-base": ">=1.4.0 <2.0.0"
-  },
-  "scripts": {
-    "build": "rm -rf utils/shared && cp -r ../shared utils/shared && npx tsx ../scripts/minify-html.ts && vite build && vite build --mode bundle && npx tsc --declaration --emitDeclarationOnly && npx tsx ../scripts/tsc-alias.ts --alias '@nectary/shared=./utils/shared'",
-    "dev": "vite build --watch"
+    "@nectary/theme-base": "1.17.0"
   }
-}
+}

package/pagination/global/index.js

@@ -1,2 +1,2 @@
-import { d as defineCustomElement } from "../../element.js";
+import { defineCustomElement } from "../../utils/element.js";
 defineCustomElement("sinch-pagination");

package/pagination/index.d.ts

@@ -16,7 +16,7 @@ export declare class Pagination extends NectaryElement {
     get focusable(): boolean;
     focus(): void;
     blur(): void;
-    get prevButtonRect(): any;
-    get nextButtonRect(): any;
+    get prevButtonRect(): TRect;
+    get nextButtonRect(): TRect;
     nthButtonRect(index: number): TRect | null;
 }

package/pagination/index.js

@@ -1,9 +1,9 @@
-import "../index.d3.js";
-import { y as updateAttribute, n as getIntegerAttribute, w as setClass } from "../dom.js";
-import { d as defineCustomElement, N as NectaryElement } from "../element.js";
-import { g as getRect } from "../rect.js";
-import { g as getReactEventHandler } from "../get-react-event-handler.js";
-import { i as isTargetEqual, b as getTargetIndexInParent } from "../event-target.js";
+import "../icon/index.js";
+import { updateAttribute, getIntegerAttribute, setClass } from "../utils/dom.js";
+import { defineCustomElement, NectaryElement } from "../utils/element.js";
+import { getRect } from "../utils/rect.js";
+import { getReactEventHandler } from "../utils/get-react-event-handler.js";
+import { isTargetEqual, getTargetIndexInParent } from "../utils/event-target.js";
 const templateHTML = '<style>:host{display:inline-block;vertical-align:middle;outline:0}#wrapper{display:flex;justify-content:center;gap:8px;width:100%;height:var(--sinch-local-size);--sinch-local-size:24px}button{all:initial;position:relative;display:flex;justify-content:center;align-items:center;min-width:var(--sinch-local-size);height:var(--sinch-local-size);cursor:pointer;border-radius:var(--sinch-comp-pagination-shape-radius);user-select:none;--sinch-global-color-icon:var(--sinch-comp-pagination-color-default-icon-default)}button:focus-visible::before{content:"";position:absolute;inset:-3px;border:2px solid var(--sinch-comp-pagination-color-default-outline-focus);border-radius:calc(var(--sinch-comp-pagination-shape-radius) + 3px);pointer-events:none}button:disabled{--sinch-global-color-icon:var(--sinch-comp-pagination-color-disabled-icon-initial);cursor:initial}button:enabled:hover{background-color:var(--sinch-comp-pagination-color-default-background-hover)}button>*{display:block;overflow:hidden;pointer-events:none}.page{font:var(--sinch-comp-pagination-font-default-page-number);color:var(--sinch-comp-pagination-color-default-text-initial);background-color:var(--sinch-comp-pagination-color-default-background-initial);padding:0 4px;box-sizing:border-box}.page.dots>span{display:none}.page.dots::after{content:"..."}.page.active{font:var(--sinch-comp-pagination-font-checked-page-number);background-color:var(--sinch-comp-pagination-color-checked-background-initial);pointer-events:none;cursor:initial}.page.active:hover{background-color:var(--sinch-comp-pagination-color-checked-background-hover)}.page.hidden{display:none}#left,#right{--sinch-icon-size:24px}</style><nav id="wrapper"><button id="left" aria-label="Go back"><sinch-icon icons-version="2" name="fa-angle-left" id="icon-left"></sinch-icon></button> <button class="page"><span>1</span></button> <button class="page active"><span>2</span></button> <button class="page"><span>3</span></button> <button class="page"><span>4</span></button> <button class="page"><span>5</span></button> <button class="page dots"><span>6</span></button> <button class="page"><span>20</span></button> <button id="right" aria-label="Go forward"><sinch-icon icons-version="2" name="fa-angle-right" id="icon-right"></sinch-icon></button></nav>';
 const NUM_BUTTONS = 7;
 const MIDDLE_BTN_INDEX = Math.floor(NUM_BUTTONS / 2);

package/persistent-overlay/global/index.js

@@ -1,2 +1,2 @@
-import { d as defineCustomElement } from "../../element.js";
+import { defineCustomElement } from "../../utils/element.js";
 defineCustomElement("sinch-persistent-overlay");

package/persistent-overlay/index.js

@@ -1,7 +1,7 @@
-import "../index.d12.js";
-import { y as updateAttribute, i as getAttribute, z as updateBooleanAttribute, j as getBooleanAttribute, t as isAttrTrue } from "../dom.js";
-import { d as defineCustomElement, N as NectaryElement } from "../element.js";
-import { g as getReactEventHandler } from "../get-react-event-handler.js";
+import "../dialog/index.js";
+import { updateAttribute, getAttribute, updateBooleanAttribute, getBooleanAttribute, isAttrTrue } from "../utils/dom.js";
+import { defineCustomElement, NectaryElement } from "../utils/element.js";
+import { getReactEventHandler } from "../utils/get-react-event-handler.js";
 const templateHTML = '<style>#persisted-dialog{--sinch-dialog-close-button-display:none}::slotted(*){display:block}</style><sinch-dialog id="persisted-dialog" prevent-close><div slot="icon"><slot id="icon" name="icon"></slot></div><div slot="content"><slot name="content"></slot></div><div slot="buttons"><slot name="buttons"></slot></div></sinch-dialog>';
 const template = document.createElement("template");
 template.innerHTML = templateHTML;

package/pop/global/index.js

@@ -1,2 +1,2 @@
-import { d as defineCustomElement } from "../../element.js";
+import { defineCustomElement } from "../../utils/element.js";
 defineCustomElement("sinch-pop");

package/pop/index.d.ts

@@ -25,7 +25,7 @@ export declare class Pop extends NectaryElement {
     set inset(inset: number);
     get inset(): number;
     get footprintRect(): TRect;
-    get popoverRect(): any;
+    get popoverRect(): TRect;
     get shouldCloseOnBackdropClick(): boolean;
     get shouldRestoreFocusOnClose(): boolean;
     attributeChangedCallback(name: string, oldVal: string | null, newVal: string | null): void;

package/pop/index.js

@@ -1,12 +1,13 @@
-import { C as Context, s as subscribeContext } from "../context.js";
-import { j as getBooleanAttribute, z as updateBooleanAttribute, o as getLiteralAttribute, C as updateLiteralAttribute, B as updateIntegerAttribute, n as getIntegerAttribute, s as isAttrEqual, p as getScrollableParents, q as getTransformedAncestor, t as isAttrTrue } from "../dom.js";
-import { d as defineCustomElement, N as NectaryElement } from "../element.js";
-import { g as getRect } from "../rect.js";
-import { a as getFirstSlotElement, g as getFirstFocusableElement, i as isElementFocused } from "../slot.js";
-import { t as throttleAnimationFrame } from "../throttle.js";
-import { g as getReactEventHandler } from "../get-react-event-handler.js";
-import { i as isTargetEqual } from "../event-target.js";
-import { o as orientationValues, d as disableOverscroll, e as enableOverscroll, g as getPlacementContext, t as toLocalRect, a as getAnchorPosition, c as clampPosition } from "../utils31.js";
+import { Context, subscribeContext } from "../utils/context.js";
+import { getBooleanAttribute, updateBooleanAttribute, getLiteralAttribute, updateLiteralAttribute, updateIntegerAttribute, getIntegerAttribute, isAttrEqual, getScrollableParents, getTransformedAncestor, isAttrTrue } from "../utils/dom.js";
+import { defineCustomElement, NectaryElement } from "../utils/element.js";
+import { getRect } from "../utils/rect.js";
+import { getFirstSlotElement, getFirstFocusableElement, isElementFocused } from "../utils/slot.js";
+import { throttleAnimationFrame } from "../utils/throttle.js";
+import { getReactEventHandler } from "../utils/get-react-event-handler.js";
+import { isTargetEqual } from "../utils/event-target.js";
+import { getPlacementContext, toLocalRect } from "../utils/placement.js";
+import { orientationValues, disableOverscroll, enableOverscroll, getAnchorPosition, clampPosition } from "./utils.js";
 const templateHTML = '<style>:host{display:contents;position:relative}dialog{position:fixed;left:0;top:0;transform:translate(var(--sinch-pop-offset-x),var(--sinch-pop-offset-y));margin:0;outline:0;padding:0;border:none;box-sizing:border-box;max-width:unset;max-height:unset;z-index:var(--sinch-comp-pop-z-index,1);background:0 0;overflow:visible}dialog:not([open]){display:none}dialog::backdrop{background-color:transparent}#content{position:relative;z-index:var(--sinch-comp-pop-z-index,1)}#target-open{display:flex;flex-direction:column;position:absolute;left:0;top:0}#focus{display:none;position:absolute;width:0;height:0}</style><slot id="target" name="target" aria-haspopup="dialog" aria-expanded="false"></slot><div id="focus"></div><dialog id="dialog"><div id="target-open"><slot name="target-open"></slot></div><div id="content"><slot name="content"></slot></div></dialog>';
 const template = document.createElement("template");
 template.innerHTML = templateHTML;

package/popover/global/index.js

@@ -1,2 +1,2 @@
-import { d as defineCustomElement } from "../../element.js";
+import { defineCustomElement } from "../../utils/element.js";
 defineCustomElement("sinch-popover");

package/popover/index.js

@@ -1,10 +1,10 @@
-import "../index.d2.js";
-import { s as subscribeContext } from "../context.js";
-import { y as updateAttribute, s as isAttrEqual, z as updateBooleanAttribute, t as isAttrTrue, j as getBooleanAttribute, o as getLiteralAttribute, C as updateLiteralAttribute, w as setClass } from "../dom.js";
-import { d as defineCustomElement, N as NectaryElement } from "../element.js";
-import { r as rectOverlap } from "../rect.js";
-import { g as getReactEventHandler } from "../get-react-event-handler.js";
-import { g as getPopOrientation, o as orientationValues } from "../utils3.js";
+import "../pop/index.js";
+import { subscribeContext } from "../utils/context.js";
+import { updateAttribute, isAttrEqual, updateBooleanAttribute, isAttrTrue, getBooleanAttribute, getLiteralAttribute, updateLiteralAttribute, setClass } from "../utils/dom.js";
+import { defineCustomElement, NectaryElement } from "../utils/element.js";
+import { rectOverlap } from "../utils/rect.js";
+import { getReactEventHandler } from "../utils/get-react-event-handler.js";
+import { getPopOrientation, orientationValues } from "./utils.js";
 const templateHTML = '<style>:host{display:contents}#content-wrapper{position:relative;padding-top:4px;width:fit-content;min-width:100%}:host([tip]) #content-wrapper{padding-top:12px;filter:drop-shadow(var(--sinch-comp-popover-shadow))}:host([orientation^=top]) #content-wrapper{padding-top:0;padding-bottom:4px}:host([orientation=left]) #content-wrapper{padding-top:0;padding-right:4px}:host([orientation=right]) #content-wrapper{padding-top:0;padding-left:4px}:host([orientation^=top][tip]) #content-wrapper{padding-top:0;padding-bottom:12px}:host([orientation=left][tip]) #content-wrapper{padding-top:0;padding-right:12px}:host([orientation=right][tip]) #content-wrapper{padding-top:0;padding-left:12px}#content{background-color:var(--sinch-comp-popover-color-default-background-initial);border:1px solid var(--sinch-comp-popover-color-default-border-initial);border-radius:var(--sinch-comp-popover-shape-radius);box-shadow:var(--sinch-comp-popover-shadow);overflow:hidden}:host([tip]) #content{box-shadow:none}#tip{position:absolute;left:50%;top:13px;transform:translateX(-50%) rotate(180deg);transform-origin:top center;fill:var(--sinch-comp-popover-color-default-background-initial);stroke:var(--sinch-comp-popover-color-default-border-initial);stroke-linecap:square;pointer-events:none;display:none}:host([orientation^=top]) #tip{transform:translateX(-50%) rotate(0);top:calc(100% - 13px)}:host([orientation=left]) #tip{transform:translateX(-50%) rotate(-90deg);top:calc(50%);left:calc(100% - 13px)}:host([orientation=right]) #tip{transform:translateX(-50%) rotate(90deg);top:calc(50%);left:13px}:host([tip]) #tip:not(.hidden){display:block}</style><sinch-pop id="pop" inset="4"><slot name="target" slot="target"></slot><div id="content-wrapper" slot="content"><div id="content"><slot name="content"></slot></div><svg id="tip" width="16" height="9" aria-hidden="true"><path d="m0 0 8 8 8 -8"/></svg></div></sinch-pop>';
 const TIP_SIZE = 16;
 const template = document.createElement("template");

package/progress/global/index.js

@@ -1,2 +1,2 @@
-import { d as defineCustomElement } from "../../element.js";
+import { defineCustomElement } from "../../utils/element.js";
 defineCustomElement("sinch-progress");

package/progress/index.js

@@ -1,6 +1,6 @@
-import "../index.d.js";
-import { s as isAttrEqual, z as updateBooleanAttribute, t as isAttrTrue, b as attrValueToFloat, n as getIntegerAttribute, y as updateAttribute, j as getBooleanAttribute } from "../dom.js";
-import { d as defineCustomElement, N as NectaryElement } from "../element.js";
+import "../text/index.js";
+import { isAttrEqual, updateBooleanAttribute, isAttrTrue, attrValueToFloat, getIntegerAttribute, updateAttribute, getBooleanAttribute } from "../utils/dom.js";
+import { defineCustomElement, NectaryElement } from "../utils/element.js";
 const templateHTML = '<style>:host{display:block}#wrapper{display:flex;align-items:center;height:24px}#bar,#progress{height:8px;border-radius:4px}#progress{background-color:var(--sinch-comp-progress-color-default-background-initial);flex:1;min-width:0}#bar{background-color:var(--sinch-comp-progress-color-default-bar-initial);width:0}#text{display:none;width:46px;--sinch-global-color-text:var(--sinch-comp-progress-color-default-text-initial)}:host([detailed]) #text{display:block}</style><div id="wrapper"><sinch-text id="text" type="m"></sinch-text><div id="progress"><div id="bar"></div></div></div>';
 const template = document.createElement("template");
 template.innerHTML = templateHTML;

package/progress-stepper/global/index.js

@@ -1,2 +1,2 @@
-import { d as defineCustomElement } from "../../element.js";
+import { defineCustomElement } from "../../utils/element.js";
 defineCustomElement("sinch-progress-stepper");

package/progress-stepper/index.js

@@ -1,9 +1,9 @@
-import { c as isProgressStepperItemActive, s as setProgressStepperItemChecked, d as setProgressStepperItemActiveDescendant, e as setProgressStepperItemStatus, f as isProgressStepperItemChecked } from "../utils21.js";
-import { y as updateAttribute, i as getAttribute } from "../dom.js";
-import { d as defineCustomElement, N as NectaryElement } from "../element.js";
-import { g as getRect } from "../rect.js";
-import { g as getReactEventHandler } from "../get-react-event-handler.js";
-import { a as getTargetByAttribute } from "../event-target.js";
+import { isProgressStepperItemActive, setProgressStepperItemChecked, setProgressStepperItemActiveDescendant, setProgressStepperItemStatus, isProgressStepperItemChecked } from "../progress-stepper-item/utils.js";
+import { updateAttribute, getAttribute } from "../utils/dom.js";
+import { defineCustomElement, NectaryElement } from "../utils/element.js";
+import { getRect } from "../utils/rect.js";
+import { getReactEventHandler } from "../utils/get-react-event-handler.js";
+import { getTargetByAttribute } from "../utils/event-target.js";
 const templateHTML = '<style>:host{display:block}#wrapper{display:flex;width:100%}::slotted(sinch-progress-stepper-item){flex:1;min-width:0}</style><div id="wrapper"><slot></slot></div>';
 const template = document.createElement("template");
 template.innerHTML = templateHTML;

package/progress-stepper-item/global/index.js

@@ -1,2 +1,2 @@
-import { d as defineCustomElement } from "../../element.js";
+import { defineCustomElement } from "../../utils/element.js";
 defineCustomElement("sinch-progress-stepper-item");

package/progress-stepper-item/index.js

@@ -1,8 +1,8 @@
-import "../index.d3.js";
-import "../index.d.js";
-import { s as isAttrEqual, A as updateExplicitBooleanAttribute, z as updateBooleanAttribute, t as isAttrTrue, y as updateAttribute, i as getAttribute, j as getBooleanAttribute } from "../dom.js";
-import { d as defineCustomElement, N as NectaryElement } from "../element.js";
-import { A as ATTR_PROGRESS_STEPPER_ITEM_STATUS, a as ATTR_PROGRESS_STEPPER_ITEM_CHECKED, b as ATTR_PROGRESS_STEPPER_ITEM_ACTIVE_DESCENDANT, i as isProgressStepperItemActiveDescendant, c as isProgressStepperItemActive } from "../utils21.js";
+import "../icon/index.js";
+import "../text/index.js";
+import { isAttrEqual, updateExplicitBooleanAttribute, updateBooleanAttribute, isAttrTrue, updateAttribute, getAttribute, getBooleanAttribute } from "../utils/dom.js";
+import { defineCustomElement, NectaryElement } from "../utils/element.js";
+import { ATTR_PROGRESS_STEPPER_ITEM_STATUS, ATTR_PROGRESS_STEPPER_ITEM_CHECKED, ATTR_PROGRESS_STEPPER_ITEM_ACTIVE_DESCENDANT, isProgressStepperItemActiveDescendant, isProgressStepperItemActive } from "./utils.js";
 const templateHTML = '<style>:host{display:block;outline:0}#button{position:relative;display:flex;flex-direction:column;gap:4px;width:100%;height:100%;padding:8px 4px 4px;box-sizing:border-box;cursor:pointer;border-radius:var(--sinch-comp-progress-stepper-step-shape-radius)}:host([data-status=inactive])>#button{cursor:not-allowed}:host([data-status=incomplete]:hover)>#button{background-color:var(--sinch-comp-progress-stepper-step-color-incomplete-background-hover)}:host([data-status=complete]:hover)>#button{background-color:var(--sinch-comp-progress-stepper-step-color-complete-background-hover)}:host([data-status=invalid]:hover)>#button{background-color:var(--sinch-comp-progress-stepper-step-color-invalid-background-hover)}#outline{position:absolute;inset:-2px;border:2px solid var(--sinch-comp-progress-stepper-step-color-outline-focus);border-radius:calc(var(--sinch-comp-progress-stepper-step-shape-radius) + 2px);pointer-events:none;opacity:0}:host(:focus-visible) #outline{opacity:1}#text{flex-shrink:1;flex-basis:auto;min-width:0;transform:translate(0,0);will-change:transform;transition:transform .25s ease-out;padding-right:24px}:host([data-status=incomplete]) #text{--sinch-global-color-text:var(--sinch-comp-progress-stepper-step-color-incomplete-label-default);--sinch-comp-text-font:var(--sinch-comp-progress-stepper-step-font-incomplete-label)}:host([data-status=complete]) #text{--sinch-global-color-text:var(--sinch-comp-progress-stepper-step-color-complete-label-default);--sinch-comp-text-font:var(--sinch-comp-progress-stepper-step-font-complete-label)}:host([data-status=inactive]) #text{--sinch-global-color-text:var(--sinch-comp-progress-stepper-step-color-inactive-label-default);--sinch-comp-text-font:var(--sinch-comp-progress-stepper-step-font-inactive-label)}:host([invalid]) #text{--sinch-global-color-text:var(--sinch-comp-progress-stepper-step-color-invalid-label-default);--sinch-comp-text-font:var(--sinch-comp-progress-stepper-step-font-invalid-label);transform:translate(24px,0)}:host([data-status=incomplete][data-checked]) #text{--sinch-global-color-text:var(--sinch-comp-progress-stepper-step-color-incomplete-current-label-default);--sinch-comp-text-font:var(--sinch-comp-progress-stepper-step-font-incomplete-current-label)}:host([data-status=complete][data-checked]) #text{--sinch-global-color-text:var(--sinch-comp-progress-stepper-step-color-complete-current-label-default);--sinch-comp-text-font:var(--sinch-comp-progress-stepper-step-font-complete-current-label)}:host([invalid][data-checked]) #text{--sinch-global-color-text:var(--sinch-comp-progress-stepper-step-color-invalid-label-default);--sinch-comp-text-font:var(--sinch-comp-progress-stepper-step-font-invalid-current-label)}#icon-error{position:absolute;left:0;top:4px;pointer-events:none;opacity:0;transition:opacity .25s ease-in-out;--sinch-global-color-icon:var(--sinch-comp-progress-stepper-step-color-invalid-icon-default);--sinch-global-size-icon:16px}:host([invalid]) #icon-error{opacity:1}#progress{height:8px;border-radius:4px;transition:background-color .25s ease-in-out}:host([data-status=incomplete]) #progress{background-color:var(--sinch-comp-progress-stepper-step-color-incomplete-progress-background)}:host([data-status=complete]) #progress{background-color:var(--sinch-comp-progress-stepper-step-color-complete-progress-background)}:host([data-status=inactive]) #progress{background-color:var(--sinch-comp-progress-stepper-step-color-inactive-progress-background)}:host([invalid]) #progress{background-color:var(--sinch-comp-progress-stepper-step-color-invalid-progress-background)}#bar{width:8px;height:8px;border-radius:4px;opacity:0;transition:width .25s ease-in-out,opacity .25s ease-in-out}:host([data-status=incomplete]) #bar{background-color:var(--sinch-comp-progress-stepper-step-color-incomplete-progress-bar)}:host([data-status=complete]) #bar{background-color:var(--sinch-comp-progress-stepper-step-color-complete-progress-bar);width:100%}:host([data-status=complete]:not([invalid])) #bar,:host([data-status=incomplete]:not([invalid])) #bar{opacity:1}#label-bar{position:relative}</style><div id="button"><div id="progress"><div id="bar"></div></div><div id="label-bar"><sinch-icon icons-version="2" name="triangle-exclamation" id="icon-error" aria-hidden="true"></sinch-icon><sinch-text id="text" type="m"></sinch-text></div><div id="outline"></div></div>';
 const template = document.createElement("template");
 template.innerHTML = templateHTML;

package/progress-stepper-item/utils.d.ts

@@ -2,10 +2,10 @@ type TSinchProgressStepperItemStatus = 'inactive' | 'incomplete' | 'invalid' | '
 export declare const ATTR_PROGRESS_STEPPER_ITEM_CHECKED = "data-checked";
 export declare const ATTR_PROGRESS_STEPPER_ITEM_STATUS = "data-status";
 export declare const ATTR_PROGRESS_STEPPER_ITEM_ACTIVE_DESCENDANT = "data-active-descendant";
-export declare const isProgressStepperItemChecked: ($el: Element) => any;
-export declare const setProgressStepperItemChecked: ($el: Element, isChecked: boolean) => any;
+export declare const isProgressStepperItemChecked: ($el: Element) => boolean;
+export declare const setProgressStepperItemChecked: ($el: Element, isChecked: boolean) => void;
 export declare const isProgressStepperItemActive: ($el: Element) => boolean;
-export declare const setProgressStepperItemStatus: ($el: Element, status: TSinchProgressStepperItemStatus) => any;
-export declare const isProgressStepperItemActiveDescendant: ($el: Element) => any;
-export declare const setProgressStepperItemActiveDescendant: ($el: Element, isActiveDescendant: boolean) => any;
+export declare const setProgressStepperItemStatus: ($el: Element, status: TSinchProgressStepperItemStatus) => void;
+export declare const isProgressStepperItemActiveDescendant: ($el: Element) => boolean;
+export declare const setProgressStepperItemActiveDescendant: ($el: Element, isActiveDescendant: boolean) => void;
 export {};

package/progress-stepper-item/utils.js

@@ -1,4 +1,4 @@
-import { j as getBooleanAttribute, z as updateBooleanAttribute, y as updateAttribute, i as getAttribute } from "../dom.js";
+import { getBooleanAttribute, getAttribute, updateBooleanAttribute, updateAttribute } from "../utils/dom.js";
 const ATTR_PROGRESS_STEPPER_ITEM_CHECKED = "data-checked";
 const ATTR_PROGRESS_STEPPER_ITEM_STATUS = "data-status";
 const ATTR_PROGRESS_STEPPER_ITEM_ACTIVE_DESCENDANT = "data-active-descendant";

package/progress-stepper-item-v2/global/index.js

@@ -1,2 +1,2 @@
-import { d as defineCustomElement } from "../../element.js";
+import { defineCustomElement } from "../../utils/element.js";
 defineCustomElement("sinch-progress-stepper-item-v2");

package/progress-stepper-item-v2/index.js

@@ -1,8 +1,9 @@
-import "../index.d3.js";
-import "../index.d.js";
-import { a as TAG_PROGRESS_STEPPER_ITEM, A as ATTR_PROGRESS_STEPPER_ITEM_STATUS, h as ATTR_PROGRESS_STEPPER_ITEM_CHECKED, f as fillProgressStepperStepChipHost, s as syncProgressStepperItemsRovingTabIndexes } from "../utils30.js";
-import { s as isAttrEqual, z as updateBooleanAttribute, t as isAttrTrue, A as updateExplicitBooleanAttribute, y as updateAttribute, i as getAttribute, j as getBooleanAttribute } from "../dom.js";
-import { d as defineCustomElement, N as NectaryElement } from "../element.js";
+import "../icon/index.js";
+import "../text/index.js";
+import { fillProgressStepperStepChipHost } from "../progress-stepper-v2/step-chip.js";
+import { isAttrEqual, updateBooleanAttribute, isAttrTrue, updateExplicitBooleanAttribute, updateAttribute, getAttribute, getBooleanAttribute } from "../utils/dom.js";
+import { defineCustomElement, NectaryElement } from "../utils/element.js";
+import { TAG_PROGRESS_STEPPER_ITEM, ATTR_PROGRESS_STEPPER_ITEM_STATUS, ATTR_PROGRESS_STEPPER_ITEM_CHECKED, syncProgressStepperItemsRovingTabIndexes } from "./utils.js";
 const templateHTML = '<style>:host{display:grid;grid-template-columns:minmax(0,max-content);grid-template-rows:minmax(0,1fr);min-height:0;min-width:0;outline:0}#button{position:relative;grid-area:1/1;align-self:stretch;justify-self:stretch;display:flex;flex-direction:column;justify-content:center;gap:0;width:100%;min-width:100%;min-height:0;padding:8px 4px;box-sizing:border-box;cursor:pointer;border-radius:var(--sinch-comp-progress-stepper-v2-step-shape-radius-container)}:host([data-stepper-layout=horizontal]) #button{padding:8px 12px 8px 10px}#label-bar{position:relative;width:100%;min-width:0}:host([data-status=inactive])>#button{cursor:default}:host([data-status=incomplete]:hover)>#button{background-color:var(--sinch-comp-progress-stepper-v2-step-color-incomplete-background-hover)}:host([data-status=complete]:hover)>#button{background-color:var(--sinch-comp-progress-stepper-v2-step-color-complete-background-hover)}:host([invalid]:not([data-status=inactive]):hover)>#button{background-color:var(--sinch-comp-progress-stepper-v2-step-color-invalid-background-hover)}#outline{position:absolute;inset:-2px;border:2px solid var(--sinch-comp-progress-stepper-v2-step-color-outline-focus);border-radius:calc(var(--sinch-comp-progress-stepper-v2-step-shape-radius-container) + 2px);pointer-events:none;opacity:0}:host(:focus-visible) #outline,:host([data-force-focus-visible]) #outline{opacity:1}#text{flex-shrink:1;flex-basis:auto;min-width:0;transition:color .25s ease-out}#label-content{display:flex;align-items:center;gap:8px;min-width:0}:host([invalid]) #text{--sinch-global-color-text:var(--sinch-comp-progress-stepper-v2-step-color-invalid-label-initial);--sinch-comp-text-font:var(--sinch-comp-progress-stepper-v2-step-font-label-initial)}:host(:is([data-status=incomplete],[data-status=inactive]):not([invalid])) #text{--sinch-global-color-text:var(--sinch-comp-progress-stepper-v2-step-color-incomplete-label-initial);--sinch-comp-text-font:var(--sinch-comp-progress-stepper-v2-step-font-label-initial)}:host([data-status=complete]:not([invalid])) #text{--sinch-global-color-text:var(--sinch-comp-progress-stepper-v2-step-color-complete-label-initial);--sinch-comp-text-font:var(--sinch-comp-progress-stepper-v2-step-font-label-initial)}:host([invalid][data-checked]) #text{--sinch-global-color-text:var(--sinch-comp-progress-stepper-v2-step-color-invalid-label-current);--sinch-comp-text-font:var(--sinch-comp-progress-stepper-v2-step-font-label-current)}:host(:is([data-status=incomplete],[data-status=inactive]):not([invalid])[data-checked]) #text{--sinch-global-color-text:var(--sinch-comp-progress-stepper-v2-step-color-incomplete-label-current);--sinch-comp-text-font:var(--sinch-comp-progress-stepper-v2-step-font-label-current)}:host([data-status=complete]:not([invalid])[data-checked]) #text{--sinch-global-color-text:var(--sinch-comp-progress-stepper-v2-step-color-complete-label-current);--sinch-comp-text-font:var(--sinch-comp-progress-stepper-v2-step-font-label-current)}</style><div id="button"><div id="label-bar"><div id="label-content"><span id="index" aria-hidden="true"></span><sinch-text id="text" type="m"></sinch-text></div></div><div id="outline"></div></div>';
 const template = document.createElement("template");
 template.innerHTML = templateHTML;

package/progress-stepper-item-v2/utils.d.ts

@@ -5,10 +5,10 @@ export declare const ATTR_PROGRESS_STEPPER_ITEM_CHECKED = "data-checked";
 export declare const ATTR_PROGRESS_STEPPER_ITEM_STATUS = "data-status";
 /** Set by `sinch-progress-stepper-v2` on default-slot items for layout-specific styling. */
 export declare const ATTR_PROGRESS_STEPPER_ITEM_LAYOUT = "data-stepper-layout";
-export declare const isProgressStepperItemChecked: ($el: Element) => any;
-export declare const setProgressStepperItemChecked: ($el: Element, isChecked: boolean) => any;
+export declare const isProgressStepperItemChecked: ($el: Element) => boolean;
+export declare const setProgressStepperItemChecked: ($el: Element, isChecked: boolean) => void;
 export declare const isProgressStepperItemActive: ($el: Element) => boolean;
-export declare const setProgressStepperItemStatus: ($el: Element, status: TSinchProgressStepperItemStatus) => any;
+export declare const setProgressStepperItemStatus: ($el: Element, status: TSinchProgressStepperItemStatus) => void;
 /**
  * Nested shadow trees (e.g. `sinch-text` inside a step) break `shadowRoot.contains(active)` —
  * walk up through shadow boundaries, and optionally use `composedPath()` from the key event.

package/progress-stepper-item-v2/utils.js

@@ -1,4 +1,4 @@
-import { j as getBooleanAttribute, z as updateBooleanAttribute, y as updateAttribute, i as getAttribute } from "../dom.js";
+import { getBooleanAttribute, getAttribute, updateBooleanAttribute, updateAttribute } from "../utils/dom.js";
 const TAG_PROGRESS_STEPPER = "sinch-progress-stepper-v2";
 const TAG_PROGRESS_STEPPER_ITEM = "sinch-progress-stepper-item-v2";
 const ATTR_PROGRESS_STEPPER_ITEM_CHECKED = "data-checked";

package/progress-stepper-v2/compact.js

@@ -1,7 +1,8 @@
-import { i as isProgressStepperItemActive, A as ATTR_PROGRESS_STEPPER_ITEM_STATUS, f as fillProgressStepperStepChipHost } from "../utils30.js";
-import { s as subscribeContext } from "../context.js";
-import { j as getBooleanAttribute, z as updateBooleanAttribute, i as getAttribute, h as createScopedElement, y as updateAttribute } from "../dom.js";
-import { r as resolveCompactMenuAndPopAriaLabel, f as formatCompactTemplate, a as resolveCompactCounterFormat, b as resolveCompactTriggerAriaLabel } from "../compact-format.js";
+import { isProgressStepperItemActive, ATTR_PROGRESS_STEPPER_ITEM_STATUS } from "../progress-stepper-item-v2/utils.js";
+import { subscribeContext } from "../utils/context.js";
+import { getBooleanAttribute, updateBooleanAttribute, getAttribute, createScopedElement, updateAttribute } from "../utils/dom.js";
+import { resolveCompactMenuAndPopAriaLabel, formatCompactTemplate, resolveCompactCounterFormat, resolveCompactTriggerAriaLabel } from "./compact-format.js";
+import { fillProgressStepperStepChipHost } from "./step-chip.js";
 class ProgressStepperCompactController {
   #$actionMenu;
   #$compactPop;

package/progress-stepper-v2/global/index.js

@@ -1,2 +1,2 @@
-import { d as defineCustomElement } from "../../element.js";
+import { defineCustomElement } from "../../utils/element.js";
 defineCustomElement("sinch-progress-stepper-v2");