@oiz/stzh-components 0.0.1-pretest → 1.5.0-alpha

package/dist/components/stzh-status2.js

@@ -2,50 +2,50 @@ import { proxyCustomElement, HTMLElement, h, Host } from '@stencil/core/internal
 
 const stzhStatusCss = ".sc-stzh-status-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-status-h{display:none}.sc-stzh-status-h *.sc-stzh-status,.sc-stzh-status-h *.sc-stzh-status::before,.sc-stzh-status-h *.sc-stzh-status::after{-webkit-box-sizing:border-box;box-sizing:border-box}.sc-stzh-status-h{--color:var(--stzh-base-color)}[type=success].sc-stzh-status-h{--color:var(--stzh-color-truegreen)}[type=warning].sc-stzh-status-h{--color:var(--stzh-color-warning)}[type=error].sc-stzh-status-h{--color:var(--stzh-color-error)}[type=info].sc-stzh-status-h{--color:var(--stzh-color-zueriblue)}.stzh-status.sc-stzh-status{min-width:10rem;color:var(--color)}.stzh-status__dot.sc-stzh-status{border-radius:50%;width:0.75rem;height:0.75rem;background-color:currentColor;margin-right:var(--stzh-space-xxsmall)}.stzh-status__bar.sc-stzh-status{display:block;height:0.25rem;border-radius:0.75rem;background-color:var(--stzh-color-grey13);margin-top:var(--stzh-space-xxsmall)}.stzh-status__bar-inner.sc-stzh-status{display:block;height:100%;width:0;border-radius:0.75rem;background:currentColor}.stzh-status__text.sc-stzh-status{font-size:var(--stzh-font-micro-font-size);line-height:var(--stzh-font-micro-text-line-height);display:-ms-flexbox;display:flex;-ms-flex-align:center;align-items:center}";
 
-const StzhStatus = /*@__PURE__*/ proxyCustomElement(class extends HTMLElement {
-  constructor() {
-    super();
-    this.__registerHost();
-    /** Percent */
-    this.percent = 0;
-    /** Whether to hide/show loadingbar */
-    this.withLoadingbar = false;
-    /** Label */
-    this.label = "";
-    /** Type */
-    this.type = "default";
-  }
-  render() {
-    const classes = {
-      "stzh-status": true,
-      [`stzh-status--type-${this.type}`]: !!this.type
-    };
-    return (h(Host, null, h("div", { class: classes }, h("div", { class: "stzh-status__text" }, h("div", { class: "stzh-status__dot" }), this.label &&
-      h("div", { class: "stzh-status__label" }, this.label)), this.withLoadingbar &&
-      h("div", { class: "stzh-status__bar" }, h("div", { class: "stzh-status__bar-inner", style: {
-          width: `${this.percent}%`
-        } })))));
-  }
-  get element() { return this; }
-  static get style() { return stzhStatusCss; }
-}, [2, "stzh-status", {
-    "percent": [2],
-    "withLoadingbar": [4, "with-loadingbar"],
-    "label": [1],
-    "type": [513]
-  }]);
-function defineCustomElement() {
-  if (typeof customElements === "undefined") {
-    return;
-  }
-  const components = ["stzh-status"];
-  components.forEach(tagName => { switch (tagName) {
-    case "stzh-status":
-      if (!customElements.get(tagName)) {
-        customElements.define(tagName, StzhStatus);
-      }
-      break;
-  } });
+const StzhStatus = /*@__PURE__*/ proxyCustomElement(class extends HTMLElement {
+  constructor() {
+    super();
+    this.__registerHost();
+    /** Percent */
+    this.percent = 0;
+    /** Whether to hide/show loadingbar */
+    this.withLoadingbar = false;
+    /** Label */
+    this.label = "";
+    /** Type */
+    this.type = "default";
+  }
+  render() {
+    const classes = {
+      "stzh-status": true,
+      [`stzh-status--type-${this.type}`]: !!this.type
+    };
+    return (h(Host, null, h("div", { class: classes }, h("div", { class: "stzh-status__text" }, h("div", { class: "stzh-status__dot" }), this.label &&
+      h("div", { class: "stzh-status__label" }, this.label)), this.withLoadingbar &&
+      h("div", { class: "stzh-status__bar" }, h("div", { class: "stzh-status__bar-inner", style: {
+          width: `${this.percent}%`
+        } })))));
+  }
+  get element() { return this; }
+  static get style() { return stzhStatusCss; }
+}, [2, "stzh-status", {
+    "percent": [2],
+    "withLoadingbar": [4, "with-loadingbar"],
+    "label": [1],
+    "type": [513]
+  }]);
+function defineCustomElement() {
+  if (typeof customElements === "undefined") {
+    return;
+  }
+  const components = ["stzh-status"];
+  components.forEach(tagName => { switch (tagName) {
+    case "stzh-status":
+      if (!customElements.get(tagName)) {
+        customElements.define(tagName, StzhStatus);
+      }
+      break;
+  } });
 }
 
 export { StzhStatus as S, defineCustomElement as d };

package/dist/components/stzh-table.js

@@ -3,159 +3,159 @@ import { s as setPropsIfNull } from './utils.js';
 
 const stzhTableCss = ":host{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}:host[hidden]{display:none}:host *,:host *::before,:host *::after{-webkit-box-sizing:border-box;box-sizing:border-box}stzh-table{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;--max-height:var(--stzh-table-max-height);--min-width:var(--stzh-table-min-width);--cell-padding:var(--stzh-table-cell-padding);--input-width:var(--stzh-table-input-width)}stzh-table[hidden]{display:none}stzh-table *,stzh-table *::before,stzh-table *::after{-webkit-box-sizing:border-box;box-sizing:border-box}.stzh-table{}.stzh-table__header{display:-ms-flexbox;display:flex;-ms-flex-direction:column;flex-direction:column;border-bottom:0.0625rem solid var(--stzh-base-border-color);padding-bottom:var(--stzh-space-small);margin-bottom:var(--stzh-space-medium)}@media screen and (min-width: 1024px){.stzh-table__header{padding-bottom:var(--stzh-space-medium)}}@media screen and (min-width: 1024px){.stzh-table__header{margin-bottom:var(--stzh-space-large)}}@media screen and (min-width: 1260px){.stzh-table__header{margin-bottom:var(--stzh-space-xlarge)}}@media screen and (min-width: 1024px){.stzh-table__header{-ms-flex-direction:row;flex-direction:row;-ms-flex-pack:justify;justify-content:space-between}}.stzh-table__heading{margin-bottom:var(--stzh-space-small)}@media screen and (min-width: 1024px){.stzh-table__heading{margin-bottom:0}}.stzh-table__header .stzh-table__search{width:var(--stzh-table-input-width)}@media screen and (min-width: 1024px){.stzh-table__header .stzh-table__search{margin-left:var(--stzh-space-large)}}.stzh-table__outer-wrapper{position:relative}.stzh-table__outer-wrapper::before,.stzh-table__outer-wrapper::after{z-index:4;background:-webkit-gradient(linear, left top, right top, from(rgba(0, 0, 0, 0.16)), to(rgba(0, 0, 0, 0)));background:linear-gradient(90deg, rgba(0, 0, 0, 0.16) 0%, rgba(0, 0, 0, 0) 100%);content:\"\";pointer-events:none;position:absolute;top:0;height:100%;width:0.375rem;-webkit-transition:opacity var(--stzh-base-transition-animation-speed);transition:opacity var(--stzh-base-transition-animation-speed);opacity:0}.stzh-table__outer-wrapper::before{left:0}.stzh-table__outer-wrapper::after{right:0;-webkit-transform:rotate(-180deg);transform:rotate(-180deg)}.stzh-table__wrapper{overflow-x:auto;max-height:var(--max-height)}.stzh-table__sort-button{font-family:var(--stzh-font-family-heavy);font-weight:var(--stzh-font-weight-heavy);font-style:normal;cursor:pointer;-webkit-appearance:none;-moz-appearance:none;appearance:none;background:none;border:none;display:-ms-flexbox;display:flex;-ms-flex-align:center;align-items:center;font-size:inherit;line-height:inherit;color:inherit;padding:var(--cell-padding)}.stzh-table__sort-button:hover,.stzh-table__sort-button:focus{color:var(--stzh-color-primary-hover, var(--stzh-color-zueribluedark))}.stzh-table__sort-icon{opacity:0}.stzh-table table{width:100%;border-spacing:0;min-width:var(--min-width)}.stzh-table thead{position:-webkit-sticky;position:sticky;top:0;z-index:3}.stzh-table tr:hover td,.stzh-table tr:hover th{background-color:var(--stzh-color-grey5)}.stzh-table td,.stzh-table th{font-size:var(--stzh-font-milli-font-size);line-height:var(--stzh-font-milli-text-line-height);letter-spacing:var(--stzh-font-curve---text-letter-spacing);text-align:left;border:none;vertical-align:top;border:none;border-bottom:0.0625rem solid var(--stzh-base-border-color);background-color:var(--stzh-color-white);-webkit-transition:background-color var(--stzh-base-transition-animation-speed);transition:background-color var(--stzh-base-transition-animation-speed);padding:var(--cell-padding);}.stzh-table td a,.stzh-table th a{color:var(--stzh-link-color);-webkit-transition:color var(--stzh-base-transition-animation-speed);transition:color var(--stzh-base-transition-animation-speed);border-radius:var(--stzh-button-border-radius)}.stzh-table td a:hover,.stzh-table td a:focus,.stzh-table th a:hover,.stzh-table th a:focus{color:var(--stzh-link-hover-color)}.stzh-table td b,.stzh-table td strong,.stzh-table th b,.stzh-table th strong{font-family:var(--stzh-font-family-heavy);font-weight:var(--stzh-font-weight-heavy);font-style:normal}.stzh-table td i,.stzh-table td em,.stzh-table th i,.stzh-table th em{font-family:var(--stzh-font-family-regular);font-weight:var(--stzh-font-weight-regular);font-style:normal}.stzh-table td.align-left,.stzh-table th.align-left{text-align:left}.stzh-table td.align-right,.stzh-table th.align-right{text-align:right}.stzh-table td.align-center,.stzh-table th.align-center{text-align:center}.stzh-table td.valign-auto,.stzh-table th.valign-auto{vertical-align:auto}.stzh-table td.valign-middle,.stzh-table th.valign-middle{vertical-align:middle}.stzh-table td.valign-bottom,.stzh-table th.valign-bottom{vertical-align:bottom}.stzh-table td.nowrap,.stzh-table th.nowrap{white-space:nowrap}.stzh-table td.is-sticky-left,.stzh-table td.is-sticky-right,.stzh-table th.is-sticky-left,.stzh-table th.is-sticky-right{position:-webkit-sticky;position:sticky;z-index:1}.stzh-table td.has-sticked,.stzh-table th.has-sticked{z-index:2}.stzh-table td.is-sticky-left,.stzh-table th.is-sticky-left{left:0}.stzh-table td.is-sticky-right,.stzh-table th.is-sticky-right{right:0}.stzh-table td.is-sticky-left::after,.stzh-table td.is-sticky-right::after,.stzh-table th.is-sticky-left::after,.stzh-table th.is-sticky-right::after{background:-webkit-gradient(linear, left top, right top, from(rgba(0, 0, 0, 0.16)), to(rgba(0, 0, 0, 0)));background:linear-gradient(90deg, rgba(0, 0, 0, 0.16) 0%, rgba(0, 0, 0, 0) 100%);content:\"\";pointer-events:none;position:absolute;top:0;height:100%;width:0.375rem;-webkit-transform:translate(100%);transform:translate(100%);opacity:0;-webkit-transition:opacity var(--stzh-base-transition-animation-speed);transition:opacity var(--stzh-base-transition-animation-speed)}.stzh-table td.is-sticky-left::after,.stzh-table th.is-sticky-left::after{right:0}.stzh-table td.is-sticky-right::after,.stzh-table th.is-sticky-right::after{left:0;-webkit-transform:rotate(-180deg) translate(100%);transform:rotate(-180deg) translate(100%)}.stzh-table td.has-sticked.is-sticky-left::after,.stzh-table td.has-sticked.is-sticky-right::after,.stzh-table th.has-sticked.is-sticky-left::after,.stzh-table th.has-sticked.is-sticky-right::after{opacity:1}.stzh-table th{font-family:var(--stzh-font-family-heavy);font-weight:var(--stzh-font-weight-heavy);font-style:normal;color:var(--stzh-color-primary, var(--stzh-color-zueriblue))}.stzh-table th.is-sortable{padding:0}td.has-sorted .stzh-table__sort-icon,th.has-sorted .stzh-table__sort-icon{opacity:1}td.has-sorted-desc .stzh-table__sort-icon,th.has-sorted-desc .stzh-table__sort-icon{-webkit-transform:rotate(180deg);transform:rotate(180deg)}.stzh-table.has-scroll-left-shadow .stzh-table__outer-wrapper::before,.stzh-table.has-scroll-right-shadow .stzh-table__outer-wrapper::after{opacity:1}";
 
-const CLASS_HAS_STICKED = "has-sticked";
-const CLASS_IS_STICKY_LEFT = "is-sticky-left";
-const CLASS_IS_STICKY_RIGHT = "is-sticky-right";
-const StzhTable$1 = /*@__PURE__*/ proxyCustomElement(class extends HTMLElement {
-  constructor() {
-    super();
-    this.__registerHost();
-    /** Columns that should be sticky on the left side (column indexes separated by comma) */
-    this.fixedLeft = null;
-    /** Columns that should be sticky on the right side (column indexes separated by comma) */
-    this.fixedRight = null;
-    this.hasScrollLeft = false;
-    this.hasScrollRight = false;
-    this.isScrollable = false;
-    this.cellsStickyLeft = [];
-    this.cellsStickyRight = [];
-    this.updateCellClasses = () => {
-      if (!this.tableWrapper) {
-        return;
-      }
-      const rows = Array.from(this.tableWrapper.querySelectorAll("tr"));
-      rows.forEach((row) => {
-        const cells = Array.from(row.children);
-        cells.forEach((cell, index) => {
-          cell.classList.remove(CLASS_IS_STICKY_LEFT);
-          cell.classList.remove(CLASS_IS_STICKY_RIGHT);
-          if (index === this.fixedLeft) {
-            cell.classList.add(CLASS_IS_STICKY_LEFT);
-          }
-          if (index === this.fixedRight) {
-            cell.classList.add(CLASS_IS_STICKY_RIGHT);
-          }
-        });
-      });
-    };
-    this.updateScrollStates = () => {
-      if (!this.tableWrapper) {
-        return;
-      }
-      const wrapperScrollLeft = this.tableWrapper.scrollLeft;
-      const wrapperScrollWidth = this.tableWrapper.scrollWidth;
-      const wrapperClientWidth = this.tableWrapper.clientWidth;
-      this.isScrollable = wrapperScrollWidth > wrapperClientWidth;
-      this.hasScrollLeft = wrapperScrollLeft > 0;
-      this.hasScrollRight = wrapperScrollLeft < wrapperScrollWidth - wrapperClientWidth;
-      const rows = Array.from(this.tableWrapper.querySelectorAll("tr"));
-      const firstRow = rows[0];
-      if (!firstRow) {
-        return;
-      }
-      this.cellsStickyLeft = [];
-      this.cellsStickyRight = [];
-      const cells = Array.from(firstRow.children);
-      cells.forEach((cell, index) => {
-        const offsetLeft = cell.offsetLeft;
-        const offsetRight = offsetLeft + cell.offsetWidth;
-        if (this.hasScrollLeft
-          && index === this.fixedLeft
-          && Math.ceil(wrapperScrollLeft) >= offsetLeft) {
-          this.cellsStickyLeft.push(index);
-        }
-        if (this.hasScrollRight
-          && index === this.fixedRight
-          && Math.ceil(wrapperScrollLeft) + wrapperClientWidth <= offsetRight) {
-          this.cellsStickyRight.push(index);
-        }
-      });
-      rows.forEach((row) => {
-        const cells = Array.from(row.children);
-        cells.forEach((cell, index) => {
-          if (this.cellsStickyLeft.indexOf(index) > -1
-            || this.cellsStickyRight.indexOf(index) > -1) {
-            cell.classList.add(CLASS_HAS_STICKED);
-          }
-          else {
-            cell.classList.remove(CLASS_HAS_STICKED);
-          }
-        });
-      });
-    };
-    this.init = () => {
-      const searchInput = this.element.querySelector('stzh-input[slot="search"], [slot="search"] stzh-input');
-      if (searchInput) {
-        setPropsIfNull(searchInput, {
-          size: "small"
-        });
-      }
-      this.updateCellClasses();
-      this.updateScrollStates();
-    };
-    this.handleScroll = () => {
-      if (this.debounceScroll) {
-        window.cancelAnimationFrame(this.debounceScroll);
-      }
-      this.debounceScroll = requestAnimationFrame(this.updateScrollStates);
-    };
-  }
-  fixedCellWatcher() {
-    this.updateCellClasses();
-    this.updateScrollStates();
-  }
-  handleResize() {
-    this.updateScrollStates();
-  }
-  connectedCallback() {
-    this.init();
-    this.observer = new MutationObserver(this.init);
-    this.observer.observe(this.element, {
-      childList: true,
-      subtree: true
-    });
-  }
-  disconnectedCallback() {
-    this.observer.disconnect();
-  }
-  render() {
-    const classes = {
-      "stzh-table": true,
-      "is-scrollable": this.isScrollable,
-      "has-scroll-left": this.hasScrollLeft,
-      "has-scroll-right": this.hasScrollRight,
-      "has-scroll-left-shadow": this.hasScrollLeft && this.cellsStickyLeft.length === 0,
-      "has-scroll-right-shadow": this.hasScrollRight && this.cellsStickyRight.length === 0
-    };
-    return (h(Host, null, h("div", { class: classes }, h("div", { class: "stzh-table__header" }, h("div", { class: "stzh-table__heading" }, h("slot", { name: "heading" })), h("div", { class: "stzh-table__search" }, h("slot", { name: "search" }))), h("div", { class: "stzh-table__outer-wrapper" }, h("div", { ref: (el) => (this.tableWrapper = el), class: "stzh-table__wrapper", onScroll: this.handleScroll }, h("slot", null))))));
-  }
-  get element() { return this; }
-  static get watchers() { return {
-    "fixedLeft": ["fixedCellWatcher"],
-    "fixedRight": ["fixedCellWatcher"]
-  }; }
-  static get style() { return stzhTableCss; }
-}, [4, "stzh-table", {
-    "fixedLeft": [2, "fixed-left"],
-    "fixedRight": [2, "fixed-right"],
-    "hasScrollLeft": [32],
-    "hasScrollRight": [32],
-    "isScrollable": [32],
-    "cellsStickyLeft": [32],
-    "cellsStickyRight": [32]
-  }, [[9, "resize", "handleResize"]]]);
-function defineCustomElement$1() {
-  if (typeof customElements === "undefined") {
-    return;
-  }
-  const components = ["stzh-table"];
-  components.forEach(tagName => { switch (tagName) {
-    case "stzh-table":
-      if (!customElements.get(tagName)) {
-        customElements.define(tagName, StzhTable$1);
-      }
-      break;
-  } });
+const CLASS_HAS_STICKED = "has-sticked";
+const CLASS_IS_STICKY_LEFT = "is-sticky-left";
+const CLASS_IS_STICKY_RIGHT = "is-sticky-right";
+const StzhTable$1 = /*@__PURE__*/ proxyCustomElement(class extends HTMLElement {
+  constructor() {
+    super();
+    this.__registerHost();
+    /** Columns that should be sticky on the left side (column indexes separated by comma) */
+    this.fixedLeft = null;
+    /** Columns that should be sticky on the right side (column indexes separated by comma) */
+    this.fixedRight = null;
+    this.hasScrollLeft = false;
+    this.hasScrollRight = false;
+    this.isScrollable = false;
+    this.cellsStickyLeft = [];
+    this.cellsStickyRight = [];
+    this.updateCellClasses = () => {
+      if (!this.tableWrapper) {
+        return;
+      }
+      const rows = Array.from(this.tableWrapper.querySelectorAll("tr"));
+      rows.forEach((row) => {
+        const cells = Array.from(row.children);
+        cells.forEach((cell, index) => {
+          cell.classList.remove(CLASS_IS_STICKY_LEFT);
+          cell.classList.remove(CLASS_IS_STICKY_RIGHT);
+          if (index === this.fixedLeft) {
+            cell.classList.add(CLASS_IS_STICKY_LEFT);
+          }
+          if (index === this.fixedRight) {
+            cell.classList.add(CLASS_IS_STICKY_RIGHT);
+          }
+        });
+      });
+    };
+    this.updateScrollStates = () => {
+      if (!this.tableWrapper) {
+        return;
+      }
+      const wrapperScrollLeft = this.tableWrapper.scrollLeft;
+      const wrapperScrollWidth = this.tableWrapper.scrollWidth;
+      const wrapperClientWidth = this.tableWrapper.clientWidth;
+      this.isScrollable = wrapperScrollWidth > wrapperClientWidth;
+      this.hasScrollLeft = wrapperScrollLeft > 0;
+      this.hasScrollRight = wrapperScrollLeft < wrapperScrollWidth - wrapperClientWidth;
+      const rows = Array.from(this.tableWrapper.querySelectorAll("tr"));
+      const firstRow = rows[0];
+      if (!firstRow) {
+        return;
+      }
+      this.cellsStickyLeft = [];
+      this.cellsStickyRight = [];
+      const cells = Array.from(firstRow.children);
+      cells.forEach((cell, index) => {
+        const offsetLeft = cell.offsetLeft;
+        const offsetRight = offsetLeft + cell.offsetWidth;
+        if (this.hasScrollLeft
+          && index === this.fixedLeft
+          && Math.ceil(wrapperScrollLeft) >= offsetLeft) {
+          this.cellsStickyLeft.push(index);
+        }
+        if (this.hasScrollRight
+          && index === this.fixedRight
+          && Math.ceil(wrapperScrollLeft) + wrapperClientWidth <= offsetRight) {
+          this.cellsStickyRight.push(index);
+        }
+      });
+      rows.forEach((row) => {
+        const cells = Array.from(row.children);
+        cells.forEach((cell, index) => {
+          if (this.cellsStickyLeft.indexOf(index) > -1
+            || this.cellsStickyRight.indexOf(index) > -1) {
+            cell.classList.add(CLASS_HAS_STICKED);
+          }
+          else {
+            cell.classList.remove(CLASS_HAS_STICKED);
+          }
+        });
+      });
+    };
+    this.init = () => {
+      const searchInput = this.element.querySelector('stzh-input[slot="search"], [slot="search"] stzh-input');
+      if (searchInput) {
+        setPropsIfNull(searchInput, {
+          size: "small"
+        });
+      }
+      this.updateCellClasses();
+      this.updateScrollStates();
+    };
+    this.handleScroll = () => {
+      if (this.debounceScroll) {
+        window.cancelAnimationFrame(this.debounceScroll);
+      }
+      this.debounceScroll = requestAnimationFrame(this.updateScrollStates);
+    };
+  }
+  fixedCellWatcher() {
+    this.updateCellClasses();
+    this.updateScrollStates();
+  }
+  handleResize() {
+    this.updateScrollStates();
+  }
+  connectedCallback() {
+    this.init();
+    this.observer = new MutationObserver(this.init);
+    this.observer.observe(this.element, {
+      childList: true,
+      subtree: true
+    });
+  }
+  disconnectedCallback() {
+    this.observer.disconnect();
+  }
+  render() {
+    const classes = {
+      "stzh-table": true,
+      "is-scrollable": this.isScrollable,
+      "has-scroll-left": this.hasScrollLeft,
+      "has-scroll-right": this.hasScrollRight,
+      "has-scroll-left-shadow": this.hasScrollLeft && this.cellsStickyLeft.length === 0,
+      "has-scroll-right-shadow": this.hasScrollRight && this.cellsStickyRight.length === 0
+    };
+    return (h(Host, null, h("div", { class: classes }, h("div", { class: "stzh-table__header" }, h("div", { class: "stzh-table__heading" }, h("slot", { name: "heading" })), h("div", { class: "stzh-table__search" }, h("slot", { name: "search" }))), h("div", { class: "stzh-table__outer-wrapper" }, h("div", { ref: (el) => (this.tableWrapper = el), class: "stzh-table__wrapper", onScroll: this.handleScroll }, h("slot", null))))));
+  }
+  get element() { return this; }
+  static get watchers() { return {
+    "fixedLeft": ["fixedCellWatcher"],
+    "fixedRight": ["fixedCellWatcher"]
+  }; }
+  static get style() { return stzhTableCss; }
+}, [4, "stzh-table", {
+    "fixedLeft": [2, "fixed-left"],
+    "fixedRight": [2, "fixed-right"],
+    "hasScrollLeft": [32],
+    "hasScrollRight": [32],
+    "isScrollable": [32],
+    "cellsStickyLeft": [32],
+    "cellsStickyRight": [32]
+  }, [[9, "resize", "handleResize"]]]);
+function defineCustomElement$1() {
+  if (typeof customElements === "undefined") {
+    return;
+  }
+  const components = ["stzh-table"];
+  components.forEach(tagName => { switch (tagName) {
+    case "stzh-table":
+      if (!customElements.get(tagName)) {
+        customElements.define(tagName, StzhTable$1);
+      }
+      break;
+  } });
 }
 
 const StzhTable = StzhTable$1;

package/dist/components/stzh-text2.js

@@ -2,63 +2,63 @@ import { proxyCustomElement, HTMLElement, h, Host } from '@stencil/core/internal
 
 const stzhTextCss = ".sc-stzh-text-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-text-h{display:none}.sc-stzh-text-h *.sc-stzh-text,.sc-stzh-text-h *.sc-stzh-text::before,.sc-stzh-text-h *.sc-stzh-text::after{-webkit-box-sizing:border-box;box-sizing:border-box}.sc-stzh-text-h{width:100%;--color:var(--stzh-base-color);color:var(--color)}.sc-stzh-text-h .sc-stzh-text-s>*:first-child{margin-top:0}.sc-stzh-text-h .sc-stzh-text-s>*:last-child{margin-bottom:0}[lead].sc-stzh-text-h:not([lead=false]){--color:var(--stzh-base-lead-color)}.stzh-text.sc-stzh-text{font-size:var(--stzh-font-curve-p1-default-font-size, var(--stzh-font-milli-font-size));line-height:var(--stzh-font-curve-p1-default-text-line-height, var(--stzh-font-milli-text-line-height));letter-spacing:var(--stzh-font-curve-p1-default-text-letter-spacing);color:var(--color)}@media screen and (min-width: 1024px){.stzh-text.sc-stzh-text{font-size:var(--stzh-font-curve-p1-medium-font-size, var(--stzh-font-centi-font-size));line-height:var(--stzh-font-curve-p1-medium-text-line-height, var(--stzh-font-centi-text-line-height));letter-spacing:var(--stzh-font-curve-p1-medium-text-letter-spacing)}}.stzh-text--is-lead.sc-stzh-text{font-family:var(--stzh-font-family-light);font-weight:var(--stzh-font-weight-light);font-style:normal;font-size:var(--stzh-font-curve-h3-default-font-size, var(--stzh-font-centi-font-size));line-height:var(--stzh-font-curve-h3-default-text-line-height, var(--stzh-font-centi-text-line-height));letter-spacing:var(--stzh-font-curve-h3-default-text-letter-spacing);letter-spacing:0.0625rem}@media screen and (min-width: 600px){.stzh-text--is-lead.sc-stzh-text{font-size:var(--stzh-font-curve-h3-small-font-size, var(--stzh-font-deci-font-size));line-height:var(--stzh-font-curve-h3-small-text-line-height, var(--stzh-font-deci-text-line-height));letter-spacing:var(--stzh-font-curve-h3-small-text-letter-spacing)}}@media screen and (min-width: 1024px){.stzh-text--is-lead.sc-stzh-text{font-size:var(--stzh-font-curve-h3-medium-font-size, var(--stzh-font-regular-font-size));line-height:var(--stzh-font-curve-h3-medium-text-line-height, var(--stzh-font-regular-text-line-height));letter-spacing:var(--stzh-font-curve-h3-medium-text-letter-spacing)}}.stzh-text--font-light.sc-stzh-text{font-family:var(--stzh-font-family-light);font-weight:var(--stzh-font-weight-light);font-style:normal}.stzh-text--font-regular.sc-stzh-text{font-family:var(--stzh-font-family-regular);font-weight:var(--stzh-font-weight-regular);font-style:normal}.stzh-text--font-medium.sc-stzh-text{font-family:var(--stzh-font-family-medium);font-weight:var(--stzh-font-weight-medium);font-style:normal}.stzh-text--font-heavy.sc-stzh-text{font-family:var(--stzh-font-family-heavy);font-weight:var(--stzh-font-weight-heavy);font-style:normal}.stzh-text--font-title.sc-stzh-text{font-family:var(--stzh-font-family-title);font-weight:var(--stzh-font-weight-title)}.stzh-text--curve-caption.sc-stzh-text{font-size:var(--stzh-font-curve-caption-default-font-size, var(--stzh-font-nano-font-size));line-height:var(--stzh-font-curve-caption-default-text-line-height, var(--stzh-font-nano-text-line-height))}@media screen and (min-width: 1024px){.stzh-text--curve-caption.sc-stzh-text{font-size:var(--stzh-font-curve-caption-medium-font-size, var(--stzh-font-micro-font-size));line-height:var(--stzh-font-curve-caption-medium-text-line-height, var(--stzh-font-micro-text-line-height))}}.stzh-text--curve-p2.sc-stzh-text{font-size:var(--stzh-font-curve-p2-default-font-size, var(--stzh-font-micro-font-size));line-height:var(--stzh-font-curve-p2-default-text-line-height, var(--stzh-font-micro-text-line-height))}@media screen and (min-width: 1024px){.stzh-text--curve-p2.sc-stzh-text{font-size:var(--stzh-font-curve-p2-medium-font-size, var(--stzh-font-milli-font-size));line-height:var(--stzh-font-curve-p2-medium-text-line-height, var(--stzh-font-milli-text-line-height));letter-spacing:var(--stzh-font-curve-p2-medium-text-letter-spacing)}}.stzh-text--curve-p1.sc-stzh-text{font-size:var(--stzh-font-curve-p1-default-font-size, var(--stzh-font-milli-font-size));line-height:var(--stzh-font-curve-p1-default-text-line-height, var(--stzh-font-milli-text-line-height));letter-spacing:var(--stzh-font-curve-p1-default-text-letter-spacing)}@media screen and (min-width: 1024px){.stzh-text--curve-p1.sc-stzh-text{font-size:var(--stzh-font-curve-p1-medium-font-size, var(--stzh-font-centi-font-size));line-height:var(--stzh-font-curve-p1-medium-text-line-height, var(--stzh-font-centi-text-line-height));letter-spacing:var(--stzh-font-curve-p1-medium-text-letter-spacing)}}.stzh-text--curve-h4.sc-stzh-text{font-size:var(--stzh-font-curve-h4-default-font-size, var(--stzh-font-milli-font-size));line-height:var(--stzh-font-curve-h4-default-text-line-height, var(--stzh-font-milli-text-line-height));letter-spacing:var(--stzh-font-curve-h4-default-text-letter-spacing)}@media screen and (min-width: 1024px){.stzh-text--curve-h4.sc-stzh-text{font-size:var(--stzh-font-curve-h4-medium-font-size, var(--stzh-font-centi-font-size));line-height:var(--stzh-font-curve-h4-medium-text-line-height, var(--stzh-font-centi-text-line-height));letter-spacing:var(--stzh-font-curve-h4-medium-text-letter-spacing)}}.stzh-text--curve-h3.sc-stzh-text{font-size:var(--stzh-font-curve-h3-default-font-size, var(--stzh-font-centi-font-size));line-height:var(--stzh-font-curve-h3-default-text-line-height, var(--stzh-font-centi-text-line-height));letter-spacing:var(--stzh-font-curve-h3-default-text-letter-spacing)}@media screen and (min-width: 600px){.stzh-text--curve-h3.sc-stzh-text{font-size:var(--stzh-font-curve-h3-small-font-size, var(--stzh-font-deci-font-size));line-height:var(--stzh-font-curve-h3-small-text-line-height, var(--stzh-font-deci-text-line-height));letter-spacing:var(--stzh-font-curve-h3-small-text-letter-spacing)}}@media screen and (min-width: 1024px){.stzh-text--curve-h3.sc-stzh-text{font-size:var(--stzh-font-curve-h3-medium-font-size, var(--stzh-font-regular-font-size));line-height:var(--stzh-font-curve-h3-medium-text-line-height, var(--stzh-font-regular-text-line-height));letter-spacing:var(--stzh-font-curve-h3-medium-text-letter-spacing)}}.stzh-text--curve-h2.sc-stzh-text{font-size:var(--stzh-font-curve-h2-default-font-size, var(--stzh-font-deci-font-size));line-height:var(--stzh-font-curve-h2-default-text-line-height, var(--stzh-font-deci-text-line-height));letter-spacing:var(--stzh-font-curve-h2-default-text-letter-spacing)}@media screen and (min-width: 600px){.stzh-text--curve-h2.sc-stzh-text{font-size:var(--stzh-font-curve-h2-small-font-size, var(--stzh-font-deca-font-size));line-height:var(--stzh-font-curve-h2-small-text-line-height, var(--stzh-font-deca-text-line-height));letter-spacing:var(--stzh-font-curve-h2-small-text-letter-spacing, var(--stzh-font-deca-text-letter-spacing))}}@media screen and (min-width: 1024px){.stzh-text--curve-h2.sc-stzh-text{font-size:var(--stzh-font-curve-h2-medium-font-size, var(--stzh-font-hecto-font-size));line-height:var(--stzh-font-curve-h2-medium-text-line-height, var(--stzh-font-hecto-text-line-height));letter-spacing:var(--stzh-font-curve-h2-medium-text-letter-spacing, var(--stzh-font-hecto-text-letter-spacing))}}@media screen and (min-width: 1440px){.stzh-text--curve-h2.sc-stzh-text{font-size:var(--stzh-font-curve-h2-ultra-font-size, var(--stzh-font-kilo-font-size));line-height:var(--stzh-font-curve-h2-ultra-text-line-height, var(--stzh-font-kilo-text-line-height));letter-spacing:var(--stzh-font-curve-h2-ultra-text-letter-spacing, var(--stzh-font-kilo-text-letter-spacing))}}.stzh-text--curve-h1.sc-stzh-text{font-size:var(--stzh-font-curve-h1-default-font-size, var(--stzh-font-deca-font-size));line-height:var(--stzh-font-curve-h1-default-text-line-height, var(--stzh-font-deca-text-line-height));letter-spacing:var(--stzh-font-curve-h1-default-text-letter-spacing, var(--stzh-font-deca-text-letter-spacing))}@media screen and (min-width: 600px){.stzh-text--curve-h1.sc-stzh-text{font-size:var(--stzh-font-curve-h1-small-font-size, var(--stzh-font-kilo-font-size));line-height:var(--stzh-font-curve-h1-small-text-line-height, var(--stzh-font-kilo-text-line-height));letter-spacing:var(--stzh-font-curve-h1-small-text-letter-spacing, var(--stzh-font-kilo-text-letter-spacing))}}@media screen and (min-width: 1024px){.stzh-text--curve-h1.sc-stzh-text{font-size:var(--stzh-font-curve-h1-medium-font-size, var(--stzh-font-mega-font-size));line-height:var(--stzh-font-curve-h1-medium-text-line-height, var(--stzh-font-mega-text-line-height));letter-spacing:var(--stzh-font-curve-h1-medium-text-letter-spacing, var(--stzh-font-mega-text-letter-spacing))}}@media screen and (min-width: 1440px){.stzh-text--curve-h1.sc-stzh-text{font-size:var(--stzh-font-curve-h1-ultra-font-size, var(--stzh-font-giga-font-size));line-height:var(--stzh-font-curve-h1-ultra-text-line-height, var(--stzh-font-giga-text-line-height));letter-spacing:var(--stzh-font-curve-h1-ultra-text-letter-spacing, var(--stzh-font-giga-text-letter-spacing))}}.stzh-text--curve-hero.sc-stzh-text{font-size:var(--stzh-font-curve-hero-default-font-size, var(--stzh-font-hecto-font-size));line-height:var(--stzh-font-curve-hero-default-text-line-height, var(--stzh-font-hecto-text-line-height));letter-spacing:var(--stzh-font-curve-hero-default-text-letter-spacing, var(--stzh-font-hecto-text-letter-spacing))}@media screen and (min-width: 600px){.stzh-text--curve-hero.sc-stzh-text{font-size:var(--stzh-font-curve-hero-small-font-size, var(--stzh-font-kilo-font-size));line-height:var(--stzh-font-curve-hero-small-text-line-height, var(--stzh-font-kilo-text-line-height));letter-spacing:var(--stzh-font-curve-hero-small-text-letter-spacing, var(--stzh-font-kilo-text-letter-spacing))}}@media screen and (min-width: 1024px){.stzh-text--curve-hero.sc-stzh-text{font-size:var(--stzh-font-curve-hero-medium-font-size, var(--stzh-font-giga-font-size));line-height:var(--stzh-font-curve-hero-medium-text-line-height, var(--stzh-font-giga-text-line-height));letter-spacing:var(--stzh-font-curve-hero-medium-text-letter-spacing, var(--stzh-font-giga-text-letter-spacing))}}@media screen and (min-width: 1260px){.stzh-text--curve-hero.sc-stzh-text{font-size:var(--stzh-font-curve-hero-large-font-size, var(--stzh-font-hero-font-size));line-height:var(--stzh-font-curve-hero-large-text-line-height, var(--stzh-font-hero-text-line-height));letter-spacing:var(--stzh-font-curve-hero-large-text-letter-spacing, var(--stzh-font-hero-text-letter-spacing))}}.stzh-text--size-femto.sc-stzh-text{font-size:var(--stzh-font-femto-font-size);line-height:var(--stzh-font-femto-text-line-height);letter-spacing:var(--stzh-font-curve---text-letter-spacing)}.stzh-text--size-pico.sc-stzh-text{font-size:var(--stzh-font-pico-font-size);line-height:var(--stzh-font-pico-text-line-height)}.stzh-text--size-nano.sc-stzh-text{font-size:var(--stzh-font-nano-font-size);line-height:var(--stzh-font-nano-text-line-height)}.stzh-text--size-micro.sc-stzh-text{font-size:var(--stzh-font-micro-font-size);line-height:var(--stzh-font-micro-text-line-height)}.stzh-text--size-milli.sc-stzh-text{font-size:var(--stzh-font-milli-font-size);line-height:var(--stzh-font-milli-text-line-height);letter-spacing:var(--stzh-font-curve---text-letter-spacing)}.stzh-text--size-centi.sc-stzh-text{font-size:var(--stzh-font-centi-font-size);line-height:var(--stzh-font-centi-text-line-height);letter-spacing:var(--stzh-font-curve---text-letter-spacing)}.stzh-text--size-deci.sc-stzh-text{font-size:var(--stzh-font-deci-font-size);line-height:var(--stzh-font-deci-text-line-height);letter-spacing:var(--stzh-font-curve---text-letter-spacing)}.stzh-text--size-regular.sc-stzh-text{font-size:var(--stzh-font-regular-font-size);line-height:var(--stzh-font-regular-text-line-height);letter-spacing:var(--stzh-font-curve---text-letter-spacing)}.stzh-text--size-deca.sc-stzh-text{font-size:var(--stzh-font-deca-font-size);line-height:var(--stzh-font-deca-text-line-height);letter-spacing:var(--stzh-font-deca-text-letter-spacing)}.stzh-text--size-hecto.sc-stzh-text{font-size:var(--stzh-font-hecto-font-size);line-height:var(--stzh-font-hecto-text-line-height);letter-spacing:var(--stzh-font-hecto-text-letter-spacing)}.stzh-text--size-kilo.sc-stzh-text{font-size:var(--stzh-font-kilo-font-size);line-height:var(--stzh-font-kilo-text-line-height);letter-spacing:var(--stzh-font-kilo-text-letter-spacing)}.stzh-text--size-mega.sc-stzh-text{font-size:var(--stzh-font-mega-font-size);line-height:var(--stzh-font-mega-text-line-height);letter-spacing:var(--stzh-font-mega-text-letter-spacing)}.stzh-text--size-giga.sc-stzh-text{font-size:var(--stzh-font-giga-font-size);line-height:var(--stzh-font-giga-text-line-height);letter-spacing:var(--stzh-font-giga-text-letter-spacing)}.stzh-text--size-hero.sc-stzh-text{font-size:var(--stzh-font-hero-font-size);line-height:var(--stzh-font-hero-text-line-height);letter-spacing:var(--stzh-font-hero-text-letter-spacing)}@media screen and (min-width: 600px){.stzh-text--size-small-femto.sc-stzh-text{font-size:var(--stzh-font-femto-font-size);line-height:var(--stzh-font-femto-text-line-height);letter-spacing:var(--stzh-font-curve---text-letter-spacing)}}@media screen and (min-width: 600px){.stzh-text--size-small-pico.sc-stzh-text{font-size:var(--stzh-font-pico-font-size);line-height:var(--stzh-font-pico-text-line-height)}}@media screen and (min-width: 600px){.stzh-text--size-small-nano.sc-stzh-text{font-size:var(--stzh-font-nano-font-size);line-height:var(--stzh-font-nano-text-line-height)}}@media screen and (min-width: 600px){.stzh-text--size-small-micro.sc-stzh-text{font-size:var(--stzh-font-micro-font-size);line-height:var(--stzh-font-micro-text-line-height)}}@media screen and (min-width: 600px){.stzh-text--size-small-milli.sc-stzh-text{font-size:var(--stzh-font-milli-font-size);line-height:var(--stzh-font-milli-text-line-height);letter-spacing:var(--stzh-font-curve---text-letter-spacing)}}@media screen and (min-width: 600px){.stzh-text--size-small-centi.sc-stzh-text{font-size:var(--stzh-font-centi-font-size);line-height:var(--stzh-font-centi-text-line-height);letter-spacing:var(--stzh-font-curve---text-letter-spacing)}}@media screen and (min-width: 600px){.stzh-text--size-small-deci.sc-stzh-text{font-size:var(--stzh-font-deci-font-size);line-height:var(--stzh-font-deci-text-line-height);letter-spacing:var(--stzh-font-curve---text-letter-spacing)}}@media screen and (min-width: 600px){.stzh-text--size-small-regular.sc-stzh-text{font-size:var(--stzh-font-regular-font-size);line-height:var(--stzh-font-regular-text-line-height);letter-spacing:var(--stzh-font-curve---text-letter-spacing)}}@media screen and (min-width: 600px){.stzh-text--size-small-deca.sc-stzh-text{font-size:var(--stzh-font-deca-font-size);line-height:var(--stzh-font-deca-text-line-height);letter-spacing:var(--stzh-font-deca-text-letter-spacing)}}@media screen and (min-width: 600px){.stzh-text--size-small-hecto.sc-stzh-text{font-size:var(--stzh-font-hecto-font-size);line-height:var(--stzh-font-hecto-text-line-height);letter-spacing:var(--stzh-font-hecto-text-letter-spacing)}}@media screen and (min-width: 600px){.stzh-text--size-small-kilo.sc-stzh-text{font-size:var(--stzh-font-kilo-font-size);line-height:var(--stzh-font-kilo-text-line-height);letter-spacing:var(--stzh-font-kilo-text-letter-spacing)}}@media screen and (min-width: 600px){.stzh-text--size-small-mega.sc-stzh-text{font-size:var(--stzh-font-mega-font-size);line-height:var(--stzh-font-mega-text-line-height);letter-spacing:var(--stzh-font-mega-text-letter-spacing)}}@media screen and (min-width: 600px){.stzh-text--size-small-giga.sc-stzh-text{font-size:var(--stzh-font-giga-font-size);line-height:var(--stzh-font-giga-text-line-height);letter-spacing:var(--stzh-font-giga-text-letter-spacing)}}@media screen and (min-width: 600px){.stzh-text--size-small-hero.sc-stzh-text{font-size:var(--stzh-font-hero-font-size);line-height:var(--stzh-font-hero-text-line-height);letter-spacing:var(--stzh-font-hero-text-letter-spacing)}}@media screen and (min-width: 800px){.stzh-text--size-smallheader-femto.sc-stzh-text{font-size:var(--stzh-font-femto-font-size);line-height:var(--stzh-font-femto-text-line-height);letter-spacing:var(--stzh-font-curve---text-letter-spacing)}}@media screen and (min-width: 800px){.stzh-text--size-smallheader-pico.sc-stzh-text{font-size:var(--stzh-font-pico-font-size);line-height:var(--stzh-font-pico-text-line-height)}}@media screen and (min-width: 800px){.stzh-text--size-smallheader-nano.sc-stzh-text{font-size:var(--stzh-font-nano-font-size);line-height:var(--stzh-font-nano-text-line-height)}}@media screen and (min-width: 800px){.stzh-text--size-smallheader-micro.sc-stzh-text{font-size:var(--stzh-font-micro-font-size);line-height:var(--stzh-font-micro-text-line-height)}}@media screen and (min-width: 800px){.stzh-text--size-smallheader-milli.sc-stzh-text{font-size:var(--stzh-font-milli-font-size);line-height:var(--stzh-font-milli-text-line-height);letter-spacing:var(--stzh-font-curve---text-letter-spacing)}}@media screen and (min-width: 800px){.stzh-text--size-smallheader-centi.sc-stzh-text{font-size:var(--stzh-font-centi-font-size);line-height:var(--stzh-font-centi-text-line-height);letter-spacing:var(--stzh-font-curve---text-letter-spacing)}}@media screen and (min-width: 800px){.stzh-text--size-smallheader-deci.sc-stzh-text{font-size:var(--stzh-font-deci-font-size);line-height:var(--stzh-font-deci-text-line-height);letter-spacing:var(--stzh-font-curve---text-letter-spacing)}}@media screen and (min-width: 800px){.stzh-text--size-smallheader-regular.sc-stzh-text{font-size:var(--stzh-font-regular-font-size);line-height:var(--stzh-font-regular-text-line-height);letter-spacing:var(--stzh-font-curve---text-letter-spacing)}}@media screen and (min-width: 800px){.stzh-text--size-smallheader-deca.sc-stzh-text{font-size:var(--stzh-font-deca-font-size);line-height:var(--stzh-font-deca-text-line-height);letter-spacing:var(--stzh-font-deca-text-letter-spacing)}}@media screen and (min-width: 800px){.stzh-text--size-smallheader-hecto.sc-stzh-text{font-size:var(--stzh-font-hecto-font-size);line-height:var(--stzh-font-hecto-text-line-height);letter-spacing:var(--stzh-font-hecto-text-letter-spacing)}}@media screen and (min-width: 800px){.stzh-text--size-smallheader-kilo.sc-stzh-text{font-size:var(--stzh-font-kilo-font-size);line-height:var(--stzh-font-kilo-text-line-height);letter-spacing:var(--stzh-font-kilo-text-letter-spacing)}}@media screen and (min-width: 800px){.stzh-text--size-smallheader-mega.sc-stzh-text{font-size:var(--stzh-font-mega-font-size);line-height:var(--stzh-font-mega-text-line-height);letter-spacing:var(--stzh-font-mega-text-letter-spacing)}}@media screen and (min-width: 800px){.stzh-text--size-smallheader-giga.sc-stzh-text{font-size:var(--stzh-font-giga-font-size);line-height:var(--stzh-font-giga-text-line-height);letter-spacing:var(--stzh-font-giga-text-letter-spacing)}}@media screen and (min-width: 800px){.stzh-text--size-smallheader-hero.sc-stzh-text{font-size:var(--stzh-font-hero-font-size);line-height:var(--stzh-font-hero-text-line-height);letter-spacing:var(--stzh-font-hero-text-letter-spacing)}}@media screen and (min-width: 1024px){.stzh-text--size-medium-femto.sc-stzh-text{font-size:var(--stzh-font-femto-font-size);line-height:var(--stzh-font-femto-text-line-height);letter-spacing:var(--stzh-font-curve---text-letter-spacing)}}@media screen and (min-width: 1024px){.stzh-text--size-medium-pico.sc-stzh-text{font-size:var(--stzh-font-pico-font-size);line-height:var(--stzh-font-pico-text-line-height)}}@media screen and (min-width: 1024px){.stzh-text--size-medium-nano.sc-stzh-text{font-size:var(--stzh-font-nano-font-size);line-height:var(--stzh-font-nano-text-line-height)}}@media screen and (min-width: 1024px){.stzh-text--size-medium-micro.sc-stzh-text{font-size:var(--stzh-font-micro-font-size);line-height:var(--stzh-font-micro-text-line-height)}}@media screen and (min-width: 1024px){.stzh-text--size-medium-milli.sc-stzh-text{font-size:var(--stzh-font-milli-font-size);line-height:var(--stzh-font-milli-text-line-height);letter-spacing:var(--stzh-font-curve---text-letter-spacing)}}@media screen and (min-width: 1024px){.stzh-text--size-medium-centi.sc-stzh-text{font-size:var(--stzh-font-centi-font-size);line-height:var(--stzh-font-centi-text-line-height);letter-spacing:var(--stzh-font-curve---text-letter-spacing)}}@media screen and (min-width: 1024px){.stzh-text--size-medium-deci.sc-stzh-text{font-size:var(--stzh-font-deci-font-size);line-height:var(--stzh-font-deci-text-line-height);letter-spacing:var(--stzh-font-curve---text-letter-spacing)}}@media screen and (min-width: 1024px){.stzh-text--size-medium-regular.sc-stzh-text{font-size:var(--stzh-font-regular-font-size);line-height:var(--stzh-font-regular-text-line-height);letter-spacing:var(--stzh-font-curve---text-letter-spacing)}}@media screen and (min-width: 1024px){.stzh-text--size-medium-deca.sc-stzh-text{font-size:var(--stzh-font-deca-font-size);line-height:var(--stzh-font-deca-text-line-height);letter-spacing:var(--stzh-font-deca-text-letter-spacing)}}@media screen and (min-width: 1024px){.stzh-text--size-medium-hecto.sc-stzh-text{font-size:var(--stzh-font-hecto-font-size);line-height:var(--stzh-font-hecto-text-line-height);letter-spacing:var(--stzh-font-hecto-text-letter-spacing)}}@media screen and (min-width: 1024px){.stzh-text--size-medium-kilo.sc-stzh-text{font-size:var(--stzh-font-kilo-font-size);line-height:var(--stzh-font-kilo-text-line-height);letter-spacing:var(--stzh-font-kilo-text-letter-spacing)}}@media screen and (min-width: 1024px){.stzh-text--size-medium-mega.sc-stzh-text{font-size:var(--stzh-font-mega-font-size);line-height:var(--stzh-font-mega-text-line-height);letter-spacing:var(--stzh-font-mega-text-letter-spacing)}}@media screen and (min-width: 1024px){.stzh-text--size-medium-giga.sc-stzh-text{font-size:var(--stzh-font-giga-font-size);line-height:var(--stzh-font-giga-text-line-height);letter-spacing:var(--stzh-font-giga-text-letter-spacing)}}@media screen and (min-width: 1024px){.stzh-text--size-medium-hero.sc-stzh-text{font-size:var(--stzh-font-hero-font-size);line-height:var(--stzh-font-hero-text-line-height);letter-spacing:var(--stzh-font-hero-text-letter-spacing)}}@media screen and (min-width: 1260px){.stzh-text--size-large-femto.sc-stzh-text{font-size:var(--stzh-font-femto-font-size);line-height:var(--stzh-font-femto-text-line-height);letter-spacing:var(--stzh-font-curve---text-letter-spacing)}}@media screen and (min-width: 1260px){.stzh-text--size-large-pico.sc-stzh-text{font-size:var(--stzh-font-pico-font-size);line-height:var(--stzh-font-pico-text-line-height)}}@media screen and (min-width: 1260px){.stzh-text--size-large-nano.sc-stzh-text{font-size:var(--stzh-font-nano-font-size);line-height:var(--stzh-font-nano-text-line-height)}}@media screen and (min-width: 1260px){.stzh-text--size-large-micro.sc-stzh-text{font-size:var(--stzh-font-micro-font-size);line-height:var(--stzh-font-micro-text-line-height)}}@media screen and (min-width: 1260px){.stzh-text--size-large-milli.sc-stzh-text{font-size:var(--stzh-font-milli-font-size);line-height:var(--stzh-font-milli-text-line-height);letter-spacing:var(--stzh-font-curve---text-letter-spacing)}}@media screen and (min-width: 1260px){.stzh-text--size-large-centi.sc-stzh-text{font-size:var(--stzh-font-centi-font-size);line-height:var(--stzh-font-centi-text-line-height);letter-spacing:var(--stzh-font-curve---text-letter-spacing)}}@media screen and (min-width: 1260px){.stzh-text--size-large-deci.sc-stzh-text{font-size:var(--stzh-font-deci-font-size);line-height:var(--stzh-font-deci-text-line-height);letter-spacing:var(--stzh-font-curve---text-letter-spacing)}}@media screen and (min-width: 1260px){.stzh-text--size-large-regular.sc-stzh-text{font-size:var(--stzh-font-regular-font-size);line-height:var(--stzh-font-regular-text-line-height);letter-spacing:var(--stzh-font-curve---text-letter-spacing)}}@media screen and (min-width: 1260px){.stzh-text--size-large-deca.sc-stzh-text{font-size:var(--stzh-font-deca-font-size);line-height:var(--stzh-font-deca-text-line-height);letter-spacing:var(--stzh-font-deca-text-letter-spacing)}}@media screen and (min-width: 1260px){.stzh-text--size-large-hecto.sc-stzh-text{font-size:var(--stzh-font-hecto-font-size);line-height:var(--stzh-font-hecto-text-line-height);letter-spacing:var(--stzh-font-hecto-text-letter-spacing)}}@media screen and (min-width: 1260px){.stzh-text--size-large-kilo.sc-stzh-text{font-size:var(--stzh-font-kilo-font-size);line-height:var(--stzh-font-kilo-text-line-height);letter-spacing:var(--stzh-font-kilo-text-letter-spacing)}}@media screen and (min-width: 1260px){.stzh-text--size-large-mega.sc-stzh-text{font-size:var(--stzh-font-mega-font-size);line-height:var(--stzh-font-mega-text-line-height);letter-spacing:var(--stzh-font-mega-text-letter-spacing)}}@media screen and (min-width: 1260px){.stzh-text--size-large-giga.sc-stzh-text{font-size:var(--stzh-font-giga-font-size);line-height:var(--stzh-font-giga-text-line-height);letter-spacing:var(--stzh-font-giga-text-letter-spacing)}}@media screen and (min-width: 1260px){.stzh-text--size-large-hero.sc-stzh-text{font-size:var(--stzh-font-hero-font-size);line-height:var(--stzh-font-hero-text-line-height);letter-spacing:var(--stzh-font-hero-text-letter-spacing)}}@media screen and (min-width: 1440px){.stzh-text--size-ultra-femto.sc-stzh-text{font-size:var(--stzh-font-femto-font-size);line-height:var(--stzh-font-femto-text-line-height);letter-spacing:var(--stzh-font-curve---text-letter-spacing)}}@media screen and (min-width: 1440px){.stzh-text--size-ultra-pico.sc-stzh-text{font-size:var(--stzh-font-pico-font-size);line-height:var(--stzh-font-pico-text-line-height)}}@media screen and (min-width: 1440px){.stzh-text--size-ultra-nano.sc-stzh-text{font-size:var(--stzh-font-nano-font-size);line-height:var(--stzh-font-nano-text-line-height)}}@media screen and (min-width: 1440px){.stzh-text--size-ultra-micro.sc-stzh-text{font-size:var(--stzh-font-micro-font-size);line-height:var(--stzh-font-micro-text-line-height)}}@media screen and (min-width: 1440px){.stzh-text--size-ultra-milli.sc-stzh-text{font-size:var(--stzh-font-milli-font-size);line-height:var(--stzh-font-milli-text-line-height);letter-spacing:var(--stzh-font-curve---text-letter-spacing)}}@media screen and (min-width: 1440px){.stzh-text--size-ultra-centi.sc-stzh-text{font-size:var(--stzh-font-centi-font-size);line-height:var(--stzh-font-centi-text-line-height);letter-spacing:var(--stzh-font-curve---text-letter-spacing)}}@media screen and (min-width: 1440px){.stzh-text--size-ultra-deci.sc-stzh-text{font-size:var(--stzh-font-deci-font-size);line-height:var(--stzh-font-deci-text-line-height);letter-spacing:var(--stzh-font-curve---text-letter-spacing)}}@media screen and (min-width: 1440px){.stzh-text--size-ultra-regular.sc-stzh-text{font-size:var(--stzh-font-regular-font-size);line-height:var(--stzh-font-regular-text-line-height);letter-spacing:var(--stzh-font-curve---text-letter-spacing)}}@media screen and (min-width: 1440px){.stzh-text--size-ultra-deca.sc-stzh-text{font-size:var(--stzh-font-deca-font-size);line-height:var(--stzh-font-deca-text-line-height);letter-spacing:var(--stzh-font-deca-text-letter-spacing)}}@media screen and (min-width: 1440px){.stzh-text--size-ultra-hecto.sc-stzh-text{font-size:var(--stzh-font-hecto-font-size);line-height:var(--stzh-font-hecto-text-line-height);letter-spacing:var(--stzh-font-hecto-text-letter-spacing)}}@media screen and (min-width: 1440px){.stzh-text--size-ultra-kilo.sc-stzh-text{font-size:var(--stzh-font-kilo-font-size);line-height:var(--stzh-font-kilo-text-line-height);letter-spacing:var(--stzh-font-kilo-text-letter-spacing)}}@media screen and (min-width: 1440px){.stzh-text--size-ultra-mega.sc-stzh-text{font-size:var(--stzh-font-mega-font-size);line-height:var(--stzh-font-mega-text-line-height);letter-spacing:var(--stzh-font-mega-text-letter-spacing)}}@media screen and (min-width: 1440px){.stzh-text--size-ultra-giga.sc-stzh-text{font-size:var(--stzh-font-giga-font-size);line-height:var(--stzh-font-giga-text-line-height);letter-spacing:var(--stzh-font-giga-text-letter-spacing)}}@media screen and (min-width: 1440px){.stzh-text--size-ultra-hero.sc-stzh-text{font-size:var(--stzh-font-hero-font-size);line-height:var(--stzh-font-hero-text-line-height);letter-spacing:var(--stzh-font-hero-text-letter-spacing)}}";
 
-const StzhText = /*@__PURE__*/ proxyCustomElement(class extends HTMLElement {
-  constructor() {
-    super();
-    this.__registerHost();
-    /** Font used */
-    this.font = "default";
-    /** Type of curve */
-    this.curve = "default";
-    /** Whether if text is lead text */
-    this.lead = false;
-    /** Manually overwrite font size applied by curve attribute */
-    this.size = "inherit";
-    /** Manually overwrite font size applied by curve attribute above small breakpoint  */
-    this.sizeSmall = "inherit";
-    /** Manually overwrite font size applied by curve attribute above medium breakpoint  */
-    this.sizeMedium = "inherit";
-    /** Manually overwrite font size applied by curve attribute above large breakpoint  */
-    this.sizeLarge = "inherit";
-    /** Manually overwrite font size applied by curve attribute above ultra breakpoint  */
-    this.sizeUltra = "inherit";
-  }
-  render() {
-    return (h(Host, null, h("div", { class: {
-        "stzh-text": true,
-        "stzh-text--is-lead": this.lead,
-        [`stzh-text--font-${this.font}`]: !!this.font,
-        [`stzh-text--curve-${this.curve}`]: !!this.curve,
-        [`stzh-text--size-${this.size}`]: !!this.size,
-        [`stzh-text--size-small-${this.sizeSmall}`]: !!this.sizeSmall,
-        [`stzh-text--size-medium-${this.sizeMedium}`]: !!this.sizeMedium,
-        [`stzh-text--size-large-${this.sizeLarge}`]: !!this.sizeLarge,
-        [`stzh-text--size-ultra-${this.sizeUltra}`]: !!this.sizeUltra,
-      } }, h("slot", null))));
-  }
-  static get style() { return stzhTextCss; }
-}, [6, "stzh-text", {
-    "font": [1],
-    "curve": [513],
-    "lead": [516],
-    "size": [1],
-    "sizeSmall": [1, "size-small"],
-    "sizeMedium": [1, "size-medium"],
-    "sizeLarge": [1, "size-large"],
-    "sizeUltra": [1, "size-ultra"]
-  }]);
-function defineCustomElement() {
-  if (typeof customElements === "undefined") {
-    return;
-  }
-  const components = ["stzh-text"];
-  components.forEach(tagName => { switch (tagName) {
-    case "stzh-text":
-      if (!customElements.get(tagName)) {
-        customElements.define(tagName, StzhText);
-      }
-      break;
-  } });
+const StzhText = /*@__PURE__*/ proxyCustomElement(class extends HTMLElement {
+  constructor() {
+    super();
+    this.__registerHost();
+    /** Font used */
+    this.font = "default";
+    /** Type of curve */
+    this.curve = "default";
+    /** Whether if text is lead text */
+    this.lead = false;
+    /** Manually overwrite font size applied by curve attribute */
+    this.size = "inherit";
+    /** Manually overwrite font size applied by curve attribute above small breakpoint  */
+    this.sizeSmall = "inherit";
+    /** Manually overwrite font size applied by curve attribute above medium breakpoint  */
+    this.sizeMedium = "inherit";
+    /** Manually overwrite font size applied by curve attribute above large breakpoint  */
+    this.sizeLarge = "inherit";
+    /** Manually overwrite font size applied by curve attribute above ultra breakpoint  */
+    this.sizeUltra = "inherit";
+  }
+  render() {
+    return (h(Host, null, h("div", { class: {
+        "stzh-text": true,
+        "stzh-text--is-lead": this.lead,
+        [`stzh-text--font-${this.font}`]: !!this.font,
+        [`stzh-text--curve-${this.curve}`]: !!this.curve,
+        [`stzh-text--size-${this.size}`]: !!this.size,
+        [`stzh-text--size-small-${this.sizeSmall}`]: !!this.sizeSmall,
+        [`stzh-text--size-medium-${this.sizeMedium}`]: !!this.sizeMedium,
+        [`stzh-text--size-large-${this.sizeLarge}`]: !!this.sizeLarge,
+        [`stzh-text--size-ultra-${this.sizeUltra}`]: !!this.sizeUltra,
+      } }, h("slot", null))));
+  }
+  static get style() { return stzhTextCss; }
+}, [6, "stzh-text", {
+    "font": [1],
+    "curve": [513],
+    "lead": [516],
+    "size": [1],
+    "sizeSmall": [1, "size-small"],
+    "sizeMedium": [1, "size-medium"],
+    "sizeLarge": [1, "size-large"],
+    "sizeUltra": [1, "size-ultra"]
+  }]);
+function defineCustomElement() {
+  if (typeof customElements === "undefined") {
+    return;
+  }
+  const components = ["stzh-text"];
+  components.forEach(tagName => { switch (tagName) {
+    case "stzh-text":
+      if (!customElements.get(tagName)) {
+        customElements.define(tagName, StzhText);
+      }
+      break;
+  } });
 }
 
 export { StzhText as S, defineCustomElement as d };