@oiz/stzh-components 4.9.0-beta2 → 4.9.0-beta4

package/dist/components/p-CVGsVbS2.js

@@ -1,205 +0,0 @@
-import { p as proxyCustomElement, H, d as createEvent, h, F as Fragment, e as Host, t as transformTag } from './p-DAS4ghWk.js';
-import { a as addWordBreakToLinks, h as hasSlot } from './p-CN5apKPb.js';
-import { d as defineCustomElement$2 } from './p-Cz-ha88J.js';
-import { d as defineCustomElement$1 } from './p-BU4OH8Cm.js';
-
-const stzhLinkCss = () => `@charset "UTF-8";.sc-stzh-link-h{font-family:var(--stzh-font-family-medium);font-weight:var(--stzh-font-weight-medium);font-style:var(--stzh-font-style-medium);color:var(--stzh-base-color);box-sizing:border-box;display:block}[hidden].sc-stzh-link-h,[stzh-hidden].sc-stzh-link-h{display:none}.sc-stzh-link-h::selection{color:var(--stzh-selection-color);background-color:var(--stzh-selection-background-color)}.sc-stzh-link-h *.sc-stzh-link,.sc-stzh-link-h *.sc-stzh-link::before,.sc-stzh-link-h *.sc-stzh-link::after{box-sizing:border-box;text-underline-offset:var(--stzh-link-text-underline-offset);text-decoration-thickness:var(--stzh-link-text-decoration-thickness);-webkit-text-decoration-skip-ink:var(--stzh-link-text-decoration-skip-ink);text-decoration-skip-ink:var(--stzh-link-text-decoration-skip-ink)}.sc-stzh-link-h .has-focus.sc-stzh-link{outline:var(--stzh-flyingfocus-color) solid 0.125rem;outline-offset:0.125rem}.sc-stzh-link-h .stzh-fylingfocus-focused.sc-stzh-link{outline-style:none !important}.sc-stzh-link-h .stzh-fylingfocus-focused.sc-stzh-link::-moz-focus-inner{border:0 !important}.sc-stzh-link-h{--font-size:var(--stzh-font-milli-font-size);--line-height:var(--stzh-font-milli-text-line-height);--letter-spacing:normal}@media screen and (min-width: 900px){.sc-stzh-link-h{--font-size:var(--stzh-font-centi-font-size);--line-height:var(--stzh-font-centi-text-line-height);--letter-spacing:normal}}.sc-stzh-link-h{--color:var(--stzh-link-color);--text-decoration-line:var(--stzh-link-text-decoration-line);--icon-wrapper-height:var(--stzh-link-icon-wrapper-height);--icon-size:var(--stzh-link-icon-size);--height:var(--stzh-link-height, 40px);--hover-color:var(--stzh-link-hover-color);--hover-text-decoration-line:var(--stzh-link-hover-text-decoration-line)}@media screen and (min-width: 900px){.sc-stzh-link-h{--height:var(--stzh-link-height, auto)}}.sc-stzh-link-h{color:var(--color);display:inline-grid;width:auto;min-height:var(--height);pointer-events:var(--stzh-link-pointer-events, auto)}[height=auto].sc-stzh-link-h{--height:var(--stzh-link-auto-height, auto)}[fullwidth].sc-stzh-link-h:not([fullwidth=false]){width:100%;display:grid}[variant=secondary].sc-stzh-link-h{--color:var(--stzh-link-secondary-color);--hover-color:var(--stzh-link-secondary-hover-color)}[variant=back].sc-stzh-link-h{--text-decoration-line:none;--hover-color:var(--color)}[active].sc-stzh-link-h:not([active=false]){--color:var(--hover-color)}[disabled].sc-stzh-link-h:not([disabled=false]){--color:var(--stzh-color-grey60);--hover-color:var(--stzh-color-grey60)}.sc-stzh-link-h:where([size=small]){--font-size:var(--stzh-font-micro-font-size);--line-height:var(--stzh-font-micro-text-line-height);--letter-spacing:normal}.sc-stzh-link-h:where([size=inherit]){--font-size:inherit;--line-height:inherit;--letter-spacing:inherit}.stzh-link.sc-stzh-link{font-size:var(--font-size);line-height:var(--line-height);letter-spacing:var(--letter-spacing);font-family:inherit;position:relative;display:flex;align-items:center;justify-content:stretch;appearance:none;border:none;color:var(--color);transition:color var(--stzh-base-transition-animation-speed);cursor:pointer;width:100%;-webkit-text-decoration-line:none;text-decoration-line:none;background-color:transparent;padding:0;border-radius:var(--stzh-button-border-radius);text-align:left}.stzh-link.sc-stzh-link:hover{color:var(--hover-color)}@media (hover: none){.stzh-link.sc-stzh-link:hover{color:inherit}}.stzh-link.sc-stzh-link:hover .stzh-link__text.sc-stzh-link{-webkit-text-decoration-line:var(--hover-text-decoration-line);text-decoration-line:var(--hover-text-decoration-line)}.stzh-link__vhidden.sc-stzh-link{border:0;clip:rect(0 0 0 0);clip-path:inset(100%);width:0.0625rem;height:0.0625rem;overflow:hidden;padding:0;position:absolute}.stzh-link__inner.sc-stzh-link{display:flex;align-items:center;justify-content:center;flex-grow:1}.stzh-link__icon-wrapper.sc-stzh-link{--stzh-icon-size:var(--icon-size);display:none;align-items:center;justify-content:center;flex-shrink:0;width:auto;height:var(--icon-wrapper-height)}.stzh-link__text.sc-stzh-link{--stzh-base-color:initial;-webkit-text-decoration-line:var(--text-decoration-line);text-decoration-line:var(--text-decoration-line)}.stzh-link__icon-wrapper.sc-stzh-link:not(:empty)+.stzh-link__text.sc-stzh-link:not(:empty),.stzh-link__text.sc-stzh-link:not(:empty)+.stzh-link__icon-wrapper.sc-stzh-link:not(:empty){margin-left:var(--stzh-space-xxsmall)}.stzh-link__badge.sc-stzh-link{position:absolute;z-index:1;top:0;right:0}.stzh-link--has-icon.sc-stzh-link .stzh-link__icon-wrapper.sc-stzh-link{display:inline-flex}.stzh-link--has-icon-only.sc-stzh-link .stzh-link__text.sc-stzh-link{border:0;clip:rect(0 0 0 0);clip-path:inset(100%);width:0.0625rem;height:0.0625rem;overflow:hidden;padding:0;position:absolute}.stzh-link--badge-position-link.sc-stzh-link .stzh-link__icon-wrapper.sc-stzh-link{position:static}.stzh-link__badge.sc-stzh-link,.stzh-link--badge-position-link.sc-stzh-link .stzh-link__badge.sc-stzh-link{top:calc(var(--stzh-space-xxsmall) * -1);right:calc(var(--stzh-space-large) * -1)}.stzh-link--badge-position-icon.stzh-link--has-icon.sc-stzh-link .stzh-link__icon-wrapper.sc-stzh-link{position:relative}.stzh-link--badge-position-icon.stzh-link--has-icon.sc-stzh-link .stzh-link__badge.sc-stzh-link{top:calc(var(--stzh-space-xsmall) * -1);right:calc(var(--stzh-space-small) * -1)}.stzh-link--badge-position-icon.stzh-link--has-icon.stzh-link--has-badge.sc-stzh-link .stzh-link__icon-wrapper.sc-stzh-link+.stzh-link__text.sc-stzh-link:not(:empty){margin-left:var(--stzh-space-small)}.stzh-link--align-left.sc-stzh-link .stzh-link__inner.sc-stzh-link{justify-content:flex-start}.stzh-link--align-right.sc-stzh-link .stzh-link__inner.sc-stzh-link{justify-content:flex-end}.stzh-link--align-center.sc-stzh-link .stzh-link__inner.sc-stzh-link{justify-content:center}.stzh-link--align-space-between.sc-stzh-link .stzh-link__inner.sc-stzh-link{justify-content:space-between}.stzh-link--is-disabled.sc-stzh-link{cursor:not-allowed}`;
-
-const StzhLink = /*@__PURE__*/ proxyCustomElement(class StzhLink extends H {
-    constructor(registerHost) {
-        super();
-        if (registerHost !== false) {
-            this.__registerHost();
-        }
-        this.stzhClick = createEvent(this, "stzhClick");
-        this.stzhFocus = createEvent(this, "stzhFocus");
-        this.stzhBlur = createEvent(this, "stzhBlur");
-        /** Icon (use instead of icon slot) */
-        this.icon = "";
-        /** Icon Position */
-        this.iconPosition = "left";
-        /** Height variant (none prevent setting min-height for mikro and small breakpoint) */
-        this.height = "default";
-        /** Size variant */
-        this.size = "default";
-        /** href attribute of the link */
-        this.href = "";
-        /** target if the button is used as link (if href used)  */
-        this.target = "";
-        /** type of the button, if used as button (if no href used) */
-        this.type = "button";
-        /** Variant style */
-        this.variant = "default";
-        /** Whether the link is full width */
-        this.fullwidth = false;
-        /** Text alignment */
-        this.textAlign = "default";
-        /** Badge text */
-        this.badge = "";
-        /** Badge type */
-        this.badgeType = "default";
-        /** Whether badge should be displayed empty */
-        this.badgeEmpty = false;
-        /** Badge position */
-        this.badgePosition = "icon";
-        /** Disabled status */
-        this.disabled = false;
-        /** Active status */
-        this.active = false;
-        /** Whether only an icon is used inside the link */
-        this.iconOnly = false;
-        /** Label */
-        this.label = "";
-        /** Id for element which describes the button (this will be overwritten if description prop or slot is used, used by stzh-radiogroup) */
-        this.a11yDescribedby = "";
-        this.focusedByInput = false;
-        this.onRootFocus = () => {
-            if (!this.focusedByInput) {
-                this.link.focus();
-            }
-            this.focusedByInput = false;
-        };
-        this.onFocus = (event) => {
-            this.focusedByInput = true;
-            const focusEvent = new FocusEvent("focus", {
-                view: window,
-                bubbles: false,
-                cancelable: false,
-            });
-            this.element.dispatchEvent(focusEvent);
-            this.stzhFocus.emit({
-                component: "stzh-link",
-                originalEvent: event,
-            });
-        };
-        this.onBlur = (event) => {
-            const blurEvent = new FocusEvent("blur", {
-                view: window,
-                bubbles: false,
-                cancelable: false,
-            });
-            this.element.dispatchEvent(blurEvent);
-            this.stzhBlur.emit({
-                component: "stzh-link",
-                originalEvent: event,
-            });
-        };
-        this.onClick = (event) => {
-            this.stzhClick.emit({
-                component: "stzh-link",
-                originalEvent: event,
-                href: this.href,
-            });
-        };
-    }
-    async componentWillLoad() {
-        if (!this.localization) {
-            this.localization = await window.stzhComponents.utils.fetchTranslations(this.element, "link");
-        }
-    }
-    addWordBreakToLinks() {
-        var _a;
-        const links = Array.from(((_a = this.element) === null || _a === void 0 ? void 0 : _a.getElementsByClassName("stzh-link")) || []);
-        addWordBreakToLinks(links);
-    }
-    renderIcon() {
-        return (h("div", { class: "stzh-link__icon-wrapper" }, this.icon ? h("stzh-icon", { class: "stzh-link__icon", name: this.icon }) : h("slot", { name: "icon" }), (this.badge || this.badgeEmpty) && (h("stzh-badge", { class: "stzh-link__badge", label: this.badge, type: this.badgeType }))));
-    }
-    renderContent() {
-        return (h("div", { class: "stzh-link__text" }, this.rel && this.rel.includes("external") && (h("div", { class: "stzh-link__vhidden" }, this.localization.$globals.externalLinkLabel)), this.download && h("div", { class: "stzh-link__vhidden" }, this.localization.$globals.downloadLinkLabel), h("div", { ref: el => (this.text = el) }, this.label ? this.label : h("slot", null))));
-    }
-    renderInner(iconUsed) {
-        return (h(Fragment, null, h("div", { class: "stzh-link__inner" }, this.iconPosition === "left" && this.renderIcon(), this.renderContent(), this.iconPosition === "right" && this.renderIcon()), (this.badge || this.badgeEmpty) && !iconUsed && (h("stzh-badge", { class: "stzh-link__badge", label: this.badge, type: this.badgeType }))));
-    }
-    async componentDidLoad() {
-        this.addWordBreakToLinks();
-    }
-    componentDidRender() {
-        requestAnimationFrame(() => {
-            var _a;
-            (_a = this.link) === null || _a === void 0 ? void 0 : _a.setAttribute("s-object-id", this.analyticsId || this.text.innerText);
-        });
-    }
-    render() {
-        const iconUsed = hasSlot(this.element, "icon") || !!this.icon;
-        const classes = {
-            "stzh-link": true,
-            "stzh-link--has-icon": iconUsed,
-            "stzh-link--has-icon-only": this.iconOnly,
-            "stzh-link--has-badge": !!this.badge,
-            "stzh-link--is-fullwidth": this.fullwidth,
-            "stzh-link--is-disabled": this.disabled,
-            "stzh-link--is-active": this.active,
-            [`stzh-link--badge-position-${this.badgePosition}`]: !!this.badgePosition,
-            [`stzh-link--align-${this.textAlign}`]: !!this.textAlign,
-            [`stzh-link--${this.variant}`]: !!this.variant,
-        };
-        return (h(Host, { key: 'e04d29563af5564d50572b2ee0223553aa7e9fe9', tabindex: this.disabled ? null : "-1", onFocus: this.onRootFocus }, this.href ? (h("a", { ref: el => (this.link = el), href: this.disabled ? null : this.href, download: this.download, rel: this.rel, target: this.target, class: classes, id: this.linkId, accessKey: this.linkAccesskey, tabindex: this.a11yTabindex, "aria-label": this.a11yLabel || null, "aria-describedby": this.a11yDescribedby || null, "aria-disabled": typeof this.a11yDisabled !== "undefined" ? (this.a11yDisabled ? "true" : "false") : null, "aria-expanded": typeof this.a11yExpanded !== "undefined" ? (this.a11yExpanded ? "true" : "false") : null, "aria-controls": this.a11yControls || null, "aria-current": this.a11yCurrent || null, onClick: this.onClick, onFocus: this.onFocus, onBlur: this.onBlur }, this.renderInner(iconUsed))) : (h("button", { ref: el => (this.link = el), class: classes, type: this.type, disabled: this.disabled, id: this.linkId, accessKey: this.linkAccesskey, tabindex: this.a11yTabindex, "aria-label": this.a11yLabel || null, "aria-describedby": this.a11yDescribedby || null, "aria-disabled": typeof this.a11yDisabled !== "undefined" ? (this.a11yDisabled ? "true" : "false") : null, "aria-expanded": typeof this.a11yExpanded !== "undefined" ? (this.a11yExpanded ? "true" : "false") : null, "aria-controls": this.a11yControls || null, "aria-current": this.a11yCurrent || null, onClick: this.onClick, onFocus: this.onFocus, onBlur: this.onBlur }, this.renderInner(iconUsed)))));
-    }
-    get element() { return this; }
-    static get style() { return stzhLinkCss(); }
-}, [262, "stzh-link", {
-        "localization": [16],
-        "icon": [1],
-        "iconPosition": [513, "icon-position"],
-        "height": [513],
-        "size": [513],
-        "sizeSmall": [513, "size-small"],
-        "sizeMedium": [513, "size-medium"],
-        "sizeLarge": [513, "size-large"],
-        "sizeUltra": [513, "size-ultra"],
-        "href": [1],
-        "rel": [1],
-        "target": [1],
-        "download": [1],
-        "type": [1],
-        "variant": [513],
-        "fullwidth": [516],
-        "textAlign": [513, "text-align"],
-        "badge": [1],
-        "badgeType": [513, "badge-type"],
-        "badgeEmpty": [516, "badge-empty"],
-        "badgePosition": [513, "badge-position"],
-        "disabled": [516],
-        "active": [516],
-        "iconOnly": [516, "icon-only"],
-        "label": [1],
-        "linkAccesskey": [1, "link-accesskey"],
-        "linkId": [1, "link-id"],
-        "a11yLabel": [1, "a11y-label"],
-        "a11yDescribedby": [1, "a11y-describedby"],
-        "a11yExpanded": [516, "a11y-expanded"],
-        "a11yDisabled": [516, "a11y-disabled"],
-        "a11yControls": [1, "a11y-controls"],
-        "a11yTabindex": [1, "a11y-tabindex"],
-        "a11yCurrent": [1, "a11y-current"],
-        "analyticsId": [1, "analytics-id"]
-    }]);
-function defineCustomElement() {
-    if (typeof customElements === "undefined") {
-        return;
-    }
-    const components = ["stzh-link", "stzh-badge", "stzh-icon"];
-    components.forEach(tagName => { switch (tagName) {
-        case "stzh-link":
-            if (!customElements.get(transformTag(tagName))) {
-                customElements.define(transformTag(tagName), StzhLink);
-            }
-            break;
-        case "stzh-badge":
-            if (!customElements.get(transformTag(tagName))) {
-                defineCustomElement$2();
-            }
-            break;
-        case "stzh-icon":
-            if (!customElements.get(transformTag(tagName))) {
-                defineCustomElement$1();
-            }
-            break;
-    } });
-}
-
-export { StzhLink as S, defineCustomElement as d };
-//# sourceMappingURL=p-CVGsVbS2.js.map
-
-//# sourceMappingURL=p-CVGsVbS2.js.map

package/dist/components/p-CVGsVbS2.js.map

@@ -1 +0,0 @@
-{"file":"p-CVGsVbS2.js","mappings":"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","names":["__stencil_proxyCustomElement","HTMLElement"],"sources":["src/components/stzh-link/stzh-link.scss?tag=stzh-link&encapsulation=scoped","src/components/stzh-link/stzh-link.tsx"],"sourcesContent":["/**\n * @prop --color: Color of link\n * @prop --hover-color: Hover color of link\n * @prop --text-decoration-line: Text decoration of link\n * @prop --hover-text-decoration-line: Hover text decoration of link\n * @prop --icon-size: Size of icon next to link\n * @prop --min-height: Min height of link\n *\n * @prop --stzh-link-color: **Global**: Color of link\n * @prop --stzh-link-hover-color: **Global**: Hover color of link\n * @prop --stzh-link-text-decoration-line: **Global**: Text decoration of link\n * @prop --stzh-link-hover-text-decoration-line: **Global**: Text decoration of link\n * @prop --stzh-link-icon-size: **Global**: Size of icon next to link\n * @prop --stzh-link-text-decoration-thickness: **Global**: Text decoration thickness\n * @prop --stzh-link-text-decoration-skip-ink: **Global**: Whether to skip ink in text decoration\n * @prop --stzh-link-text-underline-offset: **Global**: Text underline offset\n */\n\n@mixin link--size-default() {\n  --font-size: var(--stzh-font-milli-font-size);\n  --line-height: var(--stzh-font-milli-text-line-height);\n  --letter-spacing: normal;\n\n  @include mq($from: medium) {\n    --font-size: var(--stzh-font-centi-font-size);\n    --line-height: var(--stzh-font-centi-text-line-height);\n    --letter-spacing: normal;\n  }\n}\n\n@mixin link--size-small() {\n  --font-size: var(--stzh-font-micro-font-size);\n  --line-height: var(--stzh-font-micro-text-line-height);\n  --letter-spacing: normal;\n}\n\n@mixin link--size-inherit() {\n  --font-size: inherit;\n  --line-height: inherit;\n  --letter-spacing: inherit;\n}\n\n:host {\n  @include link--size-default;\n  --color: #{$linkColor};\n  --text-decoration-line: #{$linkTextDecorationLine};\n  --icon-wrapper-height: #{$linkIconWrapperHeight};\n  --icon-size: #{$linkIconSize};\n  --height: var(--stzh-link-height, 40px);\n\n  --hover-color: #{$linkHoverColor};\n  --hover-text-decoration-line: #{$linkHoverTextDecorationLine};\n\n  @include mq($from: medium) {\n    --height: var(--stzh-link-height, auto);\n  }\n\n  color: var(--color);\n  display: inline-grid;\n  width: auto;\n  min-height: var(--height);\n  pointer-events: var(--stzh-link-pointer-events, auto);\n\n  &[height=\"auto\"] {\n    --height: var(--stzh-link-auto-height, auto);\n  }\n\n  &[fullwidth]:not([fullwidth=\"false\"]) {\n    width: 100%;\n    display: grid;\n  }\n\n  &[variant=\"secondary\"] {\n    --color: #{$linkSecondaryColor};\n    --hover-color: #{$linkSecondaryHoverColor};\n  }\n\n  &[variant=\"back\"] {\n    --text-decoration-line: none;\n    --hover-color: var(--color);\n  }\n\n  &[active]:not([active=\"false\"]) {\n    --color: var(--hover-color);\n  }\n\n  &[disabled]:not([disabled=\"false\"]) {\n    --color: #{$colorGrey60};\n    --hover-color: #{$colorGrey60};\n  }\n}\n\n:host(:where([size=\"small\"])) {\n  @include link--size-small;\n}\n\n:host(:where([size=\"inherit\"])) {\n  @include link--size-inherit;\n}\n\n//@each $breakpoint, $size in $breakpoints {\n//  @include mq($from: $breakpoint) {\n//    :host(:where([size-#{$breakpoint}=\"default\"])) {\n//      @include link--size-default;\n//    }\n//\n//    :host(:where([size-#{$breakpoint}=\"small\"])) {\n//      @include link--size-small;\n//    }\n//\n//    :host(:where([size-#{$breakpoint}=\"inherit\"])) {\n//      @include link--size-inherit;\n//    }\n//  }\n//}\n\n.stzh-link {\n  font-size: var(--font-size);\n  line-height: var(--line-height);\n  letter-spacing: var(--letter-spacing);\n  font-family: inherit;\n  position: relative;\n  display: flex;\n  align-items: center;\n  justify-content: stretch;\n  appearance: none;\n  border: none;\n  color: var(--color);\n  transition: color $baseTransitionAnimationSpeed;\n  cursor: pointer;\n  width: 100%;\n  text-decoration-line: none;\n  background-color: transparent;\n  padding: 0;\n  border-radius: $buttonBorderRadius;\n  text-align: left;\n\n  &:hover {\n    color: var(--hover-color);\n\n    @media (hover: none) {\n      color: inherit;\n    }\n  }\n\n  &:hover &__text {\n    text-decoration-line: var(--hover-text-decoration-line);\n  }\n\n  &__vhidden {\n    @include visuallyhidden;\n  }\n\n  &__inner {\n    display: flex;\n    align-items: center;\n    justify-content: center;\n    flex-grow: 1;\n  }\n\n  &__icon-wrapper {\n    --stzh-icon-size: var(--icon-size);\n\n    display: none;\n    align-items: center;\n    justify-content: center;\n    flex-shrink: 0;\n    width: auto;\n    height: var(--icon-wrapper-height);\n  }\n\n  &__text {\n    --stzh-base-color: initial;\n\n    text-decoration-line: var(--text-decoration-line);\n  }\n\n  &__icon-wrapper:not(:empty) + &__text:not(:empty),\n  &__text:not(:empty) + &__icon-wrapper:not(:empty) {\n    margin-left: space(\"xxsmall\");\n  }\n\n  &__badge  {\n    position: absolute;\n    z-index: 1;\n    top: 0;\n    right: 0;\n  }\n\n  &--has-icon &__icon-wrapper {\n    display: inline-flex;\n  }\n\n  /* Variant if link only has icon */\n\n  &--has-icon-only &__text {\n    @include visuallyhidden;\n  }\n\n  /* Badge positioning variants */\n\n  &--badge-position-link &__icon-wrapper {\n    position: static;\n  }\n\n  &__badge,\n  &--badge-position-link &__badge {\n    top: calc(#{space(\"xxsmall\")} * -1);\n    right: calc(#{space(\"large\")} * -1);\n  }\n\n  &--badge-position-icon#{&}--has-icon &__icon-wrapper {\n    position: relative;\n  }\n\n  &--badge-position-icon#{&}--has-icon &__badge {\n    top: calc(#{space(\"xsmall\")} * -1);\n    right: calc(#{space(\"small\")} * -1);\n  }\n\n  &--badge-position-icon#{&}--has-icon#{&}--has-badge\n    &__icon-wrapper\n    + &__text:not(:empty) {\n    margin-left: space(\"small\");\n  }\n\n  /* Alignment variants */\n\n  &--align-left &__inner {\n    justify-content: flex-start;\n  }\n\n  &--align-right &__inner {\n    justify-content: flex-end;\n  }\n\n  &--align-center &__inner {\n    justify-content: center;\n  }\n\n  &--align-space-between &__inner {\n    justify-content: space-between;\n  }\n\n  /* Disabled variant */\n\n  &--is-disabled {\n    cursor: not-allowed;\n  }\n}\n","import { Component, Host, Fragment, Element, h, Prop, Event, EventEmitter } from \"@stencil/core\";\n\nimport { StzhLinkFocusEvent, StzhLinkBlurEvent, StzhLinkSize, StzhBadgeType, StzhLinkClickEvent } from \"../../index\";\n\nimport { StzhLinkLocalizedText } from \"./stzh-link.localization\";\nimport { hasSlot, addWordBreakToLinks } from \"../../utils/utils\";\n\n/**\n * @slot icon - Slot for icon element\n * @slot - Slot for label/text content\n */\n@Component({\n  tag: \"stzh-link\",\n  styleUrl: \"stzh-link.scss\",\n  scoped: true,\n})\nexport class StzhLink {\n  /** Translation strings */\n  @Prop() localization: StzhLinkLocalizedText;\n\n  /** Icon (use instead of icon slot) */\n  @Prop() icon: string = \"\";\n\n  /** Icon Position */\n  @Prop({ reflect: true }) iconPosition: \"left\" | \"right\" = \"left\";\n\n  /** Height variant (none prevent setting min-height for mikro and small breakpoint) */\n  @Prop({ reflect: true }) height: \"default\" | \"auto\" = \"default\";\n\n  /** Size variant */\n  @Prop({ reflect: true }) size: StzhLinkSize = \"default\";\n\n  /** Size variant (above small breakpoint) */\n  @Prop({ reflect: true }) sizeSmall: StzhLinkSize;\n\n  /** Size variant (above medium breakpoint) */\n  @Prop({ reflect: true }) sizeMedium: StzhLinkSize;\n\n  /** Size variant (above large breakpoint) */\n  @Prop({ reflect: true }) sizeLarge: StzhLinkSize;\n\n  /** Size variant (above ultra breakpoint) */\n  @Prop({ reflect: true }) sizeUltra: StzhLinkSize;\n\n  /** href attribute of the link */\n  @Prop() href: string = \"\";\n\n  /** Rel (if href is used) */\n  @Prop() rel: string;\n\n  /** target if the button is used as link (if href used)  */\n  @Prop() target: string = \"\";\n\n  /** Download attribute of link (if `href` used) */\n  @Prop() download: string;\n\n  /** type of the button, if used as button (if no href used) */\n  @Prop() type: \"button\" | \"submit\" | \"reset\" = \"button\";\n\n  /** Variant style */\n  @Prop({ reflect: true }) variant: \"default\" | \"secondary\" | \"back\" = \"default\";\n\n  /** Whether the link is full width */\n  @Prop({ reflect: true }) fullwidth: boolean = false;\n\n  /** Text alignment */\n  @Prop({ reflect: true }) textAlign: \"left\" | \"center\" | \"right\" | \"space-between\" | \"default\" = \"default\";\n\n  /** Badge text */\n  @Prop() badge: string = \"\";\n\n  /** Badge type */\n  @Prop({ reflect: true }) badgeType: StzhBadgeType = \"default\";\n\n  /** Whether badge should be displayed empty */\n  @Prop({ reflect: true }) badgeEmpty: boolean = false;\n\n  /** Badge position */\n  @Prop({ reflect: true }) badgePosition: \"icon\" | \"link\" = \"icon\";\n\n  /** Disabled status */\n  @Prop({ reflect: true }) disabled: boolean = false;\n\n  /** Active status */\n  @Prop({ reflect: true }) active: boolean = false;\n\n  /** Whether only an icon is used inside the link */\n  @Prop({ reflect: true }) iconOnly: boolean = false;\n\n  /** Label */\n  @Prop() label: string = \"\";\n\n  /** Access key of link (usually a number e.g. 1) */\n  @Prop() linkAccesskey: string;\n\n  /** ID of link element */\n  @Prop() linkId: string;\n\n  /** Accessible label for screen readers to replace visible text */\n  @Prop({ attribute: \"a11y-label\" }) a11yLabel: string;\n\n  /** Id for element which describes the button (this will be overwritten if description prop or slot is used, used by stzh-radiogroup) */\n  @Prop({ attribute: \"a11y-describedby\" }) a11yDescribedby: string = \"\";\n\n  /** Aria expanded of link/button */\n  @Prop({ reflect: true, attribute: \"a11y-expanded\" }) a11yExpanded: boolean;\n\n  /** Aria disabled of link/button */\n  @Prop({ reflect: true, attribute: \"a11y-disabled\" }) a11yDisabled: boolean;\n\n  /** Aria controls of link/button */\n  @Prop({ attribute: \"a11y-controls\" }) a11yControls: string;\n\n  /** Tabindex of link/button */\n  @Prop({ attribute: \"a11y-tabindex\" }) a11yTabindex: string;\n\n  /** Aria current of link/button */\n  @Prop({ attribute: \"a11y-current\" }) a11yCurrent: string;\n\n  /**\n   * For Adobe Analytics.\n   * Will be rendered as value of `s-object-id` attribute to the link/button element.\n   * Default value will be taken from `label` prop or default slot.\n   */\n  @Prop() analyticsId: string;\n\n  @Element() element: HTMLStzhLinkElement;\n\n  /** Click event */\n  @Event() stzhClick: EventEmitter<StzhLinkClickEvent>;\n\n  /** Focus event */\n  @Event() stzhFocus: EventEmitter<StzhLinkFocusEvent>;\n\n  /** Input blur event */\n  @Event() stzhBlur: EventEmitter<StzhLinkBlurEvent>;\n\n  private link: HTMLButtonElement | HTMLAnchorElement;\n  private text: HTMLDivElement;\n  private focusedByInput: boolean = false;\n\n  async componentWillLoad() {\n    if (!this.localization) {\n      this.localization = await window.stzhComponents.utils.fetchTranslations(this.element, \"link\");\n    }\n  }\n\n  private onRootFocus = () => {\n    if (!this.focusedByInput) {\n      this.link.focus();\n    }\n\n    this.focusedByInput = false;\n  };\n\n  private onFocus = (event: FocusEvent) => {\n    this.focusedByInput = true;\n\n    const focusEvent = new FocusEvent(\"focus\", {\n      view: window,\n      bubbles: false,\n      cancelable: false,\n    });\n\n    this.element.dispatchEvent(focusEvent);\n    this.stzhFocus.emit({\n      component: \"stzh-link\",\n      originalEvent: event,\n    });\n  };\n\n  private onBlur = (event: FocusEvent) => {\n    const blurEvent = new FocusEvent(\"blur\", {\n      view: window,\n      bubbles: false,\n      cancelable: false,\n    });\n\n    this.element.dispatchEvent(blurEvent);\n    this.stzhBlur.emit({\n      component: \"stzh-link\",\n      originalEvent: event,\n    });\n  };\n\n  private onClick = (event: MouseEvent) => {\n    this.stzhClick.emit({\n      component: \"stzh-link\",\n      originalEvent: event,\n      href: this.href,\n    });\n  };\n\n  private addWordBreakToLinks() {\n    const links = Array.from(this.element?.getElementsByClassName(\"stzh-link\") || []);\n    addWordBreakToLinks(links as HTMLElement[]);\n  }\n\n  private renderIcon(): HTMLInputElement {\n    return (\n      <div class=\"stzh-link__icon-wrapper\">\n        {this.icon ? <stzh-icon class=\"stzh-link__icon\" name={this.icon}></stzh-icon> : <slot name=\"icon\"></slot>}\n        {(this.badge || this.badgeEmpty) && (\n          <stzh-badge class=\"stzh-link__badge\" label={this.badge} type={this.badgeType}></stzh-badge>\n        )}\n      </div>\n    );\n  }\n\n  private renderContent(): HTMLDivElement {\n    return (\n      <div class=\"stzh-link__text\">\n        {this.rel && this.rel.includes(\"external\") && (\n          <div class=\"stzh-link__vhidden\">{this.localization.$globals.externalLinkLabel}</div>\n        )}\n        {this.download && <div class=\"stzh-link__vhidden\">{this.localization.$globals.downloadLinkLabel}</div>}\n        <div ref={el => (this.text = el as HTMLDivElement)}>{this.label ? this.label : <slot></slot>}</div>\n      </div>\n    );\n  }\n\n  private renderInner(iconUsed: boolean): DocumentFragment {\n    return (\n      <Fragment>\n        <div class=\"stzh-link__inner\">\n          {this.iconPosition === \"left\" && this.renderIcon()}\n          {this.renderContent()}\n          {this.iconPosition === \"right\" && this.renderIcon()}\n        </div>\n        {(this.badge || this.badgeEmpty) && !iconUsed && (\n          <stzh-badge class=\"stzh-link__badge\" label={this.badge} type={this.badgeType}></stzh-badge>\n        )}\n      </Fragment>\n    );\n  }\n\n  async componentDidLoad() {\n    this.addWordBreakToLinks();\n  }\n\n  componentDidRender() {\n    requestAnimationFrame(() => {\n      this.link?.setAttribute(\"s-object-id\", this.analyticsId || this.text.innerText);\n    });\n  }\n\n  render() {\n    const iconUsed = hasSlot(this.element, \"icon\") || !!this.icon;\n    const classes = {\n      \"stzh-link\": true,\n      \"stzh-link--has-icon\": iconUsed,\n      \"stzh-link--has-icon-only\": this.iconOnly,\n      \"stzh-link--has-badge\": !!this.badge,\n      \"stzh-link--is-fullwidth\": this.fullwidth,\n      \"stzh-link--is-disabled\": this.disabled,\n      \"stzh-link--is-active\": this.active,\n      [`stzh-link--badge-position-${this.badgePosition}`]: !!this.badgePosition,\n      [`stzh-link--align-${this.textAlign}`]: !!this.textAlign,\n      [`stzh-link--${this.variant}`]: !!this.variant,\n    };\n\n    return (\n      <Host tabindex={this.disabled ? null : \"-1\"} onFocus={this.onRootFocus}>\n        {this.href ? (\n          <a\n            ref={el => (this.link = el as HTMLAnchorElement)}\n            href={this.disabled ? null : this.href}\n            download={this.download}\n            rel={this.rel}\n            target={this.target}\n            class={classes}\n            id={this.linkId}\n            accessKey={this.linkAccesskey}\n            tabindex={this.a11yTabindex}\n            aria-label={this.a11yLabel || null}\n            aria-describedby={this.a11yDescribedby || null}\n            aria-disabled={typeof this.a11yDisabled !== \"undefined\" ? (this.a11yDisabled ? \"true\" : \"false\") : null}\n            aria-expanded={typeof this.a11yExpanded !== \"undefined\" ? (this.a11yExpanded ? \"true\" : \"false\") : null}\n            aria-controls={this.a11yControls || null}\n            aria-current={this.a11yCurrent || null}\n            onClick={this.onClick}\n            onFocus={this.onFocus}\n            onBlur={this.onBlur}\n          >\n            {this.renderInner(iconUsed)}\n          </a>\n        ) : (\n          <button\n            ref={el => (this.link = el as HTMLButtonElement)}\n            class={classes}\n            type={this.type}\n            disabled={this.disabled}\n            id={this.linkId}\n            accessKey={this.linkAccesskey}\n            tabindex={this.a11yTabindex}\n            aria-label={this.a11yLabel || null}\n            aria-describedby={this.a11yDescribedby || null}\n            aria-disabled={typeof this.a11yDisabled !== \"undefined\" ? (this.a11yDisabled ? \"true\" : \"false\") : null}\n            aria-expanded={typeof this.a11yExpanded !== \"undefined\" ? (this.a11yExpanded ? \"true\" : \"false\") : null}\n            aria-controls={this.a11yControls || null}\n            aria-current={this.a11yCurrent || null}\n            onClick={this.onClick}\n            onFocus={this.onFocus}\n            onBlur={this.onBlur}\n          >\n            {this.renderInner(iconUsed)}\n          </button>\n        )}\n      </Host>\n    );\n  }\n}\n"],"version":3}

package/dist/components/p-CViAWrjM.js

@@ -1,118 +0,0 @@
-import { p as proxyCustomElement, H, h, F as Fragment, e as Host, t as transformTag } from './p-DAS4ghWk.js';
-import { m as media, a as addMediaChangeListener, r as removeMediaChangeListener } from './p-CUGRmgip.js';
-import { d as defineCustomElement$3 } from './p-Cz-ha88J.js';
-import { d as defineCustomElement$2 } from './p-BU4OH8Cm.js';
-import { d as defineCustomElement$1 } from './p-CVGsVbS2.js';
-
-const stzhBathstatusItemCss = () => `.sc-stzh-bathstatus-item-h{font-family:var(--stzh-font-family-medium);font-weight:var(--stzh-font-weight-medium);font-style:var(--stzh-font-style-medium);color:var(--stzh-base-color);box-sizing:border-box;display:block}[hidden].sc-stzh-bathstatus-item-h,[stzh-hidden].sc-stzh-bathstatus-item-h{display:none}.sc-stzh-bathstatus-item-h::selection{color:var(--stzh-selection-color);background-color:var(--stzh-selection-background-color)}.sc-stzh-bathstatus-item-h *.sc-stzh-bathstatus-item,.sc-stzh-bathstatus-item-h *.sc-stzh-bathstatus-item::before,.sc-stzh-bathstatus-item-h *.sc-stzh-bathstatus-item::after{box-sizing:border-box;text-underline-offset:var(--stzh-link-text-underline-offset);text-decoration-thickness:var(--stzh-link-text-decoration-thickness);-webkit-text-decoration-skip-ink:var(--stzh-link-text-decoration-skip-ink);text-decoration-skip-ink:var(--stzh-link-text-decoration-skip-ink)}.sc-stzh-bathstatus-item-h .has-focus.sc-stzh-bathstatus-item{outline:var(--stzh-flyingfocus-color) solid 0.125rem;outline-offset:0.125rem}.sc-stzh-bathstatus-item-h .stzh-fylingfocus-focused.sc-stzh-bathstatus-item{outline-style:none !important}.sc-stzh-bathstatus-item-h .stzh-fylingfocus-focused.sc-stzh-bathstatus-item::-moz-focus-inner{border:0 !important}.stzh-bathstatus-item.sc-stzh-bathstatus-item{background-color:var(--stzh-color-grey10);padding-top:var(--stzh-space-xlarge);padding-right:var(--stzh-space-large);padding-bottom:var(--stzh-space-xlarge);padding-left:var(--stzh-space-large)}.stzh-bathstatus-item__description.sc-stzh-bathstatus-item,.stzh-bathstatus-item-value.sc-stzh-bathstatus-item{font-size:var(--stzh-font-milli-font-size);line-height:var(--stzh-font-milli-text-line-height);letter-spacing:var(--stzh-font-curve---text-letter-spacing)}.stzh-bathstatus-item__title.sc-stzh-bathstatus-item{font-size:var(--stzh-font-milli-font-size);line-height:var(--stzh-font-milli-text-line-height);letter-spacing:var(--stzh-font-curve---text-letter-spacing)}@media screen and (min-width: 900px){.stzh-bathstatus-item__title.sc-stzh-bathstatus-item{font-size:var(--stzh-font-centi-font-size);line-height:var(--stzh-font-centi-text-line-height);letter-spacing:var(--stzh-font-curve---text-letter-spacing)}}.stzh-bathstatus-item-container.sc-stzh-bathstatus-item{display:grid;grid-template-columns:max-content 1fr;gap:var(--stzh-space-small) var(--stzh-space-xlarge);align-items:center}.stzh-bathstatus-item-key.sc-stzh-bathstatus-item{font-size:var(--stzh-font-nano-font-size);line-height:var(--stzh-font-nano-text-line-height);color:var(--stzh-color-grey70)}.stzh-bathstatus-item--teaser.sc-stzh-bathstatus-item .stzh-bathstatus-item__title.sc-stzh-bathstatus-item{display:none}.stzh-bathstatus-item--teaser.sc-stzh-bathstatus-item .stzh-bathstatus-item__description.sc-stzh-bathstatus-item{margin-bottom:var(--stzh-space-medium)}.stzh-bathstatus-item--list.sc-stzh-bathstatus-item{padding-top:var(--stzh-space-small);padding-right:var(--stzh-space-xsmall);padding-bottom:var(--stzh-space-small);padding-left:var(--stzh-space-xsmall)}@media screen and (min-width: 900px){.stzh-bathstatus-item--list.sc-stzh-bathstatus-item{padding-top:var(--stzh-space-medium);padding-right:var(--stzh-space-large);padding-bottom:var(--stzh-space-medium);padding-left:var(--stzh-space-large)}}.stzh-bathstatus-item--list.sc-stzh-bathstatus-item .stzh-bathstatus-item__description.sc-stzh-bathstatus-item,.stzh-bathstatus-item--list.sc-stzh-bathstatus-item .stzh-bathstatus-item-key.sc-stzh-bathstatus-item,.stzh-bathstatus-item--list.sc-stzh-bathstatus-item .stzh-bathstatus-item-uv-index-prediction.sc-stzh-bathstatus-item{display:none}.stzh-bathstatus-item--list.sc-stzh-bathstatus-item .stzh-bathstatus-item-container.sc-stzh-bathstatus-item{grid-template-columns:repeat(4, minmax(0, 1fr))}.stzh-bathstatus-item--list.sc-stzh-bathstatus-item .stzh-bathstatus-item-value.sc-stzh-bathstatus-item{font-size:var(--stzh-font-micro-font-size);line-height:var(--stzh-font-micro-text-line-height)}@media screen and (min-width: 900px){.stzh-bathstatus-item--list.sc-stzh-bathstatus-item .stzh-bathstatus-item-value.sc-stzh-bathstatus-item{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)}}`;
-
-const StzhBathstatusItem = /*@__PURE__*/ proxyCustomElement(class StzhBathstatusItem extends H {
-    constructor(registerHost) {
-        super();
-        if (registerHost !== false) {
-            this.__registerHost();
-        }
-        /** Variant */
-        this.variant = "teaser";
-        /** Bathstatus item */
-        this.item = "";
-        this.mediaChangeHandler = () => {
-            this.isMedium = media("medium").matches;
-        };
-        this.init = () => {
-            this.itemWatcher(this.item);
-        };
-    }
-    itemWatcher(newValue) {
-        if (!newValue) {
-            this._item = undefined;
-        }
-        else if (typeof newValue === "string") {
-            try {
-                this._item = JSON.parse(newValue);
-            }
-            catch (e) {
-                this._item = undefined;
-            }
-        }
-        else {
-            this._item = newValue;
-        }
-    }
-    getParsedDate(dateStr) {
-        const parsedDate = new Date(dateStr);
-        if (isNaN(parsedDate.getTime())) {
-            return null;
-        }
-        return parsedDate;
-    }
-    async componentWillLoad() {
-        if (!this.localization) {
-            this.localization = await window.stzhComponents.utils.fetchTranslations(this.element, "bathstatus-item");
-        }
-        if (!this.dateAdapter) {
-            this.dateAdapter = window.stzhComponents.utils.createFormatParseAdapter(this.localization.$formats, this.localization.$globals);
-        }
-    }
-    connectedCallback() {
-        this.init();
-        this.mediaChangeHandler();
-        addMediaChangeListener(this.mediaChangeHandler);
-    }
-    disconnectedCallback() {
-        removeMediaChangeListener(this.mediaChangeHandler);
-    }
-    render() {
-        const classes = {
-            "stzh-bathstatus-item": true,
-            [`stzh-bathstatus-item--${this.variant}`]: true,
-        };
-        return (h(Host, { key: '496723ede68faa084f028757800646bdb6d0efe5' }, h("div", { key: 'f964111a68fe87f325983a6cba18ad2e5e3a6822', class: classes }, !!this._item.description && h("div", { key: 'fcff4560326baecc20fe33318405cfec8001ce39', class: "stzh-bathstatus-item__description" }, this._item.description), h("div", { key: '312ba9f35912c9b0f10b027b4ba45011c84dc328', class: "stzh-bathstatus-item-container" }, h("stzh-link", { key: '9f44c9a983562d21fd3c236b39602174c38e4f68', class: "stzh-bathstatus-item__title", size: "default", textAlign: "left", href: this._item.url, label: this._item.title }), !!this._item.temp && (h(Fragment, { key: '9f5707749b2d45751f613b44b66d53cce88062da' }, h("div", { key: 'a82f2637155056bd56516f90c63deba5a8f1513d', class: "stzh-bathstatus-item-key" }, this.localization.temperature), h("div", { key: '55580e766b16ca9468671fb25adb6844a27f49cf', class: "stzh-bathstatus-item-value" }, this._item.temp))), !!this._item.statusMessage && (h(Fragment, { key: '68dbe0674fedf8368b91d6ed0af4fbe4cf23d6a3' }, h("div", { key: 'd8a01718ba91c0d39a6acdee5fb026be43c57cc5', class: "stzh-bathstatus-item-key" }, this.localization.status), h("div", { key: 'f6f0ed954a73ca41d033b0efdb1df98e2a1ffb99', class: "stzh-bathstatus-item-value" }, this._item.statusMessage))), !!this._item.lastUpdate && (h(Fragment, { key: '0b08d1badca10127a3aa9d1c8c37390f057c6da6' }, h("div", { key: 'bf907c9d6a91ae8517fd7acff92a2edc4b6d7436', class: "stzh-bathstatus-item-key" }, this.localization.lastUpdate), h("div", { key: '493c1714b655cdfc47ce64af428730fc32df0a7d', class: "stzh-bathstatus-item-value" }, this.isMedium ? (h(Fragment, null, this.dateAdapter.format(this.getParsedDate(this._item.lastUpdate), "datetimeLong"))) : (h(Fragment, null, this.dateAdapter.format(this.getParsedDate(this._item.lastUpdate), "dateInput"), " ", this.dateAdapter.format(this.getParsedDate(this._item.lastUpdate), "time")))))), !!this._item.uvIndexPrediction && (h(Fragment, { key: '3299590f8fc202bed2614a89222e53953145acc4' }, h("div", { key: '1c0efe42467f9a6281eb1ef34c8372bba53ff465', class: "stzh-bathstatus-item-key" }, this.localization.uvIndexPrediction), h("div", { key: '7a1920a5ff79d5c04a55131260e7972b925a3d7a', class: "stzh-bathstatus-item-value stzh-bathstatus-item-uv-index-prediction" }, h("img", { key: '138c3757b4ac5f239078c5bf22f7b48d664d5914', src: `${window.stzhComponents.pathMedia}/uvindex/uvindex_${this._item.uvIndexPrediction}.gif`, alt: "UV Index" + this._item.uvIndexPrediction }))))))));
-    }
-    get element() { return this; }
-    static get watchers() { return {
-        "item": ["itemWatcher"]
-    }; }
-    static get style() { return stzhBathstatusItemCss(); }
-}, [258, "stzh-bathstatus-item", {
-        "localization": [16],
-        "variant": [1],
-        "item": [1],
-        "dateAdapter": [16],
-        "isMedium": [32]
-    }, undefined, {
-        "item": ["itemWatcher"]
-    }]);
-function defineCustomElement() {
-    if (typeof customElements === "undefined") {
-        return;
-    }
-    const components = ["stzh-bathstatus-item", "stzh-badge", "stzh-icon", "stzh-link"];
-    components.forEach(tagName => { switch (tagName) {
-        case "stzh-bathstatus-item":
-            if (!customElements.get(transformTag(tagName))) {
-                customElements.define(transformTag(tagName), StzhBathstatusItem);
-            }
-            break;
-        case "stzh-badge":
-            if (!customElements.get(transformTag(tagName))) {
-                defineCustomElement$3();
-            }
-            break;
-        case "stzh-icon":
-            if (!customElements.get(transformTag(tagName))) {
-                defineCustomElement$2();
-            }
-            break;
-        case "stzh-link":
-            if (!customElements.get(transformTag(tagName))) {
-                defineCustomElement$1();
-            }
-            break;
-    } });
-}
-
-export { StzhBathstatusItem as S, defineCustomElement as d };
-//# sourceMappingURL=p-CViAWrjM.js.map
-
-//# sourceMappingURL=p-CViAWrjM.js.map

package/dist/components/p-CViAWrjM.js.map

@@ -1 +0,0 @@
-{"file":"p-CViAWrjM.js","mappings":"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","names":["__stencil_proxyCustomElement","HTMLElement"],"sources":["src/components/CMS/stzh-bathstatus-item/stzh-bathstatus-item.scss?tag=stzh-bathstatus-item&encapsulation=scoped","src/components/CMS/stzh-bathstatus-item/stzh-bathstatus-item.tsx"],"sourcesContent":[":host {\n}\n\n.stzh-bathstatus-item {\n  background-color: var(--stzh-color-grey10);\n  padding-top: var(--stzh-space-xlarge);\n  padding-right: var(--stzh-space-large);\n  padding-bottom: var(--stzh-space-xlarge);\n  padding-left: var(--stzh-space-large);\n\n  &__description,\n  &-value {\n    @include fontSize(\"milli\");\n  }\n\n  &__title {\n    @include fontSize(\"milli\");\n\n    @include mq($from: medium) {\n      @include fontSize(\"centi\");\n    }\n  }\n\n  &-container {\n    display: grid;\n    grid-template-columns: max-content 1fr;\n    gap: var(--stzh-space-small) var(--stzh-space-xlarge);\n    align-items: center;\n  }\n\n  &-key {\n    @include fontSize(\"nano\");\n    color: var(--stzh-color-grey70);\n  }\n\n  /** Variant teaser */\n\n  &--teaser &__title {\n    display: none;\n  }\n\n  &--teaser &__description {\n    margin-bottom: var(--stzh-space-medium);\n  }\n\n  /** Variant list */\n\n  &--list {\n    padding-top: var(--stzh-space-small);\n    padding-right: var(--stzh-space-xsmall);\n    padding-bottom: var(--stzh-space-small);\n    padding-left: var(--stzh-space-xsmall);\n\n    @include mq($from: medium) {\n      padding-top: var(--stzh-space-medium);\n      padding-right: var(--stzh-space-large);\n      padding-bottom: var(--stzh-space-medium);\n      padding-left: var(--stzh-space-large);\n    }\n  }\n\n  &--list &__description,\n  &--list &-key,\n  &--list &-uv-index-prediction {\n    display: none;\n  }\n\n  &--list &-container {\n    grid-template-columns: repeat(4, minmax(0, 1fr));\n  }\n\n  &--list &-value {\n    @include fontSize(\"micro\");\n\n    @include mq($from: medium) {\n      @include fontSize(\"milli\");\n    }\n  }\n}\n","import { Component, Element, Fragment, h, Host, Prop, State, Watch } from \"@stencil/core\";\nimport { StzhBathstatusItemData, StzhLocaleAdapter } from \"../../../index\";\nimport { StzhBathstatusItemLocalizedText } from \"./stzh-bathstatus-item.localization\";\nimport { addMediaChangeListener, media, removeMediaChangeListener } from \"../../../utils/media-utils\";\n\n/**\n *\n */\n@Component({\n  tag: \"stzh-bathstatus-item\",\n  styleUrl: \"stzh-bathstatus-item.scss\",\n  scoped: true,\n})\nexport class StzhBathstatusItem {\n  /** Translation strings */\n  @Prop() localization: StzhBathstatusItemLocalizedText;\n\n  /** Variant */\n  @Prop() variant: \"teaser\" | \"list\" = \"teaser\";\n\n  /** Bathstatus item */\n  @Prop() item: StzhBathstatusItemData | string = \"\";\n  private _item: StzhBathstatusItemData | undefined;\n\n  /**\n   * Date adapter, for custom parsing/formatting.\n   * Must be object with a `parse` function which accepts a `string` and returns a `Date`,\n   * and a `format` function which accepts a `Date` and returns a `string`.\n   */\n  @Prop() dateAdapter: StzhLocaleAdapter;\n\n  @Element() element: HTMLStzhBathstatusItemElement;\n\n  @State() isMedium: boolean;\n\n  @Watch(\"item\")\n  itemWatcher(newValue: StzhBathstatusItemData | string) {\n    if (!newValue) {\n      this._item = undefined;\n    } else if (typeof newValue === \"string\") {\n      try {\n        this._item = JSON.parse(newValue);\n      } catch (e) {\n        this._item = undefined;\n      }\n    } else {\n      this._item = newValue;\n    }\n  }\n\n  private mediaChangeHandler = () => {\n    this.isMedium = media(\"medium\").matches;\n  };\n\n  private init = () => {\n    this.itemWatcher(this.item);\n  };\n\n  private getParsedDate(dateStr: string): Date | null {\n    const parsedDate = new Date(dateStr);\n    if (isNaN(parsedDate.getTime())) {\n      return null;\n    }\n    return parsedDate;\n  }\n\n  async componentWillLoad() {\n    if (!this.localization) {\n      this.localization = await window.stzhComponents.utils.fetchTranslations(this.element, \"bathstatus-item\");\n    }\n    if (!this.dateAdapter) {\n      this.dateAdapter = window.stzhComponents.utils.createFormatParseAdapter(\n        this.localization.$formats,\n        this.localization.$globals,\n      );\n    }\n  }\n\n  connectedCallback() {\n    this.init();\n    this.mediaChangeHandler();\n    addMediaChangeListener(this.mediaChangeHandler);\n  }\n\n  disconnectedCallback() {\n    removeMediaChangeListener(this.mediaChangeHandler);\n  }\n\n  render() {\n    const classes = {\n      \"stzh-bathstatus-item\": true,\n      [`stzh-bathstatus-item--${this.variant}`]: true,\n    };\n\n    return (\n      <Host>\n        <div class={classes}>\n          {!!this._item.description && <div class=\"stzh-bathstatus-item__description\">{this._item.description}</div>}\n          <div class=\"stzh-bathstatus-item-container\">\n            <stzh-link\n              class=\"stzh-bathstatus-item__title\"\n              size=\"default\"\n              textAlign={\"left\"}\n              href={this._item.url}\n              label={this._item.title}\n            ></stzh-link>\n            {!!this._item.temp && (\n              <Fragment>\n                <div class=\"stzh-bathstatus-item-key\">{this.localization.temperature}</div>\n                <div class=\"stzh-bathstatus-item-value\">{this._item.temp}</div>\n              </Fragment>\n            )}\n            {!!this._item.statusMessage && (\n              <Fragment>\n                <div class=\"stzh-bathstatus-item-key\">{this.localization.status}</div>\n                <div class=\"stzh-bathstatus-item-value\">{this._item.statusMessage}</div>\n              </Fragment>\n            )}\n            {!!this._item.lastUpdate && (\n              <Fragment>\n                <div class=\"stzh-bathstatus-item-key\">{this.localization.lastUpdate}</div>\n                <div class=\"stzh-bathstatus-item-value\">\n                  {this.isMedium ? (\n                    <Fragment>\n                      {this.dateAdapter.format(this.getParsedDate(this._item.lastUpdate), \"datetimeLong\")}\n                    </Fragment>\n                  ) : (\n                    <Fragment>\n                      {this.dateAdapter.format(this.getParsedDate(this._item.lastUpdate), \"dateInput\")}{\" \"}\n                      {this.dateAdapter.format(this.getParsedDate(this._item.lastUpdate), \"time\")}\n                    </Fragment>\n                  )}\n                </div>\n              </Fragment>\n            )}\n            {!!this._item.uvIndexPrediction && (\n              <Fragment>\n                <div class=\"stzh-bathstatus-item-key\">{this.localization.uvIndexPrediction}</div>\n                <div class=\"stzh-bathstatus-item-value stzh-bathstatus-item-uv-index-prediction\">\n                  <img\n                    src={`${window.stzhComponents.pathMedia}/uvindex/uvindex_${this._item.uvIndexPrediction}.gif`}\n                    alt={\"UV Index\" + this._item.uvIndexPrediction}\n                  />\n                </div>\n              </Fragment>\n            )}\n          </div>\n        </div>\n      </Host>\n    );\n  }\n}\n"],"version":3}

package/dist/components/p-CYfVlAWz.js

@@ -1,38 +0,0 @@
-import { p as proxyCustomElement, H, h, e as Host, t as transformTag } from './p-DAS4ghWk.js';
-
-const stzhChipgroupCss = () => `.sc-stzh-chipgroup-h{font-family:var(--stzh-font-family-medium);font-weight:var(--stzh-font-weight-medium);font-style:var(--stzh-font-style-medium);color:var(--stzh-base-color);box-sizing:border-box;display:block}[hidden].sc-stzh-chipgroup-h,[stzh-hidden].sc-stzh-chipgroup-h{display:none}.sc-stzh-chipgroup-h::selection{color:var(--stzh-selection-color);background-color:var(--stzh-selection-background-color)}.sc-stzh-chipgroup-h *.sc-stzh-chipgroup,.sc-stzh-chipgroup-h *.sc-stzh-chipgroup::before,.sc-stzh-chipgroup-h *.sc-stzh-chipgroup::after{box-sizing:border-box;text-underline-offset:var(--stzh-link-text-underline-offset);text-decoration-thickness:var(--stzh-link-text-decoration-thickness);-webkit-text-decoration-skip-ink:var(--stzh-link-text-decoration-skip-ink);text-decoration-skip-ink:var(--stzh-link-text-decoration-skip-ink)}.sc-stzh-chipgroup-h .has-focus.sc-stzh-chipgroup{outline:var(--stzh-flyingfocus-color) solid 0.125rem;outline-offset:0.125rem}.sc-stzh-chipgroup-h .stzh-fylingfocus-focused.sc-stzh-chipgroup{outline-style:none !important}.sc-stzh-chipgroup-h .stzh-fylingfocus-focused.sc-stzh-chipgroup::-moz-focus-inner{border:0 !important}.stzh-chipgroup.sc-stzh-chipgroup{display:flex;gap:var(--stzh-space-medium)}`;
-
-const StzhChipgroup = /*@__PURE__*/ proxyCustomElement(class StzhChipgroup extends H {
-    constructor(registerHost) {
-        super();
-        if (registerHost !== false) {
-            this.__registerHost();
-        }
-    }
-    render() {
-        const classes = {
-            "stzh-chipgroup": true,
-        };
-        return (h(Host, { key: '4c7e64f4acb37e905527d8162bc37b8704193a47' }, h("div", { key: '6ea413f28a9046dc884dce3d4f003760df0e4e53', class: classes }, h("slot", { key: 'f6d1747555d06553f1dda0e04881036912c204c3' }))));
-    }
-    get element() { return this; }
-    static get style() { return stzhChipgroupCss(); }
-}, [262, "stzh-chipgroup"]);
-function defineCustomElement() {
-    if (typeof customElements === "undefined") {
-        return;
-    }
-    const components = ["stzh-chipgroup"];
-    components.forEach(tagName => { switch (tagName) {
-        case "stzh-chipgroup":
-            if (!customElements.get(transformTag(tagName))) {
-                customElements.define(transformTag(tagName), StzhChipgroup);
-            }
-            break;
-    } });
-}
-
-export { StzhChipgroup as S, defineCustomElement as d };
-//# sourceMappingURL=p-CYfVlAWz.js.map
-
-//# sourceMappingURL=p-CYfVlAWz.js.map

package/dist/components/p-CYfVlAWz.js.map

@@ -1 +0,0 @@
-{"file":"p-CYfVlAWz.js","mappings":";;AAAA,MAAM,gBAAgB,GAAG,MAAM,CAAC,4tCAA4tC,CAAC;;MCUhvC,aAAa,iBAAAA,kBAAA,CAAA,MAAA,aAAA,SAAAC,CAAA,CAAA;;;;;;;IAGxB,MAAM,GAAA;AACJ,QAAA,MAAM,OAAO,GAAG;AACd,YAAA,gBAAgB,EAAE,IAAI;SACvB;AAED,QAAA,QACE,EAAC,IAAI,EAAA,EAAA,GAAA,EAAA,0CAAA,EAAA,EACH,CAAK,CAAA,KAAA,EAAA,EAAA,GAAA,EAAA,0CAAA,EAAA,KAAK,EAAE,OAAO,EAAA,EACjB,CAAa,CAAA,MAAA,EAAA,EAAA,GAAA,EAAA,0CAAA,EAAA,CAAA,CACT,CACD;;;;;;;;;;;;;;;;;;;;;","names":["__stencil_proxyCustomElement","HTMLElement"],"sources":["src/components/stzh-chipgroup/stzh-chipgroup.scss?tag=stzh-chipgroup&encapsulation=scoped","src/components/stzh-chipgroup/stzh-chipgroup.tsx"],"sourcesContent":[":host {\n}\n\n.stzh-chipgroup {\n  display: flex;\n  gap: space(\"medium\");\n}\n","import { Component, Host, h, Element } from \"@stencil/core\";\n\n/**\n * @slot - Slot for chips\n */\n@Component({\n  tag: \"stzh-chipgroup\",\n  styleUrl: \"stzh-chipgroup.scss\",\n  scoped: true,\n})\nexport class StzhChipgroup {\n  @Element() element: HTMLStzhChipgroupElement;\n\n  render() {\n    const classes = {\n      \"stzh-chipgroup\": true,\n    };\n\n    return (\n      <Host>\n        <div class={classes}>\n          <slot></slot>\n        </div>\n      </Host>\n    );\n  }\n}\n"],"version":3}