@itcenteratunihelsinki/huds-lib 0.8.72 → 0.8.74

package/dist/collection/components/hy-hero/hy-hero.js

@@ -1,489 +1,454 @@
-let timeout = null;
-let delay = 250;
 import { h, Host } from "@stencil/core";
 import { jsonParserWorker } from "../../global/globalScript";
 import { CtaLinkButtonVariants, HeroColorVariant, HeroSizeVariant, HeroGroupTypeVariant, HeroTypeVariant, } from "../../utils/utils";
 export class HyHero {
-  constructor() {
-    this.heroType = HeroTypeVariant.landing;
-    this.heroGroupType = HeroGroupTypeVariant.default;
-    this.colorVariant = HeroColorVariant.blue;
-    this.sizeVariant = HeroSizeVariant.large;
-    this.heroTextColor = null;
-    this.image = undefined;
-    this.imageHeight = null;
-    this.imageWidth = null;
-    this.imageAltText = "";
-    this.disableLazy = false;
-    this.hasShortcuts = false;
-    this.heading = undefined;
-    this.description = undefined;
-    this.subtitle = undefined;
-    this.url = undefined;
-    this.urlTitle = undefined;
-    this.scLabel = undefined;
-    this.isExternal = false;
-    this.sourceSet = undefined;
-  }
-  async componentWillLoad() {
-    this._sourceSet = await jsonParserWorker(this.sourceSet);
-  }
-  // TODO: Refactor, find way to get rid of this.
-  handleHeroImageObjectFitValue(heroSizeVariant, heroElement) {
-    const heroContentContainerElement = heroElement.getElementsByClassName("hy-hero__content-container")[0];
-    if (heroSizeVariant === "small") {
-      if (heroContentContainerElement.offsetHeight >= 300) {
-        heroElement.classList.add("has-cover");
-      }
-      else {
-        heroElement.classList.remove("has-cover");
-      }
+    constructor() {
+        this.heroType = HeroTypeVariant.landing;
+        this.heroGroupType = HeroGroupTypeVariant.default;
+        this.colorVariant = HeroColorVariant.blue;
+        this.sizeVariant = HeroSizeVariant.large;
+        this.heroTextColor = null;
+        this.image = undefined;
+        this.imageHeight = null;
+        this.imageWidth = null;
+        this.imageAltText = "";
+        this.disableLazy = false;
+        this.hasShortcuts = false;
+        this.heading = undefined;
+        this.description = undefined;
+        this.subtitle = undefined;
+        this.url = undefined;
+        this.urlTitle = undefined;
+        this.scLabel = undefined;
+        this.isExternal = false;
+        this.sourceSet = undefined;
     }
-    if (heroSizeVariant === "large") {
-      if (heroContentContainerElement.offsetHeight >= 344) {
-        heroElement.classList.add("has-cover");
-      }
-      else {
-        heroElement.classList.remove("has-cover");
-      }
+    async componentWillLoad() {
+        this._sourceSet = await jsonParserWorker(this.sourceSet);
     }
-  }
-  createImageElement(props, srcSet, aspectRatio) {
-    return (h("div", { class: `hy-hero__image-container`, style: aspectRatio }, props.image &&
-      (srcSet ? (h("picture", null, srcSet.map((item) => (h("source", { srcSet: item.src, media: item.media, type: item.type, sizes: item.sizes ? item.sizes : "" }))), h("img", { loading: props.disableLazy ? "eager" : "lazy", alt: props.imageAltText, class: `hy-image__image`, src: props.image, height: props.imageHeight, width: props.imageWidth }))) : (h("img", { loading: props.disableLazy ? "eager" : "lazy", alt: props.imageAltText, class: `hy-image__image`, src: props.image, height: props.imageHeight, width: props.imageWidth })))));
-  }
-  // TODO: Refactor, is this still even used?
-  setAspectRatio(aspectRatioWidth = 16, aspectRatioHeight = 10) {
-    const aspect = (aspectRatioHeight / aspectRatioWidth) * 100;
-    return {
-      "--aspectRatio": `${aspect}%`,
-      //"aspect-ratio": `${aspectRatioWidth} / ${aspectRatioHeight}` as "aspectRatio",
-    };
-  }
-  render() {
-    let variant = CtaLinkButtonVariants.heroWhite;
-    let colorVariantValue = this.colorVariant;
-    let heroTypeValue = this.heroType;
-    //TODO: Refactor
-    if (this.heroType === "minor_landing") {
-      colorVariantValue = HeroColorVariant.white;
-      heroTypeValue = HeroTypeVariant.landing;
+    createImageElement(props, srcSet, aspectRatio) {
+        return (h("div", { class: `hy-hero__image-container`, style: aspectRatio }, props.image &&
+            (srcSet ? (h("picture", null, srcSet.map((item) => (h("source", { srcSet: item.src, media: item.media, type: item.type, sizes: item.sizes ? item.sizes : "" }))), h("img", { loading: props.disableLazy ? "eager" : "lazy", alt: props.imageAltText, class: `hy-image__image`, src: props.image, height: props.imageHeight, width: props.imageWidth }))) : (h("img", { loading: props.disableLazy ? "eager" : "lazy", alt: props.imageAltText, class: `hy-image__image`, src: props.image, height: props.imageHeight, width: props.imageWidth })))));
     }
-    if (colorVariantValue === HeroColorVariant.blue) {
-      variant = CtaLinkButtonVariants.heroBlue;
+    render() {
+        let variant = CtaLinkButtonVariants.heroWhite;
+        let colorVariantValue = this.colorVariant;
+        let heroTypeValue = this.heroType;
+        if (this.heroType === "minor_landing") {
+            colorVariantValue = HeroColorVariant.white;
+            heroTypeValue = HeroTypeVariant.landing;
+        }
+        if (colorVariantValue === HeroColorVariant.blue) {
+            variant = CtaLinkButtonVariants.heroBlue;
+        }
+        if (colorVariantValue === HeroColorVariant.black) {
+            variant = CtaLinkButtonVariants.heroBlack;
+        }
+        if (!colorVariantValue || colorVariantValue === "fp_white") {
+            colorVariantValue = HeroColorVariant.white;
+        }
+        const hyHeroClasses = [
+            "hy-hero",
+            `hy-hero--${heroTypeValue}`,
+            `hy-hero--${this.heroGroupType}`,
+            `hy-hero--${colorVariantValue}`,
+            `hy-hero--${this.sizeVariant}`,
+            this.hasShortcuts ? "has-shortcuts" : "",
+        ];
+        const heroTitleClasses = ["hy-hero__title", "hy-heading__hero"].join(" ");
+        if (heroTypeValue === "front_page" && this.sizeVariant !== "full-image") {
+            return (h(Host, null, h("div", { class: hyHeroClasses.join(" ") }, h("div", { class: `hy-hero__container` }, this.createImageElement(this, this._sourceSet, { "--aspect-ratio": "16 / 10" }), h("div", { class: `hy-hero__spacer-box` }), h("div", { class: `hy-hero__content-container` }, h("div", { class: `hy-hero__content` }, h("div", { class: `hy-hero__title-container` }, h("h2", { innerHTML: this.heading, class: heroTitleClasses })), this.description && h("p", { class: `hy-hero__description` }, this.description), this.url && (h("div", { class: `hy-hero__actions` }, h("hy-cta-button", { "link-content": this.urlTitle, "sc-label": this.scLabel, url: this.url, "is-external": this.isExternal, variant: variant }))))))), h("hy-box", { mb: "2, 2, 1, 1" })));
+        }
+        if (this.sizeVariant === "full-image") {
+            const linkTarget = this.isExternal ? "_blank" : "_self";
+            return (h("div", { class: `hy-hero hy-hero--full-image` }, h("div", { class: `hy-hero__container` }, this.createImageElement(this, this._sourceSet, { "--aspect-ratio": "16 / 8" }), h("div", { class: `hy-hero__content-container` }, h("div", { class: `hy-hero__content`, "data-text-color": this.heroTextColor }, this.subtitle && h("span", { class: `hy-hero__subtitle` }, this.subtitle), h("h2", { innerHTML: this.heading, class: heroTitleClasses }), this.description && h("p", { class: `hy-hero__description` }, this.description), this.url && (h("div", { class: `hy-hero__actions` }, h("a", { class: "hy-hero__link", href: this.url, "aria-label": this.scLabel, target: linkTarget, "data-text-color": this.heroTextColor }, this.urlTitle, h("hy-icon", { icon: "hy-icon-arrow-right", size: 16 })))))))));
+        }
+        return (h(Host, null, h("div", { class: hyHeroClasses.join(" ") }, h("div", { class: `hy-hero__container` }, this.createImageElement(this, this._sourceSet, { "--aspect-ratio": "16 / 10" }), h("div", { class: `hy-hero__content-container` }, h("div", { class: `hy-hero__content` }, h("div", { class: `hy-hero__title-container` }, h("h2", { innerHTML: this.heading, class: heroTitleClasses })), this.description && h("p", { class: `hy-hero__description` }, this.description), this.url && (h("div", { class: `hy-hero__actions` }, h("hy-cta-button", { "link-content": this.urlTitle, "sc-label": this.scLabel, url: this.url, "is-external": this.isExternal, variant: variant }))))))), h("hy-box", { mb: "2, 2, 1, 1" })));
     }
-    if (colorVariantValue === HeroColorVariant.black) {
-      variant = CtaLinkButtonVariants.heroBlack;
+    static get is() { return "hy-hero"; }
+    static get originalStyleUrls() {
+        return {
+            "$": ["hy-hero.scss"]
+        };
     }
-    if (!colorVariantValue || colorVariantValue === "fp_white") {
-      colorVariantValue = HeroColorVariant.white;
+    static get styleUrls() {
+        return {
+            "$": ["hy-hero.css"]
+        };
     }
-    const hyHeroClasses = [
-      "hy-hero",
-      `hy-hero--${heroTypeValue}`,
-      `hy-hero--${this.heroGroupType}`,
-      `hy-hero--${colorVariantValue}`,
-      `hy-hero--${this.sizeVariant}`,
-      this.hasShortcuts ? 'has-shortcuts' : '',
-    ];
-    const heroTitleClasses = ["hy-hero__title", "hy-heading__hero"].join(" ");
-    // TODO: Refactor, find way to get rid of this.
-    window.onload = () => {
-      const heroElement = document.getElementsByClassName("hy-hero")[0];
-      this.handleHeroImageObjectFitValue(this.sizeVariant, heroElement);
-      window.addEventListener("resize", () => {
-        clearTimeout(timeout);
-        timeout = setTimeout(() => this.handleHeroImageObjectFitValue(this.sizeVariant, heroElement), delay);
-      });
-    };
-    if (heroTypeValue === "front_page" && this.sizeVariant !== 'full-image') {
-      return (h(Host, null, h("div", { class: hyHeroClasses.join(" ") }, h("div", { class: `hy-hero__container` }, this.createImageElement(this, this._sourceSet, this.setAspectRatio()), h("div", { class: `hy-hero__spacer-box` }), h("div", { class: `hy-hero__content-container` }, h("div", { class: `hy-hero__content` }, h("div", { class: `hy-hero__title-container` }, h("h2", { innerHTML: this.heading, class: heroTitleClasses })), this.description && h("p", { class: `hy-hero__description` }, this.description), this.url && (h("div", { class: `hy-hero__actions` }, h("hy-cta-button", { "link-content": this.urlTitle, "sc-label": this.scLabel, url: this.url, "is-external": this.isExternal, variant: variant }))))))), h("hy-box", { mb: "2, 2, 1, 1" })));
-    }
-    if (this.sizeVariant === 'full-image') {
-      const linkTarget = this.isExternal ? '_blank' : '_self';
-      return (h("div", { class: `hy-hero hy-hero--full-image` }, h("div", { class: `hy-hero__container` }, this.createImageElement(this, this._sourceSet, this.setAspectRatio(16, 8)), h("div", { class: `hy-hero__content-container` }, h("div", { class: `hy-hero__content`, "data-text-color": this.heroTextColor }, this.subtitle && h("span", { class: `hy-hero__subtitle` }, this.subtitle), h("h2", { innerHTML: this.heading, class: heroTitleClasses }), this.description && h("p", { class: `hy-hero__description` }, this.description), this.url && (h("div", { class: `hy-hero__actions` }, h("a", { class: "hy-hero__link", href: this.url, "aria-label": this.scLabel, target: linkTarget, "data-text-color": this.heroTextColor }, this.urlTitle, h("hy-icon", { icon: "hy-icon-arrow-right", size: 16 })))))))));
-    }
-    return (h(Host, null, h("div", { class: hyHeroClasses.join(" ") }, h("div", { class: `hy-hero__container` }, this.createImageElement(this, this._sourceSet, this.setAspectRatio()), h("div", { class: `hy-hero__content-container` }, h("div", { class: `hy-hero__content` }, h("div", { class: `hy-hero__title-container` }, h("h2", { innerHTML: this.heading, class: heroTitleClasses })), this.description && h("p", { class: `hy-hero__description` }, this.description), this.url && (h("div", { class: `hy-hero__actions` }, h("hy-cta-button", { "link-content": this.urlTitle, "sc-label": this.scLabel, url: this.url, "is-external": this.isExternal, variant: variant }))))))), h("hy-box", { mb: "2, 2, 1, 1" })));
-  }
-  static get is() { return "hy-hero"; }
-  static get originalStyleUrls() {
-    return {
-      "$": ["hy-hero.scss"]
-    };
-  }
-  static get styleUrls() {
-    return {
-      "$": ["hy-hero.css"]
-    };
-  }
-  static get properties() {
-    return {
-      "heroType": {
-        "type": "string",
-        "mutable": false,
-        "complexType": {
-          "original": "HeroTypeVariant",
-          "resolved": "HeroTypeVariant.front_page | HeroTypeVariant.group_landing | HeroTypeVariant.landing | HeroTypeVariant.minor_landing",
-          "references": {
-            "HeroTypeVariant": {
-              "location": "import",
-              "path": "../../utils/utils"
-            }
-          }
-        },
-        "required": false,
-        "optional": false,
-        "docs": {
-          "tags": [],
-          "text": ""
-        },
-        "attribute": "hero-type",
-        "reflect": false,
-        "defaultValue": "HeroTypeVariant.landing"
-      },
-      "heroGroupType": {
-        "type": "string",
-        "mutable": false,
-        "complexType": {
-          "original": "HeroGroupTypeVariant",
-          "resolved": "HeroGroupTypeVariant.default | HeroGroupTypeVariant.research",
-          "references": {
-            "HeroGroupTypeVariant": {
-              "location": "import",
-              "path": "../../utils/utils"
-            }
-          }
-        },
-        "required": false,
-        "optional": false,
-        "docs": {
-          "tags": [],
-          "text": ""
-        },
-        "attribute": "hero-group-type",
-        "reflect": false,
-        "defaultValue": "HeroGroupTypeVariant.default"
-      },
-      "colorVariant": {
-        "type": "string",
-        "mutable": false,
-        "complexType": {
-          "original": "HeroColorVariant",
-          "resolved": "HeroColorVariant.black | HeroColorVariant.blue | HeroColorVariant.fp_white | HeroColorVariant.white",
-          "references": {
-            "HeroColorVariant": {
-              "location": "import",
-              "path": "../../utils/utils"
+    static get properties() {
+        return {
+            "heroType": {
+                "type": "string",
+                "mutable": false,
+                "complexType": {
+                    "original": "HeroTypeVariant",
+                    "resolved": "HeroTypeVariant.front_page | HeroTypeVariant.group_landing | HeroTypeVariant.landing | HeroTypeVariant.minor_landing",
+                    "references": {
+                        "HeroTypeVariant": {
+                            "location": "import",
+                            "path": "../../utils/utils",
+                            "id": "src/utils/utils.ts::HeroTypeVariant"
+                        }
+                    }
+                },
+                "required": false,
+                "optional": false,
+                "docs": {
+                    "tags": [],
+                    "text": ""
+                },
+                "attribute": "hero-type",
+                "reflect": false,
+                "defaultValue": "HeroTypeVariant.landing"
+            },
+            "heroGroupType": {
+                "type": "string",
+                "mutable": false,
+                "complexType": {
+                    "original": "HeroGroupTypeVariant",
+                    "resolved": "HeroGroupTypeVariant.default | HeroGroupTypeVariant.research",
+                    "references": {
+                        "HeroGroupTypeVariant": {
+                            "location": "import",
+                            "path": "../../utils/utils",
+                            "id": "src/utils/utils.ts::HeroGroupTypeVariant"
+                        }
+                    }
+                },
+                "required": false,
+                "optional": false,
+                "docs": {
+                    "tags": [],
+                    "text": ""
+                },
+                "attribute": "hero-group-type",
+                "reflect": false,
+                "defaultValue": "HeroGroupTypeVariant.default"
+            },
+            "colorVariant": {
+                "type": "string",
+                "mutable": false,
+                "complexType": {
+                    "original": "HeroColorVariant",
+                    "resolved": "HeroColorVariant.black | HeroColorVariant.blue | HeroColorVariant.fp_white | HeroColorVariant.white",
+                    "references": {
+                        "HeroColorVariant": {
+                            "location": "import",
+                            "path": "../../utils/utils",
+                            "id": "src/utils/utils.ts::HeroColorVariant"
+                        }
+                    }
+                },
+                "required": false,
+                "optional": false,
+                "docs": {
+                    "tags": [],
+                    "text": ""
+                },
+                "attribute": "color-variant",
+                "reflect": false,
+                "defaultValue": "HeroColorVariant.blue"
+            },
+            "sizeVariant": {
+                "type": "string",
+                "mutable": false,
+                "complexType": {
+                    "original": "HeroSizeVariant",
+                    "resolved": "HeroSizeVariant.fullImage | HeroSizeVariant.large | HeroSizeVariant.small",
+                    "references": {
+                        "HeroSizeVariant": {
+                            "location": "import",
+                            "path": "../../utils/utils",
+                            "id": "src/utils/utils.ts::HeroSizeVariant"
+                        }
+                    }
+                },
+                "required": false,
+                "optional": false,
+                "docs": {
+                    "tags": [],
+                    "text": ""
+                },
+                "attribute": "size-variant",
+                "reflect": false,
+                "defaultValue": "HeroSizeVariant.large"
+            },
+            "heroTextColor": {
+                "type": "string",
+                "mutable": false,
+                "complexType": {
+                    "original": "HeroTextColor",
+                    "resolved": "HeroTextColor.dark_text_light_bg | HeroTextColor.dark_text_no_bg | HeroTextColor.light_text_dark_bg | HeroTextColor.light_text_no_bg",
+                    "references": {
+                        "HeroTextColor": {
+                            "location": "import",
+                            "path": "../../utils/utils",
+                            "id": "src/utils/utils.ts::HeroTextColor"
+                        }
+                    }
+                },
+                "required": false,
+                "optional": false,
+                "docs": {
+                    "tags": [],
+                    "text": ""
+                },
+                "attribute": "hero-text-color",
+                "reflect": false,
+                "defaultValue": "null"
+            },
+            "image": {
+                "type": "string",
+                "mutable": false,
+                "complexType": {
+                    "original": "string",
+                    "resolved": "string",
+                    "references": {}
+                },
+                "required": false,
+                "optional": false,
+                "docs": {
+                    "tags": [],
+                    "text": ""
+                },
+                "attribute": "image",
+                "reflect": false
+            },
+            "imageHeight": {
+                "type": "number",
+                "mutable": false,
+                "complexType": {
+                    "original": "number",
+                    "resolved": "number",
+                    "references": {}
+                },
+                "required": false,
+                "optional": false,
+                "docs": {
+                    "tags": [],
+                    "text": ""
+                },
+                "attribute": "image-height",
+                "reflect": false,
+                "defaultValue": "null"
+            },
+            "imageWidth": {
+                "type": "number",
+                "mutable": false,
+                "complexType": {
+                    "original": "number",
+                    "resolved": "number",
+                    "references": {}
+                },
+                "required": false,
+                "optional": false,
+                "docs": {
+                    "tags": [],
+                    "text": ""
+                },
+                "attribute": "image-width",
+                "reflect": false,
+                "defaultValue": "null"
+            },
+            "imageAltText": {
+                "type": "string",
+                "mutable": false,
+                "complexType": {
+                    "original": "string",
+                    "resolved": "string",
+                    "references": {}
+                },
+                "required": false,
+                "optional": false,
+                "docs": {
+                    "tags": [],
+                    "text": ""
+                },
+                "attribute": "image-alt-text",
+                "reflect": false,
+                "defaultValue": "\"\""
+            },
+            "disableLazy": {
+                "type": "boolean",
+                "mutable": false,
+                "complexType": {
+                    "original": "boolean",
+                    "resolved": "boolean",
+                    "references": {}
+                },
+                "required": false,
+                "optional": false,
+                "docs": {
+                    "tags": [],
+                    "text": ""
+                },
+                "attribute": "disable-lazy",
+                "reflect": false,
+                "defaultValue": "false"
+            },
+            "hasShortcuts": {
+                "type": "boolean",
+                "mutable": false,
+                "complexType": {
+                    "original": "boolean",
+                    "resolved": "boolean",
+                    "references": {}
+                },
+                "required": false,
+                "optional": false,
+                "docs": {
+                    "tags": [],
+                    "text": ""
+                },
+                "attribute": "has-shortcuts",
+                "reflect": false,
+                "defaultValue": "false"
+            },
+            "heading": {
+                "type": "string",
+                "mutable": false,
+                "complexType": {
+                    "original": "string",
+                    "resolved": "string",
+                    "references": {}
+                },
+                "required": false,
+                "optional": false,
+                "docs": {
+                    "tags": [],
+                    "text": ""
+                },
+                "attribute": "heading",
+                "reflect": false
+            },
+            "description": {
+                "type": "string",
+                "mutable": false,
+                "complexType": {
+                    "original": "string",
+                    "resolved": "string",
+                    "references": {}
+                },
+                "required": false,
+                "optional": false,
+                "docs": {
+                    "tags": [],
+                    "text": ""
+                },
+                "attribute": "description",
+                "reflect": false
+            },
+            "subtitle": {
+                "type": "string",
+                "mutable": false,
+                "complexType": {
+                    "original": "string",
+                    "resolved": "string",
+                    "references": {}
+                },
+                "required": false,
+                "optional": false,
+                "docs": {
+                    "tags": [],
+                    "text": ""
+                },
+                "attribute": "subtitle",
+                "reflect": false
+            },
+            "url": {
+                "type": "string",
+                "mutable": false,
+                "complexType": {
+                    "original": "string",
+                    "resolved": "string",
+                    "references": {}
+                },
+                "required": false,
+                "optional": false,
+                "docs": {
+                    "tags": [],
+                    "text": ""
+                },
+                "attribute": "url",
+                "reflect": false
+            },
+            "urlTitle": {
+                "type": "string",
+                "mutable": false,
+                "complexType": {
+                    "original": "string",
+                    "resolved": "string",
+                    "references": {}
+                },
+                "required": false,
+                "optional": false,
+                "docs": {
+                    "tags": [],
+                    "text": ""
+                },
+                "attribute": "url-title",
+                "reflect": false
+            },
+            "scLabel": {
+                "type": "string",
+                "mutable": false,
+                "complexType": {
+                    "original": "string",
+                    "resolved": "string",
+                    "references": {}
+                },
+                "required": false,
+                "optional": true,
+                "docs": {
+                    "tags": [],
+                    "text": ""
+                },
+                "attribute": "sc-label",
+                "reflect": false
+            },
+            "isExternal": {
+                "type": "boolean",
+                "mutable": false,
+                "complexType": {
+                    "original": "boolean",
+                    "resolved": "boolean",
+                    "references": {}
+                },
+                "required": false,
+                "optional": false,
+                "docs": {
+                    "tags": [],
+                    "text": ""
+                },
+                "attribute": "is-external",
+                "reflect": false,
+                "defaultValue": "false"
+            },
+            "sourceSet": {
+                "type": "string",
+                "mutable": false,
+                "complexType": {
+                    "original": "ImageSrcSet[] | string",
+                    "resolved": "ImageSrcSet[] | string",
+                    "references": {
+                        "ImageSrcSet": {
+                            "location": "local",
+                            "path": "/Users/tuukkaturu/hy/hy-ds/design-system-lib/core/src/components/hy-hero/hy-hero.tsx",
+                            "id": "src/components/hy-hero/hy-hero.tsx::ImageSrcSet"
+                        }
+                    }
+                },
+                "required": false,
+                "optional": false,
+                "docs": {
+                    "tags": [],
+                    "text": ""
+                },
+                "attribute": "source-set",
+                "reflect": false
             }
-          }
-        },
-        "required": false,
-        "optional": false,
-        "docs": {
-          "tags": [],
-          "text": ""
-        },
-        "attribute": "color-variant",
-        "reflect": false,
-        "defaultValue": "HeroColorVariant.blue"
-      },
-      "sizeVariant": {
-        "type": "string",
-        "mutable": false,
-        "complexType": {
-          "original": "HeroSizeVariant",
-          "resolved": "HeroSizeVariant.fullImage | HeroSizeVariant.large | HeroSizeVariant.small",
-          "references": {
-            "HeroSizeVariant": {
-              "location": "import",
-              "path": "../../utils/utils"
-            }
-          }
-        },
-        "required": false,
-        "optional": false,
-        "docs": {
-          "tags": [],
-          "text": ""
-        },
-        "attribute": "size-variant",
-        "reflect": false,
-        "defaultValue": "HeroSizeVariant.large"
-      },
-      "heroTextColor": {
-        "type": "string",
-        "mutable": false,
-        "complexType": {
-          "original": "HeroTextColor",
-          "resolved": "HeroTextColor.dark_text_light_bg | HeroTextColor.dark_text_no_bg | HeroTextColor.light_text_dark_bg | HeroTextColor.light_text_no_bg",
-          "references": {
-            "HeroTextColor": {
-              "location": "import",
-              "path": "../../utils/utils"
-            }
-          }
-        },
-        "required": false,
-        "optional": false,
-        "docs": {
-          "tags": [],
-          "text": ""
-        },
-        "attribute": "hero-text-color",
-        "reflect": false,
-        "defaultValue": "null"
-      },
-      "image": {
-        "type": "string",
-        "mutable": false,
-        "complexType": {
-          "original": "string",
-          "resolved": "string",
-          "references": {}
-        },
-        "required": false,
-        "optional": false,
-        "docs": {
-          "tags": [],
-          "text": ""
-        },
-        "attribute": "image",
-        "reflect": false
-      },
-      "imageHeight": {
-        "type": "number",
-        "mutable": false,
-        "complexType": {
-          "original": "number",
-          "resolved": "number",
-          "references": {}
-        },
-        "required": false,
-        "optional": false,
-        "docs": {
-          "tags": [],
-          "text": ""
-        },
-        "attribute": "image-height",
-        "reflect": false,
-        "defaultValue": "null"
-      },
-      "imageWidth": {
-        "type": "number",
-        "mutable": false,
-        "complexType": {
-          "original": "number",
-          "resolved": "number",
-          "references": {}
-        },
-        "required": false,
-        "optional": false,
-        "docs": {
-          "tags": [],
-          "text": ""
-        },
-        "attribute": "image-width",
-        "reflect": false,
-        "defaultValue": "null"
-      },
-      "imageAltText": {
-        "type": "string",
-        "mutable": false,
-        "complexType": {
-          "original": "string",
-          "resolved": "string",
-          "references": {}
-        },
-        "required": false,
-        "optional": false,
-        "docs": {
-          "tags": [],
-          "text": ""
-        },
-        "attribute": "image-alt-text",
-        "reflect": false,
-        "defaultValue": "\"\""
-      },
-      "disableLazy": {
-        "type": "boolean",
-        "mutable": false,
-        "complexType": {
-          "original": "boolean",
-          "resolved": "boolean",
-          "references": {}
-        },
-        "required": false,
-        "optional": false,
-        "docs": {
-          "tags": [],
-          "text": ""
-        },
-        "attribute": "disable-lazy",
-        "reflect": false,
-        "defaultValue": "false"
-      },
-      "hasShortcuts": {
-        "type": "boolean",
-        "mutable": false,
-        "complexType": {
-          "original": "boolean",
-          "resolved": "boolean",
-          "references": {}
-        },
-        "required": false,
-        "optional": false,
-        "docs": {
-          "tags": [],
-          "text": ""
-        },
-        "attribute": "has-shortcuts",
-        "reflect": false,
-        "defaultValue": "false"
-      },
-      "heading": {
-        "type": "string",
-        "mutable": false,
-        "complexType": {
-          "original": "string",
-          "resolved": "string",
-          "references": {}
-        },
-        "required": false,
-        "optional": false,
-        "docs": {
-          "tags": [],
-          "text": ""
-        },
-        "attribute": "heading",
-        "reflect": false
-      },
-      "description": {
-        "type": "string",
-        "mutable": false,
-        "complexType": {
-          "original": "string",
-          "resolved": "string",
-          "references": {}
-        },
-        "required": false,
-        "optional": false,
-        "docs": {
-          "tags": [],
-          "text": ""
-        },
-        "attribute": "description",
-        "reflect": false
-      },
-      "subtitle": {
-        "type": "string",
-        "mutable": false,
-        "complexType": {
-          "original": "string",
-          "resolved": "string",
-          "references": {}
-        },
-        "required": false,
-        "optional": false,
-        "docs": {
-          "tags": [],
-          "text": ""
-        },
-        "attribute": "subtitle",
-        "reflect": false
-      },
-      "url": {
-        "type": "string",
-        "mutable": false,
-        "complexType": {
-          "original": "string",
-          "resolved": "string",
-          "references": {}
-        },
-        "required": false,
-        "optional": false,
-        "docs": {
-          "tags": [],
-          "text": ""
-        },
-        "attribute": "url",
-        "reflect": false
-      },
-      "urlTitle": {
-        "type": "string",
-        "mutable": false,
-        "complexType": {
-          "original": "string",
-          "resolved": "string",
-          "references": {}
-        },
-        "required": false,
-        "optional": false,
-        "docs": {
-          "tags": [],
-          "text": ""
-        },
-        "attribute": "url-title",
-        "reflect": false
-      },
-      "scLabel": {
-        "type": "string",
-        "mutable": false,
-        "complexType": {
-          "original": "string",
-          "resolved": "string",
-          "references": {}
-        },
-        "required": false,
-        "optional": true,
-        "docs": {
-          "tags": [],
-          "text": ""
-        },
-        "attribute": "sc-label",
-        "reflect": false
-      },
-      "isExternal": {
-        "type": "boolean",
-        "mutable": false,
-        "complexType": {
-          "original": "boolean",
-          "resolved": "boolean",
-          "references": {}
-        },
-        "required": false,
-        "optional": false,
-        "docs": {
-          "tags": [],
-          "text": ""
-        },
-        "attribute": "is-external",
-        "reflect": false,
-        "defaultValue": "false"
-      },
-      "sourceSet": {
-        "type": "string",
-        "mutable": false,
-        "complexType": {
-          "original": "ImageSrcSet[] | string",
-          "resolved": "ImageSrcSet[] | string",
-          "references": {
-            "ImageSrcSet": {
-              "location": "local",
-              "path": "/Users/tuukkaturu/hy/hy-ds/design-system-lib/core/src/components/hy-hero/hy-hero.tsx"
-            }
-          }
-        },
-        "required": false,
-        "optional": false,
-        "docs": {
-          "tags": [],
-          "text": ""
-        },
-        "attribute": "source-set",
-        "reflect": false
-      }
-    };
-  }
-  static get elementRef() { return "el"; }
+        };
+    }
+    static get elementRef() { return "el"; }
 }
-//# sourceMappingURL=hy-hero.js.map