@itcenteratunihelsinki/huds-lib 0.8.41 → 0.8.43

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

@@ -1,12 +1,14 @@
-import { Component, Prop, h, State, Element, Host } from '@stencil/core';
+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.isLabelHidden = false;
+    this.inputId = undefined;
     this.prefillParameter = '';
     this.isInputValueEmpty = true;
   }
@@ -33,175 +35,172 @@ export class HySearchField {
     searchInput.focus();
   }
   render() {
-    return (h(Host, { class: "search-field" },
-      !this.isLuomusSearch && (h("label", { htmlFor: this.inputId, class: `search-field__label 
+    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.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() { return {
-    "$": ["hy-search-field.scss"]
-  }; }
-  static get styleUrls() { return {
-    "$": ["hy-search-field.css"]
-  }; }
-  static get properties() { return {
-    "label": {
-      "type": "string",
-      "mutable": false,
-      "complexType": {
-        "original": "string",
-        "resolved": "string",
-        "references": {}
-      },
-      "required": false,
-      "optional": false,
-      "docs": {
-        "tags": [],
-        "text": ""
-      },
-      "attribute": "label",
-      "reflect": false
-    },
-    "isLabelBold": {
-      "type": "boolean",
-      "mutable": false,
-      "complexType": {
-        "original": "boolean",
-        "resolved": "boolean",
-        "references": {}
-      },
-      "required": false,
-      "optional": false,
-      "docs": {
-        "tags": [],
-        "text": ""
-      },
-      "attribute": "is-label-bold",
-      "reflect": false,
-      "defaultValue": "false"
-    },
-    "labelLarge": {
-      "type": "boolean",
-      "mutable": false,
-      "complexType": {
-        "original": "boolean",
-        "resolved": "boolean",
-        "references": {}
-      },
-      "required": false,
-      "optional": false,
-      "docs": {
-        "tags": [],
-        "text": ""
-      },
-      "attribute": "label-large",
-      "reflect": false,
-      "defaultValue": "false"
-    },
-    "isLuomusSearch": {
-      "type": "boolean",
-      "mutable": false,
-      "complexType": {
-        "original": "boolean",
-        "resolved": "boolean",
-        "references": {}
-      },
-      "required": false,
-      "optional": false,
-      "docs": {
-        "tags": [],
-        "text": ""
-      },
-      "attribute": "is-luomus-search",
-      "reflect": false,
-      "defaultValue": "false"
-    },
-    "placeholder": {
-      "type": "string",
-      "mutable": false,
-      "complexType": {
-        "original": "string",
-        "resolved": "string",
-        "references": {}
-      },
-      "required": false,
-      "optional": false,
-      "docs": {
-        "tags": [],
-        "text": ""
-      },
-      "attribute": "placeholder",
-      "reflect": false,
-      "defaultValue": "'Type here...'"
-    },
-    "isLabelHidden": {
-      "type": "boolean",
-      "mutable": false,
-      "complexType": {
-        "original": "boolean",
-        "resolved": "boolean",
-        "references": {}
-      },
-      "required": false,
-      "optional": true,
-      "docs": {
-        "tags": [],
-        "text": ""
-      },
-      "attribute": "is-label-hidden",
-      "reflect": false,
-      "defaultValue": "false"
-    },
-    "inputId": {
-      "type": "string",
-      "mutable": false,
-      "complexType": {
-        "original": "string",
-        "resolved": "string",
-        "references": {}
-      },
-      "required": false,
-      "optional": false,
-      "docs": {
-        "tags": [],
-        "text": ""
-      },
-      "attribute": "input-id",
-      "reflect": false
-    },
-    "prefillParameter": {
-      "type": "string",
-      "mutable": false,
-      "complexType": {
-        "original": "string",
-        "resolved": "string",
-        "references": {}
-      },
-      "required": false,
-      "optional": false,
-      "docs": {
-        "tags": [],
-        "text": ""
-      },
-      "attribute": "prefill-parameter",
-      "reflect": false,
-      "defaultValue": "''"
-    }
-  }; }
-  static get states() { return {
-    "isInputValueEmpty": {}
-  }; }
+  static get originalStyleUrls() {
+    return {
+      "$": ["hy-search-field.scss"]
+    };
+  }
+  static get styleUrls() {
+    return {
+      "$": ["hy-search-field.css"]
+    };
+  }
+  static get properties() {
+    return {
+      "label": {
+        "type": "string",
+        "mutable": false,
+        "complexType": {
+          "original": "string",
+          "resolved": "string",
+          "references": {}
+        },
+        "required": false,
+        "optional": false,
+        "docs": {
+          "tags": [],
+          "text": ""
+        },
+        "attribute": "label",
+        "reflect": false
+      },
+      "isLabelBold": {
+        "type": "boolean",
+        "mutable": false,
+        "complexType": {
+          "original": "boolean",
+          "resolved": "boolean",
+          "references": {}
+        },
+        "required": false,
+        "optional": false,
+        "docs": {
+          "tags": [],
+          "text": ""
+        },
+        "attribute": "is-label-bold",
+        "reflect": false,
+        "defaultValue": "false"
+      },
+      "labelLarge": {
+        "type": "boolean",
+        "mutable": false,
+        "complexType": {
+          "original": "boolean",
+          "resolved": "boolean",
+          "references": {}
+        },
+        "required": false,
+        "optional": false,
+        "docs": {
+          "tags": [],
+          "text": ""
+        },
+        "attribute": "label-large",
+        "reflect": false,
+        "defaultValue": "false"
+      },
+      "isLuomusSearch": {
+        "type": "boolean",
+        "mutable": false,
+        "complexType": {
+          "original": "boolean",
+          "resolved": "boolean",
+          "references": {}
+        },
+        "required": false,
+        "optional": false,
+        "docs": {
+          "tags": [],
+          "text": ""
+        },
+        "attribute": "is-luomus-search",
+        "reflect": false,
+        "defaultValue": "false"
+      },
+      "placeholder": {
+        "type": "string",
+        "mutable": false,
+        "complexType": {
+          "original": "string",
+          "resolved": "string",
+          "references": {}
+        },
+        "required": false,
+        "optional": false,
+        "docs": {
+          "tags": [],
+          "text": ""
+        },
+        "attribute": "placeholder",
+        "reflect": false,
+        "defaultValue": "'Type here...'"
+      },
+      "isLabelHidden": {
+        "type": "boolean",
+        "mutable": false,
+        "complexType": {
+          "original": "boolean",
+          "resolved": "boolean",
+          "references": {}
+        },
+        "required": false,
+        "optional": true,
+        "docs": {
+          "tags": [],
+          "text": ""
+        },
+        "attribute": "is-label-hidden",
+        "reflect": false,
+        "defaultValue": "false"
+      },
+      "inputId": {
+        "type": "string",
+        "mutable": false,
+        "complexType": {
+          "original": "string",
+          "resolved": "string",
+          "references": {}
+        },
+        "required": false,
+        "optional": false,
+        "docs": {
+          "tags": [],
+          "text": ""
+        },
+        "attribute": "input-id",
+        "reflect": false
+      },
+      "prefillParameter": {
+        "type": "string",
+        "mutable": false,
+        "complexType": {
+          "original": "string",
+          "resolved": "string",
+          "references": {}
+        },
+        "required": false,
+        "optional": false,
+        "docs": {
+          "tags": [],
+          "text": ""
+        },
+        "attribute": "prefill-parameter",
+        "reflect": false,
+        "defaultValue": "''"
+      }
+    };
+  }
+  static get states() {
+    return {
+      "isInputValueEmpty": {}
+    };
+  }
   static get elementRef() { return "el"; }
 }

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

@@ -132,7 +132,7 @@
 
 @media (min-width: 30rem) {
   .hy-shortcuts .shortcut-link-container .shortcut-link-wrapper.box-3.first a.shortcut-link,
-.hy-shortcuts .shortcut-link-container .shortcut-link-wrapper.box-4.first a.shortcut-link {
+  .hy-shortcuts .shortcut-link-container .shortcut-link-wrapper.box-4.first a.shortcut-link {
     border-top: 3px solid var(--brand-main-nearly-black);
   }
 }

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

@@ -1,7 +1,8 @@
-import { Component, Element, h, Host, Prop, Watch } from '@stencil/core';
+import { h, Host } from '@stencil/core';
 import { HeadingVarians } from '../../utils/utils';
 export class HyShortcuts {
   constructor() {
+    this.dataItems = undefined;
     this.listHeading = '';
     this.headerstyle = 'default';
   }
@@ -29,96 +30,97 @@ export class HyShortcuts {
     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 = '';
-          if (this._dataItems.length % 4 == 0) {
-            isFirstLine = index == 0 || index == 1 ? 'first' : '';
-          }
-          else {
-            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 })))));
-        }))),
-      h("hy-box", { mb: "1.75, 1.75, 2, 2.5" })));
+    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 = '';
+      if (this._dataItems.length % 4 == 0) {
+        isFirstLine = index == 0 || index == 1 ? 'first' : '';
+      }
+      else {
+        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 })))));
+    }))), h("hy-box", { mb: "1.75, 1.75, 2, 2.5" })));
   }
   static get is() { return "hy-shortcuts"; }
-  static get originalStyleUrls() { return {
-    "$": ["hy-shortcuts.scss"]
-  }; }
-  static get styleUrls() { return {
-    "$": ["hy-shortcuts.css"]
-  }; }
-  static get properties() { return {
-    "dataItems": {
-      "type": "string",
-      "mutable": false,
-      "complexType": {
-        "original": "ShortcutLinkValue[] | string",
-        "resolved": "ShortcutLinkValue[] | string",
-        "references": {
-          "ShortcutLinkValue": {
-            "location": "local"
+  static get originalStyleUrls() {
+    return {
+      "$": ["hy-shortcuts.scss"]
+    };
+  }
+  static get styleUrls() {
+    return {
+      "$": ["hy-shortcuts.css"]
+    };
+  }
+  static get properties() {
+    return {
+      "dataItems": {
+        "type": "string",
+        "mutable": false,
+        "complexType": {
+          "original": "ShortcutLinkValue[] | string",
+          "resolved": "ShortcutLinkValue[] | string",
+          "references": {
+            "ShortcutLinkValue": {
+              "location": "local",
+              "path": "/builds/julkiset-sivut/design-system-lib/src/components/hy-shortcuts/hy-shortcuts.tsx"
+            }
           }
-        }
-      },
-      "required": false,
-      "optional": false,
-      "docs": {
-        "tags": [],
-        "text": ""
+        },
+        "required": false,
+        "optional": false,
+        "docs": {
+          "tags": [],
+          "text": ""
+        },
+        "attribute": "data-items",
+        "reflect": false
       },
-      "attribute": "data-items",
-      "reflect": false
-    },
-    "listHeading": {
-      "type": "string",
-      "mutable": false,
-      "complexType": {
-        "original": "string",
-        "resolved": "string",
-        "references": {}
+      "listHeading": {
+        "type": "string",
+        "mutable": false,
+        "complexType": {
+          "original": "string",
+          "resolved": "string",
+          "references": {}
+        },
+        "required": false,
+        "optional": false,
+        "docs": {
+          "tags": [],
+          "text": ""
+        },
+        "attribute": "list-heading",
+        "reflect": false,
+        "defaultValue": "''"
       },
-      "required": false,
-      "optional": false,
-      "docs": {
-        "tags": [],
-        "text": ""
-      },
-      "attribute": "list-heading",
-      "reflect": false,
-      "defaultValue": "''"
-    },
-    "headerstyle": {
-      "type": "string",
-      "mutable": false,
-      "complexType": {
-        "original": "string",
-        "resolved": "string",
-        "references": {}
-      },
-      "required": false,
-      "optional": false,
-      "docs": {
-        "tags": [],
-        "text": ""
-      },
-      "attribute": "headerstyle",
-      "reflect": false,
-      "defaultValue": "'default'"
-    }
-  }; }
+      "headerstyle": {
+        "type": "string",
+        "mutable": false,
+        "complexType": {
+          "original": "string",
+          "resolved": "string",
+          "references": {}
+        },
+        "required": false,
+        "optional": false,
+        "docs": {
+          "tags": [],
+          "text": ""
+        },
+        "attribute": "headerstyle",
+        "reflect": false,
+        "defaultValue": "'default'"
+      }
+    };
+  }
   static get elementRef() { return "el"; }
-  static get watchers() { return [{
-      "propName": "dataItems",
-      "methodName": "arrayDataWatcher"
-    }]; }
+  static get watchers() {
+    return [{
+        "propName": "dataItems",
+        "methodName": "arrayDataWatcher"
+      }];
+  }
 }

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

@@ -146,7 +146,7 @@
 
 @media (min-width: 60rem) {
   .hy-table-container td:first-child,
-.hy-table-container th:first-child {
+  .hy-table-container th:first-child {
     border-right: 1px solid var(--grayscale-dark);
   }
 }
@@ -167,7 +167,7 @@
 
 @media (min-width: 60rem) {
   .hy-table-container td:first-child::after,
-.hy-table-container th:first-child::after {
+  .hy-table-container th:first-child::after {
     display: none;
   }
 }
@@ -187,14 +187,14 @@
 
 @media (min-width: 60rem) {
   .hy-table-container td:first-child::before,
-.hy-table-container th:first-child::before {
+  .hy-table-container th:first-child::before {
     display: none;
   }
 }
 
 @media (min-width: 30rem) {
   .hy-table-container td:first-child,
-.hy-table-container th:first-child {
+  .hy-table-container th:first-child {
     max-width: 220px;
     min-width: 220px;
     width: 220px;
@@ -203,7 +203,7 @@
 
 @media (min-width: 48rem) {
   .hy-table-container td:first-child,
-.hy-table-container th:first-child {
+  .hy-table-container th:first-child {
     max-width: 300px;
     min-width: 300px;
     width: 300px;
@@ -212,7 +212,7 @@
 
 @media (min-width: 60rem) {
   .hy-table-container td:first-child,
-.hy-table-container th:first-child {
+  .hy-table-container th:first-child {
     max-width: 40%;
     min-width: 40%;
     width: 40%;

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

@@ -1,16 +1,18 @@
-import { Component, Host, h } from '@stencil/core';
+import { Host, h } from '@stencil/core';
 export class HyTableContainer {
   render() {
     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" })));
+    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"; }
-  static get originalStyleUrls() { return {
-    "$": ["hy-table-container.scss"]
-  }; }
-  static get styleUrls() { return {
-    "$": ["hy-table-container.css"]
-  }; }
+  static get originalStyleUrls() {
+    return {
+      "$": ["hy-table-container.scss"]
+    };
+  }
+  static get styleUrls() {
+    return {
+      "$": ["hy-table-container.css"]
+    };
+  }
 }