@oiz/stzh-components 2.10.0-beta → 2.10.0

package/dist/esm-es5/stzh-print.entry.js

@@ -0,0 +1,2 @@
+import{r as registerInstance,h,a as Host,g as getElement}from"./index-bfb5b569.js";import{s as setPropsIfNull}from"./utils-107fad0f.js";import"./string-utils-e252977e.js";var stzhPrintCss=":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;text-underline-offset:var(--stzh-link-text-underline-offset);text-decoration-thickness:var(--stzh-link-text-decoration-thickness)}:host .has-focus{outline:var(--stzh-flyingfocus-color) solid 0.125rem;outline-offset:0.3125rem}:host .stzh-fylingfocus-focused{outline-style:none !important}:host .stzh-fylingfocus-focused::-moz-focus-inner{border:0 !important}:host{display:contents}.stzh-print{display:contents}";var StzhPrint=function(){function t(t){var e=this;registerInstance(this,t);this.handleLinkClick=function(){window.print()};this.init=function(){var t=e.element.querySelectorAll("stzh-link, stzh-button");t.forEach((function(t){t.addEventListener("click",e.handleLinkClick);setPropsIfNull(t,{icon:"print"})}))}}t.prototype.connectedCallback=function(){this.init();this.observer=new MutationObserver(this.init);this.observer.observe(this.element,{childList:true,subtree:true})};t.prototype.disconnectedCallback=function(){if(this.observer){this.observer.disconnect()}};t.prototype.render=function(){var t={"stzh-print":true};return h(Host,null,h("div",{class:t},h("slot",null)))};Object.defineProperty(t.prototype,"element",{get:function(){return getElement(this)},enumerable:false,configurable:true});return t}();StzhPrint.style=stzhPrintCss;export{StzhPrint as stzh_print};
+//# sourceMappingURL=stzh-print.entry.js.map

package/dist/esm-es5/stzh-print.entry.js.map

@@ -0,0 +1 @@
+{"version":3,"names":["stzhPrintCss","StzhPrint","hostRef","_this","this","handleLinkClick","window","print","init","links","element","querySelectorAll","forEach","link","addEventListener","setPropsIfNull","icon","prototype","connectedCallback","observer","MutationObserver","observe","childList","subtree","disconnectedCallback","disconnect","render","classes","h","Host","class"],"sources":["src/components/stzh-print/stzh-print.scss?tag=stzh-print","src/components/stzh-print/stzh-print.tsx"],"sourcesContent":[":host {\n  display: contents\n}\n\n.stzh-print {\n  display: contents\n}\n","import {\n  Component,\n  Host,\n  h,\n  Element,\n} from \"@stencil/core\";\n\nimport { setPropsIfNull } from \"../../utils/utils\";\n\n/**\n * @slot - Slot for label\n */\n@Component({\n  tag: \"stzh-print\",\n  styleUrl: \"stzh-print.scss\"\n})\nexport class StzhPrint {\n  @Element() element: HTMLStzhPrintElement;\n\n  private observer: MutationObserver;\n\n  private handleLinkClick = () => {\n    window.print();\n  }\n\n  private init = () => {\n    const links = this.element.querySelectorAll(\"stzh-link, stzh-button\");\n\n    links.forEach((link) => {\n      link.addEventListener('click', this.handleLinkClick);\n\n      setPropsIfNull(link, {\n        icon: \"print\"\n      } as HTMLStzhLinkElement | HTMLStzhButtonElement)\n    });\n  }\n\n  connectedCallback() {\n    this.init();\n\n    this.observer = new MutationObserver(this.init);\n    this.observer.observe(this.element, {\n      childList: true,\n      subtree: true\n    });\n  }\n\n  disconnectedCallback() {\n    if (this.observer) {\n      this.observer.disconnect();\n    }\n  }\n\n  render() {\n    const classes = {\n      \"stzh-print\": true\n    };\n\n    return (\n      <Host>\n        <div class={classes}>\n          <slot></slot>\n        </div>\n      </Host>\n    );\n  }\n}\n"],"mappings":"2KAAA,IAAMA,aAAe,kuB,ICgBRC,UAAS,WAJtB,SAAAA,EAAAC,GAAA,IAAAC,EAAAC,K,yBASUA,KAAAC,gBAAkB,WACxBC,OAAOC,O,EAGDH,KAAAI,KAAO,WACb,IAAMC,EAAQN,EAAKO,QAAQC,iBAAiB,0BAE5CF,EAAMG,SAAQ,SAACC,GACbA,EAAKC,iBAAiB,QAASX,EAAKE,iBAEpCU,eAAeF,EAAM,CACnBG,KAAM,S,KAKZf,EAAAgB,UAAAC,kBAAA,WACEd,KAAKI,OAELJ,KAAKe,SAAW,IAAIC,iBAAiBhB,KAAKI,MAC1CJ,KAAKe,SAASE,QAAQjB,KAAKM,QAAS,CAClCY,UAAW,KACXC,QAAS,M,EAIbtB,EAAAgB,UAAAO,qBAAA,WACE,GAAIpB,KAAKe,SAAU,CACjBf,KAAKe,SAASM,Y,GAIlBxB,EAAAgB,UAAAS,OAAA,WACE,IAAMC,EAAU,CACd,aAAc,MAGhB,OACEC,EAACC,KAAI,KACHD,EAAA,OAAKE,MAAOH,GACVC,EAAA,c,qIA7CY,G"}

package/dist/esm-es5/stzh-ratio.entry.js

@@ -1,2 +1,2 @@
-import{r as registerInstance,h,a as Host,g as getElement}from"./index-bfb5b569.js";var stzhRatioCss='.sc-stzh-ratio-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-ratio-h{display:none}.sc-stzh-ratio-h *.sc-stzh-ratio,.sc-stzh-ratio-h *.sc-stzh-ratio::before,.sc-stzh-ratio-h *.sc-stzh-ratio::after{-webkit-box-sizing:border-box;box-sizing:border-box;text-underline-offset:var(--stzh-link-text-underline-offset);text-decoration-thickness:var(--stzh-link-text-decoration-thickness)}.sc-stzh-ratio-h .has-focus.sc-stzh-ratio{outline:var(--stzh-flyingfocus-color) solid 0.125rem;outline-offset:0.3125rem}.sc-stzh-ratio-h .stzh-fylingfocus-focused.sc-stzh-ratio{outline-style:none !important}.sc-stzh-ratio-h .stzh-fylingfocus-focused.sc-stzh-ratio::-moz-focus-inner{border:0 !important}.sc-stzh-ratio-h{--ratio:9 / 16;--background-color:var(--stzh-ratio-background-color)}.sc-stzh-ratio-h .sc-stzh-ratio-s>*{position:absolute;width:100%;height:100%;top:0;left:0;-o-object-fit:cover;object-fit:cover}.sc-stzh-ratio-h[fit=contain] .sc-stzh-ratio-s>*{-o-object-fit:contain;object-fit:contain}[portrait].sc-stzh-ratio-h:not([portrait=false]){--ratio:16 / 9}[ratio="1:1"].sc-stzh-ratio-h{--ratio:1 / 1}[ratio="5:4"].sc-stzh-ratio-h{--ratio:4 / 5}[ratio="5:4"][portrait].sc-stzh-ratio-h:not([portrait=false]){--ratio:5 / 4}[ratio="4:3"].sc-stzh-ratio-h{--ratio:3 / 4}[ratio="4:3"][portrait].sc-stzh-ratio-h:not([portrait=false]){--ratio:4 / 3}[ratio="3:2"].sc-stzh-ratio-h{--ratio:2 / 3}[ratio="3:2"][portrait].sc-stzh-ratio-h:not([portrait=false]){--ratio:3 / 2}[ratio="2:1"].sc-stzh-ratio-h{--ratio:1 / 2}[ratio="2:1"][portrait].sc-stzh-ratio-h:not([portrait=false]){--ratio:2 / 1}[ratio="21:9"].sc-stzh-ratio-h{--ratio:9 / 21}[ratio="21:9"][portrait].sc-stzh-ratio-h:not([portrait=false]){--ratio:21 / 9}.stzh-ratio.sc-stzh-ratio{position:relative;width:100%;padding-top:calc(var(--ratio) * 100%);background:var(--background-color)}';var StzhRatio=function(){function t(t){registerInstance(this,t);this.ratio="16:9";this.portrait=false;this.fit="cover"}t.prototype.render=function(){var t={"stzh-ratio":true};return h(Host,null,h("div",{class:t},h("slot",null)))};Object.defineProperty(t.prototype,"element",{get:function(){return getElement(this)},enumerable:false,configurable:true});return t}();StzhRatio.style=stzhRatioCss;export{StzhRatio as stzh_ratio};
+import{r as registerInstance,h,a as Host,g as getElement}from"./index-bfb5b569.js";var stzhRatioCss='.sc-stzh-ratio-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-ratio-h{display:none}.sc-stzh-ratio-h *.sc-stzh-ratio,.sc-stzh-ratio-h *.sc-stzh-ratio::before,.sc-stzh-ratio-h *.sc-stzh-ratio::after{-webkit-box-sizing:border-box;box-sizing:border-box;text-underline-offset:var(--stzh-link-text-underline-offset);text-decoration-thickness:var(--stzh-link-text-decoration-thickness)}.sc-stzh-ratio-h .has-focus.sc-stzh-ratio{outline:var(--stzh-flyingfocus-color) solid 0.125rem;outline-offset:0.3125rem}.sc-stzh-ratio-h .stzh-fylingfocus-focused.sc-stzh-ratio{outline-style:none !important}.sc-stzh-ratio-h .stzh-fylingfocus-focused.sc-stzh-ratio::-moz-focus-inner{border:0 !important}.sc-stzh-ratio-h{--background-color:var(--stzh-ratio-background-color);--ratio:0.5625}.sc-stzh-ratio-h .sc-stzh-ratio-s>*{position:absolute;width:100%;height:100%;top:0;left:0;-o-object-fit:cover;object-fit:cover}.sc-stzh-ratio-h[fit=contain] .sc-stzh-ratio-s>*{-o-object-fit:contain;object-fit:contain}[portrait].sc-stzh-ratio-h:not([portrait=false]){--ratio:1.7777777778}[ratio="16:9"].sc-stzh-ratio-h{--ratio:0.5625}[ratio="16:9"][portrait].sc-stzh-ratio-h:not([portrait=false]){--ratio:1.7777777778}[ratio="1:1"].sc-stzh-ratio-h{--ratio:1}[ratio="1:1"][portrait].sc-stzh-ratio-h:not([portrait=false]){--ratio:1}[ratio="21:9"].sc-stzh-ratio-h{--ratio:0.4285714286}[ratio="21:9"][portrait].sc-stzh-ratio-h:not([portrait=false]){--ratio:2.3333333333}[ratio="2:1"].sc-stzh-ratio-h{--ratio:0.5}[ratio="2:1"][portrait].sc-stzh-ratio-h:not([portrait=false]){--ratio:2}[ratio="3:2"].sc-stzh-ratio-h{--ratio:0.6666666667}[ratio="3:2"][portrait].sc-stzh-ratio-h:not([portrait=false]){--ratio:1.5}[ratio="4:3"].sc-stzh-ratio-h{--ratio:0.75}[ratio="4:3"][portrait].sc-stzh-ratio-h:not([portrait=false]){--ratio:1.3333333333}[ratio="5:4"].sc-stzh-ratio-h{--ratio:0.8}[ratio="5:4"][portrait].sc-stzh-ratio-h:not([portrait=false]){--ratio:1.25}@media screen and (min-width: 600px){[ratio-small="16:9"].sc-stzh-ratio-h{--ratio:0.5625}}@media screen and (min-width: 600px){[ratio-small="16:9"][portrait].sc-stzh-ratio-h:not([portrait=false]){--ratio:1.7777777778}}@media screen and (min-width: 600px){[ratio-small="1:1"].sc-stzh-ratio-h{--ratio:1}}@media screen and (min-width: 600px){[ratio-small="1:1"][portrait].sc-stzh-ratio-h:not([portrait=false]){--ratio:1}}@media screen and (min-width: 600px){[ratio-small="21:9"].sc-stzh-ratio-h{--ratio:0.4285714286}}@media screen and (min-width: 600px){[ratio-small="21:9"][portrait].sc-stzh-ratio-h:not([portrait=false]){--ratio:2.3333333333}}@media screen and (min-width: 600px){[ratio-small="2:1"].sc-stzh-ratio-h{--ratio:0.5}}@media screen and (min-width: 600px){[ratio-small="2:1"][portrait].sc-stzh-ratio-h:not([portrait=false]){--ratio:2}}@media screen and (min-width: 600px){[ratio-small="3:2"].sc-stzh-ratio-h{--ratio:0.6666666667}}@media screen and (min-width: 600px){[ratio-small="3:2"][portrait].sc-stzh-ratio-h:not([portrait=false]){--ratio:1.5}}@media screen and (min-width: 600px){[ratio-small="4:3"].sc-stzh-ratio-h{--ratio:0.75}}@media screen and (min-width: 600px){[ratio-small="4:3"][portrait].sc-stzh-ratio-h:not([portrait=false]){--ratio:1.3333333333}}@media screen and (min-width: 600px){[ratio-small="5:4"].sc-stzh-ratio-h{--ratio:0.8}}@media screen and (min-width: 600px){[ratio-small="5:4"][portrait].sc-stzh-ratio-h:not([portrait=false]){--ratio:1.25}}@media screen and (min-width: 800px){[ratio-smallheader="16:9"].sc-stzh-ratio-h{--ratio:0.5625}}@media screen and (min-width: 800px){[ratio-smallheader="16:9"][portrait].sc-stzh-ratio-h:not([portrait=false]){--ratio:1.7777777778}}@media screen and (min-width: 800px){[ratio-smallheader="1:1"].sc-stzh-ratio-h{--ratio:1}}@media screen and (min-width: 800px){[ratio-smallheader="1:1"][portrait].sc-stzh-ratio-h:not([portrait=false]){--ratio:1}}@media screen and (min-width: 800px){[ratio-smallheader="21:9"].sc-stzh-ratio-h{--ratio:0.4285714286}}@media screen and (min-width: 800px){[ratio-smallheader="21:9"][portrait].sc-stzh-ratio-h:not([portrait=false]){--ratio:2.3333333333}}@media screen and (min-width: 800px){[ratio-smallheader="2:1"].sc-stzh-ratio-h{--ratio:0.5}}@media screen and (min-width: 800px){[ratio-smallheader="2:1"][portrait].sc-stzh-ratio-h:not([portrait=false]){--ratio:2}}@media screen and (min-width: 800px){[ratio-smallheader="3:2"].sc-stzh-ratio-h{--ratio:0.6666666667}}@media screen and (min-width: 800px){[ratio-smallheader="3:2"][portrait].sc-stzh-ratio-h:not([portrait=false]){--ratio:1.5}}@media screen and (min-width: 800px){[ratio-smallheader="4:3"].sc-stzh-ratio-h{--ratio:0.75}}@media screen and (min-width: 800px){[ratio-smallheader="4:3"][portrait].sc-stzh-ratio-h:not([portrait=false]){--ratio:1.3333333333}}@media screen and (min-width: 800px){[ratio-smallheader="5:4"].sc-stzh-ratio-h{--ratio:0.8}}@media screen and (min-width: 800px){[ratio-smallheader="5:4"][portrait].sc-stzh-ratio-h:not([portrait=false]){--ratio:1.25}}@media screen and (min-width: 1024px){[ratio-medium="16:9"].sc-stzh-ratio-h{--ratio:0.5625}}@media screen and (min-width: 1024px){[ratio-medium="16:9"][portrait].sc-stzh-ratio-h:not([portrait=false]){--ratio:1.7777777778}}@media screen and (min-width: 1024px){[ratio-medium="1:1"].sc-stzh-ratio-h{--ratio:1}}@media screen and (min-width: 1024px){[ratio-medium="1:1"][portrait].sc-stzh-ratio-h:not([portrait=false]){--ratio:1}}@media screen and (min-width: 1024px){[ratio-medium="21:9"].sc-stzh-ratio-h{--ratio:0.4285714286}}@media screen and (min-width: 1024px){[ratio-medium="21:9"][portrait].sc-stzh-ratio-h:not([portrait=false]){--ratio:2.3333333333}}@media screen and (min-width: 1024px){[ratio-medium="2:1"].sc-stzh-ratio-h{--ratio:0.5}}@media screen and (min-width: 1024px){[ratio-medium="2:1"][portrait].sc-stzh-ratio-h:not([portrait=false]){--ratio:2}}@media screen and (min-width: 1024px){[ratio-medium="3:2"].sc-stzh-ratio-h{--ratio:0.6666666667}}@media screen and (min-width: 1024px){[ratio-medium="3:2"][portrait].sc-stzh-ratio-h:not([portrait=false]){--ratio:1.5}}@media screen and (min-width: 1024px){[ratio-medium="4:3"].sc-stzh-ratio-h{--ratio:0.75}}@media screen and (min-width: 1024px){[ratio-medium="4:3"][portrait].sc-stzh-ratio-h:not([portrait=false]){--ratio:1.3333333333}}@media screen and (min-width: 1024px){[ratio-medium="5:4"].sc-stzh-ratio-h{--ratio:0.8}}@media screen and (min-width: 1024px){[ratio-medium="5:4"][portrait].sc-stzh-ratio-h:not([portrait=false]){--ratio:1.25}}@media screen and (min-width: 1260px){[ratio-large="16:9"].sc-stzh-ratio-h{--ratio:0.5625}}@media screen and (min-width: 1260px){[ratio-large="16:9"][portrait].sc-stzh-ratio-h:not([portrait=false]){--ratio:1.7777777778}}@media screen and (min-width: 1260px){[ratio-large="1:1"].sc-stzh-ratio-h{--ratio:1}}@media screen and (min-width: 1260px){[ratio-large="1:1"][portrait].sc-stzh-ratio-h:not([portrait=false]){--ratio:1}}@media screen and (min-width: 1260px){[ratio-large="21:9"].sc-stzh-ratio-h{--ratio:0.4285714286}}@media screen and (min-width: 1260px){[ratio-large="21:9"][portrait].sc-stzh-ratio-h:not([portrait=false]){--ratio:2.3333333333}}@media screen and (min-width: 1260px){[ratio-large="2:1"].sc-stzh-ratio-h{--ratio:0.5}}@media screen and (min-width: 1260px){[ratio-large="2:1"][portrait].sc-stzh-ratio-h:not([portrait=false]){--ratio:2}}@media screen and (min-width: 1260px){[ratio-large="3:2"].sc-stzh-ratio-h{--ratio:0.6666666667}}@media screen and (min-width: 1260px){[ratio-large="3:2"][portrait].sc-stzh-ratio-h:not([portrait=false]){--ratio:1.5}}@media screen and (min-width: 1260px){[ratio-large="4:3"].sc-stzh-ratio-h{--ratio:0.75}}@media screen and (min-width: 1260px){[ratio-large="4:3"][portrait].sc-stzh-ratio-h:not([portrait=false]){--ratio:1.3333333333}}@media screen and (min-width: 1260px){[ratio-large="5:4"].sc-stzh-ratio-h{--ratio:0.8}}@media screen and (min-width: 1260px){[ratio-large="5:4"][portrait].sc-stzh-ratio-h:not([portrait=false]){--ratio:1.25}}@media screen and (min-width: 1440px){[ratio-ultra="16:9"].sc-stzh-ratio-h{--ratio:0.5625}}@media screen and (min-width: 1440px){[ratio-ultra="16:9"][portrait].sc-stzh-ratio-h:not([portrait=false]){--ratio:1.7777777778}}@media screen and (min-width: 1440px){[ratio-ultra="1:1"].sc-stzh-ratio-h{--ratio:1}}@media screen and (min-width: 1440px){[ratio-ultra="1:1"][portrait].sc-stzh-ratio-h:not([portrait=false]){--ratio:1}}@media screen and (min-width: 1440px){[ratio-ultra="21:9"].sc-stzh-ratio-h{--ratio:0.4285714286}}@media screen and (min-width: 1440px){[ratio-ultra="21:9"][portrait].sc-stzh-ratio-h:not([portrait=false]){--ratio:2.3333333333}}@media screen and (min-width: 1440px){[ratio-ultra="2:1"].sc-stzh-ratio-h{--ratio:0.5}}@media screen and (min-width: 1440px){[ratio-ultra="2:1"][portrait].sc-stzh-ratio-h:not([portrait=false]){--ratio:2}}@media screen and (min-width: 1440px){[ratio-ultra="3:2"].sc-stzh-ratio-h{--ratio:0.6666666667}}@media screen and (min-width: 1440px){[ratio-ultra="3:2"][portrait].sc-stzh-ratio-h:not([portrait=false]){--ratio:1.5}}@media screen and (min-width: 1440px){[ratio-ultra="4:3"].sc-stzh-ratio-h{--ratio:0.75}}@media screen and (min-width: 1440px){[ratio-ultra="4:3"][portrait].sc-stzh-ratio-h:not([portrait=false]){--ratio:1.3333333333}}@media screen and (min-width: 1440px){[ratio-ultra="5:4"].sc-stzh-ratio-h{--ratio:0.8}}@media screen and (min-width: 1440px){[ratio-ultra="5:4"][portrait].sc-stzh-ratio-h:not([portrait=false]){--ratio:1.25}}.stzh-ratio.sc-stzh-ratio{position:relative;width:100%;padding-top:calc(var(--ratio) * 100%);background:var(--background-color)}';var StzhRatio=function(){function t(t){registerInstance(this,t);this.ratio="16:9";this.ratioSmall="inherit";this.ratioMedium="inherit";this.ratioLarge="inherit";this.ratioUltra="inherit";this.portrait=false;this.fit="cover"}t.prototype.render=function(){var t={"stzh-ratio":true};return h(Host,null,h("div",{class:t},h("slot",null)))};Object.defineProperty(t.prototype,"element",{get:function(){return getElement(this)},enumerable:false,configurable:true});return t}();StzhRatio.style=stzhRatioCss;export{StzhRatio as stzh_ratio};
 //# sourceMappingURL=stzh-ratio.entry.js.map

package/dist/esm-es5/stzh-ratio.entry.js.map

@@ -1 +1 @@
-{"version":3,"names":["stzhRatioCss","StzhRatio","prototype","render","classes","h","Host","class"],"sources":["src/components/stzh-ratio/stzh-ratio.scss?tag=stzh-ratio&encapsulation=scoped","src/components/stzh-ratio/stzh-ratio.tsx"],"sourcesContent":["/**\n * @prop --ratio: Ratio in reverse (e.g. for 16:9 use `9 / 16`)\n * @prop --background-color: Background color of ratio area\n *\n * @prop --stzh-ratio-background-color: **Global**: Background color of ratios\n */\n\n:host {\n  --ratio: 9 / 16;\n  --background-color: #{$ratioBackgroundColor};\n\n  ::slotted(*) {\n    position: absolute;\n    width: 100%;\n    height: 100%;\n    top: 0;\n    left: 0;\n    object-fit: cover;\n  }\n}\n\n:host([fit=\"contain\"]) ::slotted(*) {\n  object-fit: contain;\n}\n\n:host([portrait]:not([portrait=\"false\"])) {\n  --ratio: 16 / 9;\n}\n\n:host([ratio=\"1:1\"]) {\n  --ratio: 1 / 1;\n}\n\n:host([ratio=\"5:4\"]) {\n  --ratio: 4 / 5;\n}\n\n:host([ratio=\"5:4\"][portrait]:not([portrait=\"false\"])) {\n  --ratio: 5 / 4;\n}\n\n:host([ratio=\"4:3\"]) {\n  --ratio: 3 / 4;\n}\n\n:host([ratio=\"4:3\"][portrait]:not([portrait=\"false\"])) {\n  --ratio: 4 / 3;\n}\n\n:host([ratio=\"3:2\"]) {\n  --ratio: 2 / 3;\n}\n\n:host([ratio=\"3:2\"][portrait]:not([portrait=\"false\"])) {\n  --ratio: 3 / 2;\n}\n\n:host([ratio=\"2:1\"]) {\n  --ratio: 1 / 2;\n}\n\n:host([ratio=\"2:1\"][portrait]:not([portrait=\"false\"])) {\n  --ratio: 2 / 1;\n}\n\n:host([ratio=\"21:9\"]) {\n  --ratio: 9 / 21;\n}\n\n:host([ratio=\"21:9\"][portrait]:not([portrait=\"false\"])) {\n  --ratio: 21 / 9;\n}\n\n.stzh-ratio {\n  position: relative;\n  width: 100%;\n  padding-top: calc(var(--ratio) * 100%);\n  background: var(--background-color);\n}\n","import {\n  Component,\n  Host,\n  h,\n  Element,\n  Prop\n} from \"@stencil/core\";\n\n/**\n * @slot - Slot for e.g. image or video\n */\n@Component({\n  tag: \"stzh-ratio\",\n  styleUrl: \"stzh-ratio.scss\",\n  scoped: true\n})\nexport class StzhRatio {\n  /** Available aspect ratios */\n  @Prop({ reflect: true }) ratio: \"16:9\" | \"1:1\" | \"5:4\" | \"4:3\" | \"3:2\" | \"2:1\" | \"21:9\" = \"16:9\";\n\n  /** Whether aspect ratio is in portrait mode */\n  @Prop({ reflect: true }) portrait: boolean = false;\n  \n  /** Fit mode */\n  @Prop({ reflect: true }) fit: \"cover\" | \"contain\" = \"cover\";\n\n  @Element() element: HTMLStzhRatioElement;\n\n  render() {\n    const classes = {\n      \"stzh-ratio\": true\n    };\n\n    return (\n      <Host>\n        <div class={classes}>\n          <slot></slot>\n        </div>\n      </Host>\n    );\n  }\n}\n"],"mappings":"mFAAA,IAAMA,aAAe,g9D,ICgBRC,UAAS,W,kDAEsE,O,cAG7C,M,SAGO,O,CAIpDA,EAAAC,UAAAC,OAAA,WACE,IAAMC,EAAU,CACd,aAAc,MAGhB,OACEC,EAACC,KAAI,KACHD,EAAA,OAAKE,MAAOH,GACVC,EAAA,c,qIApBY,G"}
+{"version":3,"names":["stzhRatioCss","StzhRatio","prototype","render","classes","h","Host","class"],"sources":["src/components/stzh-ratio/stzh-ratio.scss?tag=stzh-ratio&encapsulation=scoped","src/components/stzh-ratio/stzh-ratio.tsx"],"sourcesContent":["/**\n * @prop --ratio: Ratio in reverse (e.g. for 16:9 use `9 / 16`)\n * @prop --background-color: Background color of ratio area\n *\n * @prop --stzh-ratio-background-color: **Global**: Background color of ratios\n */\n\n:host {\n  --background-color: #{$ratioBackgroundColor};\n  --ratio: #{\n    nth(map-get($ratios, $ratioDefault), 2)\n    / nth(map-get($ratios, $ratioDefault), 1)\n  };\n\n  ::slotted(*) {\n    position: absolute;\n    width: 100%;\n    height: 100%;\n    top: 0;\n    left: 0;\n    object-fit: cover;\n  }\n}\n\n:host([fit=\"contain\"]) ::slotted(*) {\n  object-fit: contain;\n}\n\n/* Ratio variants */\n\n:host([portrait]:not([portrait=\"false\"])) {\n  --ratio: #{\n    nth(map-get($ratios, $ratioDefault), 1)\n    / nth(map-get($ratios, $ratioDefault), 2)\n  };\n}\n\n@mixin ratioProps($breakpoint: null) {\n  @each $ratio, $value in $ratios {\n    $firstNr: nth($value, 1);\n    $secondNr: nth($value, 2);\n\n    @if $breakpoint {\n      :host([ratio-#{$breakpoint}=\"#{$ratio}\"]) {\n        @include mq($from: $breakpoint) {\n          --ratio: #{$secondNr / $firstNr};\n        }\n      }\n\n      :host([ratio-#{$breakpoint}=\"#{$ratio}\"][portrait]:not([portrait=\"false\"])) {\n        @include mq($from: $breakpoint) {\n          --ratio: #{$firstNr / $secondNr};\n        }\n      }\n    } @else {\n      :host([ratio=\"#{$ratio}\"]) {\n        --ratio: #{$secondNr / $firstNr};\n      }\n\n      :host([ratio=\"#{$ratio}\"][portrait]:not([portrait=\"false\"])) {\n        --ratio: #{$firstNr / $secondNr};\n      }\n    }\n  }\n}\n\n@include ratioProps();\n\n@each $breakpoint, $size in $breakpoints {\n  @include ratioProps($breakpoint);\n}\n\n.stzh-ratio {\n  position: relative;\n  width: 100%;\n  padding-top: calc(var(--ratio) * 100%);\n  background: var(--background-color);\n}\n","import {\n  Component,\n  Host,\n  h,\n  Element,\n  Prop\n} from \"@stencil/core\";\n\nimport { Layout } from \"../../index\";\n\n/**\n * @slot - Slot for e.g. image or video\n */\n@Component({\n  tag: \"stzh-ratio\",\n  styleUrl: \"stzh-ratio.scss\",\n  scoped: true\n})\nexport class StzhRatio {\n  /** Aspect ratio */\n  @Prop() ratio: Layout.Ratio = \"16:9\";\n  /** Aspect ratio above small breakpoint */\n  @Prop() ratioSmall: Layout.Ratio | \"inherit\" = \"inherit\";\n  /** Aspect ratio above medium breakpoint */\n  @Prop() ratioMedium: Layout.Ratio | \"inherit\" = \"inherit\";\n  /** Aspect ratio above large breakpoint */\n  @Prop() ratioLarge: Layout.Ratio | \"inherit\" = \"inherit\";\n  /** Aspect ratio above ultra breakpoint */\n  @Prop() ratioUltra: Layout.Ratio | \"inherit\" = \"inherit\";\n\n  /** Whether aspect ratio is in portrait mode */\n  @Prop({ reflect: true }) portrait: boolean = false;\n\n  /** Fit mode */\n  @Prop({ reflect: true }) fit: \"cover\" | \"contain\" = \"cover\";\n\n  @Element() element: HTMLStzhRatioElement;\n\n  render() {\n    const classes = {\n      \"stzh-ratio\": true\n    };\n\n    return (\n      <Host>\n        <div class={classes}>\n          <slot></slot>\n        </div>\n      </Host>\n    );\n  }\n}\n"],"mappings":"mFAAA,IAAMA,aAAe,0gT,ICkBRC,UAAS,W,kDAEU,O,gBAEiB,U,iBAEC,U,gBAED,U,gBAEA,U,cAGF,M,SAGO,O,CAIpDA,EAAAC,UAAAC,OAAA,WACE,IAAMC,EAAU,CACd,aAAc,MAGhB,OACEC,EAACC,KAAI,KACHD,EAAA,OAAKE,MAAOH,GACVC,EAAA,c,qIA5BY,G"}

package/dist/esm-es5/stzh-scrollup.entry.js

@@ -0,0 +1,2 @@
+import{r as registerInstance,h,a as Host,g as getElement}from"./index-bfb5b569.js";import{s as setPropsIfNull}from"./utils-107fad0f.js";import"./string-utils-e252977e.js";var stzhScrollupCss=":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;text-underline-offset:var(--stzh-link-text-underline-offset);text-decoration-thickness:var(--stzh-link-text-decoration-thickness)}:host .has-focus{outline:var(--stzh-flyingfocus-color) solid 0.125rem;outline-offset:0.3125rem}:host .stzh-fylingfocus-focused{outline-style:none !important}:host .stzh-fylingfocus-focused::-moz-focus-inner{border:0 !important}:host{display:contents}.stzh-scrollup{display:contents}";var StzhScrollup=function(){function t(t){var e=this;registerInstance(this,t);this.handleLinkClick=function(){window.scrollTo(0,0)};this.init=function(){var t=e.element.querySelectorAll("stzh-link, stzh-button");t.forEach((function(t){t.addEventListener("click",e.handleLinkClick);setPropsIfNull(t,{icon:"arrow-up"})}))}}t.prototype.connectedCallback=function(){this.init();this.observer=new MutationObserver(this.init);this.observer.observe(this.element,{childList:true,subtree:true})};t.prototype.disconnectedCallback=function(){if(this.observer){this.observer.disconnect()}};t.prototype.render=function(){var t={"stzh-scrollup":true};return h(Host,null,h("div",{class:t},h("slot",null)))};Object.defineProperty(t.prototype,"element",{get:function(){return getElement(this)},enumerable:false,configurable:true});return t}();StzhScrollup.style=stzhScrollupCss;export{StzhScrollup as stzh_scrollup};
+//# sourceMappingURL=stzh-scrollup.entry.js.map

package/dist/esm-es5/stzh-scrollup.entry.js.map

@@ -0,0 +1 @@
+{"version":3,"names":["stzhScrollupCss","StzhScrollup","hostRef","_this","this","handleLinkClick","window","scrollTo","init","links","element","querySelectorAll","forEach","link","addEventListener","setPropsIfNull","icon","prototype","connectedCallback","observer","MutationObserver","observe","childList","subtree","disconnectedCallback","disconnect","render","classes","h","Host","class"],"sources":["src/components/stzh-scrollup/stzh-scrollup.scss?tag=stzh-scrollup","src/components/stzh-scrollup/stzh-scrollup.tsx"],"sourcesContent":[":host {\n  display: contents;\n}\n\n.stzh-scrollup {\n  display: contents\n}\n","import {\n  Component,\n  Host,\n  h,\n  Element,\n} from \"@stencil/core\";\n\nimport { setPropsIfNull } from \"../../utils/utils\";\n\n/**\n * @slot - Slot for label\n */\n@Component({\n  tag: \"stzh-scrollup\",\n  styleUrl: \"stzh-scrollup.scss\"\n})\nexport class StzhScrollup {\n  @Element() element: HTMLStzhScrollupElement;\n\n  private observer: MutationObserver;\n\n  private handleLinkClick = () => {\n    window.scrollTo(0, 0);\n  }\n\n  private init = () => {\n    const links = this.element.querySelectorAll(\"stzh-link, stzh-button\");\n\n    links.forEach((link) => {\n      link.addEventListener('click', this.handleLinkClick);\n\n      setPropsIfNull(link, {\n        icon: \"arrow-up\"\n      } as HTMLStzhLinkElement | HTMLStzhButtonElement)\n    });\n  }\n\n  connectedCallback() {\n    this.init();\n\n    this.observer = new MutationObserver(this.init);\n    this.observer.observe(this.element, {\n      childList: true,\n      subtree: true\n    });\n  }\n\n  disconnectedCallback() {\n    if (this.observer) {\n      this.observer.disconnect();\n    }\n  }\n\n  render() {\n    const classes = {\n      \"stzh-scrollup\": true\n    };\n\n    return (\n      <Host>\n        <div class={classes}>\n          <slot></slot>\n        </div>\n      </Host>\n    );\n  }\n}\n"],"mappings":"2KAAA,IAAMA,gBAAkB,quB,ICgBXC,aAAY,WAJzB,SAAAA,EAAAC,GAAA,IAAAC,EAAAC,K,yBASUA,KAAAC,gBAAkB,WACxBC,OAAOC,SAAS,EAAG,E,EAGbH,KAAAI,KAAO,WACb,IAAMC,EAAQN,EAAKO,QAAQC,iBAAiB,0BAE5CF,EAAMG,SAAQ,SAACC,GACbA,EAAKC,iBAAiB,QAASX,EAAKE,iBAEpCU,eAAeF,EAAM,CACnBG,KAAM,Y,KAKZf,EAAAgB,UAAAC,kBAAA,WACEd,KAAKI,OAELJ,KAAKe,SAAW,IAAIC,iBAAiBhB,KAAKI,MAC1CJ,KAAKe,SAASE,QAAQjB,KAAKM,QAAS,CAClCY,UAAW,KACXC,QAAS,M,EAIbtB,EAAAgB,UAAAO,qBAAA,WACE,GAAIpB,KAAKe,SAAU,CACjBf,KAAKe,SAASM,Y,GAIlBxB,EAAAgB,UAAAS,OAAA,WACE,IAAMC,EAAU,CACd,gBAAiB,MAGnB,OACEC,EAACC,KAAI,KACHD,EAAA,OAAKE,MAAOH,GACVC,EAAA,c,qIA7Ce,G"}