@itcenteratunihelsinki/huds-lib 0.8.43 → 0.8.44

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

@@ -1,8 +1,8 @@
 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';
+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;
@@ -10,7 +10,7 @@ export class HyHero {
     this.colorVariant = HeroColorVariant.blue;
     this.sizeVariant = HeroSizeVariant.large;
     this.image = undefined;
-    this.imageAltText = '';
+    this.imageAltText = "";
     this.disableLazy = false;
     this.hasShortcuts = false;
     this.heading = undefined;
@@ -25,21 +25,21 @@ export class HyHero {
     this._sourceSet = await jsonParserWorker(this.sourceSet);
   }
   handleHeroImageObjectFitValue(heroSizeVariant, heroElement) {
-    const heroContentContainerElement = heroElement.getElementsByClassName('hy-hero__content-container')[0];
-    if (heroSizeVariant === 'small') {
+    const heroContentContainerElement = heroElement.getElementsByClassName("hy-hero__content-container")[0];
+    if (heroSizeVariant === "small") {
       if (heroContentContainerElement.offsetHeight >= 300) {
-        heroElement.classList.add('has-cover');
+        heroElement.classList.add("has-cover");
       }
       else {
-        heroElement.classList.remove('has-cover');
+        heroElement.classList.remove("has-cover");
       }
     }
-    if (heroSizeVariant === 'large') {
+    if (heroSizeVariant === "large") {
       if (heroContentContainerElement.offsetHeight >= 344) {
-        heroElement.classList.add('has-cover');
+        heroElement.classList.add("has-cover");
       }
       else {
-        heroElement.classList.remove('has-cover');
+        heroElement.classList.remove("has-cover");
       }
     }
   }
@@ -47,7 +47,7 @@ export class HyHero {
     let variant = CtaLinkButtonVariants.heroWhite;
     let colorVariantValue = this.colorVariant;
     let heroTypeValue = this.heroType;
-    if (this.heroType === 'minor_landing') {
+    if (this.heroType === "minor_landing") {
       colorVariantValue = HeroColorVariant.white;
       heroTypeValue = HeroTypeVariant.landing;
     }
@@ -57,41 +57,41 @@ export class HyHero {
     if (colorVariantValue === HeroColorVariant.black) {
       variant = CtaLinkButtonVariants.heroBlack;
     }
-    if (!colorVariantValue || colorVariantValue === 'fp_white') {
+    if (!colorVariantValue || colorVariantValue === "fp_white") {
       colorVariantValue = HeroColorVariant.white;
     }
     const hyHeroClasses = [
-      'hy-hero',
+      "hy-hero",
       `hy-hero--${heroTypeValue}`,
       `hy-hero--${this.heroGroupType}`,
       `hy-hero--${colorVariantValue}`,
       `hy-hero--${this.sizeVariant}`,
     ];
-    const heroTitleClasses = ['hy-hero__title', 'hy-heading__hero'].join(' ');
+    const heroTitleClasses = ["hy-hero__title", "hy-heading__hero"].join(" ");
     // If there is a Shortcuts block after hero, add the class 'shortcuts' to remove underline.
     if (this.hasShortcuts) {
-      hyHeroClasses.push('has-shortcuts');
+      hyHeroClasses.push("has-shortcuts");
     }
     const aspectRatioWidth = 16;
     const aspectRatioHeight = 10;
     const aspect = (aspectRatioHeight / aspectRatioWidth) * 100;
     const aspectRatio = {
-      '--aspectRatio': `${aspect}%`,
+      "--aspectRatio": `${aspect}%`,
     };
     window.onload = () => {
-      const heroElement = document.getElementsByClassName('hy-hero')[0];
+      const heroElement = document.getElementsByClassName("hy-hero")[0];
       this.handleHeroImageObjectFitValue(this.sizeVariant, heroElement);
-      window.addEventListener('resize', () => {
+      window.addEventListener("resize", () => {
         clearTimeout(timeout);
         timeout = setTimeout(() => this.handleHeroImageObjectFitValue(this.sizeVariant, heroElement), delay);
       });
     };
-    if (heroTypeValue === 'front_page') {
-      return (h(Host, null, h("div", { class: hyHeroClasses.join(' ') }, h("div", { class: `hy-hero__container` }, h("div", { class: `hy-hero__image-container`, style: aspectRatio }, this.image &&
-        (this._sourceSet ? (h("picture", null, this._sourceSet.map((item) => (h("source", { srcSet: item.src, media: item.media, type: item.type, sizes: item.sizes ? item.sizes : '' }))), h("img", { loading: this.disableLazy ? 'eager' : 'lazy', alt: this.imageAltText, class: `hy-image__image`, src: this.image }))) : (h("img", { loading: this.disableLazy ? 'eager' : 'lazy', alt: this.imageAltText, class: `hy-image__image`, src: this.image })))), 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 (heroTypeValue === "front_page") {
+      return (h(Host, null, h("div", { class: hyHeroClasses.join(" ") }, h("div", { class: `hy-hero__container` }, h("div", { class: `hy-hero__image-container`, style: aspectRatio }, this.image &&
+        (this._sourceSet ? (h("picture", null, this._sourceSet.map((item) => (h("source", { srcSet: item.src, media: item.media, type: item.type, sizes: item.sizes ? item.sizes : "" }))), h("img", { loading: this.disableLazy ? "eager" : "lazy", alt: this.imageAltText, class: `hy-image__image`, src: this.image }))) : (h("img", { loading: this.disableLazy ? "eager" : "lazy", alt: this.imageAltText, class: `hy-image__image`, src: this.image })))), 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" })));
     }
-    return (h(Host, null, h("div", { class: hyHeroClasses.join(' ') }, h("div", { class: `hy-hero__container` }, h("div", { class: `hy-hero__image-container`, style: aspectRatio }, this.image &&
-      (this._sourceSet ? (h("picture", null, this._sourceSet.map((item) => (h("source", { srcSet: item.src, media: item.media, type: item.type, sizes: item.sizes ? item.sizes : '' }))), h("img", { loading: this.disableLazy ? 'eager' : 'lazy', alt: this.imageAltText, class: `hy-image__image`, src: this.image }))) : (h("img", { loading: this.disableLazy ? 'eager' : 'lazy', alt: this.imageAltText, class: `hy-image__image`, src: this.image })))), 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" })));
+    return (h(Host, null, h("div", { class: hyHeroClasses.join(" ") }, h("div", { class: `hy-hero__container` }, h("div", { class: `hy-hero__image-container`, style: aspectRatio }, this.image &&
+      (this._sourceSet ? (h("picture", null, this._sourceSet.map((item) => (h("source", { srcSet: item.src, media: item.media, type: item.type, sizes: item.sizes ? item.sizes : "" }))), h("img", { loading: this.disableLazy ? "eager" : "lazy", alt: this.imageAltText, class: `hy-image__image`, src: this.image }))) : (h("img", { loading: this.disableLazy ? "eager" : "lazy", alt: this.imageAltText, class: `hy-image__image`, src: this.image })))), 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() {
@@ -231,7 +231,7 @@ export class HyHero {
         },
         "attribute": "image-alt-text",
         "reflect": false,
-        "defaultValue": "''"
+        "defaultValue": "\"\""
       },
       "disableLazy": {
         "type": "boolean",
@@ -381,7 +381,7 @@ export class HyHero {
           "references": {
             "ImageSrcSet": {
               "location": "local",
-              "path": "/builds/julkiset-sivut/design-system-lib/src/components/hy-hero/hy-hero.tsx"
+              "path": "/Users/tuukkaturu/hy/hy-ds/design-system-lib/core/src/components/hy-hero/hy-hero.tsx"
             }
           }
         },

package/dist/collection/components/hy-hero-carousel/hy-hero-carousel.css

@@ -12,7 +12,7 @@
 
 @font-face {
   font-family: swiper-icons;
-  src: url('data:application/font-woff;charset=utf-8;base64, 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');
+  src: url("data:application/font-woff;charset=utf-8;base64, d09GRgABAAAAAAZgABAAAAAADAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAABGRlRNAAAGRAAAABoAAAAci6qHkUdERUYAAAWgAAAAIwAAACQAYABXR1BPUwAABhQAAAAuAAAANuAY7+xHU1VCAAAFxAAAAFAAAABm2fPczU9TLzIAAAHcAAAASgAAAGBP9V5RY21hcAAAAkQAAACIAAABYt6F0cBjdnQgAAACzAAAAAQAAAAEABEBRGdhc3AAAAWYAAAACAAAAAj//wADZ2x5ZgAAAywAAADMAAAD2MHtryVoZWFkAAABbAAAADAAAAA2E2+eoWhoZWEAAAGcAAAAHwAAACQC9gDzaG10eAAAAigAAAAZAAAArgJkABFsb2NhAAAC0AAAAFoAAABaFQAUGG1heHAAAAG8AAAAHwAAACAAcABAbmFtZQAAA/gAAAE5AAACXvFdBwlwb3N0AAAFNAAAAGIAAACE5s74hXjaY2BkYGAAYpf5Hu/j+W2+MnAzMYDAzaX6QjD6/4//Bxj5GA8AuRwMYGkAPywL13jaY2BkYGA88P8Agx4j+/8fQDYfA1AEBWgDAIB2BOoAeNpjYGRgYNBh4GdgYgABEMnIABJzYNADCQAACWgAsQB42mNgYfzCOIGBlYGB0YcxjYGBwR1Kf2WQZGhhYGBiYGVmgAFGBiQQkOaawtDAoMBQxXjg/wEGPcYDDA4wNUA2CCgwsAAAO4EL6gAAeNpj2M0gyAACqxgGNWBkZ2D4/wMA+xkDdgAAAHjaY2BgYGaAYBkGRgYQiAHyGMF8FgYHIM3DwMHABGQrMOgyWDLEM1T9/w8UBfEMgLzE////P/5//f/V/xv+r4eaAAeMbAxwIUYmIMHEgKYAYjUcsDAwsLKxc3BycfPw8jEQA/gZBASFhEVExcQlJKWkZWTl5BUUlZRVVNXUNTQZBgMAAMR+E+gAEQFEAAAAKgAqACoANAA+AEgAUgBcAGYAcAB6AIQAjgCYAKIArAC2AMAAygDUAN4A6ADyAPwBBgEQARoBJAEuATgBQgFMAVYBYAFqAXQBfgGIAZIBnAGmAbIBzgHsAAB42u2NMQ6CUAyGW568x9AneYYgm4MJbhKFaExIOAVX8ApewSt4Bic4AfeAid3VOBixDxfPYEza5O+Xfi04YADggiUIULCuEJK8VhO4bSvpdnktHI5QCYtdi2sl8ZnXaHlqUrNKzdKcT8cjlq+rwZSvIVczNiezsfnP/uznmfPFBNODM2K7MTQ45YEAZqGP81AmGGcF3iPqOop0r1SPTaTbVkfUe4HXj97wYE+yNwWYxwWu4v1ugWHgo3S1XdZEVqWM7ET0cfnLGxWfkgR42o2PvWrDMBSFj/IHLaF0zKjRgdiVMwScNRAoWUoH78Y2icB/yIY09An6AH2Bdu/UB+yxopYshQiEvnvu0dURgDt8QeC8PDw7Fpji3fEA4z/PEJ6YOB5hKh4dj3EvXhxPqH/SKUY3rJ7srZ4FZnh1PMAtPhwP6fl2PMJMPDgeQ4rY8YT6Gzao0eAEA409DuggmTnFnOcSCiEiLMgxCiTI6Cq5DZUd3Qmp10vO0LaLTd2cjN4fOumlc7lUYbSQcZFkutRG7g6JKZKy0RmdLY680CDnEJ+UMkpFFe1RN7nxdVpXrC4aTtnaurOnYercZg2YVmLN/d/gczfEimrE/fs/bOuq29Zmn8tloORaXgZgGa78yO9/cnXm2BpaGvq25Dv9S4E9+5SIc9PqupJKhYFSSl47+Qcr1mYNAAAAeNptw0cKwkAAAMDZJA8Q7OUJvkLsPfZ6zFVERPy8qHh2YER+3i/BP83vIBLLySsoKimrqKqpa2hp6+jq6RsYGhmbmJqZSy0sraxtbO3sHRydnEMU4uR6yx7JJXveP7WrDycAAAAAAAH//wACeNpjYGRgYOABYhkgZgJCZgZNBkYGLQZtIJsFLMYAAAw3ALgAeNolizEKgDAQBCchRbC2sFER0YD6qVQiBCv/H9ezGI6Z5XBAw8CBK/m5iQQVauVbXLnOrMZv2oLdKFa8Pjuru2hJzGabmOSLzNMzvutpB3N42mNgZGBg4GKQYzBhYMxJLMlj4GBgAYow/P/PAJJhLM6sSoWKfWCAAwDAjgbRAAB42mNgYGBkAIIbCZo5IPrmUn0hGA0AO8EFTQAA");
   font-weight: 400;
   font-style: normal;
 }
@@ -203,7 +203,7 @@ swiper-slide {
 }
 
 .swiper-centered > .swiper-wrapper::before {
-  content: '';
+  content: "";
   -ms-flex-negative: 0;
   flex-shrink: 0;
   -webkit-box-ordinal-group: 10000;
@@ -300,7 +300,7 @@ swiper-container:not(.swiper-watch-progress) .swiper-lazy-preloader {
 }
 
 .swiper-virtual.swiper-css-mode .swiper-wrapper::after {
-  content: '';
+  content: "";
   position: absolute;
   left: 0;
   top: 0;
@@ -379,7 +379,7 @@ swiper-container:not(.swiper-watch-progress) .swiper-lazy-preloader {
 
 .swiper-button-prev:after,
 .swiper-rtl .swiper-button-next:after {
-  content: 'prev';
+  content: "prev";
 }
 
 .swiper-button-next,
@@ -390,7 +390,7 @@ swiper-container:not(.swiper-watch-progress) .swiper-lazy-preloader {
 
 .swiper-button-next:after,
 .swiper-rtl .swiper-button-prev:after {
-  content: 'next';
+  content: "next";
 }
 
 .swiper-button-lock {
@@ -802,7 +802,7 @@ swiper-container .swiper-notification {
 }
 
 .swiper-cube .swiper-cube-shadow:before {
-  content: '';
+  content: "";
   background: #000;
   position: absolute;
   left: 0;

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

@@ -1,35 +1,35 @@
-import { h } from '@stencil/core';
-import { jsonParserWorker } from '../../global/globalScript';
-import Swiper, { Navigation, Pagination, A11y } from '../../../node_modules/swiper';
-import { CtaLinkButtonVariants } from '../../utils/utils';
+import { h } from "@stencil/core";
+import { jsonParserWorker } from "../../global/globalScript";
+import Swiper, { Navigation, Pagination, A11y } from "swiper";
+import { CtaLinkButtonVariants } from "../../utils/utils";
 export class HyHeroCarousel {
   constructor() {
     this.itemCount = undefined;
-    this.ariaLabelNext = 'Next slide';
-    this.ariaLabelPrev = 'Previous slide';
-    this.ariaLabelFirstSlide = 'This is the first slide';
-    this.ariaLabelLastSlide = 'This is the first slide';
-    this.ariaLabelBulletMessage = 'Go to slide';
+    this.ariaLabelNext = "Next slide";
+    this.ariaLabelPrev = "Previous slide";
+    this.ariaLabelFirstSlide = "This is the first slide";
+    this.ariaLabelLastSlide = "This is the first slide";
+    this.ariaLabelBulletMessage = "Go to slide";
     this.data = undefined;
   }
   async componentWillLoad() {
     this._data = await jsonParserWorker(this.data);
   }
   componentDidLoad() {
-    new Swiper('.swiper', {
+    new Swiper(".swiper", {
       modules: [Navigation, Pagination, A11y],
       enabled: true,
-      direction: 'horizontal',
+      direction: "horizontal",
       loop: true,
       spaceBetween: 50,
       navigation: {
-        nextEl: '.swiper-button-next',
-        prevEl: '.swiper-button-prev',
+        nextEl: ".swiper-button-next",
+        prevEl: ".swiper-button-prev",
       },
       pagination: {
-        el: '.swiper-pagination',
-        bulletClass: 'hero-carousel--pagination__bullet',
-        bulletActiveClass: 'hero-carousel--pagination__bullet--active',
+        el: ".swiper-pagination",
+        bulletClass: "hero-carousel--pagination__bullet",
+        bulletActiveClass: "hero-carousel--pagination__bullet--active",
         clickable: true,
         renderBullet: function (index, className) {
           return `<span aria-label="${this.ariaLabelBulletMessage} ${index}" data-index="${index}" class="${className}"></span>`;
@@ -46,22 +46,22 @@ export class HyHeroCarousel {
     });
   }
   handleSlideChangeFromButtons(index) {
-    const swiperEl = document.querySelector('.swiper');
+    const swiperEl = document.querySelector(".swiper");
     swiperEl.swiper.slideTo(index, 300, null);
   }
   render() {
-    const carouselContentClasses = ['hero-carousel--item__content', this.itemCount > 1 ? 'has-pagination' : ''].join(' ');
-    return (h("div", { class: "hero-carousel-container" }, h("div", { class: "swiper" }, h("div", { class: "swiper-wrapper" }, this._data['items'] &&
-      this._data['items'].map((i, index) => {
+    const carouselContentClasses = ["hero-carousel--item__content", this.itemCount > 1 ? "has-pagination" : ""].join(" ");
+    return (h("div", { class: "hero-carousel-container" }, h("div", { class: "swiper" }, h("div", { class: "swiper-wrapper" }, this._data["items"] &&
+      this._data["items"].map((i, index) => {
         const currentIndex = index;
         const srcSet = JSON.parse(i.image_sources);
-        return (h("div", { class: "swiper-slide", "data-title": i.title, "data-desc": i.desc }, h("div", { class: "swiper-slide hero-carousel--item" }, h("div", { class: carouselContentClasses }, h("h2", { class: "hero-carousel--item__title" }, i.title), h("div", { class: "hero-carousel--item__desc" }, i.desc), i.uri && (h("hy-cta-button", { "link-content": i.uri_title, "sc-label": i.uri_title, url: i.uri, "is-external": "false", variant: CtaLinkButtonVariants.heroBlue })), this.itemCount > 1 ? (h("div", { class: "hero-carousel--item__pagination" }, h("ul", null, this._data['items'].map((i, index) => {
+        return (h("div", { class: "swiper-slide", "data-title": i.title, "data-desc": i.desc }, h("div", { class: "swiper-slide hero-carousel--item" }, h("div", { class: carouselContentClasses }, h("h2", { class: "hero-carousel--item__title" }, i.title), h("div", { class: "hero-carousel--item__desc" }, i.desc), i.uri && (h("hy-cta-button", { "link-content": i.uri_title, "sc-label": i.uri_title, url: i.uri, "is-external": "false", variant: CtaLinkButtonVariants.heroBlue })), this.itemCount > 1 ? (h("div", { class: "hero-carousel--item__pagination" }, h("ul", null, this._data["items"].map((i, index) => {
           const paginationButtonClasses = [
-            'hero-carousel--item__pagination__button',
-            index === currentIndex ? 'is-current' : '',
-          ].join(' ');
-          return (h("li", { class: paginationButtonClasses }, h("button", { "aria-label": `${this.ariaLabelBulletMessage} ${index}`, onClick: () => this.handleSlideChangeFromButtons(index), "data-index": index, "aria-current": index === currentIndex ? 'true' : 'false' }, h("span", { class: "hero-carousel--item__pagination__button__theme" }, i.theme_text), i.title)));
-        })))) : null), h("div", { class: "hero-carousel--item__image" }, srcSet.length > 0 ? (h("picture", null, srcSet.map((item) => (h("source", { srcSet: item.src, media: item.media, type: item.type, sizes: item.sizes ? item.sizes : '' }))), h("img", { "aria-hidden": "true", loading: 'eager', alt: i.image_alt, class: `hy-image__image`, src: i.image_fallback }))) : (h("img", { "aria-hidden": "true", loading: 'eager', alt: i.image_alt, class: `hy-image__image`, src: i.image_fallback }))))));
+            "hero-carousel--item__pagination__button",
+            index === currentIndex ? "is-current" : "",
+          ].join(" ");
+          return (h("li", { class: paginationButtonClasses }, h("button", { "aria-label": `${this.ariaLabelBulletMessage} ${index}`, onClick: () => this.handleSlideChangeFromButtons(index), "data-index": index, "aria-current": index === currentIndex ? "true" : "false" }, h("span", { class: "hero-carousel--item__pagination__button__theme" }, i.theme_text), i.title)));
+        })))) : null), h("div", { class: "hero-carousel--item__image" }, srcSet.length > 0 ? (h("picture", null, srcSet.map((item) => (h("source", { srcSet: item.src, media: item.media, type: item.type, sizes: item.sizes ? item.sizes : "" }))), h("img", { "aria-hidden": "true", loading: "eager", alt: i.image_alt, class: `hy-image__image`, src: i.image_fallback }))) : (h("img", { "aria-hidden": "true", loading: "eager", alt: i.image_alt, class: `hy-image__image`, src: i.image_fallback }))))));
       })), this.itemCount > 1 ? (h("div", { class: "hero-carousel--controls" }, h("div", { class: "swiper-pagination hero-carousel--pagination--mobile" }), h("div", { class: "hero-carousel--controls__buttons" }, h("div", { class: "swiper-button-prev" }, h("hy-icon", { class: "arrow", icon: "hy-icon-arrow-left" }), h("hy-icon", { class: "caret", icon: "hy-icon-caret-left" })), h("div", { class: "swiper-button-next" }, h("hy-icon", { class: "arrow", icon: "hy-icon-arrow-right" }), h("hy-icon", { class: "caret", icon: "hy-icon-caret-right" }))))) : null)));
   }
   static get is() { return "hy-hero-carousel"; }
@@ -110,7 +110,7 @@ export class HyHeroCarousel {
         },
         "attribute": "aria-label-next",
         "reflect": false,
-        "defaultValue": "'Next slide'"
+        "defaultValue": "\"Next slide\""
       },
       "ariaLabelPrev": {
         "type": "string",
@@ -128,7 +128,7 @@ export class HyHeroCarousel {
         },
         "attribute": "aria-label-prev",
         "reflect": false,
-        "defaultValue": "'Previous slide'"
+        "defaultValue": "\"Previous slide\""
       },
       "ariaLabelFirstSlide": {
         "type": "string",
@@ -146,7 +146,7 @@ export class HyHeroCarousel {
         },
         "attribute": "aria-label-first-slide",
         "reflect": false,
-        "defaultValue": "'This is the first slide'"
+        "defaultValue": "\"This is the first slide\""
       },
       "ariaLabelLastSlide": {
         "type": "string",
@@ -164,7 +164,7 @@ export class HyHeroCarousel {
         },
         "attribute": "aria-label-last-slide",
         "reflect": false,
-        "defaultValue": "'This is the first slide'"
+        "defaultValue": "\"This is the first slide\""
       },
       "ariaLabelBulletMessage": {
         "type": "string",
@@ -182,7 +182,7 @@ export class HyHeroCarousel {
         },
         "attribute": "aria-label-bullet-message",
         "reflect": false,
-        "defaultValue": "'Go to slide'"
+        "defaultValue": "\"Go to slide\""
       },
       "data": {
         "type": "string",
@@ -193,7 +193,7 @@ export class HyHeroCarousel {
           "references": {
             "CarouselItem": {
               "location": "local",
-              "path": "/builds/julkiset-sivut/design-system-lib/src/components/hy-hero-carousel/hy-hero-carousel.tsx"
+              "path": "/Users/tuukkaturu/hy/hy-ds/design-system-lib/core/src/components/hy-hero-carousel/hy-hero-carousel.tsx"
             }
           }
         },

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

@@ -1,5 +1,5 @@
-import { Host, h } from '@stencil/core';
-import { HeadingVarians, HeadingSectionVariants } from '../../utils/utils';
+import { Host, h } from "@stencil/core";
+import { HeadingVarians, HeadingSectionVariants } from "../../utils/utils";
 export class HyIntroduction {
   constructor() {
     this.variant = null;
@@ -11,39 +11,39 @@ export class HyIntroduction {
     this.scLabel = undefined;
     this.urlTitle = undefined;
     this.imageUrl = undefined;
-    this.imageAlt = '';
+    this.imageAlt = "";
     this.isExternal = false;
-    this.headerstyle = 'common';
+    this.headerstyle = "common";
     this.sourceSet = undefined;
   }
   componentDidLoad() {
-    let hyMainDiv = this.el.closest('.hy-main');
+    let hyMainDiv = this.el.closest(".hy-main");
     if (hyMainDiv) {
-      if (!hyMainDiv.classList.contains('with-sidebar')) {
-        this.headerstyle = 'large';
+      if (!hyMainDiv.classList.contains("with-sidebar")) {
+        this.headerstyle = "large";
       }
     }
   }
   render() {
     const classAttributes = [
-      'hy-introduction',
+      "hy-introduction",
       `hy-introduction__${this.headerstyle}`,
       this.headerstyle,
-      this.reversed ? 'hy-introduction--reversed' : '',
+      this.reversed ? "hy-introduction--reversed" : "",
       this.variant
         ? `hy-introduction--with-bg hy-introduction--with-bg__${this.variant}`
-        : 'hy-introduction--without-bg',
-    ].join(' ');
-    const classTitle = ['hy-introduction__title', `hy-introduction__title__${this.headerstyle}`].join(' ');
-    const classDescription = ['hy-introduction__description', `hy-introduction__description__${this.headerstyle}`].join(' ');
+        : "hy-introduction--without-bg",
+    ].join(" ");
+    const classTitle = ["hy-introduction__title", `hy-introduction__title__${this.headerstyle}`].join(" ");
+    const classDescription = ["hy-introduction__description", `hy-introduction__description__${this.headerstyle}`].join(" ");
     const contentWrapperClasses = [
-      'hy-introduction__content',
-      this.reversed ? 'hy-introduction__content--reversed' : '',
-      this.imageUrl ? 'hy-introduction__content--with-image' : 'hy-introduction__content--without-image',
-      this.limitContentWidth ? 'hy-introduction__content--limit-width' : '',
-    ].join(' ');
-    const target = this.isExternal ? '_blank' : '_self';
-    return (h(Host, null, h("hy-box", { pt: "1.25, 1.25, 1.5, 2.5" }), h("div", { class: classAttributes }, h("hy-main-content-wrapper", null, h("div", { class: "hy-introduction__outer-content" }, h("div", { class: contentWrapperClasses }, h("hy-heading", { class: classTitle, heading: HeadingVarians.h2, section: HeadingSectionVariants.introduction }, this.textTitle), h("p", { class: classDescription }, this.textDescription), this.url && (h("div", { class: "hy-introduction__link__container" }, h("a", { class: "hy-introduction__link", href: this.url, "aria-label": this.scLabel, target: target }, this.urlTitle, h("span", { class: "hy-introduction__link__icon" }, h("hy-icon", { icon: 'hy-icon-arrow-right', size: 24 })))))), this.imageUrl &&
+      "hy-introduction__content",
+      this.reversed ? "hy-introduction__content--reversed" : "",
+      this.imageUrl ? "hy-introduction__content--with-image" : "hy-introduction__content--without-image",
+      this.limitContentWidth ? "hy-introduction__content--limit-width" : "",
+    ].join(" ");
+    const target = this.isExternal ? "_blank" : "_self";
+    return (h(Host, null, h("hy-box", { pt: "1.25, 1.25, 1.5, 2.5" }), h("div", { class: classAttributes }, h("hy-main-content-wrapper", null, h("div", { class: "hy-introduction__outer-content" }, h("div", { class: contentWrapperClasses }, h("hy-heading", { class: classTitle, heading: HeadingVarians.h2, section: HeadingSectionVariants.introduction }, this.textTitle), h("p", { class: classDescription }, this.textDescription), this.url && (h("div", { class: "hy-introduction__link__container" }, h("a", { class: "hy-introduction__link", href: this.url, "aria-label": this.scLabel, target: target }, this.urlTitle, h("span", { class: "hy-introduction__link__icon" }, h("hy-icon", { icon: "hy-icon-arrow-right", size: 24 })))))), this.imageUrl &&
       (this.sourceSet ? (h("div", { class: "hy-introduction__image" }, h("hy-image", { "source-set": this.sourceSet, "image-url": this.imageUrl, aspectRatioWidth: 16, aspectRatioHeight: 10, "image-alt": this.imageAlt }))) : (h("div", { class: "hy-introduction__image" }, h("hy-image", { "image-url": this.imageUrl, aspectRatioWidth: 16, aspectRatioHeight: 10, "image-alt": this.imageAlt }))))))), h("hy-box", { mb: "1.75, 1.75, 2, 2.5" })));
   }
   static get is() { return "hy-introduction"; }
@@ -237,7 +237,7 @@ export class HyIntroduction {
         },
         "attribute": "image-alt",
         "reflect": false,
-        "defaultValue": "''"
+        "defaultValue": "\"\""
       },
       "isExternal": {
         "type": "boolean",
@@ -273,7 +273,7 @@ export class HyIntroduction {
         },
         "attribute": "headerstyle",
         "reflect": false,
-        "defaultValue": "'common'"
+        "defaultValue": "\"common\""
       },
       "sourceSet": {
         "type": "string",
@@ -284,7 +284,7 @@ export class HyIntroduction {
           "references": {
             "ImageSrcSet": {
               "location": "local",
-              "path": "/builds/julkiset-sivut/design-system-lib/src/components/hy-introduction/hy-introduction.tsx"
+              "path": "/Users/tuukkaturu/hy/hy-ds/design-system-lib/core/src/components/hy-introduction/hy-introduction.tsx"
             }
           }
         },

package/dist/collection/components/hy-key-figure/hy-key-figure.js

@@ -1,5 +1,5 @@
-import { h } from '@stencil/core';
-import { KeyHighlightVariants } from '../../utils/utils';
+import { h } from "@stencil/core";
+import { KeyHighlightVariants } from "../../utils/utils";
 export class HyKeyFigure {
   constructor() {
     this.variant = KeyHighlightVariants.default;
@@ -7,7 +7,7 @@ export class HyKeyFigure {
     this.description = undefined;
   }
   render() {
-    const classVariant = [this.variant, 'hy-key-figure'].join(' ');
+    const classVariant = [this.variant, "hy-key-figure"].join(" ");
     return (h("div", { class: classVariant }, h("div", { class: "hy-key-figure__title" }, this.heading), h("div", { class: "hy-key-figure__description" }, this.description)));
   }
   static get is() { return "hy-key-figure"; }

package/dist/collection/components/hy-key-figure-group/hy-key-figure-group.js

@@ -1,32 +1,32 @@
-import { h, Host } from '@stencil/core';
-import { KeyHighlightVariants } from '../../utils/utils';
-import { jsonParserWorker } from '../../global/globalScript';
+import { h, Host } from "@stencil/core";
+import { KeyHighlightVariants } from "../../utils/utils";
+import { jsonParserWorker } from "../../global/globalScript";
 export class HyKeyFigureGroup {
   constructor() {
     this.dataItems = undefined;
-    this.headerstyle = 'common';
+    this.headerstyle = "common";
   }
   async componentWillLoad() {
     this._dataItems = await jsonParserWorker(this.dataItems);
   }
   componentDidLoad() {
-    let hyMainDiv = this.el.closest('.hy-main');
+    let hyMainDiv = this.el.closest(".hy-main");
     if (hyMainDiv) {
-      if (!hyMainDiv.classList.contains('with-sidebar')) {
-        this.headerstyle = 'large';
+      if (!hyMainDiv.classList.contains("with-sidebar")) {
+        this.headerstyle = "large";
       }
     }
   }
   getBoxClassName(count) {
-    let className = 'box';
+    let className = "box";
     if (count % 3 == 0) {
-      className = 'box-3';
+      className = "box-3";
     }
     else if (count % 4 == 0) {
-      className = 'box-4';
+      className = "box-4";
     }
     else if (count % 5 == 0) {
-      className = 'box-5';
+      className = "box-5";
     }
     return className;
   }
@@ -41,11 +41,11 @@ export class HyKeyFigureGroup {
     const keyFiguresVariant = this._dataItems.length == 4 ? KeyHighlightVariants.small : KeyHighlightVariants.default;
     const classAttributes = [
       keyFiguresVariant,
-      'hy-key-figure-group-container',
+      "hy-key-figure-group-container",
       `hy-key-figure-group-container__${this.headerstyle}`,
-    ].join(' ');
-    const classRowAttributes = ['hy-key-figure-group'].join(' ');
-    const classRowCenteredAttributes = ['hy-key-figure-group', 'hy-key-figure-group-centered'].join(' ');
+    ].join(" ");
+    const classRowAttributes = ["hy-key-figure-group"].join(" ");
+    const classRowCenteredAttributes = ["hy-key-figure-group", "hy-key-figure-group-centered"].join(" ");
     if (this._dataItems.length % 5 == 0) {
       return (h(Host, null, h("div", { class: classAttributes }, h("div", { class: classRowAttributes }, this._dataItems.map((x, index) => {
         if (index < 3) {
@@ -85,7 +85,7 @@ export class HyKeyFigureGroup {
           "references": {
             "KeyFigureValue": {
               "location": "local",
-              "path": "/builds/julkiset-sivut/design-system-lib/src/components/hy-key-figure-group/hy-key-figure-group.tsx"
+              "path": "/Users/tuukkaturu/hy/hy-ds/design-system-lib/core/src/components/hy-key-figure-group/hy-key-figure-group.tsx"
             }
           }
         },
@@ -114,7 +114,7 @@ export class HyKeyFigureGroup {
         },
         "attribute": "headerstyle",
         "reflect": false,
-        "defaultValue": "'common'"
+        "defaultValue": "\"common\""
       }
     };
   }

package/dist/collection/components/hy-key-highlight/hy-key-highlight.js

@@ -1,5 +1,5 @@
-import { h } from '@stencil/core';
-import { KeyHighlightVariants } from '../../utils/utils';
+import { h } from "@stencil/core";
+import { KeyHighlightVariants } from "../../utils/utils";
 export class HyKeyHighlight {
   constructor() {
     this.variant = KeyHighlightVariants.default;
@@ -7,7 +7,7 @@ export class HyKeyHighlight {
     this.description = undefined;
   }
   render() {
-    const classVariant = [this.variant, 'hy-key-highlight'].join(' ');
+    const classVariant = [this.variant, "hy-key-highlight"].join(" ");
     return (h("div", { class: classVariant }, h("div", { class: "hy-key-highlight__title__container" }, h("div", { class: "hy-key-highlight__title", innerHTML: this.heading })), h("div", { class: "hy-key-highlight__description" }, this.description)));
   }
   static get is() { return "hy-key-highlight"; }

package/dist/collection/components/hy-key-highlight-group/hy-key-highlight-group.js

@@ -1,31 +1,31 @@
-import { h, Host } from '@stencil/core';
-import { KeyHighlightVariants } from '../../utils/utils';
-import { jsonParserWorker } from '../../global/globalScript';
+import { h, Host } from "@stencil/core";
+import { KeyHighlightVariants } from "../../utils/utils";
+import { jsonParserWorker } from "../../global/globalScript";
 export class HyKeyHighlightGroup {
   constructor() {
     this.variant = KeyHighlightVariants.default;
     this.dataItems = undefined;
-    this.headerstyle = 'common';
+    this.headerstyle = "common";
   }
   async componentWillLoad() {
     this._dataItems = await jsonParserWorker(this.dataItems);
   }
   componentDidLoad() {
-    let hyMainDiv = this.el.closest('.hy-main');
+    let hyMainDiv = this.el.closest(".hy-main");
     if (hyMainDiv) {
-      if (!hyMainDiv.classList.contains('with-sidebar')) {
-        this.headerstyle = 'large';
+      if (!hyMainDiv.classList.contains("with-sidebar")) {
+        this.headerstyle = "large";
       }
     }
   }
   render() {
     const classAttributes = [
       this.variant,
-      'hy-key-highlight-group',
+      "hy-key-highlight-group",
       `hy-key-highlight-group__${this.headerstyle}`,
-    ].join(' ');
+    ].join(" ");
     const dataItemCount = this._dataItems.length;
-    const classItem = dataItemCount % 4 == 0 ? 'box-4' : 'box';
+    const classItem = dataItemCount % 4 == 0 ? "box-4" : "box";
     return (h(Host, null, h("div", { class: classAttributes }, this._dataItems.map((x) => {
       return (h("hy-key-highlight", { class: classItem, variant: this.variant, heading: x.heading, description: x.description }));
     }))));
@@ -76,7 +76,7 @@ export class HyKeyHighlightGroup {
           "references": {
             "KeyHighlightValue": {
               "location": "local",
-              "path": "/builds/julkiset-sivut/design-system-lib/src/components/hy-key-highlight-group/hy-key-highlight-group.tsx"
+              "path": "/Users/tuukkaturu/hy/hy-ds/design-system-lib/core/src/components/hy-key-highlight-group/hy-key-highlight-group.tsx"
             }
           }
         },
@@ -105,7 +105,7 @@ export class HyKeyHighlightGroup {
         },
         "attribute": "headerstyle",
         "reflect": false,
-        "defaultValue": "'common'"
+        "defaultValue": "\"common\""
       }
     };
   }