@duetds/components 6.0.3 → 6.0.4

package/lib/dist-custom-elements/duet-divider.d.ts

@@ -0,0 +1,11 @@
+import type { Components, JSX } from "../types/components";
+
+interface DuetDivider extends Components.DuetDivider, HTMLElement {}
+export const DuetDivider: {
+  prototype: DuetDivider;
+  new (): DuetDivider;
+};
+/**
+ * Used to define this component and all nested components recursively.
+ */
+export const defineCustomElement: () => void;

package/lib/dist-custom-elements/duet-divider.js

@@ -0,0 +1,9 @@
+/*!
+ * Built with Duet Design System
+ */
+import { D as DuetDivider$1, d as defineCustomElement$1 } from './p-fc5362e7.js';
+
+const DuetDivider = DuetDivider$1;
+const defineCustomElement = defineCustomElement$1;
+
+export { DuetDivider, defineCustomElement };

package/lib/dist-custom-elements/duet-editable-table.d.ts

@@ -0,0 +1,11 @@
+import type { Components, JSX } from "../types/components";
+
+interface DuetEditableTable extends Components.DuetEditableTable, HTMLElement {}
+export const DuetEditableTable: {
+  prototype: DuetEditableTable;
+  new (): DuetEditableTable;
+};
+/**
+ * Used to define this component and all nested components recursively.
+ */
+export const defineCustomElement: () => void;

package/lib/dist-custom-elements/duet-editable-table.js

@@ -0,0 +1,9 @@
+/*!
+ * Built with Duet Design System
+ */
+import { D as DuetEditableTable$1, d as defineCustomElement$1 } from './p-d96debb6.js';
+
+const DuetEditableTable = DuetEditableTable$1;
+const defineCustomElement = defineCustomElement$1;
+
+export { DuetEditableTable, defineCustomElement };

package/lib/dist-custom-elements/duet-empty-state.d.ts

@@ -0,0 +1,11 @@
+import type { Components, JSX } from "../types/components";
+
+interface DuetEmptyState extends Components.DuetEmptyState, HTMLElement {}
+export const DuetEmptyState: {
+  prototype: DuetEmptyState;
+  new (): DuetEmptyState;
+};
+/**
+ * Used to define this component and all nested components recursively.
+ */
+export const defineCustomElement: () => void;

package/lib/dist-custom-elements/duet-empty-state.js

@@ -0,0 +1,9 @@
+/*!
+ * Built with Duet Design System
+ */
+import { D as DuetEmptyState$1, d as defineCustomElement$1 } from './p-c70f3ccb.js';
+
+const DuetEmptyState = DuetEmptyState$1;
+const defineCustomElement = defineCustomElement$1;
+
+export { DuetEmptyState, defineCustomElement };

package/lib/dist-custom-elements/duet-fieldset.d.ts

@@ -0,0 +1,11 @@
+import type { Components, JSX } from "../types/components";
+
+interface DuetFieldset extends Components.DuetFieldset, HTMLElement {}
+export const DuetFieldset: {
+  prototype: DuetFieldset;
+  new (): DuetFieldset;
+};
+/**
+ * Used to define this component and all nested components recursively.
+ */
+export const defineCustomElement: () => void;

package/lib/dist-custom-elements/duet-fieldset.js

@@ -0,0 +1,9 @@
+/*!
+ * Built with Duet Design System
+ */
+import { D as DuetFieldset$1, d as defineCustomElement$1 } from './p-e4d5fbc0.js';
+
+const DuetFieldset = DuetFieldset$1;
+const defineCustomElement = defineCustomElement$1;
+
+export { DuetFieldset, defineCustomElement };

package/lib/dist-custom-elements/duet-footer.d.ts

@@ -0,0 +1,11 @@
+import type { Components, JSX } from "../types/components";
+
+interface DuetFooter extends Components.DuetFooter, HTMLElement {}
+export const DuetFooter: {
+  prototype: DuetFooter;
+  new (): DuetFooter;
+};
+/**
+ * Used to define this component and all nested components recursively.
+ */
+export const defineCustomElement: () => void;

package/lib/dist-custom-elements/duet-footer.js

@@ -0,0 +1,199 @@
+/*!
+ * Built with Duet Design System
+ */
+import { p as proxyCustomElement, H, c as createEvent$1, h, F as Fragment } from './p-3fc2d124.js';
+import { a as actionNewWindowSmall } from './p-f11208c3.js';
+import { D as DuetStringsExternalDefaults } from './p-76f00bd5.js';
+import { i as inheritGlobalTheme } from './p-4ebf1618.js';
+import { a as getLanguage, g as getLocaleString } from './p-ede854e1.js';
+import { p as parsePossibleJSON } from './p-5a9d75e1.js';
+import { d as defineCustomElement$4 } from './p-7739604d.js';
+import { d as defineCustomElement$3 } from './p-6886544b.js';
+import { d as defineCustomElement$2 } from './p-b08e57cf.js';
+
+var actionArrowRight={"title":"action-arrow-right","tags":"action arrow right caret","svg":"<svg fill=\"currentColor\" viewBox=\"0 0 24 24\" xmlns=\"http://www.w3.org/2000/svg\" role=\"img\"><path d=\"M5.499 24a.752.752 0 0 1-.53-1.281L15.689 12 4.969 1.28c-.142-.141-.22-.33-.22-.53s.078-.389.22-.53c.141-.142.33-.22.53-.22s.389.078.53.22l10.72 10.72a1.5 1.5 0 0 1 .001 2.119L6.029 23.78a.743.743 0 0 1-.53.22z\"/></svg>"};
+
+var actionNewWindow={"title":"action-new-window","tags":"arrow open new window tab external link square box rectangle action","svg":"<svg fill=\"currentColor\" viewBox=\"0 0 24 24\" xmlns=\"http://www.w3.org/2000/svg\" role=\"img\"><path d=\"M10.25 2a.75.75 0 1 1 0 1.5h-6.5A2.252 2.252 0 0 0 1.5 5.75v14.5a2.252 2.252 0 0 0 2.25 2.25h14.5a2.252 2.252 0 0 0 2.25-2.25v-6.5a.75.75 0 0 1 1.5 0v6.5A3.754 3.754 0 0 1 18.25 24H3.75A3.754 3.754 0 0 1 0 20.25V5.75A3.754 3.754 0 0 1 3.75 2zm12.985-2c.1 0 .198.02.29.058l.025.011a.726.726 0 0 1 .15.091l.066.059a.755.755 0 0 1 .109.138l.051.1c.04.092.06.192.06.293l-.001 6.363c0 .2-.078.389-.22.53a.743.743 0 0 1-.53.22.743.743 0 0 1-.53-.22.743.743 0 0 1-.22-.53V2.559L15.28 9.764a.75.75 0 0 1-1.06-1.06l7.204-7.205h-4.553a.744.744 0 0 1-.75-.75c0-.2.078-.388.22-.53A.743.743 0 0 1 16.87 0z\"/></svg>"};
+
+const duetFooterCss = "*,*::after,*::before{box-sizing:border-box;padding:0;margin:0;background:transparent;border:0;-moz-appearance:none;-webkit-appearance:none;appearance:none}:host{box-sizing:border-box;padding:0;margin:0;background:transparent;border:0;-moz-appearance:none;-webkit-appearance:none;appearance:none;display:block;flex-shrink:0;width:100%}.duet-footer{display:block;width:100%;padding-top:20px;padding-bottom:16px;margin-top:48px;font-family:\"localtapiola-sans\", -apple-system, BlinkMacSystemFont, \"Segoe UI\", Roboto, Helvetica, Arial, sans-serif, \"Apple Color Emoji\", \"Segoe UI Emoji\", \"Segoe UI Symbol\";font-size:1rem;font-weight:400;line-height:1.5;color:white;text-align:left;background:#00294d}.duet-footer.duet-p-0{padding:0 !important}.duet-footer.duet-m-0{margin:0 !important}@media (min-width: 36em){.duet-footer{padding-top:36px}}@media (min-width: 62em){.duet-footer{padding-top:48px;padding-bottom:36px}}.duet-footer.duet-theme-turva{font-family:\"turva-sans\", -apple-system, BlinkMacSystemFont, \"Segoe UI\", Roboto, Helvetica, Arial, sans-serif, \"Apple Color Emoji\", \"Segoe UI Emoji\", \"Segoe UI Symbol\";background:#c60c30}.duet-footer a{color:white;text-decoration:none}@media (min-width: 62em){.duet-footer a{border-radius:4px}}.duet-footer a:focus{outline:0}:host(.user-is-tabbing) .duet-footer a:focus{box-shadow:0 0 0 4px rgba(0, 119, 179, 0.3), 0 0 0 1px #0077b3}:host(.user-is-tabbing) .duet-theme-turva a:focus{box-shadow:0 0 0 4px rgba(23, 28, 58, 0.2), 0 0 0 1px #171c3a}.duet-footer-wrapper{position:relative;margin:0 auto}@media (min-width: 62em){.duet-footer-wrapper{padding:0 72px 0 48px}}@media (min-width: 76.25em){.duet-footer-wrapper{max-width:1110px;padding:0 20px 0 0}}.duet-footer-top{width:100%}@media (min-width: 62em){.duet-footer-top{display:flex;flex-direction:row;align-items:center;justify-content:space-between}}duet-logo{margin-left:16px !important}@media (min-width: 36em){duet-logo{margin-left:28px !important}}@media (min-width: 62em){duet-logo{margin-left:0 !important}}.duet-footer-link{padding:16px !important;display:flex;flex-direction:row;align-items:center;width:100%;font-weight:600;border-bottom:1px solid rgba(255, 255, 255, 0.2);transition:background-color 300ms ease}@media (min-width: 36em){.duet-footer-link{padding-right:20px !important;padding-left:28px !important}}@media (min-width: 62em){.duet-footer-link{width:auto;min-width:0;padding-right:0 !important;padding-left:0 !important;border:0}}.duet-footer-link:first-of-type{margin-top:20px;border-top:1px solid rgba(255, 255, 255, 0.2)}@media (min-width: 62em){.duet-footer-link:first-of-type{margin:0;border:0}}.duet-footer-link span{display:inline-block;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.duet-footer-link:hover{background:rgba(0, 0, 0, 0.1)}@media (min-width: 62em){.duet-footer-link:hover{background:transparent}}.duet-footer-icon{display:flex;align-items:center;justify-content:center;padding:12px;margin-right:16px;background:#0077b3;border-radius:50%;transition:300ms ease}.duet-theme-turva .duet-footer-icon{background:transparent;box-shadow:0 0 0 1px white}a:hover .duet-footer-icon{background:#006ba1}.duet-theme-turva a:hover .duet-footer-icon{background:transparent}.duet-footer-arrow{display:flex;align-items:center;justify-content:center;width:20px;min-width:20px;max-width:20px;height:20px;max-height:20px;margin-left:auto;color:white;transition:transform 300ms ease}@media (min-width: 62em){.duet-footer-arrow{width:10px;min-width:10px;margin-top:3px;margin-left:8px}}@media (min-width: 62em){.duet-footer-arrow{margin-right:0}}a:hover .duet-footer-arrow{transform:translateX(4px)}.duet-footer-arrow duet-icon{width:20px;height:20px}@media (min-width: 62em){.duet-footer-arrow duet-icon{width:10px;height:10px}}.duet-footer-menu{padding:20px !important;display:flex;gap:2rem;font-size:0.875rem}@media (min-width: 36em){.duet-footer-menu{padding:28px !important}}@media (min-width: 62em){.duet-footer-menu{padding-left:8px !important}}.duet-footer-menu a{display:inline-block;text-decoration:none;word-break:break-all}.duet-footer-menu a:hover,.duet-footer-menu a:focus{text-decoration:underline}.duet-footer-menu a:hover .duet-footer-divider,.duet-footer-menu a:focus .duet-footer-divider{text-decoration:none}.duet-footer-menu .duet-footer-divider{display:inline-block;margin:0 8px}.duet-footer-menu .duet-footer-divider-copyright{display:none}.duet-footer-menu .duet-footer-menu-links{flex:1}@media (min-width: 62em){.duet-footer-menu .duet-footer-menu-links{text-align:right}}.duet-footer-menu a:last-of-type .duet-footer-divider{display:none}.duet-footer-copyright{display:none;font-size:0.875rem;color:white}@media (min-width: 62em){.duet-footer-copyright{display:inline}}.duet-footer-copyright.duet-footer-copyright-mobile{display:block;padding-top:0.5rem;padding-bottom:1.25rem;padding-left:2rem;text-align:left}@media (min-width: 62em){.duet-footer-copyright.duet-footer-copyright-mobile{display:none}}.duet-footer-simple{padding:0;margin:0;margin-top:16px;color:#00294d;background:transparent !important;border-top:1px solid #e1e3e6}.duet-footer-simple .duet-footer-wrapper{max-width:100%;padding:0 20px;margin:0}@media (min-width: 62em){.duet-footer-simple .duet-footer-wrapper{padding:0 36px}}@media (min-width: 106.25em){.duet-footer-simple .duet-footer-wrapper{padding:0 48px}}.duet-footer-simple .duet-footer-copyright,.duet-footer-simple .duet-footer-menu a{color:#00294d}.duet-footer-simple .duet-footer-menu{padding:20px 0 !important}.duet-footer-simple .duet-footer-copyright-mobile{padding-left:0}.duet-footer-simple.duet-theme-turva{color:#171c3a;border-color:#e4e4e6}.duet-footer-simple.duet-theme-turva .duet-footer-copyright,.duet-footer-simple.duet-theme-turva .duet-footer-menu a{color:#171c3a}.duet-footer-external{display:inline-block;margin-left:4px;color:#0077b3}.duet-theme-turva .duet-footer-external{color:white}.duet-footer-simple.duet-theme-turva .duet-footer-external{color:#c60c30}";
+
+const i18n = {
+  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,
+});
+const DuetFooter$1 = /*@__PURE__*/ proxyCustomElement(class extends H {
+  constructor() {
+    super();
+    this.__registerHost();
+    this.__attachShadow();
+    this.duetChange = createEvent$1(this, "duetChange", 3);
+    this.duetLogoClick = createEvent$1(this, "duetLogoClick", 7);
+    this.duetMenuClick = createEvent$1(this, "duetMenuClick", 7);
+    this.duetItemClick = createEvent$1(this, "duetItemClick", 7);
+    this.duetAnalytics = createEvent$1(this, "duetAnalytics", 7);
+    this.duetEvent = createEvent$1(this, "duetEvent", 7);
+    /**
+     * State() variables
+     * Inlined decorator, alphabetical order.
+     */
+    this.processedMainItem = null;
+    this.processedItems = null;
+    this.processedMenu = null;
+    /**
+     * Theme of the navigation.
+     */
+    this.theme = "";
+    /**
+     * Style variation of the footer.
+     */
+    this.variation = "default";
+    /**
+     * Controls the margin of the component.
+     */
+    this.margin = "auto";
+    /**
+     * URL that the logo link points to.
+     */
+    this.logoHref = "/";
+    /**
+     * The currently active language. This setting changes the logo to match the
+     * chosen language.
+     * @deprecated this is now handled via the html lang tag, and is no longer used - kept to avoid breaking changes and ease unit testing
+     * @default "fi"
+     */
+    this.language = getLanguage();
+    /**
+     * Property to change accessibleLabelExternal defaults on the component.
+     * normally you would handle these strings on an application level and override @accessibleLabelExternal when needed
+     * @default {fi: "Avautuu uuteen ikkunaan",sv: "Öppnas i nytt fönster",en: "Opens in a new window"}
+     */
+    this.accessibleLabelExternalDefaults = DuetStringsExternalDefaults;
+    /**
+     * Adds accessible label for tooltip that is shown in external link (url & external have both been set)
+     * @default {fi: "Avautuu uuteen ikkunaan",sv: "Öppnas i nytt fönster",en: "Opens in a new window"}
+     */
+    this.accessibleLabelExternal = getLocaleString(this.accessibleLabelExternalDefaults, this.language);
+    /**
+     * 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,
+      });
+    };
+  }
+  /**
+   * Component lifecycle events.
+   */
+  componentWillLoad() {
+    inheritGlobalTheme(this);
+    this.refresh();
+  }
+  /**
+   * Local methods
+   */
+  async refresh() {
+    this.processedItems = parsePossibleJSON(this.items);
+    this.processedMenu = parsePossibleJSON(this.menu);
+  }
+  /**
+   * 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",
+      } }, h("div", { class: "duet-footer-wrapper" }, h("div", { class: "duet-footer-top", part: "top" }, this.variation !== "simple" && (h("duet-logo", { href: this.logoHref, onClick: this.handleLogoClick, size: "large", inverse: true, language: this.language, theme: this.theme })), 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.external && h("duet-visually-hidden", null, ", ", this.accessibleLabelExternal), h("div", { class: "duet-footer-arrow" }, item.external ? (h("duet-icon", { icon: actionNewWindow.svg, size: "xx-small", margin: "none", color: "currentColor" })) : (h("duet-icon", { icon: actionArrowRight.svg, size: "auto", margin: "none", color: "currentColor" }))))))), 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: actionNewWindowSmall.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()}`))));
+  }
+  get element() { return this; }
+  static get watchers() { return {
+    "menu": ["refresh"],
+    "items": ["refresh"]
+  }; }
+  static get style() { return duetFooterCss; }
+}, [1, "duet-footer", {
+    "theme": [1025],
+    "variation": [1],
+    "margin": [1],
+    "logoHref": [1, "logo-href"],
+    "language": [1025],
+    "items": [8],
+    "accessibleLabelExternalDefaults": [1, "accessible-label-external-default"],
+    "accessibleLabelExternal": [1, "accessible-label-external"],
+    "menu": [8],
+    "processedMainItem": [32],
+    "processedItems": [32],
+    "processedMenu": [32]
+  }]);
+function defineCustomElement$1() {
+  if (typeof customElements === "undefined") {
+    return;
+  }
+  const components = ["duet-footer", "duet-icon", "duet-logo", "duet-visually-hidden"];
+  components.forEach(tagName => { switch (tagName) {
+    case "duet-footer":
+      if (!customElements.get(tagName)) {
+        customElements.define(tagName, DuetFooter$1);
+      }
+      break;
+    case "duet-icon":
+      if (!customElements.get(tagName)) {
+        defineCustomElement$4();
+      }
+      break;
+    case "duet-logo":
+      if (!customElements.get(tagName)) {
+        defineCustomElement$3();
+      }
+      break;
+    case "duet-visually-hidden":
+      if (!customElements.get(tagName)) {
+        defineCustomElement$2();
+      }
+      break;
+  } });
+}
+
+const DuetFooter = DuetFooter$1;
+const defineCustomElement = defineCustomElement$1;
+
+export { DuetFooter, defineCustomElement };

package/lib/dist-custom-elements/duet-grid-item.d.ts

@@ -0,0 +1,11 @@
+import type { Components, JSX } from "../types/components";
+
+interface DuetGridItem extends Components.DuetGridItem, HTMLElement {}
+export const DuetGridItem: {
+  prototype: DuetGridItem;
+  new (): DuetGridItem;
+};
+/**
+ * Used to define this component and all nested components recursively.
+ */
+export const defineCustomElement: () => void;

package/lib/dist-custom-elements/duet-grid-item.js

@@ -0,0 +1,9 @@
+/*!
+ * Built with Duet Design System
+ */
+import { D as DuetGridItem$1, d as defineCustomElement$1 } from './p-bd4b92c4.js';
+
+const DuetGridItem = DuetGridItem$1;
+const defineCustomElement = defineCustomElement$1;
+
+export { DuetGridItem, defineCustomElement };

package/lib/dist-custom-elements/duet-grid.d.ts

@@ -0,0 +1,11 @@
+import type { Components, JSX } from "../types/components";
+
+interface DuetGrid extends Components.DuetGrid, HTMLElement {}
+export const DuetGrid: {
+  prototype: DuetGrid;
+  new (): DuetGrid;
+};
+/**
+ * Used to define this component and all nested components recursively.
+ */
+export const defineCustomElement: () => void;

package/lib/dist-custom-elements/duet-grid.js

@@ -0,0 +1,9 @@
+/*!
+ * Built with Duet Design System
+ */
+import { D as DuetGrid$1, d as defineCustomElement$1 } from './p-565779f5.js';
+
+const DuetGrid = DuetGrid$1;
+const defineCustomElement = defineCustomElement$1;
+
+export { DuetGrid, defineCustomElement };

package/lib/dist-custom-elements/duet-header.d.ts

@@ -0,0 +1,11 @@
+import type { Components, JSX } from "../types/components";
+
+interface DuetHeader extends Components.DuetHeader, HTMLElement {}
+export const DuetHeader: {
+  prototype: DuetHeader;
+  new (): DuetHeader;
+};
+/**
+ * Used to define this component and all nested components recursively.
+ */
+export const defineCustomElement: () => void;