@itcenteratunihelsinki/huds-lib 0.8.41 → 0.8.43

package/dist/collection/components/navigation/hy-menu-main-group/hy-menu-main-group.js

@@ -1,4 +1,4 @@
-import { Component, Host, h, Element, Prop, State, Listen, Event } from '@stencil/core';
+import { Host, h } from '@stencil/core';
 import { ColorVariant, SiteLogoSize } from '../../../utils/utils';
 import { jsonParserWorker } from '../../../global/globalScript';
 let keys = {
@@ -8,7 +8,13 @@ export class HyMenuMainGroup {
   constructor() {
     this.menuLabel = 'University main menu';
     this.menuLabelClose = 'Close';
+    this.dataMainMenu = undefined;
     this.isMobile = false;
+    this.logoUrl = undefined;
+    this.logoLabel = undefined;
+    this.siteLabel = undefined;
+    this.siteUrl = undefined;
+    this.donate = undefined;
     this.isMenuOpen = false;
   }
   handleComponentClick(event) {
@@ -109,311 +115,300 @@ export class HyMenuMainGroup {
     return this.isMobile ? (h(Host, { class: {
         'menu--main-group--mobile': true,
         'menu--main-group--mobile__is-open': this.isMenuOpen,
-      } },
-      h("button", { "aria-label": this.menuLabel, class: {
-          'menu--main-group__mobile-toggle': true,
-          'is-open': this.isMenuOpen,
-        } },
-        h("hy-icon", { icon: 'hy-icon-slim-hamburger-menu', size: 20, fill: white })),
-      h("nav", { role: "navigation", "aria-hidden": this.isMenuOpen ? 'false' : 'true', class: {
-          'menu--main-group__dropdown--mobile': true,
-          'is-open': this.isMenuOpen,
-        } },
-        h("div", { class: "menu--main-group__dropdown__top" },
-          h("div", { class: 'menu--main-group__logo-container', id: 'menu-logo' },
-            h("hy-site-logo", { "is-group": true, size: logoSizeGroup, color: logoColorGroup, url: this.siteUrl, label: this.siteLabel })),
-          h("button", { "aria-label": `Close ${this.menuLabel}`, class: "menu--main-group__dropdown__close", onClick: (e) => this.handleTopMenuClose(e) },
-            h("hy-icon", { icon: 'hy-icon-remove', size: 20, fill: white }))),
-        h("div", { class: "menu--main-group__dropdown__items" }, this._dataMainMenu.map((item) => {
-          return (h("a", { href: item.url, class: { 'menu-main-link': true } },
-            h("span", { class: 'menu--main-group__label' }, item.label)));
-        })),
-        h("div", { class: "menu--main-group__dropdown__donate" }, this.donate &&
-          this.donate.map((i) => {
-            return (h("a", { class: 'menu--secondary__item hy-link__donate group', href: i.url },
-              h("hy-icon", { icon: 'hy-icon-heart-support', size: 14, fill: logoColorGroup }),
-              h("span", { class: 'hy-link__donate__label group' }, i.label)));
-          }))))) : (h(Host, { class: {
+      } }, h("button", { "aria-label": this.menuLabel, class: {
+        'menu--main-group__mobile-toggle': true,
+        'is-open': this.isMenuOpen,
+      } }, h("hy-icon", { icon: 'hy-icon-slim-hamburger-menu', size: 20, fill: white })), h("nav", { role: "navigation", "aria-hidden": this.isMenuOpen ? 'false' : 'true', class: {
+        'menu--main-group__dropdown--mobile': true,
+        'is-open': this.isMenuOpen,
+      } }, h("div", { class: "menu--main-group__dropdown__top" }, h("div", { class: 'menu--main-group__logo-container', id: 'menu-logo' }, h("hy-site-logo", { "is-group": true, size: logoSizeGroup, color: logoColorGroup, url: this.siteUrl, label: this.siteLabel })), h("button", { "aria-label": `Close ${this.menuLabel}`, class: "menu--main-group__dropdown__close", onClick: (e) => this.handleTopMenuClose(e) }, h("hy-icon", { icon: 'hy-icon-remove', size: 20, fill: white }))), h("div", { class: "menu--main-group__dropdown__items" }, this._dataMainMenu.map((item) => {
+      return (h("a", { href: item.url, class: { 'menu-main-link': true } }, h("span", { class: 'menu--main-group__label' }, item.label)));
+    })), h("div", { class: "menu--main-group__dropdown__donate" }, this.donate &&
+      this.donate.map((i) => {
+        return (h("a", { class: 'menu--secondary__item hy-link__donate group', href: i.url }, h("hy-icon", { icon: 'hy-icon-heart-support', size: 14, fill: logoColorGroup }), h("span", { class: 'hy-link__donate__label group' }, i.label)));
+      }))))) : (h(Host, { class: {
         'menu--main-group': true,
         'menu--main-group__is-open': this.isMenuOpen,
-      } },
-      h("button", { class: {
-          'menu--main-group__toggle': true,
-          'is-open': this.isMenuOpen,
-        }, "aria-expanded": this.isMenuOpen ? 'true' : 'false', "aria-haspopup": "menu" },
-        this.isMenuOpen ? (h("hy-icon", { class: 'toggle__close', icon: 'hy-icon-remove', size: 8, fill: white })) : (h("hy-icon", { class: 'toggle__caret', icon: 'hy-icon-slim-hamburger-menu', size: 8, fill: white })),
-        h("span", null, this.menuLabel)),
-      h("div", { class: {
-          'menu--main-group__dropdown': true,
-          'is-open': this.isMenuOpen,
-        } },
-        h("div", { class: "list" }, this._dataMainMenu.map((item) => {
-          return (h("a", { href: item.url, class: { 'menu-main-link': true } },
-            h("span", { class: "heading-icon" },
-              h("hy-icon", { icon: 'hy-icon-caret-right', size: 10, fill: white })),
-            h("span", { class: 'menu--main-group__label' }, item.label)));
-        })),
-        h("button", { onClick: (e) => this.handleComponentClick(e), class: {
-            'panel-toggle': true,
-          }, "aria-label": "Close menu" },
-          h("span", { class: "panel-toggle__label" },
-            h("span", { class: "panel-toggle__label__title" }, this.menuLabelClose),
-            h("hy-icon", { icon: 'hy-icon-remove', size: 20, fill: ColorVariant.white }))))));
+      } }, h("button", { class: {
+        'menu--main-group__toggle': true,
+        'is-open': this.isMenuOpen,
+      }, "aria-expanded": this.isMenuOpen ? 'true' : 'false', "aria-haspopup": "menu" }, this.isMenuOpen ? (h("hy-icon", { class: 'toggle__close', icon: 'hy-icon-remove', size: 8, fill: white })) : (h("hy-icon", { class: 'toggle__caret', icon: 'hy-icon-slim-hamburger-menu', size: 8, fill: white })), h("span", null, this.menuLabel)), h("div", { class: {
+        'menu--main-group__dropdown': true,
+        'is-open': this.isMenuOpen,
+      } }, h("div", { class: "list" }, this._dataMainMenu.map((item) => {
+      return (h("a", { href: item.url, class: { 'menu-main-link': true } }, h("span", { class: "heading-icon" }, h("hy-icon", { icon: 'hy-icon-caret-right', size: 10, fill: white })), h("span", { class: 'menu--main-group__label' }, item.label)));
+    })), h("button", { onClick: (e) => this.handleComponentClick(e), class: {
+        'panel-toggle': true,
+      }, "aria-label": "Close menu" }, h("span", { class: "panel-toggle__label" }, h("span", { class: "panel-toggle__label__title" }, this.menuLabelClose), h("hy-icon", { icon: 'hy-icon-remove', size: 20, fill: ColorVariant.white }))))));
   }
   static get is() { return "hy-menu-main-group"; }
   static get encapsulation() { return "shadow"; }
-  static get originalStyleUrls() { return {
-    "$": ["hy-menu-main-group.scss"]
-  }; }
-  static get styleUrls() { return {
-    "$": ["hy-menu-main-group.css"]
-  }; }
-  static get properties() { return {
-    "menuLabel": {
-      "type": "string",
-      "mutable": false,
-      "complexType": {
-        "original": "string",
-        "resolved": "string",
-        "references": {}
-      },
-      "required": false,
-      "optional": false,
-      "docs": {
-        "tags": [],
-        "text": ""
-      },
-      "attribute": "menu-label",
-      "reflect": false,
-      "defaultValue": "'University main menu'"
-    },
-    "menuLabelClose": {
-      "type": "string",
-      "mutable": false,
-      "complexType": {
-        "original": "string",
-        "resolved": "string",
-        "references": {}
+  static get originalStyleUrls() {
+    return {
+      "$": ["hy-menu-main-group.scss"]
+    };
+  }
+  static get styleUrls() {
+    return {
+      "$": ["hy-menu-main-group.css"]
+    };
+  }
+  static get properties() {
+    return {
+      "menuLabel": {
+        "type": "string",
+        "mutable": false,
+        "complexType": {
+          "original": "string",
+          "resolved": "string",
+          "references": {}
+        },
+        "required": false,
+        "optional": false,
+        "docs": {
+          "tags": [],
+          "text": ""
+        },
+        "attribute": "menu-label",
+        "reflect": false,
+        "defaultValue": "'University main menu'"
       },
-      "required": false,
-      "optional": false,
-      "docs": {
-        "tags": [],
-        "text": ""
+      "menuLabelClose": {
+        "type": "string",
+        "mutable": false,
+        "complexType": {
+          "original": "string",
+          "resolved": "string",
+          "references": {}
+        },
+        "required": false,
+        "optional": false,
+        "docs": {
+          "tags": [],
+          "text": ""
+        },
+        "attribute": "menu-label-close",
+        "reflect": false,
+        "defaultValue": "'Close'"
       },
-      "attribute": "menu-label-close",
-      "reflect": false,
-      "defaultValue": "'Close'"
-    },
-    "dataMainMenu": {
-      "type": "string",
-      "mutable": false,
-      "complexType": {
-        "original": "MainMenu[] | string",
-        "resolved": "MainMenu[] | string",
-        "references": {
-          "MainMenu": {
-            "location": "local"
+      "dataMainMenu": {
+        "type": "string",
+        "mutable": false,
+        "complexType": {
+          "original": "MainMenu[] | string",
+          "resolved": "MainMenu[] | string",
+          "references": {
+            "MainMenu": {
+              "location": "local",
+              "path": "/builds/julkiset-sivut/design-system-lib/src/components/navigation/hy-menu-main-group/hy-menu-main-group.tsx"
+            }
           }
-        }
-      },
-      "required": false,
-      "optional": false,
-      "docs": {
-        "tags": [],
-        "text": ""
+        },
+        "required": false,
+        "optional": false,
+        "docs": {
+          "tags": [],
+          "text": ""
+        },
+        "attribute": "data-main-menu",
+        "reflect": false
       },
-      "attribute": "data-main-menu",
-      "reflect": false
-    },
-    "isMobile": {
-      "type": "boolean",
-      "mutable": false,
-      "complexType": {
-        "original": "boolean",
-        "resolved": "boolean",
-        "references": {}
+      "isMobile": {
+        "type": "boolean",
+        "mutable": false,
+        "complexType": {
+          "original": "boolean",
+          "resolved": "boolean",
+          "references": {}
+        },
+        "required": false,
+        "optional": false,
+        "docs": {
+          "tags": [],
+          "text": ""
+        },
+        "attribute": "is-mobile",
+        "reflect": false,
+        "defaultValue": "false"
       },
-      "required": false,
-      "optional": false,
-      "docs": {
-        "tags": [],
-        "text": ""
+      "logoUrl": {
+        "type": "string",
+        "mutable": false,
+        "complexType": {
+          "original": "string",
+          "resolved": "string",
+          "references": {}
+        },
+        "required": false,
+        "optional": true,
+        "docs": {
+          "tags": [],
+          "text": ""
+        },
+        "attribute": "logo-url",
+        "reflect": false
       },
-      "attribute": "is-mobile",
-      "reflect": false,
-      "defaultValue": "false"
-    },
-    "logoUrl": {
-      "type": "string",
-      "mutable": false,
-      "complexType": {
-        "original": "string",
-        "resolved": "string",
-        "references": {}
+      "logoLabel": {
+        "type": "string",
+        "mutable": false,
+        "complexType": {
+          "original": "string",
+          "resolved": "string",
+          "references": {}
+        },
+        "required": false,
+        "optional": true,
+        "docs": {
+          "tags": [],
+          "text": ""
+        },
+        "attribute": "logo-label",
+        "reflect": false
       },
-      "required": false,
-      "optional": true,
-      "docs": {
-        "tags": [],
-        "text": ""
+      "siteLabel": {
+        "type": "string",
+        "mutable": false,
+        "complexType": {
+          "original": "string",
+          "resolved": "string",
+          "references": {}
+        },
+        "required": false,
+        "optional": true,
+        "docs": {
+          "tags": [],
+          "text": ""
+        },
+        "attribute": "site-label",
+        "reflect": false
       },
-      "attribute": "logo-url",
-      "reflect": false
-    },
-    "logoLabel": {
-      "type": "string",
-      "mutable": false,
-      "complexType": {
-        "original": "string",
-        "resolved": "string",
-        "references": {}
+      "siteUrl": {
+        "type": "string",
+        "mutable": false,
+        "complexType": {
+          "original": "string",
+          "resolved": "string",
+          "references": {}
+        },
+        "required": false,
+        "optional": true,
+        "docs": {
+          "tags": [],
+          "text": ""
+        },
+        "attribute": "site-url",
+        "reflect": false
       },
-      "required": false,
-      "optional": true,
-      "docs": {
-        "tags": [],
-        "text": ""
-      },
-      "attribute": "logo-label",
-      "reflect": false
-    },
-    "siteLabel": {
-      "type": "string",
-      "mutable": false,
-      "complexType": {
-        "original": "string",
-        "resolved": "string",
-        "references": {}
-      },
-      "required": false,
-      "optional": true,
-      "docs": {
-        "tags": [],
-        "text": ""
-      },
-      "attribute": "site-label",
-      "reflect": false
-    },
-    "siteUrl": {
-      "type": "string",
-      "mutable": false,
-      "complexType": {
-        "original": "string",
-        "resolved": "string",
-        "references": {}
-      },
-      "required": false,
-      "optional": true,
-      "docs": {
-        "tags": [],
-        "text": ""
-      },
-      "attribute": "site-url",
-      "reflect": false
-    },
-    "donate": {
-      "type": "unknown",
-      "mutable": false,
-      "complexType": {
-        "original": "DonateLink[]",
-        "resolved": "DonateLink[]",
-        "references": {
-          "DonateLink": {
-            "location": "local"
+      "donate": {
+        "type": "unknown",
+        "mutable": false,
+        "complexType": {
+          "original": "DonateLink[]",
+          "resolved": "DonateLink[]",
+          "references": {
+            "DonateLink": {
+              "location": "local",
+              "path": "/builds/julkiset-sivut/design-system-lib/src/components/navigation/hy-menu-main-group/hy-menu-main-group.tsx"
+            }
           }
+        },
+        "required": false,
+        "optional": false,
+        "docs": {
+          "tags": [],
+          "text": ""
         }
-      },
-      "required": false,
-      "optional": false,
-      "docs": {
-        "tags": [],
-        "text": ""
       }
-    }
-  }; }
-  static get states() { return {
-    "isMenuOpen": {}
-  }; }
-  static get events() { return [{
-      "method": "universityMainMenuToggled",
-      "name": "universityMainMenuToggled",
-      "bubbles": true,
-      "cancelable": true,
-      "composed": true,
-      "docs": {
-        "tags": [],
-        "text": ""
-      },
-      "complexType": {
-        "original": "any",
-        "resolved": "any",
-        "references": {}
-      }
-    }, {
-      "method": "mobileMenuTopToggle",
-      "name": "mobileMenuTopToggle",
-      "bubbles": true,
-      "cancelable": true,
-      "composed": true,
-      "docs": {
-        "tags": [],
-        "text": ""
-      },
-      "complexType": {
-        "original": "any",
-        "resolved": "any",
-        "references": {}
-      }
-    }]; }
+    };
+  }
+  static get states() {
+    return {
+      "isMenuOpen": {}
+    };
+  }
+  static get events() {
+    return [{
+        "method": "universityMainMenuToggled",
+        "name": "universityMainMenuToggled",
+        "bubbles": true,
+        "cancelable": true,
+        "composed": true,
+        "docs": {
+          "tags": [],
+          "text": ""
+        },
+        "complexType": {
+          "original": "any",
+          "resolved": "any",
+          "references": {}
+        }
+      }, {
+        "method": "mobileMenuTopToggle",
+        "name": "mobileMenuTopToggle",
+        "bubbles": true,
+        "cancelable": true,
+        "composed": true,
+        "docs": {
+          "tags": [],
+          "text": ""
+        },
+        "complexType": {
+          "original": "any",
+          "resolved": "any",
+          "references": {}
+        }
+      }];
+  }
   static get elementRef() { return "el"; }
-  static get listeners() { return [{
-      "name": "click",
-      "method": "handleComponentClick",
-      "target": undefined,
-      "capture": true,
-      "passive": false
-    }, {
-      "name": "keydown",
-      "method": "handleComponentKeyDown",
-      "target": undefined,
-      "capture": false,
-      "passive": false
-    }, {
-      "name": "click",
-      "method": "handleOutsideMenuClick",
-      "target": "window",
-      "capture": false,
-      "passive": false
-    }, {
-      "name": "headerScrollDown",
-      "method": "handleOutsideMenuClick",
-      "target": "window",
-      "capture": false,
-      "passive": false
-    }, {
-      "name": "headerScrollUp",
-      "method": "handleOutsideMenuClick",
-      "target": "window",
-      "capture": false,
-      "passive": false
-    }, {
-      "name": "menuDesktopToggled",
-      "method": "desktopMenuToggled",
-      "target": "document",
-      "capture": false,
-      "passive": false
-    }, {
-      "name": "searchPanelToggled",
-      "method": "searchPanelToggled",
-      "target": "document",
-      "capture": false,
-      "passive": false
-    }, {
-      "name": "menuLanguageToggled",
-      "method": "languageMenuToggled",
-      "target": "document",
-      "capture": false,
-      "passive": false
-    }]; }
+  static get listeners() {
+    return [{
+        "name": "click",
+        "method": "handleComponentClick",
+        "target": undefined,
+        "capture": true,
+        "passive": false
+      }, {
+        "name": "keydown",
+        "method": "handleComponentKeyDown",
+        "target": undefined,
+        "capture": false,
+        "passive": false
+      }, {
+        "name": "click",
+        "method": "handleOutsideMenuClick",
+        "target": "window",
+        "capture": false,
+        "passive": false
+      }, {
+        "name": "headerScrollDown",
+        "method": "handleOutsideMenuClick",
+        "target": "window",
+        "capture": false,
+        "passive": false
+      }, {
+        "name": "headerScrollUp",
+        "method": "handleOutsideMenuClick",
+        "target": "window",
+        "capture": false,
+        "passive": false
+      }, {
+        "name": "menuDesktopToggled",
+        "method": "desktopMenuToggled",
+        "target": "document",
+        "capture": false,
+        "passive": false
+      }, {
+        "name": "searchPanelToggled",
+        "method": "searchPanelToggled",
+        "target": "document",
+        "capture": false,
+        "passive": false
+      }, {
+        "name": "menuLanguageToggled",
+        "method": "languageMenuToggled",
+        "target": "document",
+        "capture": false,
+        "passive": false
+      }];
+  }
 }