@itcenteratunihelsinki/huds-lib 0.8.43 → 0.8.44

package/dist/collection/components/hy-dropdown/hy-dropdown.panel.item.js

@@ -1,4 +1,4 @@
-import { h } from '@stencil/core';
+import { h } from "@stencil/core";
 export class HyDropdownPanelItem {
   constructor() {
     this.isLast = false;
@@ -7,7 +7,7 @@ export class HyDropdownPanelItem {
     this.dropdownItemLabel = undefined;
   }
   render() {
-    return (h("li", { class: `hy-dropdown__panel-item ${this.isLast ? 'is-last' : ''}` }, h("input", { type: "checkbox", class: "hy-dropdown__checkbox", id: `${this.dropdownItemId}`, value: `${this.dropdownItemValue}` }), h("label", { class: "hy-dropdown__label", htmlFor: `${this.dropdownItemId}` }, this.dropdownItemLabel, h("hy-icon", { class: "hy-dropdown__label-icon", icon: 'hy-icon-done', size: 14, "aria-hidden": "true" }))));
+    return (h("li", { class: `hy-dropdown__panel-item ${this.isLast ? "is-last" : ""}` }, h("input", { type: "checkbox", class: "hy-dropdown__checkbox", id: `${this.dropdownItemId}`, value: `${this.dropdownItemValue}` }), h("label", { class: "hy-dropdown__label", htmlFor: `${this.dropdownItemId}` }, this.dropdownItemLabel, h("hy-icon", { class: "hy-dropdown__label-icon", icon: "hy-icon-done", size: 14, "aria-hidden": "true" }))));
   }
   static get is() { return "hy-dropdown-panel-item"; }
   static get properties() {

package/dist/collection/components/hy-dropdown/hy-dropdown.panel.js

@@ -1,10 +1,10 @@
-import { h } from '@stencil/core';
+import { h } from "@stencil/core";
 export class HyDropdownPanel {
   constructor() {
     this.isHidden = undefined;
   }
   render() {
-    return (h("ul", { id: "dropdownPanel", class: `hy-dropdown__panel ${this.isHidden ? 'is-hidden' : ''}`, "aria-hidden": `${this.isHidden || false}`, role: "region", "aria-labelledby": "dropdownToggle" }, h("slot", null)));
+    return (h("ul", { id: "dropdownPanel", class: `hy-dropdown__panel ${this.isHidden ? "is-hidden" : ""}`, "aria-hidden": `${this.isHidden || false}`, role: "region", "aria-labelledby": "dropdownToggle" }, h("slot", null)));
   }
   static get is() { return "hy-dropdown-panel"; }
   static get properties() {

package/dist/collection/components/hy-event-item/hy-event-item.js

@@ -1,15 +1,15 @@
-import { h } from '@stencil/core';
+import { h } from "@stencil/core";
 export class HyEventItem {
   constructor() {
     this.eventTitle = undefined;
-    this.eventDescription = '';
-    this.dateShort = '';
-    this.dateLong = '';
-    this.location = '';
+    this.eventDescription = "";
+    this.dateShort = "";
+    this.dateLong = "";
+    this.location = "";
     this.type = undefined;
     this.url = undefined;
     this.styleGrid = false;
-    this.readMoreLabel = 'Read more';
+    this.readMoreLabel = "Read more";
     this.isLong = false;
   }
   componentDidLoad() {
@@ -22,10 +22,10 @@ export class HyEventItem {
   }
   render() {
     const containerClasses = [
-      'hy-events__item',
-      this.styleGrid ? 'hy-events__item--grid' : 'hy-events__item--list',
-      this.isLong ? 'is-long' : '',
-    ].join(' ');
+      "hy-events__item",
+      this.styleGrid ? "hy-events__item--grid" : "hy-events__item--list",
+      this.isLong ? "is-long" : "",
+    ].join(" ");
     return (h("a", { href: this.url, class: containerClasses, target: "_blank" }, h("div", { class: "hy-events__item--container" }, h("div", { class: "hy-events__item__top-container" }, h("span", { class: "hy-events__item__date--short" }, this.dateShort), this.isLong && (h("span", { class: "hy-events__item--toggle" }, h("hy-icon", { icon: "hy-icon-caret-down", size: 10 })))), h("div", { class: "hy-events__item__details" }, h("div", { class: "hy-events__item__title" }, this.eventTitle), h("div", { class: "hy-events__item__meta" }, this.dateLong && (h("div", { class: "hy-events__item__meta--item hy-events__item__date--long" }, h("hy-icon", { icon: "hy-icon-events", size: 18 }), this.dateLong)), this.location && (h("div", { class: "hy-events__item__meta--item hy-events__item__location" }, h("hy-icon", { icon: "hy-icon-location", size: 18 }), this.location)), this.type && (h("div", { class: "hy-events__item__meta--item hy-events__item__type" }, h("hy-icon", { icon: "hy-icon-people", size: 18 }), this.type)), h("span", { class: "hy-events__item__read-more" }, this.readMoreLabel))), h("span", { class: "hy-events__item__url-icon", "aria-hidden": "true" }, h("hy-icon", { icon: "hy-icon-arrow-right", size: 18 })))));
   }
   static get is() { return "hy-event-item"; }
@@ -74,7 +74,7 @@ export class HyEventItem {
         },
         "attribute": "event-description",
         "reflect": false,
-        "defaultValue": "''"
+        "defaultValue": "\"\""
       },
       "dateShort": {
         "type": "string",
@@ -92,7 +92,7 @@ export class HyEventItem {
         },
         "attribute": "date-short",
         "reflect": false,
-        "defaultValue": "''"
+        "defaultValue": "\"\""
       },
       "dateLong": {
         "type": "string",
@@ -110,7 +110,7 @@ export class HyEventItem {
         },
         "attribute": "date-long",
         "reflect": false,
-        "defaultValue": "''"
+        "defaultValue": "\"\""
       },
       "location": {
         "type": "string",
@@ -128,7 +128,7 @@ export class HyEventItem {
         },
         "attribute": "location",
         "reflect": false,
-        "defaultValue": "''"
+        "defaultValue": "\"\""
       },
       "type": {
         "type": "string",
@@ -198,7 +198,7 @@ export class HyEventItem {
         },
         "attribute": "read-more-label",
         "reflect": false,
-        "defaultValue": "'Read more'"
+        "defaultValue": "\"Read more\""
       }
     };
   }

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

@@ -1,5 +1,5 @@
-import { h } from '@stencil/core';
-import { CtaLinkVariants } from '../../utils/utils';
+import { h } from "@stencil/core";
+import { CtaLinkVariants } from "../../utils/utils";
 let scrollTimeout = null;
 let checkTimeout = null;
 let itemWidth = 280 + 24;
@@ -9,48 +9,48 @@ export class HyEvents {
     this.showMore = false;
     this.viewAllUrl = undefined;
     this.viewAllLabel = undefined;
-    this.scrollLeftLabel = 'Scroll list to left';
-    this.scrollRightLabel = 'Scroll list to right';
+    this.scrollLeftLabel = "Scroll list to left";
+    this.scrollRightLabel = "Scroll list to right";
     this.scrollable = true;
   }
   componentDidLoad() {
     const itemList = this.el;
-    const content = document.querySelector('.hy-events');
-    const scrollLeft = itemList.querySelector('.hy-events__scroll-left');
-    const scrollRight = itemList.querySelector('.hy-events__scroll-right');
+    const content = document.querySelector(".hy-events");
+    const scrollLeft = itemList.querySelector(".hy-events__scroll-left");
+    const scrollRight = itemList.querySelector(".hy-events__scroll-right");
     //this.checkScrollHidden(content, scrollLeft, scrollRight);
     if (this.styleGrid) {
-      content.addEventListener('scroll', () => {
+      content.addEventListener("scroll", () => {
         scrollTimeout = setTimeout(() => {
           window.clearTimeout(scrollTimeout);
         }, 250);
       }, false);
-      scrollLeft.addEventListener('click', (e) => {
+      scrollLeft.addEventListener("click", (e) => {
         e.preventDefault();
-        scrollLeft.classList.add('is-disabled');
+        scrollLeft.classList.add("is-disabled");
         content.scrollBy({
           top: 0,
           left: -itemWidth,
-          behavior: 'smooth',
+          behavior: "smooth",
         });
         checkTimeout = window.setTimeout(() => {
           window.clearTimeout(checkTimeout);
           //this.checkScrollHidden(content, scrollLeft, scrollRight);
-          scrollLeft.classList.remove('is-disabled');
+          scrollLeft.classList.remove("is-disabled");
         }, 250);
       });
-      scrollRight.addEventListener('click', (e) => {
+      scrollRight.addEventListener("click", (e) => {
         e.preventDefault();
-        scrollRight.classList.add('is-disabled');
+        scrollRight.classList.add("is-disabled");
         content.scrollBy({
           top: 0,
           left: +itemWidth,
-          behavior: 'smooth',
+          behavior: "smooth",
         });
         checkTimeout = window.setTimeout(() => {
           window.clearTimeout(checkTimeout);
           //this.checkScrollHidden(content, scrollLeft, scrollRight);
-          scrollRight.classList.remove('is-disabled');
+          scrollRight.classList.remove("is-disabled");
         }, 250);
       });
     }
@@ -61,23 +61,23 @@ export class HyEvents {
     }
   }
   checkScrollHidden(list, leftButton, rightButton) {
-    const itemList = list.querySelector('.hy-events__content');
+    const itemList = list.querySelector(".hy-events__content");
     if (list.scrollLeft === 0) {
-      leftButton.classList.add('is-hidden');
+      leftButton.classList.add("is-hidden");
     }
     else {
-      leftButton.classList.remove('is-hidden');
+      leftButton.classList.remove("is-hidden");
     }
     if (list.scrollLeft + list.clientWidth >= itemList.scrollWidth - 1) {
-      rightButton.classList.add('is-hidden');
+      rightButton.classList.add("is-hidden");
     }
     else {
-      rightButton.classList.remove('is-hidden');
+      rightButton.classList.remove("is-hidden");
     }
   }
   render() {
-    const classAttributes = ['hy-events', this.styleGrid ? 'hy-events--grid' : ''].join(' ');
-    const footerClasses = ['hy-events__footer', this.styleGrid ? 'hy-events__footer--grid' : ''].join(' ');
+    const classAttributes = ["hy-events", this.styleGrid ? "hy-events--grid" : ""].join(" ");
+    const footerClasses = ["hy-events__footer", this.styleGrid ? "hy-events__footer--grid" : ""].join(" ");
     return (h("div", { class: "hy-events--wrapper" }, h("div", { class: classAttributes }, h("slot", null)), h("div", { class: footerClasses }, this.scrollable && this.styleGrid && (h("div", { class: "hy-events__scroll-buttons" }, h("button", { type: "button", class: "hy-events__scroll-left", "aria-label": this.scrollLeftLabel }, h("hy-icon", { icon: "hy-icon-caret-left", size: 16 })), h("button", { type: "button", class: "hy-events__scroll-right", "aria-label": this.scrollRightLabel }, h("hy-icon", { icon: "hy-icon-caret-right", size: 16 })))), this.showMore && this.viewAllLabel && this.viewAllUrl && (h("hy-cta-link", { "link-content": this.viewAllLabel, "sc-label": this.viewAllLabel, url: this.viewAllUrl, variant: CtaLinkVariants.linkList })))));
   }
   static get is() { return "hy-events"; }
@@ -179,7 +179,7 @@ export class HyEvents {
         },
         "attribute": "scroll-left-label",
         "reflect": false,
-        "defaultValue": "'Scroll list to left'"
+        "defaultValue": "\"Scroll list to left\""
       },
       "scrollRightLabel": {
         "type": "string",
@@ -197,7 +197,7 @@ export class HyEvents {
         },
         "attribute": "scroll-right-label",
         "reflect": false,
-        "defaultValue": "'Scroll list to right'"
+        "defaultValue": "\"Scroll list to right\""
       }
     };
   }

package/dist/collection/components/hy-filter-group/hy-filter-group.item.js

@@ -1,12 +1,12 @@
-import { h } from '@stencil/core';
-import { ColorVariant } from '../../utils/utils';
+import { h } from "@stencil/core";
+import { ColorVariant } from "../../utils/utils";
 export class HyFilterGroupItem {
   constructor() {
     this.filterGroupItemId = undefined;
     this.filterGroupItemLabel = undefined;
   }
   render() {
-    return (h("li", { class: "hy-filter-group__filter" }, h("button", { type: "button", class: "hy-filter-group__button", "aria-label": `Deselect ${this.filterGroupItemLabel}` }, this.filterGroupItemLabel, h("hy-icon", { class: "hy-filter-group__button-icon", icon: 'hy-icon-remove', size: 10, "aria-hidden": "true", fill: ColorVariant.grey_dark })), h("slot", null)));
+    return (h("li", { class: "hy-filter-group__filter" }, h("button", { type: "button", class: "hy-filter-group__button", "aria-label": `Deselect ${this.filterGroupItemLabel}` }, this.filterGroupItemLabel, h("hy-icon", { class: "hy-filter-group__button-icon", icon: "hy-icon-remove", size: 10, "aria-hidden": "true", fill: ColorVariant.grey_dark })), h("slot", null)));
   }
   static get is() { return "hy-filter-group-item"; }
   static get properties() {

package/dist/collection/components/hy-filter-group/hy-filter-group.js

@@ -1,11 +1,11 @@
-import { Host, h } from '@stencil/core';
+import { Host, h } from "@stencil/core";
 export class HyFilterGroup {
   constructor() {
     this.filterGroupLabel = undefined;
     this.filterGroupFilters = undefined;
   }
   arrayDataWatcher(newValue) {
-    if (typeof newValue === 'string') {
+    if (typeof newValue === "string") {
       this._filterGroupFilters = JSON.parse(newValue);
     }
     else {
@@ -61,7 +61,7 @@ export class HyFilterGroup {
           "references": {
             "IFilterGroupFilter": {
               "location": "local",
-              "path": "/builds/julkiset-sivut/design-system-lib/src/components/hy-filter-group/hy-filter-group.tsx"
+              "path": "/Users/tuukkaturu/hy/hy-ds/design-system-lib/core/src/components/hy-filter-group/hy-filter-group.tsx"
             }
           }
         },

package/dist/collection/components/hy-filter-list-type/hy-filter-list-type.js

@@ -1,5 +1,5 @@
-import { h } from '@stencil/core';
-import { ListStyleVariants } from '../../utils/utils';
+import { h } from "@stencil/core";
+import { ListStyleVariants } from "../../utils/utils";
 export class HyFilterListType {
   constructor() {
     this.filterLabel = undefined;
@@ -7,14 +7,14 @@ export class HyFilterListType {
   }
   render() {
     return (h("div", { class: "hy-filter__list-type" }, h("span", null, this.filterLabel), h("button", { type: "button", class: {
-        'hy-filter-item': true,
-        'hy-filter__list-type__list': true,
-        'is-active': this.filterValue == ListStyleVariants.list,
-      }, "aria-label": `${this.filterLabel}--list` }, h("hy-icon", { class: "hy-filter-group__button-icon", icon: 'hy-icon-list-style-list', size: 16, "aria-hidden": "true" })), h("button", { type: "button", class: {
-        'hy-filter-item': true,
-        'hy-filter__list-type__grid': true,
-        'is-active': this.filterValue == ListStyleVariants.grid,
-      }, "aria-label": `${this.filterLabel}--grid` }, h("hy-icon", { class: "hy-filter-group__button-icon", icon: 'hy-icon-list-style-grid', size: 16, "aria-hidden": "true" }))));
+        "hy-filter-item": true,
+        "hy-filter__list-type__list": true,
+        "is-active": this.filterValue == ListStyleVariants.list,
+      }, "aria-label": `${this.filterLabel}--list` }, h("hy-icon", { class: "hy-filter-group__button-icon", icon: "hy-icon-list-style-list", size: 16, "aria-hidden": "true" })), h("button", { type: "button", class: {
+        "hy-filter-item": true,
+        "hy-filter__list-type__grid": true,
+        "is-active": this.filterValue == ListStyleVariants.grid,
+      }, "aria-label": `${this.filterLabel}--grid` }, h("hy-icon", { class: "hy-filter-group__button-icon", icon: "hy-icon-list-style-grid", size: 16, "aria-hidden": "true" }))));
   }
   static get is() { return "hy-filter-list-type"; }
   static get originalStyleUrls() {

package/dist/collection/components/hy-filter-visibility-tool/hy-filter-visibility-tool.js

@@ -1,13 +1,13 @@
-import { Host, h } from '@stencil/core';
+import { Host, h } from "@stencil/core";
 export class HyFilterVisibilityTool {
   constructor() {
     this.filterVisibilityToolType = undefined;
   }
   render() {
     switch (this.filterVisibilityToolType) {
-      case 'toggle':
+      case "toggle":
         return (h(Host, null, h("hy-filter-visibility-tool-toggle", null)));
-      case 'reset':
+      case "reset":
         return (h(Host, null, h("hy-filter-visibility-tool-reset", null)));
     }
   }
@@ -28,7 +28,7 @@ export class HyFilterVisibilityTool {
         "type": "string",
         "mutable": false,
         "complexType": {
-          "original": "'toggle' | 'reset'",
+          "original": "\"toggle\" | \"reset\"",
           "resolved": "\"reset\" | \"toggle\"",
           "references": {}
         },

package/dist/collection/components/hy-filter-visibility-tool/hy-filter-visibility-tool.reset.js

@@ -1,7 +1,7 @@
-import { h } from '@stencil/core';
+import { h } from "@stencil/core";
 export class HyFilterVisibilityToolReset {
   render() {
-    return (h("button", { class: "hy-filter-visibility-tool hy-filter-visibility-tool--reset", type: "button" }, h("hy-icon", { class: "hy-filter-visibility-tool__icon", icon: 'hy-icon-remove', size: 14, "aria-hidden": "true" }), "Reset filters"));
+    return (h("button", { class: "hy-filter-visibility-tool hy-filter-visibility-tool--reset", type: "button" }, h("hy-icon", { class: "hy-filter-visibility-tool__icon", icon: "hy-icon-remove", size: 14, "aria-hidden": "true" }), "Reset filters"));
   }
   static get is() { return "hy-filter-visibility-tool-reset"; }
 }

package/dist/collection/components/hy-filter-visibility-tool/hy-filter-visibility-tool.reset.toggle.js

@@ -1,7 +1,7 @@
-import { h, Host } from '@stencil/core';
+import { h, Host } from "@stencil/core";
 export class HyFilterVisibilityToolToggle {
   render() {
-    return (h(Host, null, h("button", { class: "hy-filter-visibility-tool hy-filter-visibility-tool--show-more", type: "button" }, h("hy-icon", { class: "hy-filter-visibility-tool__icon", icon: 'hy-icon-plus', size: 12, "aria-hidden": "true" }), "Show more filters"), h("button", { class: "hy-filter-visibility-tool hy-filter-visibility-tool--show-less", type: "button" }, h("hy-icon", { class: "hy-filter-visibility-tool__icon", icon: 'hy-icon-minus', size: 12, "aria-hidden": "true" }), "Show less filters")));
+    return (h(Host, null, h("button", { class: "hy-filter-visibility-tool hy-filter-visibility-tool--show-more", type: "button" }, h("hy-icon", { class: "hy-filter-visibility-tool__icon", icon: "hy-icon-plus", size: 12, "aria-hidden": "true" }), "Show more filters"), h("button", { class: "hy-filter-visibility-tool hy-filter-visibility-tool--show-less", type: "button" }, h("hy-icon", { class: "hy-filter-visibility-tool__icon", icon: "hy-icon-minus", size: 12, "aria-hidden": "true" }), "Show less filters")));
   }
   static get is() { return "hy-filter-visibility-tool-toggle"; }
 }

package/dist/collection/components/hy-general-list/hy-general-list.js

@@ -1,6 +1,6 @@
-import { h, Host } from '@stencil/core';
-import { GeneralListTypes } from '../../utils/utils';
-import { jsonParserWorker } from '../../global/globalScript';
+import { h, Host } from "@stencil/core";
+import { GeneralListTypes } from "../../utils/utils";
+import { jsonParserWorker } from "../../global/globalScript";
 export class HyGeneralList {
   constructor() {
     this.type = GeneralListTypes.list;
@@ -12,9 +12,9 @@ export class HyGeneralList {
   }
   async componentWillLoad() {
     this._dataItems = await jsonParserWorker(this.dataItems);
-    const hyMainDiv = this.el.closest('.hy-main');
+    const hyMainDiv = this.el.closest(".hy-main");
     if (hyMainDiv) {
-      if (hyMainDiv.classList.contains('with-sidebar')) {
+      if (hyMainDiv.classList.contains("with-sidebar")) {
         this.hasSidebar = true;
       }
     }
@@ -26,16 +26,16 @@ export class HyGeneralList {
   }
   render() {
     const classAttributes = [
-      'hy-general-list',
-      this.hasSidebar ? 'hy-general-list--with-sidebar' : '',
+      "hy-general-list",
+      this.hasSidebar ? "hy-general-list--with-sidebar" : "",
       `hy-general-list--style-${this.type}`,
-    ].join(' ');
+    ].join(" ");
     let listData = this._dataItems;
-    if (typeof this._dataItems === 'object') {
+    if (typeof this._dataItems === "object") {
       listData = Object.values(this._dataItems);
     }
     function truncate(str, n) {
-      return str.length > n ? str.substr(0, n - 1) + '...' : str;
+      return str.length > n ? str.substr(0, n - 1) + "..." : str;
     }
     return (h(Host, null, h("ul", { class: classAttributes }, listData &&
       listData.map((item) => (h("li", null, h("hy-general-list-item", { "has-sidebar": this.hasSidebar, target: this.blank, "data-location": item.url, description: this.truncateDescription ? truncate(item.description, this.truncateLimit) : item.description, id: item.id, imageAlt: item.imageAlt, imageUrl: item.imageUrl, "item-title": item.title, label: item.label, "sub-label": item.subLabel, tag: item.tag, date: item.date, type: item.type, url: item.url, "list-style": this.type }))))), h("hy-box", { mb: "1.75, 1.75, 2, 2.5" })));
@@ -103,7 +103,7 @@ export class HyGeneralList {
           "references": {
             "ListItemValue": {
               "location": "local",
-              "path": "/builds/julkiset-sivut/design-system-lib/src/components/hy-general-list/hy-general-list.tsx"
+              "path": "/Users/tuukkaturu/hy/hy-ds/design-system-lib/core/src/components/hy-general-list/hy-general-list.tsx"
             }
           }
         },

package/dist/collection/components/hy-general-list-item/hy-general-list-item.js

@@ -1,38 +1,38 @@
-import { h } from '@stencil/core';
+import { h } from "@stencil/core";
 export class HyGeneralListItem {
   constructor() {
     this.hasSidebar = true;
     this.description = undefined;
-    this.imageAlt = '';
+    this.imageAlt = "";
     this.imageUrl = null;
     this.disableLazy = false;
     this.itemTitle = undefined;
     this.label = undefined;
-    this.subLabel = '';
-    this.date = '';
-    this.tag = '';
+    this.subLabel = "";
+    this.date = "";
+    this.tag = "";
     this.type = undefined;
     this.url = undefined;
     this.listStyle = undefined;
     this.target = true;
   }
   render() {
-    const classAttributes = ['hy-general-list-item', `hy-general-list-item--style-${this.listStyle}`].join(' ');
-    const contentClassAttributes = ['hy-general-list-item__text-container'].join(' ');
-    const imageClassAttributes = ['hy-general-list-item__image-container'].join(' ');
-    const sidebarClass = this.hasSidebar ? 'common' : 'large';
-    const titleClassAttributes = ['hy-general-list-item__title', `hy-general-list-item__title__${sidebarClass}`].join(' ');
+    const classAttributes = ["hy-general-list-item", `hy-general-list-item--style-${this.listStyle}`].join(" ");
+    const contentClassAttributes = ["hy-general-list-item__text-container"].join(" ");
+    const imageClassAttributes = ["hy-general-list-item__image-container"].join(" ");
+    const sidebarClass = this.hasSidebar ? "common" : "large";
+    const titleClassAttributes = ["hy-general-list-item__title", `hy-general-list-item__title__${sidebarClass}`].join(" ");
     const descriptionClassAttributes = [
-      'hy-general-list-item__description',
+      "hy-general-list-item__description",
       `hy-general-list-item__description__${sidebarClass}`,
-    ].join(' ');
+    ].join(" ");
     const aspectRatioWidth = 16;
     const aspectRatioHeight = 10;
     const aspect = (aspectRatioHeight / aspectRatioWidth) * 100;
     const aspectRatio = {
-      '--aspectRatio': `${aspect}%`,
+      "--aspectRatio": `${aspect}%`,
     };
-    return (h("article", { class: classAttributes }, h("a", { class: "hy-general-list-item__link", href: this.url, target: this.target ? '_blank' : '_self' }, this.type && (h("div", { class: "hy-general-list-item__type" }, h("span", { class: "hy-general-list-item__type__major" }, this.label), h("span", { class: "hy-general-list-item__type__sub" }, this.subLabel))), this.imageUrl && (h("figure", { class: imageClassAttributes, style: aspectRatio }, h("img", { loading: this.disableLazy ? 'eager' : 'lazy', alt: this.imageAlt, class: "hy-general-list-item__image", src: this.imageUrl }))), h("div", { class: contentClassAttributes }, (this.tag || this.date) && (h("span", { class: "hy-genenral-list-item__meta" }, this.tag, h("span", { class: "hy-genenral-list-item__meta__date" }, this.tag && '|', " ", this.date))), h("h3", { class: titleClassAttributes }, this.itemTitle), h("p", { class: descriptionClassAttributes }, this.description)))));
+    return (h("article", { class: classAttributes }, h("a", { class: "hy-general-list-item__link", href: this.url, target: this.target ? "_blank" : "_self" }, this.type && (h("div", { class: "hy-general-list-item__type" }, h("span", { class: "hy-general-list-item__type__major" }, this.label), h("span", { class: "hy-general-list-item__type__sub" }, this.subLabel))), this.imageUrl && (h("figure", { class: imageClassAttributes, style: aspectRatio }, h("img", { loading: this.disableLazy ? "eager" : "lazy", alt: this.imageAlt, class: "hy-general-list-item__image", src: this.imageUrl }))), h("div", { class: contentClassAttributes }, (this.tag || this.date) && (h("span", { class: "hy-genenral-list-item__meta" }, this.tag, h("span", { class: "hy-genenral-list-item__meta__date" }, this.tag && "|", " ", this.date))), h("h3", { class: titleClassAttributes }, this.itemTitle), h("p", { class: descriptionClassAttributes }, this.description)))));
   }
   static get is() { return "hy-general-list-item"; }
   static get originalStyleUrls() {
@@ -98,7 +98,7 @@ export class HyGeneralListItem {
         },
         "attribute": "image-alt",
         "reflect": false,
-        "defaultValue": "''"
+        "defaultValue": "\"\""
       },
       "imageUrl": {
         "type": "string",
@@ -186,7 +186,7 @@ export class HyGeneralListItem {
         },
         "attribute": "sub-label",
         "reflect": false,
-        "defaultValue": "''"
+        "defaultValue": "\"\""
       },
       "date": {
         "type": "string",
@@ -204,7 +204,7 @@ export class HyGeneralListItem {
         },
         "attribute": "date",
         "reflect": false,
-        "defaultValue": "''"
+        "defaultValue": "\"\""
       },
       "tag": {
         "type": "string",
@@ -222,7 +222,7 @@ export class HyGeneralListItem {
         },
         "attribute": "tag",
         "reflect": false,
-        "defaultValue": "''"
+        "defaultValue": "\"\""
       },
       "type": {
         "type": "string",