@itcenteratunihelsinki/huds-lib 0.8.42 → 0.8.44

package/dist/collection/components/hy-person-card/hy-person-card.js

@@ -1,6 +1,6 @@
-import { h } from '@stencil/core';
-import { PersonCardVariants } from '../../utils/utils';
-import ResizeObserver from 'resize-observer-polyfill';
+import { h } from "@stencil/core";
+import { PersonCardVariants } from "../../utils/utils";
+import ResizeObserver from "resize-observer-polyfill";
 export class HyPersonCard {
   constructor() {
     this.variant = PersonCardVariants.default;
@@ -41,44 +41,44 @@ export class HyPersonCard {
     this.isMobile = size <= 479 ? true : false;
   }
   componentWillRender() {
-    this._fullName = this.firstName && this.lastName ? `${this.firstName} ${this.lastName}` : '';
+    this._fullName = this.firstName && this.lastName ? `${this.firstName} ${this.lastName}` : "";
     this._initials =
-      this.imageUrl && this.firstName && this.lastName ? '' : `${this.firstName.charAt(0)}${this.lastName.charAt(0)}`;
+      this.imageUrl && this.firstName && this.lastName ? "" : `${this.firstName.charAt(0)}${this.lastName.charAt(0)}`;
     if (!this.imageAlt) {
       this.imageAlt = this._fullName;
     }
     if (!this.scLabel) {
-      this.scLabel = 'Link to the person profile';
+      this.scLabel = "Link to the person profile";
     }
   }
   render() {
-    let classLinkAttributes = ['hy-person-card-container__link', this.variant].join(' ');
-    let classIsActive = this.url && this.url.length > 0 ? '' : ' inactive';
+    let classLinkAttributes = ["hy-person-card-container__link", this.variant].join(" ");
+    let classIsActive = this.url && this.url.length > 0 ? "" : " inactive";
     classLinkAttributes = classLinkAttributes.concat(classIsActive);
-    const classAttributes = ['hy-person-card', this.variant].join(' ');
+    const classAttributes = ["hy-person-card", this.variant].join(" ");
     const classPositionTitle = [
-      'hy-person-card__info-container__position-title',
+      "hy-person-card__info-container__position-title",
       `hy-person-card__info-container__position-title__${this.variant}`,
-    ].join(' ');
-    const target = this.isExternal ? '_blank' : '_self';
-    return (h("article", { class: "hy-person-card-container" }, h("div", { class: classLinkAttributes }, this.categoryTitle && this.variant == PersonCardVariants.default && (h("div", { class: "hy-person-card-container__category-title" }, this.categoryTitle)), h("div", { class: classAttributes }, h("div", { class: "hy-person-card__image-container" }, this.imageUrl ? (h("a", { class: "hy-person-card__image-container__image", href: this.url, target: target }, h("img", { loading: this.disableLazy ? 'eager' : 'lazy', "aria-hidden": "true", src: this.imageUrl, alt: this.imageAlt }))) : (h("div", { class: "hy-person-card__image-container__no-image" }, h("div", { class: "hy-person-card__image-container__no-image__initials", "aria-hidden": "true" }, this._initials)))), h("div", { class: "hy-person-card__info-container" }, h("a", { class: "hy-person-card__info-container__full-name", href: this.url, target: target }, this._fullName), this.positionTitle && h("div", { class: classPositionTitle }, this.positionTitle), this.department &&
+    ].join(" ");
+    const target = this.isExternal ? "_blank" : "_self";
+    return (h("article", { class: "hy-person-card-container" }, h("div", { class: classLinkAttributes }, this.categoryTitle && this.variant == PersonCardVariants.default && (h("div", { class: "hy-person-card-container__category-title" }, this.categoryTitle)), h("div", { class: classAttributes }, h("div", { class: "hy-person-card__image-container" }, this.imageUrl ? (h("a", { class: "hy-person-card__image-container__image", href: this.url, target: target }, h("img", { loading: this.disableLazy ? "eager" : "lazy", "aria-hidden": "true", src: this.imageUrl, alt: this.imageAlt }))) : (h("div", { class: "hy-person-card__image-container__no-image" }, h("div", { class: "hy-person-card__image-container__no-image__initials", "aria-hidden": "true" }, this._initials)))), h("div", { class: "hy-person-card__info-container" }, h("a", { class: "hy-person-card__info-container__full-name", href: this.url, target: target }, this._fullName), this.positionTitle && h("div", { class: classPositionTitle }, this.positionTitle), this.department &&
       (this.variant == PersonCardVariants.default ||
         (this.variant == PersonCardVariants.extended && !this.isMobile)) && (h("div", { class: "hy-person-card__info-container__department" }, this.department)), this.field &&
       (this.variant == PersonCardVariants.default ||
         (this.variant == PersonCardVariants.extended && !this.isMobile)) && (h("div", { class: "hy-person-card__info-container__field" }, this.field)), this.email &&
       (this.variant == PersonCardVariants.default ||
         (this.variant == PersonCardVariants.extended && !this.isMobile)) && [
-      h("div", { class: "hy-person-card__info-container__email-container" }, h("span", { class: "hy-person-card__info-container__email__icon" }, h("hy-icon", { icon: 'hy-icon-email', size: 16 })), h("span", { class: "hy-person-card__info-container__email" }, this.email)),
+      h("div", { class: "hy-person-card__info-container__email-container" }, h("span", { class: "hy-person-card__info-container__email__icon" }, h("hy-icon", { icon: "hy-icon-email", size: 16 })), h("span", { class: "hy-person-card__info-container__email" }, this.email)),
     ], this.phone &&
       (this.variant == PersonCardVariants.default ||
         (this.variant == PersonCardVariants.extended && !this.isMobile)) && [
-      h("div", { class: "hy-person-card__info-container__phone-container" }, h("span", { class: "hy-person-card__info-container__phone__icon" }, h("hy-icon", { icon: 'hy-icon-phone', size: 14 })), h("span", { class: "hy-person-card__info-container__phone" }, this.phone)),
+      h("div", { class: "hy-person-card__info-container__phone-container" }, h("span", { class: "hy-person-card__info-container__phone__icon" }, h("hy-icon", { icon: "hy-icon-phone", size: 14 })), h("span", { class: "hy-person-card__info-container__phone" }, this.phone)),
     ])), this.variant == PersonCardVariants.extended && (h("div", { class: "hy-person-card hy-person-card__extended-info-container" }, this.department && this.isMobile && (h("div", { class: "hy-person-card__info-container__department" }, this.department)), this.field && this.isMobile && h("div", { class: "hy-person-card__info-container__field" }, this.field), this.email &&
       this.isMobile && [
-      h("div", { class: "hy-person-card__info-container__email-container" }, h("span", { class: "hy-person-card__info-container__email__icon" }, h("hy-icon", { icon: 'hy-icon-email', size: 16 })), h("span", { class: "hy-person-card__info-container__email" }, this.email)),
+      h("div", { class: "hy-person-card__info-container__email-container" }, h("span", { class: "hy-person-card__info-container__email__icon" }, h("hy-icon", { icon: "hy-icon-email", size: 16 })), h("span", { class: "hy-person-card__info-container__email" }, this.email)),
     ], this.phone &&
       this.isMobile && [
-      h("div", { class: "hy-person-card__info-container__phone-container" }, h("span", { class: "hy-person-card__info-container__phone__icon" }, h("hy-icon", { icon: 'hy-icon-phone', size: 14 })), h("span", { class: "hy-person-card__info-container__phone" }, this.phone)),
+      h("div", { class: "hy-person-card__info-container__phone-container" }, h("span", { class: "hy-person-card__info-container__phone__icon" }, h("hy-icon", { icon: "hy-icon-phone", size: 14 })), h("span", { class: "hy-person-card__info-container__phone" }, this.phone)),
     ], this.aboutInfo && (h("div", { class: "hy-person-card__extended-info-container__about" }, h("span", { class: "label" }, this.aboutInfoLabel, ":"), h("span", null, this.aboutInfo))))))));
   }
   static get is() { return "hy-person-card"; }
@@ -475,4 +475,3 @@ export class HyPersonCard {
     };
   }
 }
-//# sourceMappingURL=hy-person-card.js.map

package/dist/collection/components/hy-prominent-image/hy-prominent-image.js

@@ -1,27 +1,27 @@
-import { Host, h } from '@stencil/core';
+import { Host, h } from "@stencil/core";
 export class HyProminentImage {
   constructor() {
     this.textTitle = undefined;
     this.imageUrl = undefined;
-    this.imageAlt = '';
-    this.headerstyle = 'common';
+    this.imageAlt = "";
+    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 prominentImageClass = [
-      'hy-prominent-image',
+      "hy-prominent-image",
       this.headerstyle,
       `hy-prominent-image__${this.headerstyle}`,
-    ].join(' ');
-    const prominentImageText = ['hy-prominent-image__text', `hy-prominent-image__text__${this.headerstyle}`].join(' ');
+    ].join(" ");
+    const prominentImageText = ["hy-prominent-image__text", `hy-prominent-image__text__${this.headerstyle}`].join(" ");
     return (h(Host, null, h("div", { class: prominentImageClass }, h("div", { class: "hy-prominent-image__image" }, h("hy-image", { "source-set": this.sourceSet, "image-url": this.imageUrl, "image-alt": this.imageAlt, aspectRatioWidth: 2, aspectRatioHeight: 1 })), this.textTitle && h("div", { class: prominentImageText }, this.textTitle))));
   }
   static get is() { return "hy-prominent-image"; }
@@ -88,7 +88,7 @@ export class HyProminentImage {
         },
         "attribute": "image-alt",
         "reflect": false,
-        "defaultValue": "''"
+        "defaultValue": "\"\""
       },
       "headerstyle": {
         "type": "string",
@@ -106,7 +106,7 @@ export class HyProminentImage {
         },
         "attribute": "headerstyle",
         "reflect": false,
-        "defaultValue": "'common'"
+        "defaultValue": "\"common\""
       },
       "sourceSet": {
         "type": "string",
@@ -117,7 +117,7 @@ export class HyProminentImage {
           "references": {
             "ImageSrcSet": {
               "location": "local",
-              "path": "/builds/julkiset-sivut/design-system-lib/src/components/hy-prominent-image/hy-prominent-image.tsx"
+              "path": "/Users/tuukkaturu/hy/hy-ds/design-system-lib/core/src/components/hy-prominent-image/hy-prominent-image.tsx"
             }
           }
         },
@@ -134,4 +134,3 @@ export class HyProminentImage {
   }
   static get elementRef() { return "el"; }
 }
-//# sourceMappingURL=hy-prominent-image.js.map

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

@@ -1,20 +1,20 @@
-import { h } from '@stencil/core';
+import { h } from "@stencil/core";
 export class HyQuote {
   constructor() {
     this.quoteSignature = undefined;
-    this.headerstyle = 'common';
+    this.headerstyle = "common";
   }
   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 quoteClass = ['hy-quote', this.headerstyle, `hy-quote__${this.headerstyle}`].join(' ');
-    return (h("div", { class: quoteClass }, h("span", { class: "hy-quote__icon-wrapper" }, h("div", { class: "hy-quote__icon" }, h("hy-icon", { icon: 'hy-icon-quote', size: 48 }))), h("div", { class: "hy-quote-text-wrapper" }, h("div", { class: "hy-quote__text" }, h("slot", null)), this.quoteSignature && h("div", { class: "hy-quote__signature" }, this.quoteSignature))));
+    const quoteClass = ["hy-quote", this.headerstyle, `hy-quote__${this.headerstyle}`].join(" ");
+    return (h("div", { class: quoteClass }, h("span", { class: "hy-quote__icon-wrapper" }, h("div", { class: "hy-quote__icon" }, h("hy-icon", { icon: "hy-icon-quote", size: 48 }))), h("div", { class: "hy-quote-text-wrapper" }, h("div", { class: "hy-quote__text" }, h("slot", null)), this.quoteSignature && h("div", { class: "hy-quote__signature" }, this.quoteSignature))));
   }
   static get is() { return "hy-quote"; }
   static get encapsulation() { return "shadow"; }
@@ -63,10 +63,9 @@ export class HyQuote {
         },
         "attribute": "headerstyle",
         "reflect": false,
-        "defaultValue": "'common'"
+        "defaultValue": "\"common\""
       }
     };
   }
   static get elementRef() { return "el"; }
 }
-//# sourceMappingURL=hy-quote.js.map

package/dist/collection/components/hy-search-field/hy-search-field.js

@@ -1,20 +1,20 @@
-import { h, Host } from '@stencil/core';
-import { ColorVariant } from '../../utils/utils';
+import { h, Host } from "@stencil/core";
+import { ColorVariant } from "../../utils/utils";
 export class HySearchField {
   constructor() {
     this.label = undefined;
     this.isLabelBold = false;
     this.labelLarge = false;
     this.isLuomusSearch = false;
-    this.placeholder = 'Type here...';
+    this.placeholder = "Type here...";
     this.isLabelHidden = false;
     this.inputId = undefined;
-    this.prefillParameter = '';
+    this.prefillParameter = "";
     this.isInputValueEmpty = true;
   }
   componentDidLoad() {
-    const searchInput = this.el.querySelector('.search-field__input');
-    searchInput.addEventListener('keyup', (event) => {
+    const searchInput = this.el.querySelector(".search-field__input");
+    searchInput.addEventListener("keyup", (event) => {
       const { value } = event.target;
       this.isInputValueEmpty = value.length > 0 ? false : true;
     });
@@ -23,22 +23,22 @@ export class HySearchField {
         return;
       const urlParams = new URLSearchParams(window.location.search);
       const searchValue = urlParams.get(`${this.prefillParameter}`);
-      const searchInput = this.el.querySelector('.search-field__input');
-      searchInput.value = searchValue && searchValue.length > 0 ? searchValue : '';
+      const searchInput = this.el.querySelector(".search-field__input");
+      searchInput.value = searchValue && searchValue.length > 0 ? searchValue : "";
       this.isInputValueEmpty = false;
     }
   }
   handleInputReset() {
     this.isInputValueEmpty = true;
-    const searchInput = this.el.querySelector('.search-field__input');
-    searchInput.value = '';
+    const searchInput = this.el.querySelector(".search-field__input");
+    searchInput.value = "";
     searchInput.focus();
   }
   render() {
     return (h(Host, { class: "search-field" }, !this.isLuomusSearch && (h("label", { htmlFor: this.inputId, class: `search-field__label 
-          ${this.isLabelHidden ? 'visually-hidden' : ''} 
-          ${this.labelLarge ? 'label-large' : ''} 
-          ${this.isLabelBold ? 'bold' : ''}` }, this.label)), h("div", { class: "search-field__actions" }, h("div", { class: "search-field__wrapper" }, this.isLuomusSearch && (h("input", { id: this.inputId, name: "search", "data-drupal-selector": "edit-search", value: "", type: "text", placeholder: this.placeholder, class: "search-field__input" })), !this.isLuomusSearch && (h("input", { id: this.inputId, type: "text", placeholder: this.placeholder, class: "search-field__input" })), !this.isInputValueEmpty && (h("button", { type: "button", class: "search-field__reset", "aria-label": "Reset", onClick: () => this.handleInputReset() }, h("hy-icon", { icon: 'hy-icon-remove', size: 14, "aria-hidden": "true" })))), this.isLuomusSearch && (h("button", { type: "submit", class: "search-field__submit", "aria-label": "Search", "data-drupal-selector": "edit-submit-luomus-search", id: "edit-submit-luomus-search", value: "Apply" }, h("hy-icon", { icon: 'hy-icon-search', size: 18, fill: ColorVariant.white, "aria-hidden": "true" }))), !this.isLuomusSearch && (h("button", { type: "submit", class: "search-field__submit", "aria-label": "Search" }, h("hy-icon", { icon: 'hy-icon-search', size: 18, fill: ColorVariant.white, "aria-hidden": "true" }))))));
+          ${this.isLabelHidden ? "visually-hidden" : ""} 
+          ${this.labelLarge ? "label-large" : ""} 
+          ${this.isLabelBold ? "bold" : ""}` }, this.label)), h("div", { class: "search-field__actions" }, h("div", { class: "search-field__wrapper" }, this.isLuomusSearch && (h("input", { id: this.inputId, name: "search", "data-drupal-selector": "edit-search", value: "", type: "text", placeholder: this.placeholder, class: "search-field__input" })), !this.isLuomusSearch && (h("input", { id: this.inputId, type: "text", placeholder: this.placeholder, class: "search-field__input" })), !this.isInputValueEmpty && (h("button", { type: "button", class: "search-field__reset", "aria-label": "Reset", onClick: () => this.handleInputReset() }, h("hy-icon", { icon: "hy-icon-remove", size: 14, "aria-hidden": "true" })))), this.isLuomusSearch && (h("button", { type: "submit", class: "search-field__submit", "aria-label": "Search", "data-drupal-selector": "edit-submit-luomus-search", id: "edit-submit-luomus-search", value: "Apply" }, h("hy-icon", { icon: "hy-icon-search", size: 18, fill: ColorVariant.white, "aria-hidden": "true" }))), !this.isLuomusSearch && (h("button", { type: "submit", class: "search-field__submit", "aria-label": "Search" }, h("hy-icon", { icon: "hy-icon-search", size: 18, fill: ColorVariant.white, "aria-hidden": "true" }))))));
   }
   static get is() { return "hy-search-field"; }
   static get originalStyleUrls() {
@@ -140,7 +140,7 @@ export class HySearchField {
         },
         "attribute": "placeholder",
         "reflect": false,
-        "defaultValue": "'Type here...'"
+        "defaultValue": "\"Type here...\""
       },
       "isLabelHidden": {
         "type": "boolean",
@@ -193,7 +193,7 @@ export class HySearchField {
         },
         "attribute": "prefill-parameter",
         "reflect": false,
-        "defaultValue": "''"
+        "defaultValue": "\"\""
       }
     };
   }
@@ -204,4 +204,3 @@ export class HySearchField {
   }
   static get elementRef() { return "el"; }
 }
-//# sourceMappingURL=hy-search-field.js.map

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

@@ -1,13 +1,13 @@
-import { h, Host } from '@stencil/core';
-import { HeadingVarians } from '../../utils/utils';
+import { h, Host } from "@stencil/core";
+import { HeadingVarians } from "../../utils/utils";
 export class HyShortcuts {
   constructor() {
     this.dataItems = undefined;
-    this.listHeading = '';
-    this.headerstyle = 'default';
+    this.listHeading = "";
+    this.headerstyle = "default";
   }
   arrayDataWatcher(newValue) {
-    if (typeof newValue === 'string') {
+    if (typeof newValue === "string") {
       this._dataItems = JSON.parse(newValue);
     }
     else {
@@ -18,29 +18,29 @@ export class HyShortcuts {
     this.arrayDataWatcher(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 = ['hy-shortcuts', `hy-shortcuts__${this.headerstyle}`].join(' ');
-    const textClassAttributes = ['text'].join(' ');
-    const iconClassAttributes = ['link-icon'].join(' ');
-    let classItem = ['shortcut-link-wrapper', this._dataItems.length % 4 == 0 ? 'box-4' : 'box-3'].join(' ');
+    const classAttributes = ["hy-shortcuts", `hy-shortcuts__${this.headerstyle}`].join(" ");
+    const textClassAttributes = ["text"].join(" ");
+    const iconClassAttributes = ["link-icon"].join(" ");
+    let classItem = ["shortcut-link-wrapper", this._dataItems.length % 4 == 0 ? "box-4" : "box-3"].join(" ");
     return (h(Host, null, h("div", { class: classAttributes }, this.listHeading.length > 0 && (h("hy-heading", { class: "list-title", heading: HeadingVarians.h2 }, this.listHeading)), h("div", { class: "shortcut-link-container" }, this._dataItems.map((x, index) => {
-      let isFirstLine = '';
+      let isFirstLine = "";
       if (this._dataItems.length % 4 == 0) {
-        isFirstLine = index == 0 || index == 1 ? 'first' : '';
+        isFirstLine = index == 0 || index == 1 ? "first" : "";
       }
       else {
-        isFirstLine = index == 0 ? 'first' : '';
+        isFirstLine = index == 0 ? "first" : "";
       }
-      let classLinkWrapper = classItem.concat(' ', isFirstLine);
-      let target = x.isExternal ? '_blank' : '_self';
-      return (h("div", { class: classLinkWrapper }, h("a", { "aria-label": x.ariaLabel, class: "shortcut-link", href: x.url, target: target }, h("span", { class: textClassAttributes }, x.heading), h("span", { class: iconClassAttributes }, h("hy-icon", { icon: 'hy-icon-arrow-right', size: 28 })))));
+      let classLinkWrapper = classItem.concat(" ", isFirstLine);
+      let target = x.isExternal ? "_blank" : "_self";
+      return (h("div", { class: classLinkWrapper }, h("a", { "aria-label": x.ariaLabel, class: "shortcut-link", href: x.url, target: target }, h("span", { class: textClassAttributes }, x.heading), h("span", { class: iconClassAttributes }, h("hy-icon", { icon: "hy-icon-arrow-right", size: 28 })))));
     }))), h("hy-box", { mb: "1.75, 1.75, 2, 2.5" })));
   }
   static get is() { return "hy-shortcuts"; }
@@ -65,7 +65,7 @@ export class HyShortcuts {
           "references": {
             "ShortcutLinkValue": {
               "location": "local",
-              "path": "/builds/julkiset-sivut/design-system-lib/src/components/hy-shortcuts/hy-shortcuts.tsx"
+              "path": "/Users/tuukkaturu/hy/hy-ds/design-system-lib/core/src/components/hy-shortcuts/hy-shortcuts.tsx"
             }
           }
         },
@@ -94,7 +94,7 @@ export class HyShortcuts {
         },
         "attribute": "list-heading",
         "reflect": false,
-        "defaultValue": "''"
+        "defaultValue": "\"\""
       },
       "headerstyle": {
         "type": "string",
@@ -112,7 +112,7 @@ export class HyShortcuts {
         },
         "attribute": "headerstyle",
         "reflect": false,
-        "defaultValue": "'default'"
+        "defaultValue": "\"default\""
       }
     };
   }
@@ -124,4 +124,3 @@ export class HyShortcuts {
       }];
   }
 }
-//# sourceMappingURL=hy-shortcuts.js.map

package/dist/collection/components/hy-table-container/hy-table-container.js

@@ -1,7 +1,7 @@
-import { Host, h } from '@stencil/core';
+import { Host, h } from "@stencil/core";
 export class HyTableContainer {
   render() {
-    const classAttributes = ['hy-table-container'].join(' ');
+    const classAttributes = ["hy-table-container"].join(" ");
     return (h(Host, { class: classAttributes }, h("slot", null), h("hy-box", { mb: "1.75, 1.75, 2, 2.5" })));
   }
   static get is() { return "hy-table-container"; }
@@ -16,4 +16,3 @@ export class HyTableContainer {
     };
   }
 }
-//# sourceMappingURL=hy-table-container.js.map