@oiz/stzh-components 0.0.0-pretest → 1.4.0-npmjstest

package/dist/components/stzh-vspace.js

@@ -2,60 +2,60 @@ import { proxyCustomElement, HTMLElement, h, Host } from '@stencil/core/internal
 
 const stzhVspaceCss = ".sc-stzh-vspace-h{font-family:var(--stzh-font-family-regular);font-weight:var(--stzh-font-weight-regular);font-style:normal;color:var(--stzh-base-color);-webkit-box-sizing:border-box;box-sizing:border-box;display:block}[hidden].sc-stzh-vspace-h{display:none}.sc-stzh-vspace-h *.sc-stzh-vspace,.sc-stzh-vspace-h *.sc-stzh-vspace::before,.sc-stzh-vspace-h *.sc-stzh-vspace::after{-webkit-box-sizing:border-box;box-sizing:border-box}.sc-stzh-vspace-h{--space:var(--stzh-space-default);--around:0}.sc-stzh-vspace-h .sc-stzh-vspace-s>*{max-width:100%;padding-top:calc(var(--space) * var(--around));padding-bottom:calc(var(--space) * var(--around));margin:0}.sc-stzh-vspace-h .sc-stzh-vspace-s>*:not(:last-child){margin-bottom:calc(var(--space) * (1 - var(--around)))}.sc-stzh-vspace-h .sc-stzh-vspace-s>stzh-vspace,.sc-stzh-vspace-h .sc-stzh-vspace-s>stzh-hspace,.sc-stzh-vspace-h .sc-stzh-vspace-s>stzh-row,.sc-stzh-vspace-h .sc-stzh-vspace-s>stzh-container,.sc-stzh-vspace-h .sc-stzh-vspace-s>stzh-section{-ms-flex-item-align:stretch;align-self:stretch;-ms-flex-positive:1;flex-grow:1}[around].sc-stzh-vspace-h{--around:1}[curve=tiny].sc-stzh-vspace-h{--space:var(--stzh-space-xsmall)}@media screen and (min-width: 600px){[curve=tiny].sc-stzh-vspace-h{--space:var(--stzh-space-small)}}@media screen and (min-width: 1024px){[curve=tiny].sc-stzh-vspace-h{--space:var(--stzh-space-medium)}}@media screen and (min-width: 1260px){[curve=tiny].sc-stzh-vspace-h{--space:var(--stzh-space-large)}}[curve=small].sc-stzh-vspace-h{--space:var(--stzh-space-small)}@media screen and (min-width: 1024px){[curve=small].sc-stzh-vspace-h{--space:var(--stzh-space-medium)}}[curve=regular].sc-stzh-vspace-h{--space:var(--stzh-space-medium)}@media screen and (min-width: 1024px){[curve=regular].sc-stzh-vspace-h{--space:var(--stzh-space-large)}}@media screen and (min-width: 1260px){[curve=regular].sc-stzh-vspace-h{--space:var(--stzh-space-xlarge)}}[curve=medium].sc-stzh-vspace-h{--space:var(--stzh-space-medium)}@media screen and (min-width: 600px){[curve=medium].sc-stzh-vspace-h{--space:var(--stzh-space-large)}}@media screen and (min-width: 1024px){[curve=medium].sc-stzh-vspace-h{--space:var(--stzh-space-xlarge)}}@media screen and (min-width: 1260px){[curve=medium].sc-stzh-vspace-h{--space:var(--stzh-space-xxlarge)}}[curve=large].sc-stzh-vspace-h{--space:var(--stzh-space-large)}@media screen and (min-width: 600px){[curve=large].sc-stzh-vspace-h{--space:var(--stzh-space-xlarge)}}@media screen and (min-width: 1024px){[curve=large].sc-stzh-vspace-h{--space:var(--stzh-space-xxlarge)}}@media screen and (min-width: 1260px){[curve=large].sc-stzh-vspace-h{--space:var(--stzh-space-xxxxlarge)}}[curve=big].sc-stzh-vspace-h{--space:var(--stzh-space-xxlarge)}@media screen and (min-width: 600px){[curve=big].sc-stzh-vspace-h{--space:var(--stzh-space-xxxxlarge)}}@media screen and (min-width: 1260px){[curve=big].sc-stzh-vspace-h{--space:var(--stzh-space-xbig)}}[curve=huge].sc-stzh-vspace-h{--space:var(--stzh-space-xxxlarge)}@media screen and (min-width: 600px){[curve=huge].sc-stzh-vspace-h{--space:var(--stzh-space-big)}}@media screen and (min-width: 1024px){[curve=huge].sc-stzh-vspace-h{--space:var(--stzh-space-xbig)}}@media screen and (min-width: 1260px){[curve=huge].sc-stzh-vspace-h{--space:var(--stzh-space-huge)}}[size=xxxsmall].sc-stzh-vspace-h{--space:var(--stzh-space-xxxsmall)}[size=xxsmall].sc-stzh-vspace-h{--space:var(--stzh-space-xxsmall)}[size=xsmall].sc-stzh-vspace-h{--space:var(--stzh-space-xsmall)}[size=small].sc-stzh-vspace-h{--space:var(--stzh-space-small)}[size=medium].sc-stzh-vspace-h{--space:var(--stzh-space-medium)}[size=large].sc-stzh-vspace-h{--space:var(--stzh-space-large)}[size=xlarge].sc-stzh-vspace-h{--space:var(--stzh-space-xlarge)}[size=xxlarge].sc-stzh-vspace-h{--space:var(--stzh-space-xxlarge)}[size=xxxlarge].sc-stzh-vspace-h{--space:var(--stzh-space-xxxlarge)}[size=xxxxlarge].sc-stzh-vspace-h{--space:var(--stzh-space-xxxxlarge)}[size=big].sc-stzh-vspace-h{--space:var(--stzh-space-big)}[size=xbig].sc-stzh-vspace-h{--space:var(--stzh-space-xbig)}[size=huge].sc-stzh-vspace-h{--space:var(--stzh-space-huge)}[size=xhuge].sc-stzh-vspace-h{--space:var(--stzh-space-xhuge)}[size=none].sc-stzh-vspace-h{--space:var(--stzh-space-none)}[size=default].sc-stzh-vspace-h{--space:var(--stzh-space-default)}@media screen and (min-width: 600px){[size-small=xxxsmall].sc-stzh-vspace-h{--space:var(--stzh-space-xxxsmall)}}@media screen and (min-width: 600px){[size-small=xxsmall].sc-stzh-vspace-h{--space:var(--stzh-space-xxsmall)}}@media screen and (min-width: 600px){[size-small=xsmall].sc-stzh-vspace-h{--space:var(--stzh-space-xsmall)}}@media screen and (min-width: 600px){[size-small=small].sc-stzh-vspace-h{--space:var(--stzh-space-small)}}@media screen and (min-width: 600px){[size-small=medium].sc-stzh-vspace-h{--space:var(--stzh-space-medium)}}@media screen and (min-width: 600px){[size-small=large].sc-stzh-vspace-h{--space:var(--stzh-space-large)}}@media screen and (min-width: 600px){[size-small=xlarge].sc-stzh-vspace-h{--space:var(--stzh-space-xlarge)}}@media screen and (min-width: 600px){[size-small=xxlarge].sc-stzh-vspace-h{--space:var(--stzh-space-xxlarge)}}@media screen and (min-width: 600px){[size-small=xxxlarge].sc-stzh-vspace-h{--space:var(--stzh-space-xxxlarge)}}@media screen and (min-width: 600px){[size-small=xxxxlarge].sc-stzh-vspace-h{--space:var(--stzh-space-xxxxlarge)}}@media screen and (min-width: 600px){[size-small=big].sc-stzh-vspace-h{--space:var(--stzh-space-big)}}@media screen and (min-width: 600px){[size-small=xbig].sc-stzh-vspace-h{--space:var(--stzh-space-xbig)}}@media screen and (min-width: 600px){[size-small=huge].sc-stzh-vspace-h{--space:var(--stzh-space-huge)}}@media screen and (min-width: 600px){[size-small=xhuge].sc-stzh-vspace-h{--space:var(--stzh-space-xhuge)}}@media screen and (min-width: 600px){[size-small=none].sc-stzh-vspace-h{--space:var(--stzh-space-none)}}@media screen and (min-width: 600px){[size-small=default].sc-stzh-vspace-h{--space:var(--stzh-space-default)}}@media screen and (min-width: 800px){[size-smallheader=xxxsmall].sc-stzh-vspace-h{--space:var(--stzh-space-xxxsmall)}}@media screen and (min-width: 800px){[size-smallheader=xxsmall].sc-stzh-vspace-h{--space:var(--stzh-space-xxsmall)}}@media screen and (min-width: 800px){[size-smallheader=xsmall].sc-stzh-vspace-h{--space:var(--stzh-space-xsmall)}}@media screen and (min-width: 800px){[size-smallheader=small].sc-stzh-vspace-h{--space:var(--stzh-space-small)}}@media screen and (min-width: 800px){[size-smallheader=medium].sc-stzh-vspace-h{--space:var(--stzh-space-medium)}}@media screen and (min-width: 800px){[size-smallheader=large].sc-stzh-vspace-h{--space:var(--stzh-space-large)}}@media screen and (min-width: 800px){[size-smallheader=xlarge].sc-stzh-vspace-h{--space:var(--stzh-space-xlarge)}}@media screen and (min-width: 800px){[size-smallheader=xxlarge].sc-stzh-vspace-h{--space:var(--stzh-space-xxlarge)}}@media screen and (min-width: 800px){[size-smallheader=xxxlarge].sc-stzh-vspace-h{--space:var(--stzh-space-xxxlarge)}}@media screen and (min-width: 800px){[size-smallheader=xxxxlarge].sc-stzh-vspace-h{--space:var(--stzh-space-xxxxlarge)}}@media screen and (min-width: 800px){[size-smallheader=big].sc-stzh-vspace-h{--space:var(--stzh-space-big)}}@media screen and (min-width: 800px){[size-smallheader=xbig].sc-stzh-vspace-h{--space:var(--stzh-space-xbig)}}@media screen and (min-width: 800px){[size-smallheader=huge].sc-stzh-vspace-h{--space:var(--stzh-space-huge)}}@media screen and (min-width: 800px){[size-smallheader=xhuge].sc-stzh-vspace-h{--space:var(--stzh-space-xhuge)}}@media screen and (min-width: 800px){[size-smallheader=none].sc-stzh-vspace-h{--space:var(--stzh-space-none)}}@media screen and (min-width: 800px){[size-smallheader=default].sc-stzh-vspace-h{--space:var(--stzh-space-default)}}@media screen and (min-width: 1024px){[size-medium=xxxsmall].sc-stzh-vspace-h{--space:var(--stzh-space-xxxsmall)}}@media screen and (min-width: 1024px){[size-medium=xxsmall].sc-stzh-vspace-h{--space:var(--stzh-space-xxsmall)}}@media screen and (min-width: 1024px){[size-medium=xsmall].sc-stzh-vspace-h{--space:var(--stzh-space-xsmall)}}@media screen and (min-width: 1024px){[size-medium=small].sc-stzh-vspace-h{--space:var(--stzh-space-small)}}@media screen and (min-width: 1024px){[size-medium=medium].sc-stzh-vspace-h{--space:var(--stzh-space-medium)}}@media screen and (min-width: 1024px){[size-medium=large].sc-stzh-vspace-h{--space:var(--stzh-space-large)}}@media screen and (min-width: 1024px){[size-medium=xlarge].sc-stzh-vspace-h{--space:var(--stzh-space-xlarge)}}@media screen and (min-width: 1024px){[size-medium=xxlarge].sc-stzh-vspace-h{--space:var(--stzh-space-xxlarge)}}@media screen and (min-width: 1024px){[size-medium=xxxlarge].sc-stzh-vspace-h{--space:var(--stzh-space-xxxlarge)}}@media screen and (min-width: 1024px){[size-medium=xxxxlarge].sc-stzh-vspace-h{--space:var(--stzh-space-xxxxlarge)}}@media screen and (min-width: 1024px){[size-medium=big].sc-stzh-vspace-h{--space:var(--stzh-space-big)}}@media screen and (min-width: 1024px){[size-medium=xbig].sc-stzh-vspace-h{--space:var(--stzh-space-xbig)}}@media screen and (min-width: 1024px){[size-medium=huge].sc-stzh-vspace-h{--space:var(--stzh-space-huge)}}@media screen and (min-width: 1024px){[size-medium=xhuge].sc-stzh-vspace-h{--space:var(--stzh-space-xhuge)}}@media screen and (min-width: 1024px){[size-medium=none].sc-stzh-vspace-h{--space:var(--stzh-space-none)}}@media screen and (min-width: 1024px){[size-medium=default].sc-stzh-vspace-h{--space:var(--stzh-space-default)}}@media screen and (min-width: 1260px){[size-large=xxxsmall].sc-stzh-vspace-h{--space:var(--stzh-space-xxxsmall)}}@media screen and (min-width: 1260px){[size-large=xxsmall].sc-stzh-vspace-h{--space:var(--stzh-space-xxsmall)}}@media screen and (min-width: 1260px){[size-large=xsmall].sc-stzh-vspace-h{--space:var(--stzh-space-xsmall)}}@media screen and (min-width: 1260px){[size-large=small].sc-stzh-vspace-h{--space:var(--stzh-space-small)}}@media screen and (min-width: 1260px){[size-large=medium].sc-stzh-vspace-h{--space:var(--stzh-space-medium)}}@media screen and (min-width: 1260px){[size-large=large].sc-stzh-vspace-h{--space:var(--stzh-space-large)}}@media screen and (min-width: 1260px){[size-large=xlarge].sc-stzh-vspace-h{--space:var(--stzh-space-xlarge)}}@media screen and (min-width: 1260px){[size-large=xxlarge].sc-stzh-vspace-h{--space:var(--stzh-space-xxlarge)}}@media screen and (min-width: 1260px){[size-large=xxxlarge].sc-stzh-vspace-h{--space:var(--stzh-space-xxxlarge)}}@media screen and (min-width: 1260px){[size-large=xxxxlarge].sc-stzh-vspace-h{--space:var(--stzh-space-xxxxlarge)}}@media screen and (min-width: 1260px){[size-large=big].sc-stzh-vspace-h{--space:var(--stzh-space-big)}}@media screen and (min-width: 1260px){[size-large=xbig].sc-stzh-vspace-h{--space:var(--stzh-space-xbig)}}@media screen and (min-width: 1260px){[size-large=huge].sc-stzh-vspace-h{--space:var(--stzh-space-huge)}}@media screen and (min-width: 1260px){[size-large=xhuge].sc-stzh-vspace-h{--space:var(--stzh-space-xhuge)}}@media screen and (min-width: 1260px){[size-large=none].sc-stzh-vspace-h{--space:var(--stzh-space-none)}}@media screen and (min-width: 1260px){[size-large=default].sc-stzh-vspace-h{--space:var(--stzh-space-default)}}@media screen and (min-width: 1440px){[size-ultra=xxxsmall].sc-stzh-vspace-h{--space:var(--stzh-space-xxxsmall)}}@media screen and (min-width: 1440px){[size-ultra=xxsmall].sc-stzh-vspace-h{--space:var(--stzh-space-xxsmall)}}@media screen and (min-width: 1440px){[size-ultra=xsmall].sc-stzh-vspace-h{--space:var(--stzh-space-xsmall)}}@media screen and (min-width: 1440px){[size-ultra=small].sc-stzh-vspace-h{--space:var(--stzh-space-small)}}@media screen and (min-width: 1440px){[size-ultra=medium].sc-stzh-vspace-h{--space:var(--stzh-space-medium)}}@media screen and (min-width: 1440px){[size-ultra=large].sc-stzh-vspace-h{--space:var(--stzh-space-large)}}@media screen and (min-width: 1440px){[size-ultra=xlarge].sc-stzh-vspace-h{--space:var(--stzh-space-xlarge)}}@media screen and (min-width: 1440px){[size-ultra=xxlarge].sc-stzh-vspace-h{--space:var(--stzh-space-xxlarge)}}@media screen and (min-width: 1440px){[size-ultra=xxxlarge].sc-stzh-vspace-h{--space:var(--stzh-space-xxxlarge)}}@media screen and (min-width: 1440px){[size-ultra=xxxxlarge].sc-stzh-vspace-h{--space:var(--stzh-space-xxxxlarge)}}@media screen and (min-width: 1440px){[size-ultra=big].sc-stzh-vspace-h{--space:var(--stzh-space-big)}}@media screen and (min-width: 1440px){[size-ultra=xbig].sc-stzh-vspace-h{--space:var(--stzh-space-xbig)}}@media screen and (min-width: 1440px){[size-ultra=huge].sc-stzh-vspace-h{--space:var(--stzh-space-huge)}}@media screen and (min-width: 1440px){[size-ultra=xhuge].sc-stzh-vspace-h{--space:var(--stzh-space-xhuge)}}@media screen and (min-width: 1440px){[size-ultra=none].sc-stzh-vspace-h{--space:var(--stzh-space-none)}}@media screen and (min-width: 1440px){[size-ultra=default].sc-stzh-vspace-h{--space:var(--stzh-space-default)}}.stzh-vspace.sc-stzh-vspace{display:-ms-flexbox;display:flex;-ms-flex-direction:column;flex-direction:column;-ms-flex-pack:start;justify-content:flex-start;-ms-flex-align:start;align-items:flex-start;padding:0;margin:0}.stzh-vspace.sc-stzh-vspace:empty{height:var(--space)}.stzh-vspace--border-top.sc-stzh-vspace{border-top:0.0625rem solid var(--stzh-base-border-color)}.stzh-vspace--border-bottom.sc-stzh-vspace{border-bottom:0.0625rem solid var(--stzh-base-border-color)}.stzh-vspace--justify-center.sc-stzh-vspace{-ms-flex-pack:center;justify-content:center}.stzh-vspace--justify-end.sc-stzh-vspace{-ms-flex-pack:end;justify-content:flex-end}.stzh-vspace--justify-between.sc-stzh-vspace{-ms-flex-pack:justify;justify-content:space-between}.stzh-vspace--justify-around.sc-stzh-vspace{-ms-flex-pack:distribute;justify-content:space-around}.stzh-vspace--justify-evenly.sc-stzh-vspace{-ms-flex-pack:space-evenly;justify-content:space-evenly}";
 
-const StzhVspace$1 = /*@__PURE__*/ proxyCustomElement(class extends HTMLElement {
-  constructor() {
-    super();
-    this.__registerHost();
-    /** Type of curve */
-    this.curve = "none";
-    /** Type of size */
-    this.size = "inherit";
-    /** Type of size above small breakpoint  */
-    this.sizeSmall = "inherit";
-    /** Type of size above medium breakpoint  */
-    this.sizeMedium = "inherit";
-    /** Type of size above large breakpoint  */
-    this.sizeLarge = "inherit";
-    /** Type of size above ultra breakpoint  */
-    this.sizeUltra = "inherit";
-    /** Alignment */
-    this.justify = "start";
-    /** Apply spacing to slotted elements */
-    this.around = false;
-    /** Add border */
-    this.border = "none";
-  }
-  render() {
-    return (h(Host, null, h("div", { class: {
-        "stzh-vspace": true,
-        [`stzh-vspace--justify-${this.justify}`]: !!this.justify,
-        [`stzh-vspace--border-${this.border}`]: !!this.border
-      } }, h("slot", null))));
-  }
-  static get style() { return stzhVspaceCss; }
-}, [6, "stzh-vspace", {
-    "curve": [1],
-    "size": [1],
-    "sizeSmall": [1, "size-small"],
-    "sizeMedium": [1, "size-medium"],
-    "sizeLarge": [1, "size-large"],
-    "sizeUltra": [1, "size-ultra"],
-    "justify": [1],
-    "around": [4],
-    "border": [1]
-  }]);
-function defineCustomElement$1() {
-  if (typeof customElements === "undefined") {
-    return;
-  }
-  const components = ["stzh-vspace"];
-  components.forEach(tagName => { switch (tagName) {
-    case "stzh-vspace":
-      if (!customElements.get(tagName)) {
-        customElements.define(tagName, StzhVspace$1);
-      }
-      break;
-  } });
+const StzhVspace$1 = /*@__PURE__*/ proxyCustomElement(class extends HTMLElement {
+  constructor() {
+    super();
+    this.__registerHost();
+    /** Type of curve */
+    this.curve = "none";
+    /** Type of size */
+    this.size = "inherit";
+    /** Type of size above small breakpoint  */
+    this.sizeSmall = "inherit";
+    /** Type of size above medium breakpoint  */
+    this.sizeMedium = "inherit";
+    /** Type of size above large breakpoint  */
+    this.sizeLarge = "inherit";
+    /** Type of size above ultra breakpoint  */
+    this.sizeUltra = "inherit";
+    /** Alignment */
+    this.justify = "start";
+    /** Apply spacing to slotted elements */
+    this.around = false;
+    /** Add border */
+    this.border = "none";
+  }
+  render() {
+    return (h(Host, null, h("div", { class: {
+        "stzh-vspace": true,
+        [`stzh-vspace--justify-${this.justify}`]: !!this.justify,
+        [`stzh-vspace--border-${this.border}`]: !!this.border
+      } }, h("slot", null))));
+  }
+  static get style() { return stzhVspaceCss; }
+}, [6, "stzh-vspace", {
+    "curve": [1],
+    "size": [1],
+    "sizeSmall": [1, "size-small"],
+    "sizeMedium": [1, "size-medium"],
+    "sizeLarge": [1, "size-large"],
+    "sizeUltra": [1, "size-ultra"],
+    "justify": [1],
+    "around": [4],
+    "border": [1]
+  }]);
+function defineCustomElement$1() {
+  if (typeof customElements === "undefined") {
+    return;
+  }
+  const components = ["stzh-vspace"];
+  components.forEach(tagName => { switch (tagName) {
+    case "stzh-vspace":
+      if (!customElements.get(tagName)) {
+        customElements.define(tagName, StzhVspace$1);
+      }
+      break;
+  } });
 }
 
 const StzhVspace = StzhVspace$1;

package/dist/components/translation-utils.js

@@ -1,57 +1,57 @@
-const LANG_DE = "de";
-const LANG_EN = "en";
-const LANG_DEFAULT = LANG_DE;
-const SUPPORTED_LANGUAGES = [
-  LANG_DE,
-  LANG_EN
-];
-function getLocale(element) {
-  const closestElement = element.closest("[lang]");
-  const locale = closestElement && closestElement.lang.split("-")[0];
-  if (SUPPORTED_LANGUAGES.indexOf(locale) === -1 || !locale) {
-    return LANG_DEFAULT;
-  }
-  else {
-    return locale;
-  }
-}
-function tc(translation, count) {
-  if (!translation) {
-    return "";
-  }
-  const parts = translation.split('|');
-  let part = parts[0].trim();
-  if (parts.length === 3 && count === 1) {
-    part = parts[1].trim();
-  }
-  else if (parts.length === 3 && count > 1) {
-    part = parts[2].trim();
-  }
-  if (parts.length === 2 && count !== 1) {
-    part = parts[1].trim();
-  }
-  return part.replace(/\{n\}/ig, count.toString());
-}
-async function fetchTranslations(host, component) {
-  const locale = getLocale(host);
-  const existingTranslations = JSON.parse(sessionStorage.getItem(`stzhComponents.v${window.stzhComponents.version}.i18n.${locale}`));
-  if (window.stzhComponents.cacheTranslations
-    && window.stzhComponents.version.match(/-dev-snapshot/i) === null
-    && existingTranslations
-    && Object.keys(existingTranslations).length > 0) {
-    return Object.assign(Object.assign({}, existingTranslations[component] || {}), { $globals: existingTranslations.$globals, $locale: existingTranslations.$code, $formats: existingTranslations.$formats });
-  }
-  try {
-    const result = await fetch(`${window.stzhComponents.pathTranslations}/${locale}.json`);
-    if (result.ok) {
-      const data = await result.json();
-      sessionStorage.setItem(`stzhComponents.v${window.stzhComponents.version}.i18n.${locale}`, JSON.stringify(data));
-      return Object.assign(Object.assign({}, data[component] || {}), { $globals: data.$globals, $locale: data.$code, $formats: data.$formats });
-    }
-  }
-  catch (exception) {
-    console.error(`Error loading locale: ${locale}`, exception);
-  }
+const LANG_DE = "de";
+const LANG_EN = "en";
+const LANG_DEFAULT = LANG_DE;
+const SUPPORTED_LANGUAGES = [
+  LANG_DE,
+  LANG_EN
+];
+function getLocale(element) {
+  const closestElement = element.closest("[lang]");
+  const locale = closestElement && closestElement.lang.split("-")[0];
+  if (SUPPORTED_LANGUAGES.indexOf(locale) === -1 || !locale) {
+    return LANG_DEFAULT;
+  }
+  else {
+    return locale;
+  }
+}
+function tc(translation, count) {
+  if (!translation) {
+    return "";
+  }
+  const parts = translation.split('|');
+  let part = parts[0].trim();
+  if (parts.length === 3 && count === 1) {
+    part = parts[1].trim();
+  }
+  else if (parts.length === 3 && count > 1) {
+    part = parts[2].trim();
+  }
+  if (parts.length === 2 && count !== 1) {
+    part = parts[1].trim();
+  }
+  return part.replace(/\{n\}/ig, count.toString());
+}
+async function fetchTranslations(host, component) {
+  const locale = getLocale(host);
+  const existingTranslations = JSON.parse(sessionStorage.getItem(`stzhComponents.v${window.stzhComponents.version}.i18n.${locale}`));
+  if (window.stzhComponents.cacheTranslations
+    && window.stzhComponents.version.match(/-dev-snapshot/i) === null
+    && existingTranslations
+    && Object.keys(existingTranslations).length > 0) {
+    return Object.assign(Object.assign({}, existingTranslations[component] || {}), { $globals: existingTranslations.$globals, $locale: existingTranslations.$code, $formats: existingTranslations.$formats });
+  }
+  try {
+    const result = await fetch(`${window.stzhComponents.pathTranslations}/${locale}.json`);
+    if (result.ok) {
+      const data = await result.json();
+      sessionStorage.setItem(`stzhComponents.v${window.stzhComponents.version}.i18n.${locale}`, JSON.stringify(data));
+      return Object.assign(Object.assign({}, data[component] || {}), { $globals: data.$globals, $locale: data.$code, $formats: data.$formats });
+    }
+  }
+  catch (exception) {
+    console.error(`Error loading locale: ${locale}`, exception);
+  }
 }
 
 export { fetchTranslations as f, tc as t };

package/dist/components/utils.js

@@ -1,33 +1,33 @@
-// IMPORTANT: Don't use this to check for a default slot when shadow DOM is not used
-// https://github.com/shoelace-style/shoelace/blob/9f7bc29b5f13eda1beb1d4f9c952894a21e13322/src/components/card/card.tsx
-// Determines whether an element has a slot. If name is specified, the function will look for a corresponding named
-// slot, otherwise it will look for a "default" slot (e.g. a non-empty text node or an element with no slot attribute).
-//
-function hasSlot(el, name) {
-  // Look for a named slot
-  if (name) {
-    return el.querySelector(`[slot="${name}"]`) !== null;
-  }
-  // Look for a default slot
-  return Array.from(el.childNodes).some(node => {
-    if (node.nodeType === node.TEXT_NODE && node.textContent.trim() !== '') {
-      return true;
-    }
-    if (node.nodeType === node.ELEMENT_NODE) {
-      const el = node;
-      if (!el.hasAttribute('slot')) {
-        return true;
-      }
-    }
-    return false;
-  });
-}
-function setPropsIfNull(element, attributes) {
-  Object.keys(attributes).forEach(attribute => {
-    if (element.getAttribute(attribute) === null) {
-      element[attribute] = attributes[attribute];
-    }
-  });
+// IMPORTANT: Don't use this to check for a default slot when shadow DOM is not used
+// https://github.com/shoelace-style/shoelace/blob/9f7bc29b5f13eda1beb1d4f9c952894a21e13322/src/components/card/card.tsx
+// Determines whether an element has a slot. If name is specified, the function will look for a corresponding named
+// slot, otherwise it will look for a "default" slot (e.g. a non-empty text node or an element with no slot attribute).
+//
+function hasSlot(el, name) {
+  // Look for a named slot
+  if (name) {
+    return el.querySelector(`[slot="${name}"]`) !== null;
+  }
+  // Look for a default slot
+  return Array.from(el.childNodes).some(node => {
+    if (node.nodeType === node.TEXT_NODE && node.textContent.trim() !== '') {
+      return true;
+    }
+    if (node.nodeType === node.ELEMENT_NODE) {
+      const el = node;
+      if (!el.hasAttribute('slot')) {
+        return true;
+      }
+    }
+    return false;
+  });
+}
+function setPropsIfNull(element, attributes) {
+  Object.keys(attributes).forEach(attribute => {
+    if (element.getAttribute(attribute) === null) {
+      element[attribute] = attributes[attribute];
+    }
+  });
 }
 
 export { hasSlot as h, setPropsIfNull as s };

package/dist/esm/{animation-utils-27dcfc1e.js → animation-utils-25c74e5b.js}

@@ -1,40 +1,40 @@
-//
-// Animates an element using keyframes. Returns a promise that resolves after the animation completes or gets canceled.
-//
-function animateTo(el, keyframes, options) {
-  return new Promise(resolve => {
-    if ((options === null || options === void 0 ? void 0 : options.duration) === Infinity) {
-      throw new Error('Promise-based animations must be finite.');
-    }
-    const animation = el.animate(keyframes, Object.assign(Object.assign({}, options), { duration: prefersReducedMotion() ? 0 : options.duration }));
-    animation.addEventListener('cancel', resolve, { once: true });
-    animation.addEventListener('finish', resolve, { once: true });
-  });
-}
-//
-// Tells if the user has enabled the "reduced motion" setting in their browser or OS.
-//
-function prefersReducedMotion() {
-  const query = window.matchMedia('(prefers-reduced-motion: reduce)');
-  return query.matches;
-}
-//
-// Stops all active animations on the target element. Returns a promise that resolves after all animations are canceled.
-//
-function stopAnimations(el) {
-  return Promise.all(el.getAnimations().map(animation => {
-    return new Promise(resolve => {
-      const handleAnimationEvent = requestAnimationFrame(resolve);
-      animation.addEventListener('cancel', () => handleAnimationEvent, { once: true });
-      animation.addEventListener('finish', () => handleAnimationEvent, { once: true });
-      animation.cancel();
-    });
-  }));
-}
-// We can't animate `height: auto`, but we can calculate the height and shim keyframes by replacing it with the
-// element's scrollHeight before the animation.
-function shimKeyframesHeightAuto(keyframes, calculatedHeight) {
-  return keyframes.map(keyframe => (Object.assign(Object.assign({}, keyframe), { height: keyframe.height === 'auto' ? `${calculatedHeight}px` : keyframe.height })));
+//
+// Animates an element using keyframes. Returns a promise that resolves after the animation completes or gets canceled.
+//
+function animateTo(el, keyframes, options) {
+  return new Promise(resolve => {
+    if ((options === null || options === void 0 ? void 0 : options.duration) === Infinity) {
+      throw new Error('Promise-based animations must be finite.');
+    }
+    const animation = el.animate(keyframes, Object.assign(Object.assign({}, options), { duration: prefersReducedMotion() ? 0 : options.duration }));
+    animation.addEventListener('cancel', resolve, { once: true });
+    animation.addEventListener('finish', resolve, { once: true });
+  });
+}
+//
+// Tells if the user has enabled the "reduced motion" setting in their browser or OS.
+//
+function prefersReducedMotion() {
+  const query = window.matchMedia('(prefers-reduced-motion: reduce)');
+  return query.matches;
+}
+//
+// Stops all active animations on the target element. Returns a promise that resolves after all animations are canceled.
+//
+function stopAnimations(el) {
+  return Promise.all(el.getAnimations().map(animation => {
+    return new Promise(resolve => {
+      const handleAnimationEvent = requestAnimationFrame(resolve);
+      animation.addEventListener('cancel', () => handleAnimationEvent, { once: true });
+      animation.addEventListener('finish', () => handleAnimationEvent, { once: true });
+      animation.cancel();
+    });
+  }));
+}
+// We can't animate `height: auto`, but we can calculate the height and shim keyframes by replacing it with the
+// element's scrollHeight before the animation.
+function shimKeyframesHeightAuto(keyframes, calculatedHeight) {
+  return keyframes.map(keyframe => (Object.assign(Object.assign({}, keyframe), { height: keyframe.height === 'auto' ? `${calculatedHeight}px` : keyframe.height })));
 }
 
 export { animateTo as a, shimKeyframesHeightAuto as b, prefersReducedMotion as p, stopAnimations as s };

package/dist/esm/{app-globals-137e106c.js → app-globals-70c229e3.js}

@@ -1,50 +1,50 @@
 const name = "@oiz/stzh-components";
-const version = "0.0.0-DEV-SNAPSHOT";
-
-/**
- * Execute setFocus method if it exists
- * on stzh-element with autofocus on pageload
- * when (child components are loaded)
- */
-function applyAutofocus() {
-  window.addEventListener('appload', (event) => {
-    const autofocus = document.querySelector('[autofocus]');
-
-    if (autofocus
-        && event.detail.namespace === name
-        && autofocus.tagName.toLowerCase().indexOf('stzh-') === 0
-        && 'setFocus' in autofocus
-    ) {
-      autofocus.setFocus();
-    }
-  });
+const version = "1.4.0-npmjstest";
+
+/**
+ * Execute setFocus method if it exists
+ * on stzh-element with autofocus on pageload
+ * when (child components are loaded)
+ */
+function applyAutofocus() {
+  window.addEventListener('appload', (event) => {
+    const autofocus = document.querySelector('[autofocus]');
+
+    if (autofocus
+        && event.detail.namespace === name
+        && autofocus.tagName.toLowerCase().indexOf('stzh-') === 0
+        && 'setFocus' in autofocus
+    ) {
+      autofocus.setFocus();
+    }
+  });
 }
 
-function observeScrollbarWidth() {
-  const config = {
-    threshold: 1.0
-  };
-
-  const handleIntersect = (entries) => {
-    entries.forEach(entry => {
-      let scrollbarWidth = 0;
-
-      if (entry.intersectionRatio < 1) {
-        scrollbarWidth = window.innerWidth - document.body.clientWidth;
-      }
-
-      document.documentElement.style.setProperty('--stzh-scrollbar-width', scrollbarWidth + 'px');
-    });
-  };
-
-  const bodyScrollObserver = new IntersectionObserver(handleIntersect, config);
-  bodyScrollObserver.observe(document.body);
+function observeScrollbarWidth() {
+  const config = {
+    threshold: 1.0
+  };
+
+  const handleIntersect = (entries) => {
+    entries.forEach(entry => {
+      let scrollbarWidth = 0;
+
+      if (entry.intersectionRatio < 1) {
+        scrollbarWidth = window.innerWidth - document.body.clientWidth;
+      }
+
+      document.documentElement.style.setProperty('--stzh-scrollbar-width', scrollbarWidth + 'px');
+    });
+  };
+
+  const bodyScrollObserver = new IntersectionObserver(handleIntersect, config);
+  bodyScrollObserver.observe(document.body);
 }
 
-function appGlobalScript () {
-  window.stzhComponents = Object.assign({ version, labels: 'flyout', cacheTranslations: true, pathTranslations: '/', formats: {} }, window.stzhComponents || {});
-  applyAutofocus();
-  observeScrollbarWidth();
+function appGlobalScript () {
+  window.stzhComponents = Object.assign({ version, labels: 'flyout', cacheTranslations: true, pathTranslations: '/', formats: {} }, window.stzhComponents || {});
+  applyAutofocus();
+  observeScrollbarWidth();
 }
 
 const globalScripts = appGlobalScript;

package/dist/esm/{arrow-18769ca6.js → arrow-86a679c7.js}

@@ -1289,9 +1289,9 @@ const computePosition = (reference, floating, options) => computePosition$1(refe
   ...options
 });
 
-const Arrow = `<svg width="16" height="8" viewBox="0 0 16 8" fill="none" xmlns="http://www.w3.org/2000/svg">
-  <path d="M0 8L16 8L8 0L0 8Z" fill="currentColor"/>
-</svg>
+const Arrow = `<svg width="16" height="8" viewBox="0 0 16 8" fill="none" xmlns="http://www.w3.org/2000/svg">
+  <path d="M0 8L16 8L8 0L0 8Z" fill="currentColor"/>
+</svg>
 `;
 
 export { Arrow as A, autoUpdate as a, arrow as b, computePosition as c, flip as f, offset as o, shift as s };