@oiz/stzh-components 2.1.0 → 2.2.0-beta

package/dist/esm/stzh-card_3.entry.js

@@ -0,0 +1,468 @@
+import { r as registerInstance, c as createEvent, i as forceUpdate, h, F as Fragment, a as Host, g as getElement } from './index-011c84fe.js';
+import { s as setPropsIfNull, h as hasSlot, c as cloneElement } from './utils-92a77db5.js';
+import { m as media } from './media-utils-9b041ceb.js';
+import { f as fetchTranslations } from './translation-utils-2623783f.js';
+import { S as StzhInputDescription } from './stzh-input-description-bdd1e340.js';
+
+const stzhCardCss = ".sc-stzh-card-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-card-h{display:none}.sc-stzh-card-h *.sc-stzh-card,.sc-stzh-card-h *.sc-stzh-card::before,.sc-stzh-card-h *.sc-stzh-card::after{-webkit-box-sizing:border-box;box-sizing:border-box}.sc-stzh-card-h{--box-shadow:var(--stzh-box-shadow-popover);--border:0.0625rem solid var(--stzh-base-border-color);--border-radius:0.1875rem;--content-min-height:7.5rem;--dnd-visibility:hidden;--dnd-opacity:0;display:-ms-flexbox;display:flex;-ms-flex-direction:column;flex-direction:column;position:relative;border-radius:var(--border-radius)}[checked].sc-stzh-card-h:not([checked=false]){outline:0.1875rem solid var(--stzh-color-primary, var(--stzh-color-zueriblue))}.is-ghost.sc-stzh-card-h::after,.is-ghost .sc-stzh-card-h::after{border-radius:var(--border-radius)}[href].sc-stzh-card-h:hover,[href].sc-stzh-card-h:focus-within,.is-selected.sc-stzh-card-h,.is-chosen.sc-stzh-card-h,.is-selected .sc-stzh-card-h,.is-chosen .sc-stzh-card-h{--box-shadow:var(--stzh-box-shadow-overlay)}.is-ghost.sc-stzh-card-h,.is-ghost .sc-stzh-card-h{--box-shadow:none;--border:0.0625rem solid transparent;overflow:hidden}.is-drag.sc-stzh-card-h,.is-chosen.sc-stzh-card-h,.is-ghost.sc-stzh-card-h,.is-selected.sc-stzh-card-h,.is-drag .sc-stzh-card-h,.is-chosen .sc-stzh-card-h,.is-ghost .sc-stzh-card-h,.is-selected .sc-stzh-card-h{--dnd-visibility:visible;--dnd-opacity:1}.sc-stzh-card-h .sc-stzh-card-s>*{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)}.sc-stzh-card-h .sc-stzh-card-s>[slot=image]{width:100%;max-width:100%}.sc-stzh-card-h .sc-stzh-card-s>img[slot=image]{display:block}.sc-stzh-card-h .sc-stzh-card-s>[slot=meta]:not(:last-child){margin-right:var(--stzh-space-xsmall)}.sc-stzh-card-h .sc-stzh-card-s>table{border:0;border-spacing:0}.sc-stzh-card-h .sc-stzh-card-s>table th{font-family:var(--stzh-font-family-regular);font-weight:var(--stzh-font-weight-regular);font-style:normal}.sc-stzh-card-h .sc-stzh-card-s>table td,.sc-stzh-card-h .sc-stzh-card-s>table th{padding:0}.sc-stzh-card-h .sc-stzh-card-s>table td{color:var(--stzh-color-black);padding-left:var(--stzh-space-xsmall)}.sc-stzh-card-h .sc-stzh-card-s>[slot=heading],.stzh-card__title.sc-stzh-card{font-family:var(--stzh-font-family-heavy);font-weight:var(--stzh-font-weight-heavy);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-heading-line-height, var(--stzh-font-centi-heading-line-height));letter-spacing:var(--stzh-font-curve-h3-default-heading-letter-spacing)}@media screen and (min-width: 600px){.sc-stzh-card-h .sc-stzh-card-s>[slot=heading],.stzh-card__title.sc-stzh-card{font-size:var(--stzh-font-curve-h3-small-font-size, var(--stzh-font-deci-font-size));line-height:var(--stzh-font-curve-h3-small-heading-line-height, var(--stzh-font-deci-heading-line-height));letter-spacing:var(--stzh-font-curve-h3-small-heading-letter-spacing)}}@media screen and (min-width: 1024px){.sc-stzh-card-h .sc-stzh-card-s>[slot=heading],.stzh-card__title.sc-stzh-card{font-size:var(--stzh-font-curve-h3-medium-font-size, var(--stzh-font-regular-font-size));line-height:var(--stzh-font-curve-h3-medium-heading-line-height, var(--stzh-font-regular-heading-line-height));letter-spacing:var(--stzh-font-curve-h3-medium-heading-letter-spacing)}}.stzh-card.sc-stzh-card{-ms-flex-positive:1;flex-grow:1;display:-ms-flexbox;display:flex;-ms-flex-direction:column;flex-direction:column;background-color:var(--stzh-color-white);border-radius:var(--border-radius);-webkit-box-shadow:var(--box-shadow);box-shadow:var(--box-shadow);border:var(--border);-webkit-transition:-webkit-box-shadow var(--stzh-base-transition-animation-speed);transition:-webkit-box-shadow var(--stzh-base-transition-animation-speed);transition:box-shadow var(--stzh-base-transition-animation-speed);transition:box-shadow var(--stzh-base-transition-animation-speed), -webkit-box-shadow var(--stzh-base-transition-animation-speed)}@media screen and (max-width: 1023px){.stzh-card.sc-stzh-card .show-medium.sc-stzh-card{display:none}}@media screen and (min-width: 1024px){.stzh-card.sc-stzh-card .hide-medium.sc-stzh-card{display:none}}.stzh-card__content-wrapper.sc-stzh-card{position:relative;-ms-flex-positive:1;flex-grow:1;display:-ms-flexbox;display:flex;-ms-flex-direction:column;flex-direction:column;min-height:var(--content-min-height)}.stzh-card__dnd.sc-stzh-card{--size:var(--stzh-icon-size-xsmall);position:absolute;left:0.1875rem;top:1.4375rem;display:-ms-flexbox;display:flex;visibility:var(--dnd-visibility);opacity:var(--dnd-opacity);-webkit-transition:all var(--stzh-base-transition-animation-speed);transition:all var(--stzh-base-transition-animation-speed);display:none}@media screen and (min-width: 1024px){.stzh-card__dnd.sc-stzh-card{display:block}}@media screen and (min-width: 1260px){.stzh-card__dnd.sc-stzh-card{left:0.25rem;top:1.6875rem}}.stzh-card__header.sc-stzh-card{padding:var(--stzh-space-medium);border-bottom:0.0625rem solid var(--stzh-base-border-color)}@media screen and (min-width: 1024px){.stzh-card__header.sc-stzh-card{padding:var(--stzh-space-large)}}@media screen and (min-width: 1260px){.stzh-card__header.sc-stzh-card{padding:var(--stzh-space-xlarge)}}.stzh-card__header-top.sc-stzh-card{display:-ms-flexbox;display:flex;-ms-flex-pack:justify;justify-content:space-between;-ms-flex-align:start;align-items:flex-start}.stzh-card__header-meta.sc-stzh-card{display:-ms-flexbox;display:flex}.stzh-card__header-meta.sc-stzh-card:not(:empty){margin-top:var(--stzh-space-xsmall)}.stzh-card__header-left.sc-stzh-card,.stzh-card__header-right.sc-stzh-card{display:-ms-flexbox;display:flex}.stzh-card__header-right.sc-stzh-card{padding-left:var(--stzh-space-xsmall)}@media screen and (min-width: 1024px){.stzh-card__header-right.sc-stzh-card{padding-left:var(--stzh-space-small)}}@media screen and (min-width: 1260px){.stzh-card__header-right.sc-stzh-card{padding-left:var(--stzh-space-medium)}}.stzh-card__left.sc-stzh-card{-ms-flex-item-align:center;align-self:center}.stzh-card__title-area.sc-stzh-card{overflow-wrap:break-word;word-wrap:break-word;word-break:break-word;-webkit-hyphens:auto;-ms-hyphens:auto;hyphens:auto;overflow:hidden}.stzh-card__title.sc-stzh-card,.stzh-card__subtitle.sc-stzh-card{margin:0}.stzh-card__title-link.sc-stzh-card{color:inherit;text-decoration:none}.stzh-card__image-link.sc-stzh-card{display:block}.stzh-card__subtitle.sc-stzh-card{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);display:-ms-flexbox;display:flex;-ms-flex-align:center;align-items:center;-ms-flex-wrap:wrap;flex-wrap:wrap;text-decoration:none;margin-left:-0.5625em}@media screen and (min-width: 1024px){.stzh-card__subtitle.sc-stzh-card{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-card__subtitle-text.sc-stzh-card{position:relative;display:-ms-inline-flexbox;display:inline-flex;padding-left:0.5625em}.stzh-card__subtitle-text.sc-stzh-card::after{content:\",\";position:absolute;left:0}.stzh-card__content.sc-stzh-card{-ms-flex-positive:1;flex-grow:1}.stzh-card__content.sc-stzh-card:not(:empty){padding:var(--stzh-space-medium)}@media screen and (min-width: 1024px){.stzh-card__content.sc-stzh-card:not(:empty){padding:var(--stzh-space-large)}}@media screen and (min-width: 1260px){.stzh-card__content.sc-stzh-card:not(:empty){padding:var(--stzh-space-xlarge)}}.stzh-card__footer.sc-stzh-card:not(:empty){padding:var(--stzh-space-medium);border-top:0.0625rem solid var(--stzh-base-border-color)}@media screen and (min-width: 1024px){.stzh-card__footer.sc-stzh-card:not(:empty){padding:var(--stzh-space-large)}}@media screen and (min-width: 1260px){.stzh-card__footer.sc-stzh-card:not(:empty){padding:var(--stzh-space-xlarge)}}.stzh-card__card-actions.sc-stzh-card{display:-ms-inline-flexbox;display:inline-flex;white-space:nowrap}@media screen and (max-width: 1023px){.stzh-card__card-action.sc-stzh-card{--icon-text-margin:0;--badge-icon-text-margin:0}}.stzh-card__card-action[variant=tertiary].sc-stzh-card{--color:var(--stzh-color-grey70)}.stzh-card__card-action.is-button.sc-stzh-card{--icon-size:var(--stzh-icon-size-small)}.stzh-card__card-action.is-placeholder.sc-stzh-card{width:var(--stzh-space-xxlarge);height:var(--stzh-space-xxlarge)}.stzh-card__card-action-popover.sc-stzh-card{--width:auto}.stzh-card--has-link.sc-stzh-card .stzh-card__title-link.sc-stzh-card{color:var(--stzh-color-primary, var(--stzh-color-zueriblue));text-decoration:none;-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-card--has-link.sc-stzh-card .stzh-card__title-link.sc-stzh-card::before{-webkit-transition:all var(--stzh-base-transition-animation-speed);transition:all var(--stzh-base-transition-animation-speed)}.stzh-card--has-link.sc-stzh-card .stzh-card__title-link.sc-stzh-card::before,.stzh-card--has-link.sc-stzh-card .stzh-card__title-link.sc-stzh-card::after{content:\"\";display:block;position:absolute;top:0;left:0;width:100%;height:100%}.stzh-card--has-link.sc-stzh-card .stzh-card__image-link.sc-stzh-card:hover+.stzh-card__content-wrapper.sc-stzh-card .stzh-card__title-link.sc-stzh-card,.stzh-card--has-link.sc-stzh-card .stzh-card__title-link.sc-stzh-card:hover,.stzh-card--has-link.sc-stzh-card .stzh-card__title-link.sc-stzh-card:focus{color:var(--stzh-color-primary-hover, var(--stzh-color-zueribluedark))}.stzh-card--has-link.sc-stzh-card .stzh-card__image-link.sc-stzh-card:hover+.stzh-card__content-wrapper.sc-stzh-card .stzh-card__title-link.sc-stzh-card::before,.stzh-card--has-link.sc-stzh-card .stzh-card__title-link.sc-stzh-card:hover::before,.stzh-card--has-link.sc-stzh-card .stzh-card__title-link.sc-stzh-card:focus::before{background-color:var(--stzh-color-primary4)}.stzh-card--has-subtitle-interactive.sc-stzh-card .stzh-card__subtitle.sc-stzh-card{cursor:pointer;padding:0;-webkit-appearance:none;-moz-appearance:none;appearance:none;background:none;border:none;-webkit-transition:color var(--stzh-base-transition-animation-speed);transition:color var(--stzh-base-transition-animation-speed);color:var(--stzh-color-primary, var(--stzh-color-zueriblue))}.stzh-card--has-subtitle-interactive.sc-stzh-card .stzh-card__subtitle.sc-stzh-card:hover,.stzh-card--has-subtitle-interactive.sc-stzh-card .stzh-card__subtitle.sc-stzh-card:focus{color:var(--stzh-color-primary-hover, var(--stzh-color-zueribluedark))}.stzh-card--is-collapsed.sc-stzh-card .hide-when-collapsed.sc-stzh-card,.stzh-card--has-collapsed-header.sc-stzh-card .stzh-card__header.sc-stzh-card .hide-when-collapsed.sc-stzh-card{display:none}.stzh-card--is-collapsed.sc-stzh-card .show-when-collapsed.sc-stzh-card,.stzh-card--has-collapsed-header.sc-stzh-card .stzh-card__header.sc-stzh-card .show-when-collapsed.sc-stzh-card{display:block}.stzh-card--is-collapsed.sc-stzh-card .stzh-card__header.sc-stzh-card{border-bottom:none}.stzh-card--is-collapsed.sc-stzh-card .stzh-card__card-action.sc-stzh-card,.stzh-card--has-collapsed-header.sc-stzh-card .stzh-card__card-action.sc-stzh-card{--icon-text-margin:0;--badge-icon-text-margin:0}.stzh-card--is-starred.sc-stzh-card .stzh-card__card-action.is-star.sc-stzh-card{color:var(--stzh-color-primary, var(--stzh-color-zueriblue))}.stzh-card--is-starred.sc-stzh-card .stzh-card__card-action.is-star.sc-stzh-card:hover,.stzh-card--is-starred.sc-stzh-card .stzh-card__card-action.is-star.sc-stzh-card:focus{color:var(--stzh-color-primary-hover, var(--stzh-color-zueribluedark))}.stzh-card--has-hidden-header-border.sc-stzh-card .stzh-card__header.sc-stzh-card{border-bottom:none;padding-bottom:0}.stzh-card--has-hidden-footer-border.sc-stzh-card .stzh-card__footer.sc-stzh-card:not(:empty){padding-top:0;border-top:none}";
+
+const StzhCard = class {
+  constructor(hostRef) {
+    registerInstance(this, hostRef);
+    this.stzhClick = createEvent(this, "stzhClick", 7);
+    this.stzhCollapse = createEvent(this, "stzhCollapse", 7);
+    this.stzhSubtitleClick = createEvent(this, "stzhSubtitleClick", 7);
+    this.stzhStarClick = createEvent(this, "stzhStarClick", 7);
+    this.stzhHeaderActionClick = createEvent(this, "stzhHeaderActionClick", 7);
+    this._subtitles = [];
+    this.nodeChange = (entries) => {
+      let changeInSlot = false;
+      entries.forEach((entry) => {
+        if (entry.target.closest('[slot]') || entry.target.hasAttribute('slot')) {
+          changeInSlot = true;
+        }
+      });
+      if (changeInSlot) {
+        forceUpdate(this.element);
+      }
+    };
+    this.update = () => {
+      if (!this.mainElement) {
+        return;
+      }
+      this.mainElement.classList.remove("stzh-card--has-collapsed-header");
+      if (media('medium').matches) {
+        const headerWidth = this.headerElement.clientWidth;
+        const leftWidth = this.headerLeftElement.clientWidth;
+        const rightWidth = this.headerRightElement.clientWidth;
+        if (headerWidth - leftWidth <= rightWidth) {
+          this.mainElement.classList.add("stzh-card--has-collapsed-header");
+        }
+      }
+    };
+    this.headerClick = (event) => {
+      if (!this.collapsible) {
+        return;
+      }
+      const filterTags = ["stzh-popover", "stzh-tooltip", "button", "a", "input", "select", "textarea", "iframe", "details", "label", "area"];
+      const composedPathTags = event.composedPath().map(element => { var _a; return (_a = element.tagName) === null || _a === void 0 ? void 0 : _a.toLowerCase(); });
+      const found = composedPathTags.some(r => filterTags.includes(r));
+      if (!found) {
+        this.collapsed = !this.collapsed;
+        this.stzhCollapse.emit({
+          component: "stzh-card",
+          collapsed: this.collapsed
+        });
+      }
+    };
+    this.subtitleClick = () => {
+      if (this.subtitleInteractive) {
+        this.stzhSubtitleClick.emit({
+          component: "stzh-card"
+        });
+      }
+    };
+    this.starToggleClick = () => {
+      this.stzhStarClick.emit({
+        component: "stzh-card",
+        starred: this.starred
+      });
+    };
+    this.actionClick = (action) => {
+      this.stzhHeaderActionClick.emit({
+        component: "stzh-card",
+        action
+      });
+    };
+    this.arrowUpClick = () => {
+      const sortable = this.element.closest("stzh-sortable");
+      if (sortable) {
+        const element = this.findSortableChildElement();
+        sortable.moveItem(element, "up");
+      }
+    };
+    this.arrowDownClick = () => {
+      const sortable = this.element.closest("stzh-sortable");
+      if (sortable) {
+        const element = this.findSortableChildElement();
+        sortable.moveItem(element, "down");
+      }
+    };
+    this.updateElementInsideSortable = () => {
+      const currentSortable = this.element.closest("stzh-sortable");
+      // check if element is still inside sortable
+      if (!currentSortable) {
+        this.sortable.removeEventListener("stzhUpdate", this.updateElementInsideSortable);
+        this.sortable.removeEventListener("stzhDisable", this.updateElementInsideSortable);
+        return;
+      }
+      if (this.element) {
+        forceUpdate(this.element);
+      }
+    };
+    this.init = () => {
+      const chips = this.element.querySelectorAll('stzh-chip[slot="meta"], [slot="meta"] stzh-chip');
+      chips.forEach((chip) => {
+        setPropsIfNull(chip, {
+          size: "small"
+        });
+      });
+    };
+    this.handleMutation = (entries) => {
+      this.init();
+      this.nodeChange(entries);
+    };
+    this.handleSelectionChange = (event) => {
+      this.checked = event.detail.checked;
+    };
+    this.cardClick = (originalEvent) => {
+      this.stzhClick.emit({
+        component: "stzh-card",
+        originalEvent
+      });
+    };
+    this.localization = undefined;
+    this.collapsed = false;
+    this.starred = false;
+    this.starrable = false;
+    this.selectable = false;
+    this.checked = false;
+    this.name = "";
+    this.href = undefined;
+    this.target = undefined;
+    this.value = "";
+    this.disabled = false;
+    this.heading = "";
+    this.subtitle = "";
+    this.headerActions = [];
+    this.footerActions = [];
+    this.subtitleInteractive = false;
+    this.sortableDisabled = false;
+    this.collapsible = false;
+    this.hideHeaderBorder = false;
+    this.hideFooterBorder = false;
+    this.hideMovementActions = false;
+  }
+  handleResize() {
+    if (this.debounceResize) {
+      window.cancelAnimationFrame(this.debounceResize);
+    }
+    this.debounceResize = requestAnimationFrame(this.update);
+  }
+  subtitleWatcher(newValue) {
+    if (typeof newValue === "string") {
+      try {
+        this._subtitles = JSON.parse(newValue);
+      }
+      catch (err) {
+        this._subtitles = [newValue];
+      }
+    }
+    else {
+      this._subtitles = newValue;
+    }
+  }
+  headerActionsWatcher(newValue) {
+    if (typeof newValue === "string") {
+      this._headerActions = JSON.parse(newValue);
+    }
+    else {
+      this._headerActions = newValue;
+    }
+  }
+  footerActionsWatcher(newValue) {
+    if (typeof newValue === "string") {
+      this._footerActions = JSON.parse(newValue);
+    }
+    else {
+      this._footerActions = newValue;
+    }
+  }
+  collapsedWatcher() {
+    this.handleResize();
+  }
+  findSortableChildElement() {
+    const sortable = this.element.closest("stzh-sortable");
+    if (sortable) {
+      let element = this.element;
+      let sortableContainer = null;
+      if (typeof sortable.container === "function") {
+        sortableContainer = sortable.container();
+      }
+      else {
+        sortableContainer = sortable.container;
+      }
+      while (element.parentElement && element.parentElement !== sortableContainer) {
+        element = element.parentElement;
+      }
+      return element;
+    }
+  }
+  async componentWillLoad() {
+    this.subtitleWatcher(this.subtitle);
+    this.headerActionsWatcher(this.headerActions);
+    this.footerActionsWatcher(this.footerActions);
+    if (!this.localization) {
+      this.localization = await fetchTranslations(this.element, "card");
+    }
+  }
+  componentDidLoad() {
+    this.sortable = this.element.closest("stzh-sortable");
+    if (this.sortable) {
+      this.sortable.addEventListener("stzhUpdate", this.updateElementInsideSortable);
+      this.sortable.addEventListener("stzhDisable", this.updateElementInsideSortable);
+    }
+  }
+  connectedCallback() {
+    this.init();
+    this.observer = new MutationObserver(this.handleMutation);
+    this.observer.observe(this.element, {
+      childList: true,
+      subtree: true
+    });
+  }
+  disconnectedCallback() {
+    this.observer.disconnect();
+  }
+  render() {
+    var _a, _b, _c;
+    const imageUsed = hasSlot(this.element, "image");
+    const contentUsed = hasSlot(this.element, "content");
+    const classes = {
+      "stzh-card": true,
+      "stzh-card--has-link": !!this.href,
+      "stzh-card--has-image": imageUsed,
+      "stzh-card--has-content": contentUsed,
+      "stzh-card--has-subtitle": !!this.subtitle,
+      "stzh-card--has-subtitle-interactive": !!this.subtitle && this.subtitleInteractive,
+      "stzh-card--has-hidden-header-border": this.hideHeaderBorder,
+      "stzh-card--has-hidden-footer-border": this.hideFooterBorder,
+      "stzh-card--is-collapsed": this.collapsed,
+      "stzh-card--is-starred": this.starred,
+      "stzh-card--is-checked": this.checked
+    };
+    const Subtitle = `${this.subtitleInteractive ? 'button' : 'span'}`;
+    const sortableChildElement = this.findSortableChildElement();
+    const isFirstItemInSortable = (sortableChildElement === null || sortableChildElement === void 0 ? void 0 : sortableChildElement.parentElement)
+      && Array.from((_a = sortableChildElement === null || sortableChildElement === void 0 ? void 0 : sortableChildElement.parentElement) === null || _a === void 0 ? void 0 : _a.children)
+        .indexOf(sortableChildElement) === 0;
+    const isLastItemInSortable = (sortableChildElement === null || sortableChildElement === void 0 ? void 0 : sortableChildElement.parentElement)
+      && Array.from((_b = sortableChildElement === null || sortableChildElement === void 0 ? void 0 : sortableChildElement.parentElement) === null || _b === void 0 ? void 0 : _b.children)
+        .indexOf(sortableChildElement) === ((_c = sortableChildElement === null || sortableChildElement === void 0 ? void 0 : sortableChildElement.parentElement) === null || _c === void 0 ? void 0 : _c.children.length) - 1;
+    const sortableActionsEnabled = !this.sortableDisabled
+      && !this.hideMovementActions
+      && this.sortable
+      && !this.sortable.disabled;
+    const nonCollapsingTextHeaderActions = this._headerActions.filter(action => !action.onlyCollapseText);
+    // const headerActions = [
+    //   ...this._headerActions
+    // ];
+    return (h(Host, { role: "listitem", "aria-label": this.heading }, h("article", { ref: (el) => (this.mainElement = el), class: classes }, h("a", { "aria-hidden": "true", tabindex: "-1", class: "stzh-card__image-link", href: this.href, target: this.target, onClick: this.href ? this.cardClick : null }, h("slot", { name: "image" })), h("div", { class: "stzh-card__content-wrapper" }, h("stzh-icon", { class: "stzh-card__dnd", name: "drag" }), h("header", { ref: (el) => (this.headerElement = el), class: "stzh-card__header", onClick: this.headerClick }, h("div", { class: "stzh-card__header-top" }, h("div", { ref: (el) => (this.headerLeftElement = el), class: "stzh-card__header-left" }, h("div", { class: "stzh-card__title-area" }, h("h3", { class: "stzh-card__title" }, h("a", { class: "stzh-card__title-link", href: this.href, target: this.target, onClick: this.href ? this.cardClick : null }, this.heading ? this.heading : h("slot", { name: "heading" }))), this._subtitles.length > 0 &&
+      h(Subtitle, { class: "stzh-card__subtitle", onClick: this.subtitleClick }, this._subtitles.map(subtitle => (h("span", { class: "stzh-card__subtitle-text" }, subtitle)))))), h("div", { ref: (el) => (this.headerRightElement = el), class: "stzh-card__header-right" }, h("div", { class: "stzh-card__card-actions" }, this._headerActions.map(action => (h("stzh-button", { class: {
+        "stzh-card__card-action": true,
+        "is-button": true,
+        "show-medium": !action.onlyCollapseText,
+        "hide-when-collapsed": !action.onlyCollapseText,
+        "hide-text-when-collapsed": action.onlyCollapseText
+      }, icon: action.icon, badge: action.badge, badgeEmpty: action.badgeEmpty, badgeType: action.badgeType, variant: "tertiary", size: "tiny", badgePosition: "icon", onClick: () => { this.actionClick(action); } }, h("span", { class: {
+        "show-medium": action.onlyCollapseText,
+        "hide-when-collapsed": action.onlyCollapseText
+      } }, action.label)))), this.starrable &&
+      h("stzh-tooltip", null, h("stzh-button", { class: "stzh-card__card-action is-star", icon: this.starred ? "star-filled" : "star", variant: "tertiary", size: "tiny", iconOnly: true, onClick: this.starToggleClick }), h("div", { slot: "content" }, this.starred ? this.localization.actionRemove : this.localization.actionAdd)), (nonCollapsingTextHeaderActions.length > 0 || this.starrable || sortableActionsEnabled) &&
+      h("stzh-popover", { label: this.localization.actionsPopoverLabel, placement: "bottom-end", class: {
+          "stzh-card__card-action-popover": true,
+          "hide-medium show-when-collapsed": !this.starrable && !sortableActionsEnabled
+        } }, h("stzh-button", { class: "stzh-card__card-action is-further", variant: "tertiary", size: "tiny", icon: "more-vertical", iconOnly: true }), h("stzh-menu", { slot: "content" }, this.starrable &&
+        h("stzh-menu-item", { icon: this.starred ? "star-filled" : "star", onClick: this.starToggleClick }, this.starred ? this.localization.actionRemove : this.localization.actionAdd), nonCollapsingTextHeaderActions.map(action => (h("stzh-menu-item", { class: "hide-medium show-when-collapsed", icon: action.icon, badge: action.badge, badgeEmpty: action.badgeEmpty, badgeType: action.badgeType, onClick: () => { this.actionClick(action); } }, action.label))), sortableActionsEnabled &&
+        h(Fragment, null, !isFirstItemInSortable &&
+          h("stzh-menu-item", { icon: "arrow-up", onClick: this.arrowUpClick }, this.localization.actionMoveUp), !isLastItemInSortable &&
+          h("stzh-menu-item", { icon: "arrow-down", onClick: this.arrowDownClick }, this.localization.actionMoveDown))))))), h("div", { class: "stzh-card__header-meta" }, h("slot", { name: "meta" }))), h("div", { class: "stzh-card__content hide-when-collapsed" }, h("slot", { name: "content" })), h("div", { class: "stzh-card__footer hide-when-collapsed" }, this._footerActions.length > 0 &&
+      h("stzh-actionset", { actions: this._footerActions }), this.selectable &&
+      h("stzh-button", { fullwidth: true, type: "radio", variant: "secondary", name: this.name, value: this.value, checked: this.checked, disabled: this.disabled, label: this.localization.select, onStzhChange: this.handleSelectionChange }))))));
+  }
+  get element() { return getElement(this); }
+  static get watchers() { return {
+    "subtitle": ["subtitleWatcher"],
+    "headerActions": ["headerActionsWatcher"],
+    "footerActions": ["footerActionsWatcher"],
+    "collapsed": ["collapsedWatcher"]
+  }; }
+};
+StzhCard.style = stzhCardCss;
+
+const stzhCardListCss = ".sc-stzh-card-list-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-card-list-h{display:none}.sc-stzh-card-list-h *.sc-stzh-card-list,.sc-stzh-card-list-h *.sc-stzh-card-list::before,.sc-stzh-card-list-h *.sc-stzh-card-list::after{-webkit-box-sizing:border-box;box-sizing:border-box}.sc-stzh-card-list-h[layout=fullwidth] .sc-stzh-card-list-s>*:not(:last-child):not([slot]){margin-bottom:var(--stzh-space-medium)}@media screen and (min-width: 1024px){.sc-stzh-card-list-h[layout=fullwidth] .sc-stzh-card-list-s>*:not(:last-child):not([slot]){margin-bottom:var(--stzh-space-large)}}@media screen and (min-width: 1260px){.sc-stzh-card-list-h[layout=fullwidth] .sc-stzh-card-list-s>*:not(:last-child):not([slot]){margin-bottom:var(--stzh-space-xlarge)}}.sc-stzh-card-list-h[layout=subpages] .sc-stzh-card-list-s>*:not([slot]){width:100%;margin:calc(var(--stzh-grid-gutter) / 2)}@media screen and (min-width: 600px){.sc-stzh-card-list-h[layout=subpages] .sc-stzh-card-list-s>*:not([slot]){width:calc(50% - var(--stzh-grid-gutter-small));margin:calc(var(--stzh-grid-gutter-small) / 2)}}@media screen and (min-width: 1024px){.sc-stzh-card-list-h[layout=subpages] .sc-stzh-card-list-s>*:not([slot]){width:calc(33.333% - var(--stzh-grid-gutter-medium));margin:calc(var(--stzh-grid-gutter-medium) / 2)}}.sc-stzh-card-list-h .sc-stzh-card-list-s>[slot=description] stzh-icon{color:var(--stzh-color-primary, var(--stzh-color-zueriblue))}.sc-stzh-card-list-h .sc-stzh-card-list-s>stzh-text[slot=description]{--color:inherit}.stzh-card-list__cards.sc-stzh-card-list{display:-ms-flexbox;display:flex;-ms-flex-direction:column;flex-direction:column}.stzh-card-list__header.sc-stzh-card-list{display:-ms-flexbox;display:flex;-ms-flex-pack:justify;justify-content:space-between;-ms-flex-direction:column;flex-direction:column;-ms-flex-align:start;align-items:flex-start}@media screen and (min-width: 800px){.stzh-card-list__header.sc-stzh-card-list{-ms-flex-direction:row;flex-direction:row}}.stzh-card-list__description.sc-stzh-card-list{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(--stzh-base-lead-color)}@media screen and (min-width: 1024px){.stzh-card-list__description.sc-stzh-card-list{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-card-list__description.sc-stzh-card-list:not(:empty){margin-bottom:var(--stzh-space-xsmall)}@media screen and (min-width: 800px){.stzh-card-list__description.sc-stzh-card-list:not(:empty){margin-bottom:0}}.stzh-card-list__switch.sc-stzh-card-list{--color:var(--stzh-base-lead-color);-ms-flex-item-align:end;align-self:end}.stzh-card-list--has-header.sc-stzh-card-list .stzh-card-list__header.sc-stzh-card-list{margin-bottom:var(--stzh-space-medium)}@media screen and (min-width: 1024px){.stzh-card-list--has-header.sc-stzh-card-list .stzh-card-list__header.sc-stzh-card-list{margin-bottom:var(--stzh-space-large)}}@media screen and (min-width: 1260px){.stzh-card-list--has-header.sc-stzh-card-list .stzh-card-list__header.sc-stzh-card-list{margin-bottom:var(--stzh-space-xlarge)}}.stzh-card-list--layout-subpages.sc-stzh-card-list .stzh-card-list__cards.sc-stzh-card-list{-ms-flex-direction:row;flex-direction:row;-ms-flex-wrap:wrap;flex-wrap:wrap;margin:calc(var(--stzh-grid-gutter) / -2)}@media screen and (min-width: 600px){.stzh-card-list--layout-subpages.sc-stzh-card-list .stzh-card-list__cards.sc-stzh-card-list{margin:calc(var(--stzh-grid-gutter-small) / -2)}}@media screen and (min-width: 1024px){.stzh-card-list--layout-subpages.sc-stzh-card-list .stzh-card-list__cards.sc-stzh-card-list{margin:calc(var(--stzh-grid-gutter-medium) / -2)}}";
+
+const StzhCardList = class {
+  constructor(hostRef) {
+    registerInstance(this, hostRef);
+    this.stzhCollapseAll = createEvent(this, "stzhCollapseAll", 7);
+    this.collapseClick = () => {
+      const cards = Array.from(this.element.querySelectorAll("stzh-card"));
+      cards.forEach(card => {
+        if (card.collapsible) {
+          card.collapsed = !this.allCollapsed;
+        }
+      });
+      this.allCollapsed = !this.allCollapsed;
+      this.stzhCollapseAll.emit({
+        component: "stzh-card-list",
+        allCollapsed: this.allCollapsed
+      });
+    };
+    this.updateCollapsedState = () => {
+      const cards = Array.from(this.element.querySelectorAll("stzh-card"));
+      this.allCollapsed = !cards.some(card => !card.collapsed);
+    };
+    this.sortableGhostClone = (dragElement) => {
+      const [clonedElement, clonedStzhElement, originalStzhElement] = cloneElement(dragElement);
+      if (clonedStzhElement
+        && originalStzhElement
+        && clonedStzhElement.tagName.toLowerCase() === "stzh-card") {
+        const clonedStzhElementCard = clonedStzhElement;
+        const originalStzhElementCard = originalStzhElement;
+        // copy every property that is not reflected to its attribute
+        clonedStzhElementCard.heading = originalStzhElementCard.heading;
+        clonedStzhElementCard.subtitle = originalStzhElementCard.subtitle;
+        clonedStzhElementCard.headerActions = originalStzhElementCard.headerActions;
+        clonedStzhElementCard.footerActions = originalStzhElementCard.footerActions;
+        clonedStzhElementCard.hideMovementActions = originalStzhElementCard.hideMovementActions;
+      }
+      return clonedElement;
+    };
+    this.localization = undefined;
+    this.layout = "fullwidth";
+    this.description = undefined;
+    this.showToggleLink = false;
+    this.sortableEnabled = false;
+    this.sortableDataIdAttribute = "data-id";
+    this.allCollapsed = false;
+  }
+  collapseListener() {
+    this.updateCollapsedState();
+  }
+  async componentWillLoad() {
+    if (!this.localization) {
+      this.localization = await fetchTranslations(this.element, "card-list");
+    }
+  }
+  componentDidLoad() {
+    this.updateCollapsedState();
+  }
+  render() {
+    const descriptionSlotUsed = hasSlot(this.element, "description") || !!this.description;
+    const classes = {
+      "stzh-card-list": true,
+      "stzh-card-list--has-header": this.showToggleLink || descriptionSlotUsed,
+      [`stzh-card-list--layout-${this.layout}`]: !!this.layout
+    };
+    return (h(Host, null, h("div", { class: classes }, h("div", { class: "stzh-card-list__header" }, h("div", { class: "stzh-card-list__description" }, this.description ? this.description : h("slot", { name: "description" })), this.showToggleLink &&
+      h("stzh-link", { class: "stzh-card-list__switch", icon: this.allCollapsed ? "list-expanded" : "list-shrinked", label: this.allCollapsed ? this.localization.expandAll : this.localization.collapseAll, onClick: this.collapseClick })), h("stzh-sortable", { disabled: !this.sortableEnabled, dataIdAttribute: this.sortableDataIdAttribute, ghostClone: this.sortableGhostClone }, h("div", { class: "stzh-card-list__cards", role: "list" }, h("slot", null))))));
+  }
+  get element() { return getElement(this); }
+};
+StzhCardList.style = stzhCardListCss;
+
+const stzhChipSelectCss = ".sc-stzh-chip-select-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-chip-select-h{display:none}.sc-stzh-chip-select-h *.sc-stzh-chip-select,.sc-stzh-chip-select-h *.sc-stzh-chip-select::before,.sc-stzh-chip-select-h *.sc-stzh-chip-select::after{-webkit-box-sizing:border-box;box-sizing:border-box}.stzh-chip-select__marker-symbol.sc-stzh-chip-select{font-family:var(--stzh-font-family-regular);font-weight:var(--stzh-font-weight-regular);font-style:normal}.stzh-chip-select__marker-text.sc-stzh-chip-select{border:0;clip:rect(0 0 0 0);-webkit-clip-path:inset(100%);clip-path:inset(100%);width:0.0625rem;height:0.0625rem;overflow:hidden;padding:0;position:absolute}.stzh-chip-select__description-wrapper.sc-stzh-chip-select{display:-ms-flexbox;display:flex;-ms-flex-direction:column-reverse;flex-direction:column-reverse}.stzh-chip-select__error.sc-stzh-chip-select,.stzh-chip-select__description.sc-stzh-chip-select{font-size:var(--stzh-font-micro-font-size);line-height:var(--stzh-font-micro-text-line-height);color:var(--stzh-base-color)}.stzh-chip-select__error.sc-stzh-chip-select{color:var(--stzh-color-error)}.stzh-chip-select__error-list.sc-stzh-chip-select{list-style:none;margin:0;padding:0}.stzh-chip-select__description.sc-stzh-chip-select{display:-ms-flexbox;display:flex;-ms-flex-align:start;align-items:flex-start}.stzh-chip-select__description-long.sc-stzh-chip-select{margin-left:var(--stzh-space-xxsmall);margin-top:0.1875rem}.stzh-chip-select__description-long-popover.sc-stzh-chip-select{--width:auto;--max-width:27.3125rem}.stzh-chip-select__description-long-popover[open].sc-stzh-chip-select:not([open=false]) .stzh-chip-select__description-long-button.sc-stzh-chip-select{color:var(--stzh-color-primary, var(--stzh-color-zueriblue))}.stzh-chip-select__description-long-button.sc-stzh-chip-select{display:-ms-flexbox;display:flex;-ms-flex-pack:center;justify-content:center;-ms-flex-align:center;align-items:center;-webkit-appearance:none;-moz-appearance:none;appearance:none;padding:0;border:none;background-color:transparent;border-radius:0.5rem;cursor:pointer;-webkit-transition:color var(--stzh-base-transition-animation-speed);transition:color var(--stzh-base-transition-animation-speed);color:var(--stzh-base-lead-color)}.stzh-chip-select__description-long-button.sc-stzh-chip-select:hover{color:var(--stzh-color-primary, var(--stzh-color-zueriblue))}.stzh-chip-select.sc-stzh-chip-select stzh-icon.stzh-chip-select__description-long-icon.sc-stzh-chip-select{--size:var(--stzh-icon-size-xsmall)}.stzh-chip-select--has-error.sc-stzh-chip-select .stzh-chip-select__error.sc-stzh-chip-select,.stzh-chip-select--has-description.sc-stzh-chip-select .stzh-chip-select__description.sc-stzh-chip-select{margin-top:var(--stzh-space-xxsmall)}.stzh-chip-select__chips.sc-stzh-chip-select{display:-ms-flexbox;display:flex;-ms-flex-align:center;align-items:center;-ms-flex-wrap:wrap;flex-wrap:wrap;margin:calc(var(--stzh-space-small) / -2) calc(var(--stzh-space-xsmall) / -2)}@media screen and (max-width: 1023px){.stzh-chip-select__chips.sc-stzh-chip-select{display:none}}.stzh-chip-select__chip.sc-stzh-chip-select{margin:calc(var(--stzh-space-small) / 2) calc(var(--stzh-space-xsmall) / 2)}@media screen and (min-width: 1024px){.stzh-chip-select__dropdown.sc-stzh-chip-select{display:none}}@media screen and (max-width: 1023px){.stzh-chip-select__description-wrapper.sc-stzh-chip-select{display:none}}.stzh-chip-select--has-error.sc-stzh-chip-select .stzh-chip-select__error.sc-stzh-chip-select,.stzh-chip-select--has-description.sc-stzh-chip-select .stzh-chip-select__description.sc-stzh-chip-select{margin-top:var(--stzh-space-xsmall)}";
+
+let chipSelectCounter = 0;
+const StzhChipSelect = class {
+  constructor(hostRef) {
+    registerInstance(this, hostRef);
+    this.stzhChange = createEvent(this, "stzhChange", 7);
+    this._data = [];
+    this._dataDropdown = [];
+    this.chipClick = (data) => {
+      this.value = data.value;
+      this.stzhChange.emit({
+        component: "stzh-chip-select",
+        value: this.value
+      });
+    };
+    this.onDropdownChange = (event) => {
+      this.value = event.detail.value;
+      this.stzhChange.emit({
+        component: "stzh-chip-select",
+        value: this.value
+      });
+    };
+    this.localization = undefined;
+    this.data = [];
+    this.name = undefined;
+    this.label = "";
+    this.value = "";
+    this.description = undefined;
+    this.descriptionLong = undefined;
+    this.error = undefined;
+    this.invalid = false;
+    this.required = false;
+    this.disabled = false;
+    this.a11yDescribedby = "";
+  }
+  dataWatcher(newValue) {
+    if (typeof newValue === "string") {
+      this._data = JSON.parse(newValue);
+    }
+    else {
+      this._data = newValue;
+    }
+    this._dataDropdown = this._data.map((data) => {
+      return {
+        text: `${data.label} (${data.counter})`,
+        value: data.value
+      };
+    });
+  }
+  errorWatcher(newValue) {
+    if (typeof newValue === "string") {
+      try {
+        this._error = JSON.parse(newValue);
+      }
+      catch (e) {
+        if (newValue) {
+          this._error = [newValue];
+        }
+        else {
+          this._error = [];
+        }
+      }
+    }
+    else if (newValue) {
+      this._error = newValue;
+    }
+    else {
+      this._error = [];
+    }
+    this.invalid = this._error.length > 0;
+  }
+  async componentWillLoad() {
+    this.inputId = `stzh-chip-select-${chipSelectCounter++}`;
+    this.dataWatcher(this.data);
+    this.errorWatcher(this.error);
+    if (!this.localization) {
+      this.localization = await fetchTranslations(this.element, "chip-select");
+    }
+  }
+  render() {
+    const descriptionUsed = !!this.description;
+    const descriptionLongUsed = !!this.descriptionLong;
+    const errorUsed = !!this.error;
+    const classes = {
+      "stzh-chip-select": true,
+      "stzh-chip-select--has-description": descriptionUsed,
+      "stzh-chip-select--has-description-long": descriptionLongUsed,
+      "stzh-chip-select--has-error": errorUsed,
+      "stzh-chip-select--is-invalid": this.invalid,
+      "stzh-chip-select--is-disabled": this.disabled,
+      "stzh-chip-select--is-required": this.required
+    };
+    return (h(Host, null, h("div", { class: classes }, h("input", { type: "hidden", name: this.name, value: this.value }), h("div", { class: "stzh-chip-select__chips", role: "listbox" }, this._data.map((data) => (h("stzh-chip", { role: "option", class: "stzh-chip-select__chip", label: data.label, counter: data.counter, icon: data.icon, type: data.type, variant: data.variant, size: data.size, disabled: this.disabled || data.disabled, active: this.value === data.value, "aria-selected": this.value === data.value ? "true" : null, a11yDescribedby: `${this.inputId}-description ${this.a11yDescribedby}`, onClick: () => this.chipClick(data) })))), h(StzhInputDescription, { classPrefix: "stzh-chip-select", id: `${this.inputId}-description`, error: this._error, description: this.description, descriptionLong: this.descriptionLong, descriptionLongUsed: descriptionLongUsed, moreInfoButtonLabel: this.localization.$globals.moreInfoButtonLabel }), h("stzh-dropdown", { class: "stzh-chip-select__dropdown", disabled: this.disabled, error: this._error, description: this.description, descriptionLong: this.descriptionLong, required: this.required, invalid: this.invalid, items: [this.value], label: this.label, options: this._dataDropdown, onStzhChange: this.onDropdownChange }))));
+  }
+  get element() { return getElement(this); }
+  static get watchers() { return {
+    "data": ["dataWatcher"],
+    "error": ["errorWatcher"]
+  }; }
+};
+StzhChipSelect.style = stzhChipSelectCss;
+
+export { StzhCard as stzh_card, StzhCardList as stzh_card_list, StzhChipSelect as stzh_chip_select };

package/dist/esm/stzh-cell.entry.js

@@ -1,4 +1,4 @@
-import { r as registerInstance, h, a as Host } from './index-2915b467.js';
+import { r as registerInstance, h, a as Host } from './index-011c84fe.js';
 
 const stzhCellCss = ":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}:host{--cell-width:100%;max-width:100%;width:var(--cell-width);-ms-flex-preferred-size:var(--cell-width);flex-basis:var(--cell-width);-ms-flex-negative:0;flex-shrink:0}:host([justify-self=start]){justify-self:flex-start}:host([justify-self=end]){justify-self:flex-end}:host([justify-self=center]){justify-self:center}:host([justify-self=between]){justify-self:space-between}:host([justify-self=around]){justify-self:space-around}:host([justify-self=evenly]){justify-self:space-evenly}:host([align-self=start]){-ms-flex-item-align:start;align-self:flex-start}:host([align-self=end]){-ms-flex-item-align:end;align-self:flex-end}:host([align-self=center]){-ms-flex-item-align:center;align-self:center}:host([align-self=baseline]){-ms-flex-item-align:baseline;align-self:baseline}:host([align-self=stretch]){-ms-flex-item-align:stretch;align-self:stretch}:host([span=\"1\"]){--cell-width:8.3333333333%}:host([span=\"2\"]){--cell-width:16.6666666667%}:host([span=\"3\"]){--cell-width:25%}:host([span=\"4\"]){--cell-width:33.3333333333%}:host([span=\"5\"]){--cell-width:41.6666666667%}:host([span=\"6\"]){--cell-width:50%}:host([span=\"7\"]){--cell-width:58.3333333333%}:host([span=\"8\"]){--cell-width:66.6666666667%}:host([span=\"9\"]){--cell-width:75%}:host([span=\"10\"]){--cell-width:83.3333333333%}:host([span=\"11\"]){--cell-width:91.6666666667%}:host([span=\"12\"]){--cell-width:100%}@media screen and (min-width: 600px){:host([span-small=\"1\"]){--cell-width:8.3333333333%}}@media screen and (min-width: 600px){:host([span-small=\"2\"]){--cell-width:16.6666666667%}}@media screen and (min-width: 600px){:host([span-small=\"3\"]){--cell-width:25%}}@media screen and (min-width: 600px){:host([span-small=\"4\"]){--cell-width:33.3333333333%}}@media screen and (min-width: 600px){:host([span-small=\"5\"]){--cell-width:41.6666666667%}}@media screen and (min-width: 600px){:host([span-small=\"6\"]){--cell-width:50%}}@media screen and (min-width: 600px){:host([span-small=\"7\"]){--cell-width:58.3333333333%}}@media screen and (min-width: 600px){:host([span-small=\"8\"]){--cell-width:66.6666666667%}}@media screen and (min-width: 600px){:host([span-small=\"9\"]){--cell-width:75%}}@media screen and (min-width: 600px){:host([span-small=\"10\"]){--cell-width:83.3333333333%}}@media screen and (min-width: 600px){:host([span-small=\"11\"]){--cell-width:91.6666666667%}}@media screen and (min-width: 600px){:host([span-small=\"12\"]){--cell-width:100%}}@media screen and (min-width: 800px){:host([span-smallheader=\"1\"]){--cell-width:8.3333333333%}}@media screen and (min-width: 800px){:host([span-smallheader=\"2\"]){--cell-width:16.6666666667%}}@media screen and (min-width: 800px){:host([span-smallheader=\"3\"]){--cell-width:25%}}@media screen and (min-width: 800px){:host([span-smallheader=\"4\"]){--cell-width:33.3333333333%}}@media screen and (min-width: 800px){:host([span-smallheader=\"5\"]){--cell-width:41.6666666667%}}@media screen and (min-width: 800px){:host([span-smallheader=\"6\"]){--cell-width:50%}}@media screen and (min-width: 800px){:host([span-smallheader=\"7\"]){--cell-width:58.3333333333%}}@media screen and (min-width: 800px){:host([span-smallheader=\"8\"]){--cell-width:66.6666666667%}}@media screen and (min-width: 800px){:host([span-smallheader=\"9\"]){--cell-width:75%}}@media screen and (min-width: 800px){:host([span-smallheader=\"10\"]){--cell-width:83.3333333333%}}@media screen and (min-width: 800px){:host([span-smallheader=\"11\"]){--cell-width:91.6666666667%}}@media screen and (min-width: 800px){:host([span-smallheader=\"12\"]){--cell-width:100%}}@media screen and (min-width: 1024px){:host([span-medium=\"1\"]){--cell-width:8.3333333333%}}@media screen and (min-width: 1024px){:host([span-medium=\"2\"]){--cell-width:16.6666666667%}}@media screen and (min-width: 1024px){:host([span-medium=\"3\"]){--cell-width:25%}}@media screen and (min-width: 1024px){:host([span-medium=\"4\"]){--cell-width:33.3333333333%}}@media screen and (min-width: 1024px){:host([span-medium=\"5\"]){--cell-width:41.6666666667%}}@media screen and (min-width: 1024px){:host([span-medium=\"6\"]){--cell-width:50%}}@media screen and (min-width: 1024px){:host([span-medium=\"7\"]){--cell-width:58.3333333333%}}@media screen and (min-width: 1024px){:host([span-medium=\"8\"]){--cell-width:66.6666666667%}}@media screen and (min-width: 1024px){:host([span-medium=\"9\"]){--cell-width:75%}}@media screen and (min-width: 1024px){:host([span-medium=\"10\"]){--cell-width:83.3333333333%}}@media screen and (min-width: 1024px){:host([span-medium=\"11\"]){--cell-width:91.6666666667%}}@media screen and (min-width: 1024px){:host([span-medium=\"12\"]){--cell-width:100%}}@media screen and (min-width: 1260px){:host([span-large=\"1\"]){--cell-width:8.3333333333%}}@media screen and (min-width: 1260px){:host([span-large=\"2\"]){--cell-width:16.6666666667%}}@media screen and (min-width: 1260px){:host([span-large=\"3\"]){--cell-width:25%}}@media screen and (min-width: 1260px){:host([span-large=\"4\"]){--cell-width:33.3333333333%}}@media screen and (min-width: 1260px){:host([span-large=\"5\"]){--cell-width:41.6666666667%}}@media screen and (min-width: 1260px){:host([span-large=\"6\"]){--cell-width:50%}}@media screen and (min-width: 1260px){:host([span-large=\"7\"]){--cell-width:58.3333333333%}}@media screen and (min-width: 1260px){:host([span-large=\"8\"]){--cell-width:66.6666666667%}}@media screen and (min-width: 1260px){:host([span-large=\"9\"]){--cell-width:75%}}@media screen and (min-width: 1260px){:host([span-large=\"10\"]){--cell-width:83.3333333333%}}@media screen and (min-width: 1260px){:host([span-large=\"11\"]){--cell-width:91.6666666667%}}@media screen and (min-width: 1260px){:host([span-large=\"12\"]){--cell-width:100%}}@media screen and (min-width: 1440px){:host([span-ultra=\"1\"]){--cell-width:8.3333333333%}}@media screen and (min-width: 1440px){:host([span-ultra=\"2\"]){--cell-width:16.6666666667%}}@media screen and (min-width: 1440px){:host([span-ultra=\"3\"]){--cell-width:25%}}@media screen and (min-width: 1440px){:host([span-ultra=\"4\"]){--cell-width:33.3333333333%}}@media screen and (min-width: 1440px){:host([span-ultra=\"5\"]){--cell-width:41.6666666667%}}@media screen and (min-width: 1440px){:host([span-ultra=\"6\"]){--cell-width:50%}}@media screen and (min-width: 1440px){:host([span-ultra=\"7\"]){--cell-width:58.3333333333%}}@media screen and (min-width: 1440px){:host([span-ultra=\"8\"]){--cell-width:66.6666666667%}}@media screen and (min-width: 1440px){:host([span-ultra=\"9\"]){--cell-width:75%}}@media screen and (min-width: 1440px){:host([span-ultra=\"10\"]){--cell-width:83.3333333333%}}@media screen and (min-width: 1440px){:host([span-ultra=\"11\"]){--cell-width:91.6666666667%}}@media screen and (min-width: 1440px){:host([span-ultra=\"12\"]){--cell-width:100%}}.stzh-cell{height:100%;padding-left:calc(var(--stzh-grid-gutter) / 2);padding-right:calc(var(--stzh-grid-gutter) / 2)}@media screen and (min-width: 600px){.stzh-cell{padding-left:calc(var(--stzh-grid-gutter-small) / 2);padding-right:calc(var(--stzh-grid-gutter-small) / 2)}}@media screen and (min-width: 1024px){.stzh-cell{padding-left:calc(var(--stzh-grid-gutter-medium) / 2);padding-right:calc(var(--stzh-grid-gutter-medium) / 2)}}";
 

package/dist/esm/stzh-chart.entry.js

@@ -1,4 +1,4 @@
-import { r as registerInstance, h, a as Host, g as getElement } from './index-2915b467.js';
+import { r as registerInstance, h, a as Host, g as getElement } from './index-011c84fe.js';
 import { g as getAugmentedNamespace, c as createCommonjsModule, a as getDefaultExportFromCjs, b as commonjsGlobal } from './_commonjsHelpers-f9dc4873.js';
 
 var version = "4.13.0";
@@ -26085,13 +26085,12 @@ const topojson = /*#__PURE__*/Object.freeze({
   untransform: untransform
 });
 
-const stzhChartCss = "@charset \"UTF-8\";: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}.sszvis-outer-container{clear:both;position:relative}.sszvis-svg-layer{position:relative}.sszvis-html-layer{position:absolute}.sszvis-fallback-image{display:block;margin:0 auto;max-width:32.25rem;width:100%}.sszvis-interactive{cursor:default;user-select:none;-moz-user-select:none;-webkit-user-select:none;-ms-user-select:none;-webkit-tap-highlight-color:rgba(0, 0, 0, 0);-webkit-touch-callout:none}.sszvis-interactive.sszvis-interactive--draggable{cursor:pointer;cursor:grab;cursor:-webkit-grab}.sszvis-interactive.sszvis-interactive--draggable:active{cursor:grabbing;cursor:-webkit-grabbing}.sszvis-axis text{fill:#767676;font-family:Arial, sans-serif;font-size:0.625rem;font-style:normal;font-weight:normal}.sszvis-axis path,.sszvis-axis line{fill:none;stroke:#B8B8B8;shape-rendering:crispEdges}.sszvis-axis .tick text.active{fill:#545454}.sszvis-axis .tick text.hidden{display:none}.sszvis-axis .tick line.hidden{display:none}.sszvis-axis.sszvis-axis--top path{display:none}.sszvis-axis.sszvis-axis--vertical path{display:none}.sszvis-axis.sszvis-axis--slider path{stroke:none}.sszvis-axis__label-contour{fill:#FFFFFF;opacity:0.8;stroke:#FFFFFF;stroke-width:3}.sszvis-bar--missing{stroke:#A4A4A4}.sszvis-line{fill:none;stroke-width:1.1}.sszvis-pyramid__referenceline{fill:none;stroke:#aaa;stroke-width:2;stroke-dasharray:3 3}.sszvis-sankey-label{alignment-baseline:central;dominant-baseline:central;font-family:Arial, sans-serif;font-size:0.625rem;font-style:normal;font-weight:normal}.sszvis-sankey-strong-label{fill:#545454}.sszvis-sankey-weak-label{fill:#767676}.sszvis-sankey-column-label{text-anchor:middle}.sszvis-sankey-column-label-tick{stroke:#B8B8B8}.sszvis-sankey-link-source-label{text-anchor:start}.sszvis-sankey-link-target-label{text-anchor:end}.sszvis-map__area{stroke:none}.sszvis-map__border{fill:none;pointer-events:none;stroke-linejoin:round;user-select:none;-moz-user-select:none;-webkit-user-select:none;-ms-user-select:none}.sszvis-map__highlight{fill:none;pointer-events:none;stroke-linejoin:round;user-select:none;-moz-user-select:none;-webkit-user-select:none;-ms-user-select:none}.sszvis-map__lakezurich{pointer-events:none;stroke:none;user-select:none;-moz-user-select:none;-webkit-user-select:none;-ms-user-select:none}.sszvis-map__lakepath{fill:none;pointer-events:none;stroke:#d3d3d3;stroke-width:1.25;stroke-dasharray:3 3;user-select:none;-moz-user-select:none;-webkit-user-select:none;-ms-user-select:none}.sszvis-map__geojsonelement{pointer-events:none;user-select:none;-moz-user-select:none;-webkit-user-select:none;-ms-user-select:none}.sszvis-map__image{display:block;position:absolute;pointer-events:none;user-select:none;-moz-user-select:none;-webkit-user-select:none;-ms-user-select:none}.sszvis-map__rasterimage{display:block;position:absolute;pointer-events:none;user-select:none;-moz-user-select:none;-webkit-user-select:none;-ms-user-select:none}.sszvis-control-buttonGroup{display:inline-block;position:absolute;user-select:none;-moz-user-select:none;-webkit-user-select:none;-ms-user-select:none}.sszvis-control-buttonGroup__item{background-color:#FFFFFF;border:0.0625rem solid #767676;border-left:none;-webkit-box-sizing:border-box;box-sizing:border-box;color:#767676;cursor:pointer;display:table-cell;font-family:Arial, sans-serif;font-size:0.75rem;line-height:normal;padding:0.5625rem 0.75rem;text-align:center;vertical-align:middle}.sszvis-control-buttonGroup__item.selected{background-color:#767676;color:#FFFFFF}.sszvis-control-buttonGroup__item:first-child{border-left:0.0625rem solid #767676;border-top-left-radius:0.1875rem;border-bottom-left-radius:0.1875rem}.sszvis-control-buttonGroup__item:last-child{border-top-right-radius:0.1875rem;border-bottom-right-radius:0.1875rem}.sszvis-control-select{border:0.0625rem solid #767676;border-radius:0.1875rem;background-color:#FFFFFF;background-image:url(\"data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAEAAAABACAYAAACqaXHeAAABQElEQVR4nO3TzW2DUBDEcZdACSnBpe1lVhzdCSXZnaQE55JJSOJgMO9rH/OTOK70/iNxOomIiIiIiMi3cRzfar8hlc0tAM4A3gFMeZ5UDoDps+W86sDMBgBXd7+7+z3yCACmWcfVzIbFg9/xkUeYx68a4b/4iCM8in86wlJ8pBGW4ucj/Dhy98uzowgjrImffZevQzMb3P0WeYSN8bc/v0HkEXbHU8QRksVTpBGSx1OEEbLFU8sjZI+nFkcoFk8tjVA8nloYoVo81RyhejzVGKGZeCo5QnPxVGKEZuMp5wjNx1OOEcLEU8oRwsVTihHCxtOeEcLH0ysjdBNPW0foKp4yjBAnnhKOEC+eEowQN552jBA/nl4YoZ942jBCf/G0YoR+42lhhP7j6cEIx4mn2QjHiyczGw4bLyIiIiIiUtMHjJmBk7uXEiAAAAAASUVORK5CYII=\");background-position:96% 51%;background-repeat:no-repeat;background-size:0.75rem 0.75rem;-webkit-box-sizing:border-box;box-sizing:border-box;cursor:pointer;height:2.125rem;overflow:hidden}.sszvis-control-select__element{background:transparent;border:0.0625rem solid #FFFFFF;color:#767676;font-family:Arial, sans-serif;font-size:1rem;height:2.125rem;outline:0}.sszvis-control-select__element:-moz-focusring{color:transparent;text-shadow:0 0 0 #000}.sszvis-control-select__metrics{font-family:Arial, sans-serif;font-size:0.75rem;height:auto;position:absolute;visibility:hidden;width:auto;white-space:nowrap}.sszvis-control-slider__handle{cursor:pointer}.sszvis-control-slider--label{fill:#545454;font-family:Arial, sans-serif;font-size:0.625rem;text-anchor:middle}.sszvis-control-slider__handlebox{fill:#fff;stroke:#545454}.sszvis-control-slider__handleline{stroke:#545454}.sszvis-handleRuler__handle{fill:#FFFFFF;stroke:#808184}.sszvis-handleRuler__handle-mark{stroke:#A6A8AB}.sszvis-ruler__rule{shape-rendering:crispEdges;stroke:#CCCCCC}.sszvis-ruler__dot{stroke:#FFFFFF;stroke-width:1.5}.sszvis-ruler__label,.sszvis-ruler__label-outline{font-family:Arial, sans-serif;font-size:0.75rem;font-style:normal;font-weight:normal}.sszvis-ruler__label{fill:#545454}.sszvis-ruler__label-outline{stroke:#FFFFFF;stroke-width:3}.sszvis-rangeFlag__mark{fill:#EFEFEF;stroke:#7C7C7C;stroke-width:1.5}.sszvis-rangeRuler__rule{opacity:0.25;shape-rendering:crispEdges;stroke:#000000}.sszvis-rangeRuler__p1,.sszvis-rangeRuler__p2{fill:#000000;opacity:0.25}.sszvis-rangeRuler__label,.sszvis-rangeRuler__total{font-size:0.625rem;fill:#545454;font-family:Arial, sans-serif;font-style:normal}.sszvis-tooltip{min-width:3.75rem;position:absolute}.sszvis-tooltip__background{position:absolute}.sszvis-tooltip__background path{fill:rgba(255, 255, 255, 0.9)}.sszvis-tooltip__background.sszvis-tooltip__background--fallback path{stroke:#ddd;stroke-width:1}.sszvis-tooltip__content{font-family:Arial;padding:0.625rem 0.625rem 0.4375rem 0.625rem;position:relative;white-space:nowrap;z-index:1}.sszvis-tooltip__content strong{font-weight:bold}.sszvis-tooltip__content em{font-weight:bold}.sszvis-tooltip__header{color:#545454;font-size:0.75rem;line-height:1.3333;vertical-align:middle}.sszvis-tooltip__body{color:#7C7C7C;font-size:0.6875rem;line-height:1.4545;vertical-align:middle}.sszvis-tooltip--small .sszvis-tooltip__content{padding:0.375rem 0.625rem 0.25rem 0.625rem;text-align:center}.sszvis-tooltip__body__table,.sszvis-tooltip__body__table td{margin:0;padding:0;border:0;font-size:100%;font:inherit;vertical-align:top}.sszvis-tooltip__body__table{border:none !important;border-collapse:collapse;border-spacing:0;min-width:7.5rem;margin-top:0.375rem;width:100%}.sszvis-tooltip__body__table tr{border-top:0.0625rem solid #E5E6E7}.sszvis-tooltip__body__table td{border:none !important;padding:0.4375rem 0.5em 0.4375rem 0 !important;text-align:left;vertical-align:top}.sszvis-tooltip__body__table tr:last-child td{padding-bottom:0.1875rem}.sszvis-tooltip__body__table td:last-child{color:#545454;font-weight:bold;padding-right:0;text-align:right}.sszvis-tooltipAnchor{pointer-events:none;user-select:none;-moz-user-select:none;-webkit-user-select:none;-ms-user-select:none}.sszvis-referenceline{stroke-width:1.5;stroke:#aaa;stroke-dasharray:3 3}.sszvis-referenceline__caption{fill:#7C7C7C;font-family:Arial, sans-serif;font-size:0.6875rem;text-anchor:middle;-webkit-backface-visibility:hidden}.sszvis-dataareacircle__caption{fill:#7C7C7C;font-family:Arial, sans-serif;font-size:0.6875rem;text-anchor:middle}.sszvis-dataarearectangle__caption{fill:#7C7C7C;font-family:Arial, sans-serif;font-size:0.6875rem;text-anchor:middle}.sszvis-legend__label{fill:#767676;font-family:Arial, sans-serif;font-size:0.75rem;font-style:normal;font-weight:normal;text-anchor:start}.sszvis-legend__label--small{fill:#767676;font-size:0.625rem}.sszvis-legend__axislabel{fill:#767676;font-family:Arial, sans-serif;font-size:0.625rem;font-style:normal;font-weight:normal}.sszvis-legend__crispmark{shape-rendering:crispEdges}.sszvis-legend__greyline{fill:none;stroke:#B8B8B8;stroke-width:1.1}.sszvis-legend__dashedline{stroke:#CCCCCC;stroke-dasharray:2 3;stroke-width:1}stzh-chart{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}stzh-chart[hidden]{display:none}stzh-chart *,stzh-chart *::before,stzh-chart *::after{-webkit-box-sizing:border-box;box-sizing:border-box}.stzh-chart__caption{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-chart__caption{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-chart__caption:not(:empty){margin-top:var(--stzh-space-small)}";
+const stzhChartCss = "@charset \"UTF-8\";: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}.sszvis-outer-container{clear:both;position:relative}.sszvis-svg-layer{position:relative}.sszvis-html-layer{position:absolute}.sszvis-fallback-image{display:block;margin:0 auto;max-width:32.25rem;width:100%}.sszvis-interactive{cursor:default;user-select:none;-moz-user-select:none;-webkit-user-select:none;-ms-user-select:none;-webkit-tap-highlight-color:rgba(0, 0, 0, 0);-webkit-touch-callout:none}.sszvis-interactive.sszvis-interactive--draggable{cursor:pointer;cursor:grab;cursor:-webkit-grab}.sszvis-interactive.sszvis-interactive--draggable:active{cursor:grabbing;cursor:-webkit-grabbing}.sszvis-axis text{fill:#767676;font-family:Arial, sans-serif;font-size:0.625rem;font-style:normal;font-weight:normal}.sszvis-axis path,.sszvis-axis line{fill:none;stroke:#B8B8B8;shape-rendering:crispEdges}.sszvis-axis .tick text.active{fill:#545454}.sszvis-axis .tick text.hidden{display:none}.sszvis-axis .tick line.hidden{display:none}.sszvis-axis.sszvis-axis--top path{display:none}.sszvis-axis.sszvis-axis--vertical path{display:none}.sszvis-axis.sszvis-axis--slider path{stroke:none}.sszvis-axis__label-contour{fill:#FFFFFF;opacity:0.8;stroke:#FFFFFF;stroke-width:3}.sszvis-bar--missing{stroke:#A4A4A4}.sszvis-line{fill:none;stroke-width:1.1}.sszvis-pyramid__referenceline{fill:none;stroke:#aaa;stroke-width:2;stroke-dasharray:3 3}.sszvis-sankey-label{alignment-baseline:central;dominant-baseline:central;font-family:Arial, sans-serif;font-size:0.625rem;font-style:normal;font-weight:normal}.sszvis-sankey-strong-label{fill:#545454}.sszvis-sankey-weak-label{fill:#767676}.sszvis-sankey-column-label{text-anchor:middle}.sszvis-sankey-column-label-tick{stroke:#B8B8B8}.sszvis-sankey-link-source-label{text-anchor:start}.sszvis-sankey-link-target-label{text-anchor:end}.sszvis-map__area{stroke:none}.sszvis-map__border{fill:none;pointer-events:none;stroke-linejoin:round;user-select:none;-moz-user-select:none;-webkit-user-select:none;-ms-user-select:none}.sszvis-map__highlight{fill:none;pointer-events:none;stroke-linejoin:round;user-select:none;-moz-user-select:none;-webkit-user-select:none;-ms-user-select:none}.sszvis-map__lakezurich{pointer-events:none;stroke:none;user-select:none;-moz-user-select:none;-webkit-user-select:none;-ms-user-select:none}.sszvis-map__lakepath{fill:none;pointer-events:none;stroke:#d3d3d3;stroke-width:1.25;stroke-dasharray:3 3;user-select:none;-moz-user-select:none;-webkit-user-select:none;-ms-user-select:none}.sszvis-map__geojsonelement{pointer-events:none;user-select:none;-moz-user-select:none;-webkit-user-select:none;-ms-user-select:none}.sszvis-map__image{display:block;position:absolute;pointer-events:none;user-select:none;-moz-user-select:none;-webkit-user-select:none;-ms-user-select:none}.sszvis-map__rasterimage{display:block;position:absolute;pointer-events:none;user-select:none;-moz-user-select:none;-webkit-user-select:none;-ms-user-select:none}.sszvis-control-buttonGroup{display:inline-block;position:absolute;user-select:none;-moz-user-select:none;-webkit-user-select:none;-ms-user-select:none}.sszvis-control-buttonGroup__item{background-color:#FFFFFF;border:0.0625rem solid #767676;border-left:none;-webkit-box-sizing:border-box;box-sizing:border-box;color:#767676;cursor:pointer;display:table-cell;font-family:Arial, sans-serif;font-size:0.75rem;line-height:normal;padding:0.5625rem 0.75rem;text-align:center;vertical-align:middle}.sszvis-control-buttonGroup__item.selected{background-color:#767676;color:#FFFFFF}.sszvis-control-buttonGroup__item:first-child{border-left:0.0625rem solid #767676;border-top-left-radius:0.1875rem;border-bottom-left-radius:0.1875rem}.sszvis-control-buttonGroup__item:last-child{border-top-right-radius:0.1875rem;border-bottom-right-radius:0.1875rem}.sszvis-control-select{border:0.0625rem solid #767676;border-radius:0.1875rem;background-color:#FFFFFF;background-image:url(\"data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAEAAAABACAYAAACqaXHeAAABQElEQVR4nO3TzW2DUBDEcZdACSnBpe1lVhzdCSXZnaQE55JJSOJgMO9rH/OTOK70/iNxOomIiIiIiMi3cRzfar8hlc0tAM4A3gFMeZ5UDoDps+W86sDMBgBXd7+7+z3yCACmWcfVzIbFg9/xkUeYx68a4b/4iCM8in86wlJ8pBGW4ucj/Dhy98uzowgjrImffZevQzMb3P0WeYSN8bc/v0HkEXbHU8QRksVTpBGSx1OEEbLFU8sjZI+nFkcoFk8tjVA8nloYoVo81RyhejzVGKGZeCo5QnPxVGKEZuMp5wjNx1OOEcLEU8oRwsVTihHCxtOeEcLH0ysjdBNPW0foKp4yjBAnnhKOEC+eEowQN552jBA/nl4YoZ942jBCf/G0YoR+42lhhP7j6cEIx4mn2QjHiyczGw4bLyIiIiIiUtMHjJmBk7uXEiAAAAAASUVORK5CYII=\");background-position:96% 51%;background-repeat:no-repeat;background-size:0.75rem 0.75rem;-webkit-box-sizing:border-box;box-sizing:border-box;cursor:pointer;height:2.125rem;overflow:hidden}.sszvis-control-select__element{background:transparent;border:0.0625rem solid #FFFFFF;color:#767676;font-family:Arial, sans-serif;font-size:1rem;height:2.125rem;outline:0}.sszvis-control-select__element:-moz-focusring{color:transparent;text-shadow:0 0 0 #000}.sszvis-control-select__metrics{font-family:Arial, sans-serif;font-size:0.75rem;height:auto;position:absolute;visibility:hidden;width:auto;white-space:nowrap}.sszvis-control-slider__handle{cursor:pointer}.sszvis-control-slider--label{fill:#545454;font-family:Arial, sans-serif;font-size:0.625rem;text-anchor:middle}.sszvis-control-slider__handlebox{fill:#fff;stroke:#545454}.sszvis-control-slider__handleline{stroke:#545454}.sszvis-handleRuler__handle{fill:#FFFFFF;stroke:#808184}.sszvis-handleRuler__handle-mark{stroke:#A6A8AB}.sszvis-ruler__rule{shape-rendering:crispEdges;stroke:#CCCCCC}.sszvis-ruler__dot{stroke:#FFFFFF;stroke-width:1.5}.sszvis-ruler__label,.sszvis-ruler__label-outline{font-family:Arial, sans-serif;font-size:0.75rem;font-style:normal;font-weight:normal}.sszvis-ruler__label{fill:#545454}.sszvis-ruler__label-outline{stroke:#FFFFFF;stroke-width:3}.sszvis-rangeFlag__mark{fill:#EFEFEF;stroke:#7C7C7C;stroke-width:1.5}.sszvis-rangeRuler__rule{opacity:0.25;shape-rendering:crispEdges;stroke:#000000}.sszvis-rangeRuler__p1,.sszvis-rangeRuler__p2{fill:#000000;opacity:0.25}.sszvis-rangeRuler__label,.sszvis-rangeRuler__total{font-size:0.625rem;fill:#545454;font-family:Arial, sans-serif;font-style:normal}.sszvis-tooltip{min-width:3.75rem;position:absolute}.sszvis-tooltip__background{position:absolute}.sszvis-tooltip__background path{fill:rgba(255, 255, 255, 0.9)}.sszvis-tooltip__background.sszvis-tooltip__background--fallback path{stroke:#ddd;stroke-width:1}.sszvis-tooltip__content{font-family:Arial;padding:0.625rem 0.625rem 0.4375rem 0.625rem;position:relative;white-space:nowrap;z-index:1}.sszvis-tooltip__content strong{font-weight:bold}.sszvis-tooltip__content em{font-weight:bold}.sszvis-tooltip__header{color:#545454;font-size:0.75rem;line-height:1.3333;vertical-align:middle}.sszvis-tooltip__body{color:#7C7C7C;font-size:0.6875rem;line-height:1.4545;vertical-align:middle}.sszvis-tooltip--small .sszvis-tooltip__content{padding:0.375rem 0.625rem 0.25rem 0.625rem;text-align:center}.sszvis-tooltip__body__table,.sszvis-tooltip__body__table td{margin:0;padding:0;border:0;font-size:100%;font:inherit;vertical-align:top}.sszvis-tooltip__body__table{border:none !important;border-collapse:collapse;border-spacing:0;min-width:7.5rem;margin-top:0.375rem;width:100%}.sszvis-tooltip__body__table tr{border-top:0.0625rem solid #E5E6E7}.sszvis-tooltip__body__table td{border:none !important;padding:0.4375rem 0.5em 0.4375rem 0 !important;text-align:left;vertical-align:top}.sszvis-tooltip__body__table tr:last-child td{padding-bottom:0.1875rem}.sszvis-tooltip__body__table td:last-child{color:#545454;font-weight:bold;padding-right:0;text-align:right}.sszvis-tooltipAnchor{pointer-events:none;user-select:none;-moz-user-select:none;-webkit-user-select:none;-ms-user-select:none}.sszvis-referenceline{stroke-width:1.5;stroke:#aaa;stroke-dasharray:3 3}.sszvis-referenceline__caption{fill:#7C7C7C;font-family:Arial, sans-serif;font-size:0.6875rem;text-anchor:middle;-webkit-backface-visibility:hidden}.sszvis-dataareacircle__caption{fill:#7C7C7C;font-family:Arial, sans-serif;font-size:0.6875rem;text-anchor:middle}.sszvis-dataarearectangle__caption{fill:#7C7C7C;font-family:Arial, sans-serif;font-size:0.6875rem;text-anchor:middle}.sszvis-legend__label{fill:#767676;font-family:Arial, sans-serif;font-size:0.75rem;font-style:normal;font-weight:normal;text-anchor:start}.sszvis-legend__label--small{fill:#767676;font-size:0.625rem}.sszvis-legend__axislabel{fill:#767676;font-family:Arial, sans-serif;font-size:0.625rem;font-style:normal;font-weight:normal}.sszvis-legend__crispmark{shape-rendering:crispEdges}.sszvis-legend__greyline{fill:none;stroke:#B8B8B8;stroke-width:1.1}.sszvis-legend__dashedline{stroke:#CCCCCC;stroke-dasharray:2 3;stroke-width:1}stzh-chart{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}stzh-chart[hidden]{display:none}stzh-chart *,stzh-chart *::before,stzh-chart *::after{-webkit-box-sizing:border-box;box-sizing:border-box}";
 
 const StzhChart = class {
   constructor(hostRef) {
     registerInstance(this, hostRef);
     this.initialized = false;
-    this.caption = "";
     this.chartId = undefined;
     this.create = function () { };
   }
@@ -26111,7 +26110,7 @@ const StzhChart = class {
     const classes = {
       "stzh-chart": true
     };
-    return (h(Host, null, h("figure", { class: classes }, h("div", { id: this.chartId, ref: (el) => (this.chartElement = el), class: "stzh-chart__element" }), h("figcaption", { class: "stzh-chart__caption" }, this.caption ? this.caption : h("slot", { name: "caption" })))));
+    return (h(Host, null, h("div", { class: classes }, h("div", { id: this.chartId, ref: (el) => (this.chartElement = el), class: "stzh-chart__element" }))));
   }
   get element() { return getElement(this); }
   static get watchers() { return {