npm - @duetds/components - Versions diffs - 8.0.6 → 8.1.1 - Mend

@duetds/components 8.0.6 → 8.1.1

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.

Files changed (1247) hide show

package/lib/collection/components/duet-footer/duet-footer.js CHANGED Viewed

@@ -7,17 +7,18 @@ import newWindowIconSmall from "@duetds/icons/lib/assets/action-new-window-small
 import { Build, Fragment, h } from "@stencil/core";
 import { DuetStringsExternalDefaults } from "../../common-strings";
 import { inheritGlobalTheme } from "../../common/themeable-component";
+import { subscribeTabbingChange, unsubscribeTabbingChange } from "../../utils/keyboard-utils";
 import { connectLanguageChangeObserver, disconnectLanguageChangeObserver, getLanguage, getLocaleString, } from "../../utils/language-utils";
 import { parsePossibleJSON } from "../../utils/string-utils";
 const i18n = {
-  fi: { lahi: "© LähiTapiola", turva: "© Turva" },
-  sv: { lahi: "© LokalTapiola", turva: "© Turva" },
-  en: { lahi: "© LocalTapiola", turva: "© Turva" },
+    fi: { lahi: "© LähiTapiola", turva: "© Turva" },
+    sv: { lahi: "© LokalTapiola", turva: "© Turva" },
+    en: { lahi: "© LocalTapiola", turva: "© Turva" },
 };
 const createEvent = (ev, data) => ({
-  component: "duet-footer",
-  data,
-  originalEvent: ev,
+    component: "duet-footer",
+    data,
+    originalEvent: ev,
 });
 /**
  * @slot extra - A slot for extra links.
@@ -26,489 +27,491 @@ const createEvent = (ev, data) => ({
  * @part menu - piercing selector for styling the menu section of the footer
  */
 export class DuetFooter {
-  constructor() {
+    constructor() {
+        /**
+         * Component event handling.
+         */
+        this.handleClick = (event) => {
+            if (event.data.analyticsId) {
+                this.duetAnalytics.emit({
+                    component: "duet-footer",
+                    analyticsId: event.data.analyticsId,
+                });
+            }
+            this.duetChange.emit(event);
+        };
+        this.handleLogoClick = (ev) => {
+            const e = createEvent(ev, { href: this.logoHref, label: "logo" });
+            this.duetLogoClick.emit(e);
+            this.handleClick(e);
+        };
+        this.handleMenuClick = (ev, data) => {
+            const e = createEvent(ev, data);
+            this.handleClick(e);
+            this.duetMenuClick.emit(e);
+        };
+        this.handleItemClick = (ev, data) => {
+            const e = createEvent(ev, data);
+            this.handleClick(e);
+            this.duetItemClick.emit(e);
+        };
+        this.emitDuetEvent = (ev, data) => {
+            this.duetEvent.emit({
+                component: "duet-footer",
+                data,
+                originalEvent: ev,
+            });
+        };
+        this.processedMainItem = null;
+        this.processedItems = null;
+        this.processedMenu = null;
+        this.theme = "";
+        this.variation = "default";
+        this.margin = "auto";
+        this.logoHref = "/";
+        this.language = getLanguage();
+        this.items = undefined;
+        this.accessibleLabel = undefined;
+        this.accessibleLabelExternalDefaults = DuetStringsExternalDefaults;
+        this.accessibleLabelExternal = getLocaleString(this.accessibleLabelExternalDefaults);
+        this.menu = undefined;
+    }
     /**
-     * Component event handling.
+     * Component lifecycle events.
      */
-    this.handleClick = (event) => {
-      if (event.data.analyticsId) {
-        this.duetAnalytics.emit({
-          component: "duet-footer",
-          analyticsId: event.data.analyticsId,
+    componentWillLoad() {
+        inheritGlobalTheme(this);
+        this.refresh();
+        this.hasInfoSlot = Build.isServer
+            ? Array.from(this.element.children).filter(el => el.matches("[slot='info']")).length > 0
+            : !!this.element.querySelector(":scope > [slot='info']");
+    }
+    connectedCallback() {
+        connectLanguageChangeObserver(this, {
+            prop: "accessibleLabelExternal",
+            defaults: "accessibleLabelExternalDefaults",
         });
-      }
-      this.duetChange.emit(event);
-    };
-    this.handleLogoClick = (ev) => {
-      const e = createEvent(ev, { href: this.logoHref, label: "logo" });
-      this.duetLogoClick.emit(e);
-      this.handleClick(e);
-    };
-    this.handleMenuClick = (ev, data) => {
-      const e = createEvent(ev, data);
-      this.handleClick(e);
-      this.duetMenuClick.emit(e);
-    };
-    this.handleItemClick = (ev, data) => {
-      const e = createEvent(ev, data);
-      this.handleClick(e);
-      this.duetItemClick.emit(e);
-    };
-    this.emitDuetEvent = (ev, data) => {
-      this.duetEvent.emit({
-        component: "duet-footer",
-        data,
-        originalEvent: ev,
-      });
-    };
-    this.processedMainItem = null;
-    this.processedItems = null;
-    this.processedMenu = null;
-    this.theme = "";
-    this.variation = "default";
-    this.margin = "auto";
-    this.logoHref = "/";
-    this.language = getLanguage();
-    this.items = undefined;
-    this.accessibleLabel = undefined;
-    this.accessibleLabelExternalDefaults = DuetStringsExternalDefaults;
-    this.accessibleLabelExternal = getLocaleString(this.accessibleLabelExternalDefaults);
-    this.menu = undefined;
-  }
-  /**
-   * Component lifecycle events.
-   */
-  componentWillLoad() {
-    inheritGlobalTheme(this);
-    this.refresh();
-    this.hasInfoSlot = Build.isServer
-      ? Array.from(this.element.children).filter(el => el.matches("[slot='info']")).length > 0
-      : !!this.element.querySelector(":scope > [slot='info']");
-  }
-  connectedCallback() {
-    connectLanguageChangeObserver(this, {
-      prop: "accessibleLabelExternal",
-      defaults: "accessibleLabelExternalDefaults",
-    });
-  }
-  disconnectedCallback() {
-    disconnectLanguageChangeObserver(this);
-  }
-  /**
-   * Local methods
-   */
-  async refresh() {
-    this.processedItems = parsePossibleJSON(this.items);
-    this.processedMenu = parsePossibleJSON(this.menu);
-  }
-  renderFooterTop() {
-    const logo = (h("div", { class: {
-        "footer-top-logo": this.hasInfoSlot,
-      } }, this.variation !== "simple" && (h("duet-logo", { href: this.logoHref, onClick: this.handleLogoClick, size: "large", inverse: true, language: this.language, theme: this.theme }))));
-    const footerItems = this.processedItems &&
-      this.variation !== "simple" &&
-      this.processedItems.map(item => (h("a", { class: "duet-footer-link", href: item.href, id: item.id, target: item.external ? "_blank" : "_self", onClick: event => this.handleItemClick(event, item), onMouseEnter: event => this.emitDuetEvent(event, item), onTouchStart: event => this.emitDuetEvent(event, item) }, h("div", { class: "duet-footer-icon" }, h("duet-icon", { size: "medium", margin: "none", name: item.icon, color: "currentColor" })), h("span", null, item.label), !item.hideArrow && (h(Fragment, null, item.external && h("duet-visually-hidden", null, ", ", this.accessibleLabelExternal), h("div", { class: "duet-footer-arrow" }, item.external ? (h("duet-icon", { icon: newWindowIcon.svg, size: "xx-small", margin: "none", color: "currentColor" })) : (h("duet-icon", { icon: arrowRightIcon.svg, size: "auto", margin: "none", color: "currentColor" }))))))));
-    if (this.hasInfoSlot) {
-      return (h(Fragment, null, logo, h("div", { class: "footer-top-right-container" }, h("slot", { name: "info" }), h("div", { class: "footer-top-items" }, footerItems))));
+        subscribeTabbingChange(this);
     }
-    return (h(Fragment, null, logo, footerItems));
-  }
-  /**
-   * render() function
-   * Always the last one in the class.
-   */
-  render() {
-    const text = getLocaleString(i18n);
-    const copyrightLabel = this.theme === "turva" ? text.turva : text.lahi;
-    return (h("footer", { class: {
-        "duet-footer": true,
-        "duet-m-0": this.margin === "none",
-        "duet-theme-turva": this.theme === "turva",
-        "duet-footer-simple": this.variation === "simple",
-      }, "aria-label": this.accessibleLabel }, h("div", { class: "duet-footer-wrapper" }, h("div", { class: "duet-footer-top", part: "top" }, this.renderFooterTop()), h("slot", { name: "extra" }), h("p", { class: "duet-footer-menu", part: "menu" }, h("span", { class: "duet-footer-copyright" }, `${copyrightLabel} ${new Date().getFullYear()}`), h("div", { class: "duet-footer-menu-links" }, this.processedMenu && (h(Fragment, null, this.processedMenu.map(item => (h("a", { href: item.href, id: item.id, target: item.external ? "_blank" : "_self", onClick: event => this.handleMenuClick(event, item), onMouseEnter: event => this.emitDuetEvent(event, item), onTouchStart: event => this.emitDuetEvent(event, item) }, item.label, item.external && (h(Fragment, null, h("duet-visually-hidden", null, ", ", this.accessibleLabelExternal), h("div", { class: "duet-footer-external" }, h("duet-icon", { icon: newWindowIconSmall.svg, size: "xx-small", margin: "none", color: "currentColor" })))), h("span", { class: "duet-footer-divider", role: "presentation", "aria-hidden": "true" }, "/")))))))), h("p", { class: "duet-footer-copyright duet-footer-copyright-mobile" }, `${copyrightLabel} ${new Date().getFullYear()}`))));
-  }
-  static get is() { return "duet-footer"; }
-  static get encapsulation() { return "shadow"; }
-  static get originalStyleUrls() {
-    return {
-      "$": ["duet-footer.scss"]
-    };
-  }
-  static get styleUrls() {
-    return {
-      "$": ["duet-footer.css"]
-    };
-  }
-  static get properties() {
-    return {
-      "theme": {
-        "type": "string",
-        "mutable": true,
-        "complexType": {
-          "original": "DuetTheme",
-          "resolved": "\"\" | \"default\" | \"turva\"",
-          "references": {
-            "DuetTheme": {
-              "location": "import",
-              "path": "../../common-types",
-              "id": "src/common-types.d.ts::DuetTheme"
-            }
-          }
-        },
-        "required": false,
-        "optional": false,
-        "docs": {
-          "tags": [],
-          "text": "Theme of the navigation."
-        },
-        "attribute": "theme",
-        "reflect": false,
-        "defaultValue": "\"\""
-      },
-      "variation": {
-        "type": "string",
-        "mutable": false,
-        "complexType": {
-          "original": "DuetFooterVariation",
-          "resolved": "\"default\" | \"multilevel\" | \"simple\"",
-          "references": {
-            "DuetFooterVariation": {
-              "location": "local",
-              "path": "/Users/laaksju3/duetds/packages/components/src/components/duet-footer/duet-footer.tsx",
-              "id": "src/components/duet-footer/duet-footer.tsx::DuetFooterVariation"
-            }
-          }
-        },
-        "required": false,
-        "optional": false,
-        "docs": {
-          "tags": [],
-          "text": "Style variation of the footer."
-        },
-        "attribute": "variation",
-        "reflect": false,
-        "defaultValue": "\"default\""
-      },
-      "margin": {
-        "type": "string",
-        "mutable": false,
-        "complexType": {
-          "original": "DuetMargin",
-          "resolved": "\"auto\" | \"none\"",
-          "references": {
-            "DuetMargin": {
-              "location": "import",
-              "path": "../../common-types",
-              "id": "src/common-types.d.ts::DuetMargin"
-            }
-          }
-        },
-        "required": false,
-        "optional": false,
-        "docs": {
-          "tags": [],
-          "text": "Controls the margin of the component."
-        },
-        "attribute": "margin",
-        "reflect": false,
-        "defaultValue": "\"auto\""
-      },
-      "logoHref": {
-        "type": "string",
-        "mutable": false,
-        "complexType": {
-          "original": "string",
-          "resolved": "string",
-          "references": {}
-        },
-        "required": false,
-        "optional": false,
-        "docs": {
-          "tags": [],
-          "text": "URL that the logo link points to."
-        },
-        "attribute": "logo-href",
-        "reflect": false,
-        "defaultValue": "\"/\""
-      },
-      "language": {
-        "type": "string",
-        "mutable": true,
-        "complexType": {
-          "original": "DuetLanguage",
-          "resolved": "\"en\" | \"fi\" | \"sv\"",
-          "references": {
-            "DuetLanguage": {
-              "location": "import",
-              "path": "../../common-types",
-              "id": "src/common-types.d.ts::DuetLanguage"
-            }
-          }
-        },
-        "required": false,
-        "optional": false,
-        "docs": {
-          "tags": [{
-              "name": "deprecated",
-              "text": "this is now handled via the html lang tag, and is no longer used - kept to avoid breaking changes and ease unit testing"
-            }, {
-              "name": "default",
-              "text": "\"fi\""
-            }],
-          "text": "The currently active language. This setting changes the logo to match the\nchosen language."
-        },
-        "attribute": "language",
-        "reflect": true,
-        "defaultValue": "getLanguage()"
-      },
-      "items": {
-        "type": "any",
-        "mutable": false,
-        "complexType": {
-          "original": "any",
-          "resolved": "any",
-          "references": {}
-        },
-        "required": false,
-        "optional": false,
-        "docs": {
-          "tags": [],
-          "text": "An array of items for the main footer links. Items have to include mandatory\n\"label\", \"href\" and \"icon\" fields to work. Additionally, you can pass an \"id\"\nthat is added as an HTML identifier for the anchor tag."
-        },
-        "attribute": "items",
-        "reflect": false
-      },
-      "accessibleLabel": {
-        "type": "string",
-        "mutable": false,
-        "complexType": {
-          "original": "string",
-          "resolved": "string",
-          "references": {}
-        },
-        "required": false,
-        "optional": false,
-        "docs": {
-          "tags": [],
-          "text": "Accessible label for footer"
-        },
-        "attribute": "accessible-label",
-        "reflect": false
-      },
-      "accessibleLabelExternalDefaults": {
-        "type": "string",
-        "mutable": false,
-        "complexType": {
-          "original": "DuetLangObject | string",
-          "resolved": "DuetLangObject | string",
-          "references": {
-            "DuetLangObject": {
-              "location": "import",
-              "path": "../../utils/language-utils",
-              "id": "src/utils/language-utils.ts::DuetLangObject"
-            }
-          }
-        },
-        "required": false,
-        "optional": false,
-        "docs": {
-          "tags": [{
-              "name": "default",
-              "text": "{fi: \"Avautuu uuteen ikkunaan\",sv: \"\u00D6ppnas i nytt f\u00F6nster\",en: \"Opens in a new window\"}"
-            }],
-          "text": "Property to change accessibleLabelExternal defaults on the component.\nnormally you would handle these strings on an application level and override accessibleLabelExternal when needed"
-        },
-        "attribute": "accessible-label-external-default",
-        "reflect": false,
-        "defaultValue": "DuetStringsExternalDefaults"
-      },
-      "accessibleLabelExternal": {
-        "type": "string",
-        "mutable": true,
-        "complexType": {
-          "original": "string",
-          "resolved": "string",
-          "references": {}
-        },
-        "required": false,
-        "optional": false,
-        "docs": {
-          "tags": [{
-              "name": "default",
-              "text": "{fi: \"Avautuu uuteen ikkunaan\",sv: \"\u00D6ppnas i nytt f\u00F6nster\",en: \"Opens in a new window\"}"
-            }],
-          "text": "Adds accessible label for tooltip that is shown in external link (url & external have both been set)"
-        },
-        "attribute": "accessible-label-external",
-        "reflect": false,
-        "defaultValue": "getLocaleString(this.accessibleLabelExternalDefaults)"
-      },
-      "menu": {
-        "type": "any",
-        "mutable": false,
-        "complexType": {
-          "original": "any",
-          "resolved": "any",
-          "references": {}
-        },
-        "required": false,
-        "optional": false,
-        "docs": {
-          "tags": [],
-          "text": "An array of  items for the small footer menu. Items have to include mandatory\n\"label\" and \"href\" fields to work. Additionally, you can pass an \"id\" that is\nadded as an HTML identifier for the anchor tag."
-        },
-        "attribute": "menu",
-        "reflect": false
-      }
-    };
-  }
-  static get states() {
-    return {
-      "processedMainItem": {},
-      "processedItems": {},
-      "processedMenu": {}
-    };
-  }
-  static get events() {
-    return [{
-        "method": "duetChange",
-        "name": "duetChange",
-        "bubbles": false,
-        "cancelable": true,
-        "composed": true,
-        "docs": {
-          "tags": [{
-              "name": "deprecated",
-              "text": "in favour of the more specific events like duetLogoClick.\nCallback for when a user is about to navigate to another page. You can prevent\nthe default browser functionality by calling **event.detail.originalEvent.preventDefault()**\ninside your listener. Additionally, the passed data is available via\n**event.detail.data**."
-            }],
-          "text": ""
-        },
-        "complexType": {
-          "original": "DuetFooterChangeEvent",
-          "resolved": "{ component: \"duet-footer\"; data: DuetFooterItem | DuetFooterIconItem; originalEvent: Event; }",
-          "references": {
-            "DuetFooterChangeEvent": {
-              "location": "local",
-              "path": "/Users/laaksju3/duetds/packages/components/src/components/duet-footer/duet-footer.tsx",
-              "id": "src/components/duet-footer/duet-footer.tsx::DuetFooterChangeEvent"
-            }
-          }
-        }
-      }, {
-        "method": "duetLogoClick",
-        "name": "duetLogoClick",
-        "bubbles": true,
-        "cancelable": true,
-        "composed": true,
-        "docs": {
-          "tags": [],
-          "text": "Event raised when the logo is clicked. You can prevent\nthe default browser functionality by calling **event.detail.originalEvent.preventDefault()**\ninside your listener. Additionally, the passed data is available via\n**event.detail.data**."
-        },
-        "complexType": {
-          "original": "DuetFooterChangeEvent",
-          "resolved": "{ component: \"duet-footer\"; data: DuetFooterItem | DuetFooterIconItem; originalEvent: Event; }",
-          "references": {
-            "DuetFooterChangeEvent": {
-              "location": "local",
-              "path": "/Users/laaksju3/duetds/packages/components/src/components/duet-footer/duet-footer.tsx",
-              "id": "src/components/duet-footer/duet-footer.tsx::DuetFooterChangeEvent"
-            }
-          }
-        }
-      }, {
-        "method": "duetMenuClick",
-        "name": "duetMenuClick",
-        "bubbles": true,
-        "cancelable": true,
-        "composed": true,
-        "docs": {
-          "tags": [],
-          "text": "Event raised when the menu links are clicked. You can prevent\nthe default browser functionality by calling **event.detail.originalEvent.preventDefault()**\ninside your listener. Additionally, the passed data is available via\n**event.detail.data**."
-        },
-        "complexType": {
-          "original": "DuetFooterChangeEvent",
-          "resolved": "{ component: \"duet-footer\"; data: DuetFooterItem | DuetFooterIconItem; originalEvent: Event; }",
-          "references": {
-            "DuetFooterChangeEvent": {
-              "location": "local",
-              "path": "/Users/laaksju3/duetds/packages/components/src/components/duet-footer/duet-footer.tsx",
-              "id": "src/components/duet-footer/duet-footer.tsx::DuetFooterChangeEvent"
-            }
-          }
-        }
-      }, {
-        "method": "duetItemClick",
-        "name": "duetItemClick",
-        "bubbles": true,
-        "cancelable": true,
-        "composed": true,
-        "docs": {
-          "tags": [],
-          "text": "Event raised when the items are clicked. You can prevent\nthe default browser functionality by calling **event.detail.originalEvent.preventDefault()**\ninside your listener. Additionally, the passed data is available via\n**event.detail.data**."
-        },
-        "complexType": {
-          "original": "DuetFooterChangeEvent",
-          "resolved": "{ component: \"duet-footer\"; data: DuetFooterItem | DuetFooterIconItem; originalEvent: Event; }",
-          "references": {
-            "DuetFooterChangeEvent": {
-              "location": "local",
-              "path": "/Users/laaksju3/duetds/packages/components/src/components/duet-footer/duet-footer.tsx",
-              "id": "src/components/duet-footer/duet-footer.tsx::DuetFooterChangeEvent"
-            }
-          }
-        }
-      }, {
-        "method": "duetAnalytics",
-        "name": "duetAnalytics",
-        "bubbles": true,
-        "cancelable": true,
-        "composed": true,
-        "docs": {
-          "tags": [],
-          "text": "Event raised when an items with an associated analytics ID is clicked. Analytics ID can be\naccessed via **event.detail.analyticsId**"
-        },
-        "complexType": {
-          "original": "DuetFooterAnalyticsEvent",
-          "resolved": "{ analyticsId: string; component: \"duet-footer\"; }",
-          "references": {
-            "DuetFooterAnalyticsEvent": {
-              "location": "local",
-              "path": "/Users/laaksju3/duetds/packages/components/src/components/duet-footer/duet-footer.tsx",
-              "id": "src/components/duet-footer/duet-footer.tsx::DuetFooterAnalyticsEvent"
-            }
-          }
+    disconnectedCallback() {
+        disconnectLanguageChangeObserver(this);
+        unsubscribeTabbingChange(this);
+    }
+    /**
+     * Local methods
+     */
+    async refresh() {
+        this.processedItems = parsePossibleJSON(this.items);
+        this.processedMenu = parsePossibleJSON(this.menu);
+    }
+    renderFooterTop() {
+        const logo = (h("div", { class: {
+                "footer-top-logo": this.hasInfoSlot,
+            } }, this.variation !== "simple" && (h("duet-logo", { href: this.logoHref, onClick: this.handleLogoClick, size: "large", inverse: true, language: this.language, theme: this.theme }))));
+        const footerItems = this.processedItems &&
+            this.variation !== "simple" &&
+            this.processedItems.map(item => (h("a", { class: "duet-footer-link", href: item.href, id: item.id, target: item.external ? "_blank" : "_self", onClick: event => this.handleItemClick(event, item), onMouseEnter: event => this.emitDuetEvent(event, item), onTouchStart: event => this.emitDuetEvent(event, item) }, h("div", { class: "duet-footer-icon" }, h("duet-icon", { size: "medium", margin: "none", name: item.icon, color: "currentColor" })), h("span", null, item.label), !item.hideArrow && (h(Fragment, null, item.external && h("duet-visually-hidden", null, ", ", this.accessibleLabelExternal), h("div", { class: "duet-footer-arrow" }, item.external ? (h("duet-icon", { icon: newWindowIcon.svg, size: "xx-small", margin: "none", color: "currentColor" })) : (h("duet-icon", { icon: arrowRightIcon.svg, size: "auto", margin: "none", color: "currentColor" }))))))));
+        if (this.hasInfoSlot) {
+            return (h(Fragment, null, logo, h("div", { class: "footer-top-right-container" }, h("slot", { name: "info" }), h("div", { class: "footer-top-items" }, footerItems))));
         }
-      }, {
-        "method": "duetEvent",
-        "name": "duetEvent",
-        "bubbles": true,
-        "cancelable": true,
-        "composed": true,
-        "docs": {
-          "tags": [],
-          "text": "General event stream for the following events:\nitem: onMouseEnter, onTouchDown;\nmenuItem: onMouseEnter, onTouchDown;.\nYou can prevent\nthe default browser functionality by calling **event.detail.originalEvent.preventDefault()**\ninside your listener. Additionally, the passed data is available via\n**event.detail.data**."
-        },
-        "complexType": {
-          "original": "DuetFooterChangeEvent",
-          "resolved": "{ component: \"duet-footer\"; data: DuetFooterItem | DuetFooterIconItem; originalEvent: Event; }",
-          "references": {
-            "DuetFooterChangeEvent": {
-              "location": "local",
-              "path": "/Users/laaksju3/duetds/packages/components/src/components/duet-footer/duet-footer.tsx",
-              "id": "src/components/duet-footer/duet-footer.tsx::DuetFooterChangeEvent"
+        return (h(Fragment, null, logo, footerItems));
+    }
+    /**
+     * render() function
+     * Always the last one in the class.
+     */
+    render() {
+        const text = getLocaleString(i18n);
+        const copyrightLabel = this.theme === "turva" ? text.turva : text.lahi;
+        return (h("footer", { class: {
+                "duet-footer": true,
+                "duet-m-0": this.margin === "none",
+                "duet-theme-turva": this.theme === "turva",
+                "duet-footer-simple": this.variation === "simple",
+            }, "aria-label": this.accessibleLabel }, h("div", { class: "duet-footer-wrapper" }, h("div", { class: "duet-footer-top", part: "top" }, this.renderFooterTop()), h("slot", { name: "extra" }), h("p", { class: "duet-footer-menu", part: "menu" }, h("span", { class: "duet-footer-copyright" }, `${copyrightLabel} ${new Date().getFullYear()}`), h("div", { class: "duet-footer-menu-links" }, this.processedMenu && (h(Fragment, null, this.processedMenu.map(item => (h("a", { href: item.href, id: item.id, target: item.external ? "_blank" : "_self", onClick: event => this.handleMenuClick(event, item), onMouseEnter: event => this.emitDuetEvent(event, item), onTouchStart: event => this.emitDuetEvent(event, item) }, item.label, item.external && (h(Fragment, null, h("duet-visually-hidden", null, ", ", this.accessibleLabelExternal), h("div", { class: "duet-footer-external" }, h("duet-icon", { icon: newWindowIconSmall.svg, size: "xx-small", margin: "none", color: "currentColor" })))), h("span", { class: "duet-footer-divider", role: "presentation", "aria-hidden": "true" }, "/")))))))), h("p", { class: "duet-footer-copyright duet-footer-copyright-mobile" }, `${copyrightLabel} ${new Date().getFullYear()}`))));
+    }
+    static get is() { return "duet-footer"; }
+    static get encapsulation() { return "shadow"; }
+    static get originalStyleUrls() {
+        return {
+            "$": ["duet-footer.scss"]
+        };
+    }
+    static get styleUrls() {
+        return {
+            "$": ["duet-footer.css"]
+        };
+    }
+    static get properties() {
+        return {
+            "theme": {
+                "type": "string",
+                "mutable": true,
+                "complexType": {
+                    "original": "DuetTheme",
+                    "resolved": "\"\" | \"default\" | \"turva\"",
+                    "references": {
+                        "DuetTheme": {
+                            "location": "import",
+                            "path": "../../common-types",
+                            "id": "src/common-types.d.ts::DuetTheme"
+                        }
+                    }
+                },
+                "required": false,
+                "optional": false,
+                "docs": {
+                    "tags": [],
+                    "text": "Theme of the navigation."
+                },
+                "attribute": "theme",
+                "reflect": false,
+                "defaultValue": "\"\""
+            },
+            "variation": {
+                "type": "string",
+                "mutable": false,
+                "complexType": {
+                    "original": "DuetFooterVariation",
+                    "resolved": "\"default\" | \"multilevel\" | \"simple\"",
+                    "references": {
+                        "DuetFooterVariation": {
+                            "location": "local",
+                            "path": "/Users/mgibas/workspace/duet/packages/components/src/components/duet-footer/duet-footer.tsx",
+                            "id": "src/components/duet-footer/duet-footer.tsx::DuetFooterVariation"
+                        }
+                    }
+                },
+                "required": false,
+                "optional": false,
+                "docs": {
+                    "tags": [],
+                    "text": "Style variation of the footer."
+                },
+                "attribute": "variation",
+                "reflect": false,
+                "defaultValue": "\"default\""
+            },
+            "margin": {
+                "type": "string",
+                "mutable": false,
+                "complexType": {
+                    "original": "DuetMargin",
+                    "resolved": "\"auto\" | \"none\"",
+                    "references": {
+                        "DuetMargin": {
+                            "location": "import",
+                            "path": "../../common-types",
+                            "id": "src/common-types.d.ts::DuetMargin"
+                        }
+                    }
+                },
+                "required": false,
+                "optional": false,
+                "docs": {
+                    "tags": [],
+                    "text": "Controls the margin of the component."
+                },
+                "attribute": "margin",
+                "reflect": false,
+                "defaultValue": "\"auto\""
+            },
+            "logoHref": {
+                "type": "string",
+                "mutable": false,
+                "complexType": {
+                    "original": "string",
+                    "resolved": "string",
+                    "references": {}
+                },
+                "required": false,
+                "optional": false,
+                "docs": {
+                    "tags": [],
+                    "text": "URL that the logo link points to."
+                },
+                "attribute": "logo-href",
+                "reflect": false,
+                "defaultValue": "\"/\""
+            },
+            "language": {
+                "type": "string",
+                "mutable": true,
+                "complexType": {
+                    "original": "DuetLanguage",
+                    "resolved": "\"en\" | \"fi\" | \"sv\"",
+                    "references": {
+                        "DuetLanguage": {
+                            "location": "import",
+                            "path": "../../common-types",
+                            "id": "src/common-types.d.ts::DuetLanguage"
+                        }
+                    }
+                },
+                "required": false,
+                "optional": false,
+                "docs": {
+                    "tags": [{
+                            "name": "deprecated",
+                            "text": "this is now handled via the html lang tag, and is no longer used - kept to avoid breaking changes and ease unit testing"
+                        }, {
+                            "name": "default",
+                            "text": "\"fi\""
+                        }],
+                    "text": "The currently active language. This setting changes the logo to match the\nchosen language."
+                },
+                "attribute": "language",
+                "reflect": true,
+                "defaultValue": "getLanguage()"
+            },
+            "items": {
+                "type": "any",
+                "mutable": false,
+                "complexType": {
+                    "original": "any",
+                    "resolved": "any",
+                    "references": {}
+                },
+                "required": false,
+                "optional": false,
+                "docs": {
+                    "tags": [],
+                    "text": "An array of items for the main footer links. Items have to include mandatory\n\"label\", \"href\" and \"icon\" fields to work. Additionally, you can pass an \"id\"\nthat is added as an HTML identifier for the anchor tag."
+                },
+                "attribute": "items",
+                "reflect": false
+            },
+            "accessibleLabel": {
+                "type": "string",
+                "mutable": false,
+                "complexType": {
+                    "original": "string",
+                    "resolved": "string",
+                    "references": {}
+                },
+                "required": false,
+                "optional": false,
+                "docs": {
+                    "tags": [],
+                    "text": "Accessible label for footer"
+                },
+                "attribute": "accessible-label",
+                "reflect": false
+            },
+            "accessibleLabelExternalDefaults": {
+                "type": "string",
+                "mutable": false,
+                "complexType": {
+                    "original": "DuetLangObject | string",
+                    "resolved": "DuetLangObject | string",
+                    "references": {
+                        "DuetLangObject": {
+                            "location": "import",
+                            "path": "../../utils/language-utils",
+                            "id": "src/utils/language-utils.ts::DuetLangObject"
+                        }
+                    }
+                },
+                "required": false,
+                "optional": false,
+                "docs": {
+                    "tags": [{
+                            "name": "default",
+                            "text": "{fi: \"Avautuu uuteen ikkunaan\",sv: \"\u00D6ppnas i nytt f\u00F6nster\",en: \"Opens in a new window\"}"
+                        }],
+                    "text": "Property to change accessibleLabelExternal defaults on the component.\nnormally you would handle these strings on an application level and override accessibleLabelExternal when needed"
+                },
+                "attribute": "accessible-label-external-default",
+                "reflect": false,
+                "defaultValue": "DuetStringsExternalDefaults"
+            },
+            "accessibleLabelExternal": {
+                "type": "string",
+                "mutable": true,
+                "complexType": {
+                    "original": "string",
+                    "resolved": "string",
+                    "references": {}
+                },
+                "required": false,
+                "optional": false,
+                "docs": {
+                    "tags": [{
+                            "name": "default",
+                            "text": "{fi: \"Avautuu uuteen ikkunaan\",sv: \"\u00D6ppnas i nytt f\u00F6nster\",en: \"Opens in a new window\"}"
+                        }],
+                    "text": "Adds accessible label for tooltip that is shown in external link (url & external have both been set)"
+                },
+                "attribute": "accessible-label-external",
+                "reflect": false,
+                "defaultValue": "getLocaleString(this.accessibleLabelExternalDefaults)"
+            },
+            "menu": {
+                "type": "any",
+                "mutable": false,
+                "complexType": {
+                    "original": "any",
+                    "resolved": "any",
+                    "references": {}
+                },
+                "required": false,
+                "optional": false,
+                "docs": {
+                    "tags": [],
+                    "text": "An array of  items for the small footer menu. Items have to include mandatory\n\"label\" and \"href\" fields to work. Additionally, you can pass an \"id\" that is\nadded as an HTML identifier for the anchor tag."
+                },
+                "attribute": "menu",
+                "reflect": false
             }
-          }
-        }
-      }];
-  }
-  static get elementRef() { return "element"; }
-  static get watchers() {
-    return [{
-        "propName": "menu",
-        "methodName": "refresh"
-      }, {
-        "propName": "items",
-        "methodName": "refresh"
-      }];
-  }
+        };
+    }
+    static get states() {
+        return {
+            "processedMainItem": {},
+            "processedItems": {},
+            "processedMenu": {}
+        };
+    }
+    static get events() {
+        return [{
+                "method": "duetChange",
+                "name": "duetChange",
+                "bubbles": false,
+                "cancelable": true,
+                "composed": true,
+                "docs": {
+                    "tags": [{
+                            "name": "deprecated",
+                            "text": "in favour of the more specific events like duetLogoClick.\nCallback for when a user is about to navigate to another page. You can prevent\nthe default browser functionality by calling **event.detail.originalEvent.preventDefault()**\ninside your listener. Additionally, the passed data is available via\n**event.detail.data**."
+                        }],
+                    "text": ""
+                },
+                "complexType": {
+                    "original": "DuetFooterChangeEvent",
+                    "resolved": "{ component: \"duet-footer\"; data: DuetFooterItem | DuetFooterIconItem; originalEvent: Event; }",
+                    "references": {
+                        "DuetFooterChangeEvent": {
+                            "location": "local",
+                            "path": "/Users/mgibas/workspace/duet/packages/components/src/components/duet-footer/duet-footer.tsx",
+                            "id": "src/components/duet-footer/duet-footer.tsx::DuetFooterChangeEvent"
+                        }
+                    }
+                }
+            }, {
+                "method": "duetLogoClick",
+                "name": "duetLogoClick",
+                "bubbles": true,
+                "cancelable": true,
+                "composed": true,
+                "docs": {
+                    "tags": [],
+                    "text": "Event raised when the logo is clicked. You can prevent\nthe default browser functionality by calling **event.detail.originalEvent.preventDefault()**\ninside your listener. Additionally, the passed data is available via\n**event.detail.data**."
+                },
+                "complexType": {
+                    "original": "DuetFooterChangeEvent",
+                    "resolved": "{ component: \"duet-footer\"; data: DuetFooterItem | DuetFooterIconItem; originalEvent: Event; }",
+                    "references": {
+                        "DuetFooterChangeEvent": {
+                            "location": "local",
+                            "path": "/Users/mgibas/workspace/duet/packages/components/src/components/duet-footer/duet-footer.tsx",
+                            "id": "src/components/duet-footer/duet-footer.tsx::DuetFooterChangeEvent"
+                        }
+                    }
+                }
+            }, {
+                "method": "duetMenuClick",
+                "name": "duetMenuClick",
+                "bubbles": true,
+                "cancelable": true,
+                "composed": true,
+                "docs": {
+                    "tags": [],
+                    "text": "Event raised when the menu links are clicked. You can prevent\nthe default browser functionality by calling **event.detail.originalEvent.preventDefault()**\ninside your listener. Additionally, the passed data is available via\n**event.detail.data**."
+                },
+                "complexType": {
+                    "original": "DuetFooterChangeEvent",
+                    "resolved": "{ component: \"duet-footer\"; data: DuetFooterItem | DuetFooterIconItem; originalEvent: Event; }",
+                    "references": {
+                        "DuetFooterChangeEvent": {
+                            "location": "local",
+                            "path": "/Users/mgibas/workspace/duet/packages/components/src/components/duet-footer/duet-footer.tsx",
+                            "id": "src/components/duet-footer/duet-footer.tsx::DuetFooterChangeEvent"
+                        }
+                    }
+                }
+            }, {
+                "method": "duetItemClick",
+                "name": "duetItemClick",
+                "bubbles": true,
+                "cancelable": true,
+                "composed": true,
+                "docs": {
+                    "tags": [],
+                    "text": "Event raised when the items are clicked. You can prevent\nthe default browser functionality by calling **event.detail.originalEvent.preventDefault()**\ninside your listener. Additionally, the passed data is available via\n**event.detail.data**."
+                },
+                "complexType": {
+                    "original": "DuetFooterChangeEvent",
+                    "resolved": "{ component: \"duet-footer\"; data: DuetFooterItem | DuetFooterIconItem; originalEvent: Event; }",
+                    "references": {
+                        "DuetFooterChangeEvent": {
+                            "location": "local",
+                            "path": "/Users/mgibas/workspace/duet/packages/components/src/components/duet-footer/duet-footer.tsx",
+                            "id": "src/components/duet-footer/duet-footer.tsx::DuetFooterChangeEvent"
+                        }
+                    }
+                }
+            }, {
+                "method": "duetAnalytics",
+                "name": "duetAnalytics",
+                "bubbles": true,
+                "cancelable": true,
+                "composed": true,
+                "docs": {
+                    "tags": [],
+                    "text": "Event raised when an items with an associated analytics ID is clicked. Analytics ID can be\naccessed via **event.detail.analyticsId**"
+                },
+                "complexType": {
+                    "original": "DuetFooterAnalyticsEvent",
+                    "resolved": "{ analyticsId: string; component: \"duet-footer\"; }",
+                    "references": {
+                        "DuetFooterAnalyticsEvent": {
+                            "location": "local",
+                            "path": "/Users/mgibas/workspace/duet/packages/components/src/components/duet-footer/duet-footer.tsx",
+                            "id": "src/components/duet-footer/duet-footer.tsx::DuetFooterAnalyticsEvent"
+                        }
+                    }
+                }
+            }, {
+                "method": "duetEvent",
+                "name": "duetEvent",
+                "bubbles": true,
+                "cancelable": true,
+                "composed": true,
+                "docs": {
+                    "tags": [],
+                    "text": "General event stream for the following events:\nitem: onMouseEnter, onTouchDown;\nmenuItem: onMouseEnter, onTouchDown;.\nYou can prevent\nthe default browser functionality by calling **event.detail.originalEvent.preventDefault()**\ninside your listener. Additionally, the passed data is available via\n**event.detail.data**."
+                },
+                "complexType": {
+                    "original": "DuetFooterChangeEvent",
+                    "resolved": "{ component: \"duet-footer\"; data: DuetFooterItem | DuetFooterIconItem; originalEvent: Event; }",
+                    "references": {
+                        "DuetFooterChangeEvent": {
+                            "location": "local",
+                            "path": "/Users/mgibas/workspace/duet/packages/components/src/components/duet-footer/duet-footer.tsx",
+                            "id": "src/components/duet-footer/duet-footer.tsx::DuetFooterChangeEvent"
+                        }
+                    }
+                }
+            }];
+    }
+    static get elementRef() { return "element"; }
+    static get watchers() {
+        return [{
+                "propName": "menu",
+                "methodName": "refresh"
+            }, {
+                "propName": "items",
+                "methodName": "refresh"
+            }];
+    }
 }