@duetds/components 6.9.0 → 6.9.2

package/lib/types/components.d.ts

@@ -1262,6 +1262,10 @@ export namespace Components {
           * Enable or disable the automatic responsive behaviour of the grid component. Setting this option to "true" makes sure that contents are stacked vertically on mobile (575px and under).
          */
         "responsive": boolean;
+        /**
+          * Reverse the order of the grid items when horizontal. Usefull when we want the primary item to be on bottom right on desktop, but on top on mobile and the first for screen readers.
+         */
+        "rowReverse": boolean;
     }
     interface DuetGridItem {
         "breakpoint": DuetGridBreakpoint;
@@ -2021,6 +2025,10 @@ export namespace Components {
         "theme": DuetTheme;
     }
     interface DuetMenuBarDropdownLink {
+        /**
+          * Adds accessible label for the link that is only shown for screen readers. Typically, this label text replaces the visible text on the link for users who use assistive technology.
+         */
+        "accessibleLabel": string;
         /**
           * Href
          */
@@ -2035,6 +2043,10 @@ export namespace Components {
         "theme": DuetTheme;
     }
     interface DuetMenuBarLink {
+        /**
+          * Adds accessible label for the link that is only shown for screen readers. Typically, this label text replaces the visible text on the link for users who use assistive technology.
+         */
+        "accessibleLabel": string;
         /**
           * Active
          */
@@ -2139,6 +2151,10 @@ export namespace Components {
         "theme": DuetTheme;
     }
     interface DuetMultiselect {
+        /**
+          * Indicates the id of a component that describes the input.
+         */
+        "accessibleDescribedBy": string;
         /**
           * Caption (underneath label) that can be set as a way of adding extra information
          */
@@ -3337,6 +3353,10 @@ export namespace Components {
           * Controls if tab content should have tab index and be accessible by pressing tab
          */
         "setTabIndex": boolean;
+        /**
+          * If this property is set to true, tab won't change immediately after clicking it. Component will emit "duetTabChangeRequested" event, and it needs to be handled manually in order to change tab.
+         */
+        "tabChangeConfirm": boolean;
         /**
           * Theme of the component.
          */
@@ -3643,6 +3663,10 @@ export namespace Components {
         "theme": DuetTheme;
     }
     interface DuetToolbarLink {
+        /**
+          * Adds accessible label for the link that is only shown for screen readers. Typically, this label text replaces the visible text on the link for users who use assistive technology.
+         */
+        "accessibleLabel": string;
         /**
           * Active
          */
@@ -5941,6 +5965,10 @@ declare namespace LocalJSX {
           * Enable or disable the automatic responsive behaviour of the grid component. Setting this option to "true" makes sure that contents are stacked vertically on mobile (575px and under).
          */
         "responsive"?: boolean;
+        /**
+          * Reverse the order of the grid items when horizontal. Usefull when we want the primary item to be on bottom right on desktop, but on top on mobile and the first for screen readers.
+         */
+        "rowReverse"?: boolean;
     }
     interface DuetGridItem {
         /**
@@ -6745,6 +6773,10 @@ declare namespace LocalJSX {
         "theme"?: DuetTheme;
     }
     interface DuetMenuBarDropdownLink {
+        /**
+          * Adds accessible label for the link that is only shown for screen readers. Typically, this label text replaces the visible text on the link for users who use assistive technology.
+         */
+        "accessibleLabel"?: string;
         /**
           * Href
          */
@@ -6759,6 +6791,10 @@ declare namespace LocalJSX {
         "theme"?: DuetTheme;
     }
     interface DuetMenuBarLink {
+        /**
+          * Adds accessible label for the link that is only shown for screen readers. Typically, this label text replaces the visible text on the link for users who use assistive technology.
+         */
+        "accessibleLabel"?: string;
         /**
           * Active
          */
@@ -6867,6 +6903,10 @@ declare namespace LocalJSX {
         "theme"?: DuetTheme;
     }
     interface DuetMultiselect {
+        /**
+          * Indicates the id of a component that describes the input.
+         */
+        "accessibleDescribedBy"?: string;
         /**
           * Caption (underneath label) that can be set as a way of adding extra information
          */
@@ -8057,6 +8097,10 @@ declare namespace LocalJSX {
           * Event raised when the selected tab is changed
          */
         "onDuetTabChange"?: (event: DuetTabGroupCustomEvent<DuetTabGroupEvent>) => void;
+        /**
+          * Event raised when new tab is clicked and "tabChangeConfirm" property is set to true
+         */
+        "onDuetTabChangeRequested"?: (event: DuetTabGroupCustomEvent<DuetTabGroupEvent>) => void;
         /**
           * Controls the padding of the component.
          */
@@ -8069,6 +8113,10 @@ declare namespace LocalJSX {
           * Controls if tab content should have tab index and be accessible by pressing tab
          */
         "setTabIndex"?: boolean;
+        /**
+          * If this property is set to true, tab won't change immediately after clicking it. Component will emit "duetTabChangeRequested" event, and it needs to be handled manually in order to change tab.
+         */
+        "tabChangeConfirm"?: boolean;
         /**
           * Theme of the component.
          */
@@ -8383,6 +8431,10 @@ declare namespace LocalJSX {
         "theme"?: DuetTheme;
     }
     interface DuetToolbarLink {
+        /**
+          * Adds accessible label for the link that is only shown for screen readers. Typically, this label text replaces the visible text on the link for users who use assistive technology.
+         */
+        "accessibleLabel"?: string;
         /**
           * Active
          */

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@duetds/components",
-  "version": "6.9.0",
+  "version": "6.9.2",
   "description": "This package includes Duet Design System Web Components and related utilities.",
   "bugs": {
     "email": "duetdesignsystem@lahitapiola.fi"
@@ -50,9 +50,9 @@
     "body-scroll-lock": "3.1.5"
   },
   "devDependencies": {
-    "@duetds/fonts": "2.0.47",
-    "@duetds/icons": "3.0.47",
-    "@duetds/tokens": "3.0.47",
+    "@duetds/fonts": "2.0.49",
+    "@duetds/icons": "3.0.49",
+    "@duetds/tokens": "3.0.49",
     "@rollup/plugin-replace": "5.0.2",
     "@stencil/core": "3.1.0",
     "@stencil/sass": "3.0.0",
@@ -78,5 +78,5 @@
   "collection": "lib/collection/collection-manifest.json",
   "es2015": "lib/esm/index.js",
   "es2017": "lib/esm/index.js",
-  "gitHead": "48c942cd750fb320eab03204e2b984f479fde1f8"
+  "gitHead": "25d8b210a5cff486da46eb36763935c97d365921"
 }

package/lib/dist-custom-elements/p-132f2514.js

@@ -1,235 +0,0 @@
-/*!
- * Built with Duet Design System
- */
-import { p as proxyCustomElement, H, c as createEvent, h, d as Host } from './p-0d1b84db.js';
-import { i as inheritGlobalTheme } from './p-4ebf1618.js';
-import { c as createID } from './p-c1325e35.js';
-import { p as parsePossibleJSON } from './p-5a9d75e1.js';
-import { d as defineCustomElement$5 } from './p-29b2c3bb.js';
-import { d as defineCustomElement$4 } from './p-d6a4de03.js';
-import { d as defineCustomElement$3 } from './p-c4a3d30d.js';
-import { d as defineCustomElement$2 } from './p-26d32594.js';
-import { d as defineCustomElement$1 } from './p-85fd8f09.js';
-
-const duetSelectCss = "@charset \"UTF-8\";*.sc-duet-select,*.sc-duet-select::after,*.sc-duet-select::before{box-sizing:border-box;padding:0;margin:0;background:transparent;border:0;-moz-appearance:none;-webkit-appearance:none;appearance:none}.sc-duet-select-h{box-sizing:border-box;padding:0;margin:0;background:transparent;border:0;-moz-appearance:none;-webkit-appearance:none;appearance:none;margin-right:16px !important;margin-bottom:12px !important;display:inline-flex;width:100%;max-width:100%;vertical-align:bottom}.sc-duet-select-h:last-child,.sc-duet-select-h:last-of-type{margin-right:0 !important}@media (min-width: 36em){.sc-duet-select-h{width:calc(50% - 16px - 3px)}.duet-expand.sc-duet-select-h{width:100% !important}}.duet-select-variation-tiny.sc-duet-select-h{position:relative;top:-2px;width:72px;margin:0 !important;vertical-align:baseline}.duet-m-0.sc-duet-select-h{margin:0 !important}duet-tooltip.sc-duet-select{position:absolute;top:12px;right:0}@media (min-width: 48em){duet-tooltip.sc-duet-select{position:relative;top:4px;right:auto}}.duet-select-placeholder.sc-duet-select{position:absolute;top:-9px;left:9px;z-index:200;display:block;width:auto;max-width:60%;padding:0 0.25rem;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;background:rgb(255, 255, 255)}.duet-select-container.sc-duet-select{position:relative;width:100%}.duet-select-container.duet-select-variation-tiny.sc-duet-select{width:72px}.duet-select-wrapper.sc-duet-select{position:relative;width:100%;padding:15px 14px !important;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.25}.duet-theme-turva.sc-duet-select .duet-select-wrapper.sc-duet-select{font-family:\"turva-sans\", -apple-system, BlinkMacSystemFont, \"Segoe UI\", Roboto, Helvetica, Arial, sans-serif, \"Apple Color Emoji\", \"Segoe UI Emoji\", \"Segoe UI Symbol\"}.duet-select-variation-tiny.sc-duet-select .duet-select-wrapper.sc-duet-select{width:81px;padding:0 !important}.duet-select-wrapper.sc-duet-select::after{content:\"  \"}.duet-select-wrapper.sc-duet-select select.sc-duet-select{position:absolute;top:0;right:0;bottom:0;left:0;z-index:200;width:100%;height:100%;padding:0;margin:0;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;cursor:pointer;border:0;outline:none;opacity:0}.duet-theme-turva.sc-duet-select .duet-select-wrapper.sc-duet-select select.sc-duet-select{font-family:\"turva-sans\", -apple-system, BlinkMacSystemFont, \"Segoe UI\", Roboto, Helvetica, Arial, sans-serif, \"Apple Color Emoji\", \"Segoe UI Emoji\", \"Segoe UI Symbol\"}.duet-select-wrapper.sc-duet-select select.sc-duet-select:hover+.duet-select.sc-duet-select{border-color:rgb(144, 149, 153);box-shadow:0 0 0 1px rgb(144, 149, 153)}.duet-theme-turva.sc-duet-select .duet-select-wrapper.sc-duet-select select.sc-duet-select:hover+.duet-select.sc-duet-select{border-color:rgb(116, 116, 117);box-shadow:0 0 0 1px rgb(116, 116, 117)}.has-error.sc-duet-select .duet-select-wrapper.sc-duet-select select.sc-duet-select:hover+.duet-select.sc-duet-select{box-shadow:0 0 0 1px rgb(222, 35, 98)}.duet-theme-turva.has-error.sc-duet-select .duet-select-wrapper.sc-duet-select select.sc-duet-select:hover+.duet-select.sc-duet-select{box-shadow:0 0 0 1px rgb(224, 42, 13)}.duet-select-wrapper.sc-duet-select select.sc-duet-select:focus+.duet-select.sc-duet-select{border-color:rgb(0, 119, 179);outline:0;box-shadow:0 0 0 1px rgb(0, 119, 179);transition:none}.duet-theme-turva.sc-duet-select .duet-select-wrapper.sc-duet-select select.sc-duet-select:focus+.duet-select.sc-duet-select{border-color:rgb(23, 28, 58);box-shadow:0 0 0 1px rgb(23, 28, 58)}.duet-theme-turva.sc-duet-select .duet-select-wrapper.sc-duet-select select.sc-duet-select:focus+.duet-select.sc-duet-select .duet-select-icon.sc-duet-select{color:rgb(23, 28, 58)}.duet-select-wrapper.sc-duet-select select.sc-duet-select:focus+.duet-select.sc-duet-select .duet-select-icon.sc-duet-select{color:rgb(0, 119, 179)}.has-error.sc-duet-select .duet-select-wrapper.sc-duet-select select.sc-duet-select:focus+.duet-select.sc-duet-select{box-shadow:0 0 0 1px rgb(222, 35, 98)}.duet-theme-turva.has-error.sc-duet-select .duet-select-wrapper.sc-duet-select select.sc-duet-select:focus+.duet-select.sc-duet-select{box-shadow:0 0 0 1px rgb(224, 42, 13)}.duet-select-wrapper.sc-duet-select select[disabled].sc-duet-select{cursor:default !important}.duet-select-wrapper.sc-duet-select select[disabled].sc-duet-select+.duet-select.sc-duet-select{color:rgb(0, 41, 77) !important;cursor:default !important;background:rgb(245, 248, 250) !important;border-color:rgb(245, 248, 250) !important;box-shadow:none !important;opacity:1 !important;-webkit-text-fill-color:rgb(0, 41, 77) !important}.duet-theme-turva.sc-duet-select .duet-select-wrapper.sc-duet-select select[disabled].sc-duet-select+.duet-select.sc-duet-select{color:rgb(23, 28, 58) !important;background:rgb(245, 245, 247) !important;border-color:rgb(245, 245, 247) !important;-webkit-text-fill-color:rgb(23, 28, 58) !important}.duet-select.sc-duet-select{position:absolute;top:0;right:0;bottom:0;left:0;z-index:100;display:block;width:100%;min-width:8rem;padding:12px 14px !important;padding-right:48px !important;overflow:hidden;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;font-variant-numeric:tabular-nums;line-height:1.5;color:rgb(0, 41, 77);text-align:left;text-overflow:ellipsis;white-space:nowrap;background:rgb(255, 255, 255);border:1px solid rgb(144, 149, 153);border-radius:4px;transition:150ms ease}.has-error.sc-duet-select .duet-select.sc-duet-select{border-color:rgb(222, 35, 98) !important}.has-error.sc-duet-select .duet-select.sc-duet-select .duet-select-icon.sc-duet-select{color:rgb(222, 35, 98) !important}.duet-theme-turva.has-error.sc-duet-select .duet-select.sc-duet-select{border-color:rgb(224, 42, 13) !important}.duet-theme-turva.has-error.sc-duet-select .duet-select.sc-duet-select .duet-select-icon.sc-duet-select{color:rgb(224, 42, 13) !important}.duet-theme-turva.sc-duet-select .duet-select.sc-duet-select{font-family:\"turva-sans\", -apple-system, BlinkMacSystemFont, \"Segoe UI\", Roboto, Helvetica, Arial, sans-serif, \"Apple Color Emoji\", \"Segoe UI Emoji\", \"Segoe UI Symbol\";color:rgb(23, 28, 58);border-color:rgb(116, 116, 117)}.duet-select.sc-duet-select svg.sc-duet-select{position:absolute;top:50%;right:16px;z-index:200;width:20px;height:20px;color:rgb(0, 41, 77);pointer-events:none;transform:translateY(-50%)}.duet-theme-turva.sc-duet-select .duet-select.sc-duet-select svg.sc-duet-select{color:rgb(23, 28, 58)}.duet-select-variation-tiny.sc-duet-select .duet-select.sc-duet-select{width:72px;min-width:inherit;padding:0 !important;margin-bottom:-4px;overflow:visible;font-weight:600;text-align:center}.duet-select-variation-tiny.sc-duet-select .duet-select.sc-duet-select duet-icon.sc-duet-select{padding-left:10px}.duet-select-help.sc-duet-select{display:block;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:0.875rem;font-weight:400;line-height:1.25;color:rgb(101, 119, 135);border-radius:4px}.duet-select-help.sc-duet-select span.sc-duet-select{display:block;margin-top:8px}.duet-theme-turva.sc-duet-select .duet-select-help.sc-duet-select{font-family:\"turva-sans\", -apple-system, BlinkMacSystemFont, \"Segoe UI\", Roboto, Helvetica, Arial, sans-serif, \"Apple Color Emoji\", \"Segoe UI Emoji\", \"Segoe UI Symbol\";color:rgb(116, 116, 117)}.has-error.sc-duet-select .duet-select-help.sc-duet-select{color:rgb(222, 35, 98)}.duet-theme-turva.has-error.sc-duet-select .duet-select-help.sc-duet-select{color:rgb(224, 42, 13)}.duet-label-hidden.sc-duet-select duet-label.sc-duet-select{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0 0 0 0);border:0}";
-
-function isOptionGroup(item) {
-  return "options" in item;
-}
-function findOptionByValue(items, value) {
-  for (var i = 0; i < items.length; i++) {
-    let item = items[i];
-    if (isOptionGroup(item)) {
-      item = findOptionByValue(item.options, value);
-    }
-    if (item && item.value === value) {
-      return item;
-    }
-  }
-}
-const DuetSelect = /*@__PURE__*/ proxyCustomElement(class extends H {
-  constructor() {
-    super();
-    this.__registerHost();
-    this.duetChange = createEvent(this, "duetChange", 3);
-    this.duetFocus = createEvent(this, "duetFocus", 7);
-    this.duetBlur = createEvent(this, "duetBlur", 7);
-    /**
-     * Own Properties
-     */
-    this.selectId = createID("DuetSelect");
-    this.errorId = createID("DuetError");
-    this.labelId = createID("DuetLabel");
-    this.topCaptionId = createID("DuetCaptionTop");
-    this.topCaptionPlaceholderId = createID("DuetCaptionPlaceholderTop");
-    /**
-     * Component event handling.
-     */
-    this.onClick = (ev) => {
-      ev.stopPropagation();
-    };
-    this.onChange = () => {
-      this.value = this.nativeSelect.value;
-      this.duetChange.emit({
-        value: this.value,
-        component: "duet-select",
-      });
-    };
-    this.onBlur = (ev) => {
-      this.duetBlur.emit({
-        originalEvent: ev,
-        value: this.value,
-        component: "duet-select",
-      });
-    };
-    this.onFocus = (ev) => {
-      this.duetFocus.emit({
-        originalEvent: ev,
-        value: this.value,
-        component: "duet-select",
-      });
-    };
-    this.processedItems = null;
-    this.variation = "default";
-    this.accessibleActiveDescendant = undefined;
-    this.accessibleDescribedBy = undefined;
-    this.margin = "auto";
-    this.accessibleControls = undefined;
-    this.accessibleOwns = undefined;
-    this.error = "";
-    this.expand = false;
-    this.value = undefined;
-    this.theme = "";
-    this.labelHidden = false;
-    this.identifier = undefined;
-    this.name = undefined;
-    this.placeholder = "";
-    this.caption = undefined;
-    this.echoPlaceholder = false;
-    this.items = undefined;
-    this.disabled = false;
-    this.required = false;
-    this.label = "label";
-    this.role = undefined;
-    this.tooltip = "";
-    this.tooltipDirection = "auto";
-  }
-  valueChanged() {
-    if (this.nativeSelect) {
-      this.nativeSelect.value = this.value;
-    }
-    this.isCaptionVisible = !!this.caption;
-  }
-  /**
-   * Component lifecycle events.
-   */
-  componentWillLoad() {
-    inheritGlobalTheme(this);
-    this.isCaptionVisible = !!this.caption;
-    this.refresh();
-  }
-  /**
-   * Sets focus on the specified `duet-select`. Use this method instead of the global
-   * `select.focus()`.
-   */
-  async setFocus(options) {
-    if (this.nativeSelect) {
-      this.nativeSelect.focus(options);
-    }
-  }
-  /**
-   * Local methods.
-   */
-  async refresh() {
-    this.processedItems = parsePossibleJSON(this.items);
-  }
-  getSelectedItemLabel() {
-    let item;
-    if (this.processedItems) {
-      item = findOptionByValue(this.processedItems, this.value);
-    }
-    return item ? item.label : this.placeholder || "";
-  }
-  renderOption(option) {
-    return (h("option", { value: option.value, key: option.value, selected: this.value === option.value, disabled: option.disabled }, option.label));
-  }
-  renderOptionGroup(group) {
-    return (h("optgroup", { key: group.label, label: group.label, disabled: group.disabled }, group.options.map(option => this.renderOption(option))));
-  }
-  /**
-   * render() function
-   * Always the last one in the class.
-   */
-  render() {
-    const identifier = this.identifier || this.selectId;
-    return (h(Host, { onClick: this.onClick, class: {
-        "duet-m-0": this.margin === "none",
-        "duet-expand": this.expand,
-        "duet-select-variation-tiny": this.variation === "tiny",
-      } }, h("div", { class: {
-        "duet-select-container": true,
-        "duet-label-hidden": this.labelHidden,
-        "duet-theme-turva": this.theme === "turva",
-        "duet-select-variation-tiny": this.variation === "tiny",
-        "duet-input-top-caption-shown": this.isCaptionVisible,
-        "has-error": !!this.error,
-      } }, h("duet-label", { theme: this.theme === "turva" ? "turva" : "default", class: { "duet-has-tooltip": !!this.tooltip }, id: this.labelId, for: identifier }, this.label), this.tooltip && (h("duet-tooltip", { direction: this.tooltipDirection, accessibleInputLabel: this.label }, this.tooltip)), this.caption && (h("duet-caption", { id: this.topCaptionId, size: "medium" }, this.caption)), h("div", { class: "duet-select-wrapper" }, this.placeholder && this.echoPlaceholder && this.value && (h("duet-caption", { id: this.topCaptionPlaceholderId, class: "duet-select-placeholder", size: "small" }, this.placeholder)), h("select", { ref: select => (this.nativeSelect = select), disabled: this.disabled, name: this.name, id: identifier, role: this.role, "aria-labelledby": `${this.errorId} ${this.labelId}`, "aria-controls": this.accessibleControls, "aria-activedescendant": this.accessibleActiveDescendant, "aria-errormessage": this.error ? this.errorId : null, "aria-owns": this.accessibleOwns, onFocus: this.onFocus, onBlur: this.onBlur, onChange: this.onChange, required: this.required, "aria-describedby": this.accessibleDescribedBy }, this.placeholder && (h("option", { disabled: true, selected: true, value: "" }, this.placeholder)), !this.processedItems ? (h("option", null, "Virhe valintoja ladattaessa. P\u00E4ivit\u00E4 sivu ja kokeile uusiksi.")) : (this.processedItems.map(item => {
-      return isOptionGroup(item) ? this.renderOptionGroup(item) : this.renderOption(item);
-    }))), h("div", { class: {
-        "duet-select": true,
-        "duet-select-variation-tiny": this.variation === "tiny",
-      }, "aria-hidden": "true" }, h("span", { key: this.value }, this.getSelectedItemLabel()), this.variation !== "tiny" && (h("svg", { role: "img", class: "duet-select-icon", fill: "currentColor", viewBox: "0 0 24 24", xmlns: "http://www.w3.org/2000/svg" }, h("path", { d: "m12 18.999c-.4 0-.776-.156-1.059-.438l-10.721-10.72c-.142-.142-.22-.33-.22-.531 0-.2.078-.389.22-.53.142-.142.33-.22.53-.22s.389.078.53.22l10.72 10.719 10.72-10.719c.142-.142.33-.22.53-.22s.389.078.53.22c.142.142.22.33.22.53s-.078.389-.22.53l-10.72 10.72c-.282.283-.659.439-1.06.439z" }))), this.variation === "tiny" && (h("duet-icon", { name: "action-arrow-down-small", color: "currentColor", margin: "none", size: "xx-small" })))), h("span", { class: "duet-select-help", id: this.errorId, "aria-live": "polite", "aria-atomic": "true", "aria-relevant": "additions removals" }, this.error && h("span", null, this.error)))));
-  }
-  get element() { return this; }
-  static get watchers() { return {
-    "value": ["valueChanged"],
-    "items": ["refresh"]
-  }; }
-  static get style() { return duetSelectCss; }
-}, [2, "duet-select", {
-    "variation": [1],
-    "accessibleActiveDescendant": [1, "accessible-active-descendant"],
-    "accessibleDescribedBy": [1, "accessible-described-by"],
-    "margin": [1],
-    "accessibleControls": [1, "accessible-controls"],
-    "accessibleOwns": [1, "accessible-owns"],
-    "error": [1],
-    "expand": [4],
-    "value": [1537],
-    "theme": [1025],
-    "labelHidden": [4, "label-hidden"],
-    "identifier": [1],
-    "name": [1],
-    "placeholder": [1],
-    "caption": [1],
-    "echoPlaceholder": [4, "echo-placeholder"],
-    "items": [1],
-    "disabled": [516],
-    "required": [4],
-    "label": [1],
-    "role": [1],
-    "tooltip": [1],
-    "tooltipDirection": [1, "tooltip-direction"],
-    "processedItems": [32],
-    "setFocus": [64]
-  }]);
-function defineCustomElement() {
-  if (typeof customElements === "undefined") {
-    return;
-  }
-  const components = ["duet-select", "duet-caption", "duet-icon", "duet-label", "duet-tooltip", "duet-visually-hidden"];
-  components.forEach(tagName => { switch (tagName) {
-    case "duet-select":
-      if (!customElements.get(tagName)) {
-        customElements.define(tagName, DuetSelect);
-      }
-      break;
-    case "duet-caption":
-      if (!customElements.get(tagName)) {
-        defineCustomElement$5();
-      }
-      break;
-    case "duet-icon":
-      if (!customElements.get(tagName)) {
-        defineCustomElement$4();
-      }
-      break;
-    case "duet-label":
-      if (!customElements.get(tagName)) {
-        defineCustomElement$3();
-      }
-      break;
-    case "duet-tooltip":
-      if (!customElements.get(tagName)) {
-        defineCustomElement$2();
-      }
-      break;
-    case "duet-visually-hidden":
-      if (!customElements.get(tagName)) {
-        defineCustomElement$1();
-      }
-      break;
-  } });
-}
-
-export { DuetSelect as D, defineCustomElement as d };

package/lib/dist-custom-elements/p-e48e8201.js

@@ -1,180 +0,0 @@
-/*!
- * Built with Duet Design System
- */
-import { p as proxyCustomElement, H, h, d as Host } from './p-0d1b84db.js';
-import { m as media_query_large, a as media_query_medium, b as media_query_small } from './p-c4d8cad0.js';
-import { w as watchForOptions, a as watchForElement } from './p-12721178.js';
-
-const duetGridCss = ".sc-duet-grid-h{box-sizing:border-box;padding:0;margin:0;background:transparent;border:0;-moz-appearance:none;-webkit-appearance:none;appearance:none;display:flex !important;flex-direction:column !important;align-items:flex-start !important;justify-content:flex-start !important;width:100%;max-width:100%;height:auto}.duet-grid-breakpoint-x-small.sc-duet-grid-h{flex-direction:row !important}@media (max-width: 22.5em){.duet-grid-breakpoint-x-small.sc-duet-grid-h{flex-direction:column !important}}@media (min-width: 36em){.duet-grid-breakpoint-small.sc-duet-grid-h{flex-direction:row !important}}@media (min-width: 48em){.duet-grid-breakpoint-medium.sc-duet-grid-h{flex-direction:row !important}}@media (min-width: 62em){.duet-grid-breakpoint-large.sc-duet-grid-h{flex-direction:row !important}}@media (min-width: 64.0625em){.duet-grid-breakpoint-x-large.sc-duet-grid-h{flex-direction:row !important}}.duet-grid-wrap.sc-duet-grid-h{flex-wrap:wrap !important}.duet-no-stacking.sc-duet-grid-h{flex-direction:row !important}.duet-grid-direction-vertical.duet-grid-breakpoint-x-small.sc-duet-grid-h{flex-direction:column !important}@media (max-width: 35.9375em){.duet-grid-direction-vertical.duet-grid-breakpoint-x-small.sc-duet-grid-h{flex-direction:column !important}}.duet-grid-direction-vertical.duet-grid-breakpoint-small.sc-duet-grid-h{flex-direction:column !important}@media (min-width: 36em){.duet-grid-direction-vertical.duet-grid-breakpoint-small.sc-duet-grid-h{flex-direction:column !important}}.duet-grid-direction-vertical.duet-grid-breakpoint-medium.sc-duet-grid-h{flex-direction:column !important}@media (min-width: 48em){.duet-grid-direction-vertical.duet-grid-breakpoint-medium.sc-duet-grid-h{flex-direction:column !important}}.duet-grid-direction-vertical.duet-grid-breakpoint-large.sc-duet-grid-h{flex-direction:column !important}@media (min-width: 62em){.duet-grid-direction-vertical.duet-grid-breakpoint-large.sc-duet-grid-h{flex-direction:column !important}}.duet-grid-direction-vertical.duet-grid-breakpoint-x-large.sc-duet-grid-h{flex-direction:column !important}@media (min-width: 64.0625em){.duet-grid-direction-vertical.duet-grid-breakpoint-x-large.sc-duet-grid-h{flex-direction:column !important}}.duet-grid-align-top.duet-no-stacking.sc-duet-grid-h{align-items:flex-start !important}.duet-grid-align-bottom.duet-no-stacking.sc-duet-grid-h{align-items:flex-end !important}.duet-grid-align-center.duet-no-stacking.sc-duet-grid-h{align-items:center !important}.duet-grid-align-stretch.duet-no-stacking.sc-duet-grid-h{align-items:stretch !important}.duet-grid-align-baseline.duet-no-stacking.sc-duet-grid-h{align-items:baseline !important}.duet-grid-align-top.duet-grid-breakpoint-x-small.sc-duet-grid-h{align-items:flex-start !important}.duet-grid-align-bottom.duet-grid-breakpoint-x-small.sc-duet-grid-h{align-items:flex-end !important}.duet-grid-align-center.duet-grid-breakpoint-x-small.sc-duet-grid-h{align-items:center !important}.duet-grid-align-stretch.duet-grid-breakpoint-x-small.sc-duet-grid-h{align-items:stretch !important}.duet-grid-align-baseline.duet-grid-breakpoint-x-small.sc-duet-grid-h{align-items:baseline !important}@media (min-width: 36em){.duet-grid-align-top.duet-grid-breakpoint-small.sc-duet-grid-h{align-items:flex-start !important}}@media (min-width: 36em){.duet-grid-align-bottom.duet-grid-breakpoint-small.sc-duet-grid-h{align-items:flex-end !important}}@media (min-width: 36em){.duet-grid-align-center.duet-grid-breakpoint-small.sc-duet-grid-h{align-items:center !important}}@media (min-width: 36em){.duet-grid-align-stretch.duet-grid-breakpoint-small.sc-duet-grid-h{align-items:stretch !important}}@media (min-width: 36em){.duet-grid-align-baseline.duet-grid-breakpoint-small.sc-duet-grid-h{align-items:baseline !important}}@media (min-width: 48em){.duet-grid-align-top.duet-grid-breakpoint-medium.sc-duet-grid-h{align-items:flex-start !important}}@media (min-width: 48em){.duet-grid-align-bottom.duet-grid-breakpoint-medium.sc-duet-grid-h{align-items:flex-end !important}}@media (min-width: 48em){.duet-grid-align-center.duet-grid-breakpoint-medium.sc-duet-grid-h{align-items:center !important}}@media (min-width: 48em){.duet-grid-align-stretch.duet-grid-breakpoint-medium.sc-duet-grid-h{align-items:stretch !important}}@media (min-width: 48em){.duet-grid-align-baseline.duet-grid-breakpoint-medium.sc-duet-grid-h{align-items:baseline !important}}@media (min-width: 62em){.duet-grid-align-top.duet-grid-breakpoint-large.sc-duet-grid-h{align-items:flex-start !important}}@media (min-width: 62em){.duet-grid-align-bottom.duet-grid-breakpoint-large.sc-duet-grid-h{align-items:flex-end !important}}@media (min-width: 62em){.duet-grid-align-center.duet-grid-breakpoint-large.sc-duet-grid-h{align-items:center !important}}@media (min-width: 62em){.duet-grid-align-stretch.duet-grid-breakpoint-large.sc-duet-grid-h{align-items:stretch !important}}@media (min-width: 62em){.duet-grid-align-baseline.duet-grid-breakpoint-large.sc-duet-grid-h{align-items:baseline !important}}@media (min-width: 64.0625em){.duet-grid-align-top.duet-grid-breakpoint-x-large.sc-duet-grid-h{align-items:flex-start !important}}@media (min-width: 64.0625em){.duet-grid-align-bottom.duet-grid-breakpoint-x-large.sc-duet-grid-h{align-items:flex-end !important}}@media (min-width: 64.0625em){.duet-grid-align-center.duet-grid-breakpoint-x-large.sc-duet-grid-h{align-items:center !important}}@media (min-width: 64.0625em){.duet-grid-align-stretch.duet-grid-breakpoint-x-large.sc-duet-grid-h{align-items:stretch !important}}@media (min-width: 64.0625em){.duet-grid-align-baseline.duet-grid-breakpoint-x-large.sc-duet-grid-h{align-items:baseline !important}}.duet-grid-distribution-left.sc-duet-grid-h{justify-content:flex-start !important}.duet-grid-distribution-right.sc-duet-grid-h{justify-content:flex-end !important}.duet-grid-distribution-center.sc-duet-grid-h{justify-content:center !important}.duet-grid-distribution-between.sc-duet-grid-h{justify-content:space-between !important}.duet-grid-distribution-around.sc-duet-grid-h{justify-content:space-around !important}.duet-grid-distribution-evenly.sc-duet-grid-h{justify-content:space-evenly !important}@media (max-width: 35.9375em){.duet-grid-mobile-left.sc-duet-grid-h{align-items:flex-start !important;justify-content:flex-start !important;text-align:left !important}}@media (max-width: 35.9375em){.duet-grid-mobile-center.sc-duet-grid-h{align-items:center !important;justify-content:center !important;text-align:center !important}.duet-grid-mobile-center.sc-duet-grid-h *.sc-duet-grid{text-align:center !important}}@media (max-width: 35.9375em){.duet-grid-mobile-right.sc-duet-grid-h{align-items:flex-end !important;justify-content:flex-end !important;text-align:right !important}.duet-grid-mobile-right.sc-duet-grid-h *.sc-duet-grid{text-align:right !important}}";
-
-function isGridItem(element) {
-  return element.tagName.toLowerCase() === "duet-grid-item";
-}
-const DuetGrid = /*@__PURE__*/ proxyCustomElement(class extends H {
-  constructor() {
-    super();
-    this.__registerHost();
-    this.mql = [
-      window.matchMedia(media_query_large.replace(/'/g, "")),
-      window.matchMedia(media_query_medium.replace(/'/g, "")),
-      window.matchMedia(media_query_small.replace(/'/g, "")),
-    ];
-    this.distributeFormElement = false;
-    this.responsive = false;
-    this.breakpoint = "small";
-    this.direction = "horizontal";
-    this.alignment = "top";
-    this.distribution = "default";
-    this.mobile = "";
-  }
-  /**
-   * Private functions
-   */
-  /**
-   * Returns the element height including margins
-   * @param element - element
-   * @returns {number}
-   */
-  outerHeight(element) {
-    const height = element.offsetHeight, style = window.getComputedStyle(element);
-    return ["top", "bottom"]
-      .map(side => parseInt(style[`margin-${side}`]))
-      .reduce((total, side) => total + side, height);
-  }
-  /**
-   * Component lifecycle events.
-   */
-  async connectedCallback() {
-    const el = this.element;
-    this.distributeFormElement = this.alignment === "form_distribute";
-    this.mutationO = watchForOptions(el, "duet-grid-item", () => {
-      this.updateGridItems();
-    });
-    // the next two functions are used to watch for changes in the grid items, and are process intensive - so only run when needed
-    if (this.distributeFormElement) {
-      this.mutation1 = watchForElement(el, "duet-input", () => {
-        this.updateGridItemsWithInputFields();
-      });
-      // listen for potential mediaquery changes and reset layout
-      for (let i = 0; i < this.mql.length; i++) {
-        // addEventListener is not available in Stencil hydrate
-        if (this.mql[i].addEventListener) {
-          this.mql[i].addEventListener("change", this.updateGridItemsWithInputFields.bind(this));
-        }
-      }
-    }
-    this.updateGridItems();
-  }
-  disconnectedCallback() {
-    if (this.mutationO) {
-      this.mutationO.disconnect();
-      this.mutationO = undefined;
-    }
-    if (this.mutation1) {
-      this.mutation1.disconnect();
-      this.mutation1 = undefined;
-    }
-    // listen for potential mediaquery changes and reset layout
-    for (let i = 0; i < this.mql.length; i++) {
-      // addEventListener is not available in Stencil hydrate
-      if (this.mql[i].removeEventListener) {
-        this.mql[i].removeEventListener("change", this.updateGridItemsWithInputFields.bind(this));
-      }
-    }
-  }
-  /**
-   * Local methods
-   */
-  async updateGridItems() {
-    const items = Array.from(this.element.children).filter(isGridItem);
-    items.forEach(item => {
-      item.responsive = this.responsive;
-      item.breakpoint = this.breakpoint;
-      item.direction = this.direction;
-    });
-  }
-  async updateGridItemsWithInputFields() {
-    const items = Array.from(this.element.children).filter(isGridItem);
-    // if layout changes to columns instead of row, remove all padding
-    const hasColumnLayout = window ? window.getComputedStyle(this.element).flexDirection === "column" : false;
-    let maxHeight = 0;
-    const sizes = [];
-    items.forEach(item => {
-      const inputErrorDom = item.querySelector("span.duet-input-error");
-      const height = inputErrorDom ? this.outerHeight(inputErrorDom) : 0;
-      sizes.push(height);
-    });
-    maxHeight = Math.max(...sizes);
-    items.forEach(item => {
-      const inputErrorDom = item.querySelector("span.duet-input-error");
-      const height = inputErrorDom ? this.outerHeight(inputErrorDom) : 0;
-      if (height < maxHeight && !hasColumnLayout) {
-        item.setAttribute("style", `padding-bottom: ${maxHeight - height}px;`);
-      }
-      else if (height === maxHeight || hasColumnLayout) {
-        item.setAttribute("style", `padding-bottom: 0px;`);
-      }
-    });
-  }
-  /**
-   * render() function
-   * Always the last one in the class.
-   */
-  render() {
-    return (h(Host, { class: {
-        "duet-grid": true,
-        "duet-no-stacking": !this.responsive,
-        "duet-grid-align-top": this.alignment === "top",
-        "duet-grid-align-bottom": this.alignment === "bottom" || this.alignment === "form_distribute",
-        "duet-grid-align-center": this.alignment === "center",
-        "duet-grid-align-stretch": this.alignment === "stretch",
-        "duet-grid-align-baseline": this.alignment === "baseline",
-        "duet-grid-distribution-left": this.distribution === "left",
-        "duet-grid-distribution-right": this.distribution === "right",
-        "duet-grid-distribution-center": this.distribution === "center",
-        "duet-grid-distribution-between": this.distribution === "space-between",
-        "duet-grid-distribution-around": this.distribution === "space-around",
-        "duet-grid-distribution-evenly": this.distribution === "space-evenly",
-        "duet-grid-mobile-left": this.mobile === "left",
-        "duet-grid-mobile-center": this.mobile === "center",
-        "duet-grid-mobile-right": this.mobile === "right",
-        "duet-grid-direction-horizontal": this.direction === "horizontal",
-        "duet-grid-direction-vertical": this.direction === "vertical",
-        "duet-grid-breakpoint-x-small": this.breakpoint === "x-small",
-        "duet-grid-breakpoint-small": this.breakpoint === "small",
-        "duet-grid-breakpoint-medium": this.breakpoint === "medium",
-        "duet-grid-breakpoint-large": this.breakpoint === "large",
-        "duet-grid-breakpoint-x-large": this.breakpoint === "x-large",
-      } }));
-  }
-  get element() { return this; }
-  static get watchers() { return {
-    "responsive": ["updateGridItems"],
-    "breakpoint": ["updateGridItems"],
-    "direction": ["updateGridItems"]
-  }; }
-  static get style() { return duetGridCss; }
-}, [2, "duet-grid", {
-    "responsive": [4],
-    "breakpoint": [1],
-    "direction": [1],
-    "alignment": [1],
-    "distribution": [1],
-    "mobile": [1],
-    "distributeFormElement": [32]
-  }]);
-function defineCustomElement() {
-  if (typeof customElements === "undefined") {
-    return;
-  }
-  const components = ["duet-grid"];
-  components.forEach(tagName => { switch (tagName) {
-    case "duet-grid":
-      if (!customElements.get(tagName)) {
-        customElements.define(tagName, DuetGrid);
-      }
-      break;
-  } });
-}
-
-export { DuetGrid as D, defineCustomElement as d };

package/lib/duet/p-00e57f9b.system.entry.js

@@ -1,4 +0,0 @@
-var __awaiter=this&&this.__awaiter||function(t,e,o,i){function r(t){return t instanceof o?t:new o((function(e){e(t)}))}return new(o||(o=Promise))((function(o,n){function a(t){try{s(i.next(t))}catch(e){n(e)}}function l(t){try{s(i["throw"](t))}catch(e){n(e)}}function s(t){t.done?o(t.value):r(t.value).then(a,l)}s((i=i.apply(t,e||[])).next())}))};var __generator=this&&this.__generator||function(t,e){var o={label:0,sent:function(){if(n[0]&1)throw n[1];return n[1]},trys:[],ops:[]},i,r,n,a;return a={next:l(0),throw:l(1),return:l(2)},typeof Symbol==="function"&&(a[Symbol.iterator]=function(){return this}),a;function l(t){return function(e){return s([t,e])}}function s(l){if(i)throw new TypeError("Generator is already executing.");while(a&&(a=0,l[0]&&(o=0)),o)try{if(i=1,r&&(n=l[0]&2?r["return"]:l[0]?r["throw"]||((n=r["return"])&&n.call(r),0):r.next)&&!(n=n.call(r,l[1])).done)return n;if(r=0,n)l=[l[0]&2,n.value];switch(l[0]){case 0:case 1:n=l;break;case 4:o.label++;return{value:l[1],done:false};case 5:o.label++;r=l[1];l=[0];continue;case 7:l=o.ops.pop();o.trys.pop();continue;default:if(!(n=o.trys,n=n.length>0&&n[n.length-1])&&(l[0]===6||l[0]===2)){o=0;continue}if(l[0]===3&&(!n||l[1]>n[0]&&l[1]<n[3])){o.label=l[1];break}if(l[0]===6&&o.label<n[1]){o.label=n[1];n=l;break}if(n&&o.label<n[2]){o.label=n[2];o.ops.push(l);break}if(n[2])o.ops.pop();o.trys.pop();continue}l=e.call(t,o)}catch(s){l=[6,s];r=0}finally{i=n=0}if(l[0]&5)throw l[1];return{value:l[0]?l[1]:void 0,done:true}}};
-/*!
- * Built with Duet Design System
- */System.register(["./p-7dc36831.system.js","./p-33b3aba4.system.js","./p-5f6bd5db.system.js","./p-c8dc599d.system.js","./p-b6d51921.system.js"],(function(t){"use strict";var e,o,i,r,n,a,l,s;return{setters:[function(t){e=t.r;o=t.h;i=t.H;r=t.g},function(t){n=t.i},function(t){a=t.c},function(t){l=t.g;s=t.a},function(){}],execute:function(){var p='*,*::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;position:relative;z-index:200;display:inline-flex;width:auto;margin-top:-16px !important;margin-left:-3px !important;-webkit-tap-highlight-color:transparent}.duet-tooltip{position:absolute;right:-141px;bottom:100%;z-index:950;display:block;width:282px;min-height:48px;max-height:340px;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:0.875rem;font-weight:400;line-height:1.25;color:rgb(0, 41, 77);visibility:hidden;background:rgb(255, 255, 255);border:1px solid rgb(225, 227, 230);border-radius:4px;box-shadow:0 2px 10px 0 rgba(0, 41, 77, 0.07);opacity:0;transition:300ms ease;transform:scale(0.9) translateZ(0) translateY(20px);transform-origin:100% 100%}.duet-tooltip.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";color:rgb(23, 28, 58);border-color:rgb(228, 228, 230);box-shadow:0 2px 10px 0 rgba(117, 117, 117, 0.13)}.duet-tooltip::after{position:absolute;right:142px;bottom:-20px;z-index:200;width:0;height:0;content:"";border:10px solid transparent;border-top:10px solid rgb(255, 255, 255)}.duet-tooltip::before{position:absolute;right:141px;bottom:-22px;z-index:100;width:0;height:0;content:"";border:11px solid transparent;border-top:11px solid rgb(225, 227, 230)}.duet-theme-turva .duet-tooltip::before{border-top:11px solid rgb(228, 228, 230)}.duet-tooltip.duet-tooltip-down{top:100%;bottom:auto;transform:scale(0.9) translateZ(0) translateY(-20px);transform-origin:100% 0}.duet-tooltip.duet-tooltip-down::after{top:-20px;bottom:auto;border:10px solid transparent;border-bottom:10px solid rgb(255, 255, 255)}.duet-tooltip.duet-tooltip-down::before{top:-22px;bottom:auto;border:11px solid transparent;border-bottom:11px solid rgb(225, 227, 230)}.duet-theme-turva .duet-tooltip.duet-tooltip-down::before{border-bottom:11px solid rgb(228, 228, 230)}.duet-tooltip.duet-tooltip-left{right:-21px !important;transform-origin:100% 100% !important}.duet-tooltip.duet-tooltip-left::after{right:22px !important;transform:none !important}.duet-tooltip.duet-tooltip-left::before{right:21px !important;transform:none !important}.duet-tooltip.duet-tooltip-right{right:auto !important;left:-9px !important;transform-origin:100% 100% !important}.duet-tooltip.duet-tooltip-right::after{right:auto !important;left:22px !important;transform:none !important}.duet-tooltip.duet-tooltip-right::before{right:auto !important;left:21px !important;transform:none !important}.duet-tooltip.duet-tooltip-has-label{right:auto !important;left:0;width:282px !important;transform-origin:0 0 !important}.duet-tooltip.duet-tooltip-has-label::after{right:auto !important;left:1px !important;transform:none !important}.duet-tooltip.duet-tooltip-has-label::before{right:auto !important;left:0 !important;transform:none !important}.duet-tooltip.duet-tooltip-active{visibility:visible;opacity:1;transition-property:transform, opacity;transform:scale(1.0001) translateZ(0) translateY(-8px)}.duet-tooltip.duet-tooltip-active.duet-tooltip-down{transform:scale(1.0001) translateZ(0) translateY(8px)}.duet-tooltip-button{z-index:100;display:inline-block;align-items:center;justify-content:center;min-width:48px;height:48px;padding:0 !important;margin-right:-12px;line-height:normal !important;color:rgb(0, 119, 179);white-space:nowrap;cursor:pointer;background:transparent !important;border-radius:4px}.duet-tooltip-button.duet-theme-turva{color:rgb(198, 12, 48)}.duet-tooltip-button:hover{color:rgb(0, 77, 128)}.duet-tooltip-button:hover.duet-theme-turva{color:rgb(148, 9, 37)}.duet-tooltip-button:focus{background:transparent !important;outline:0}:host(.user-is-tabbing) .duet-tooltip-button:focus{background:transparent !important;box-shadow:0 0 0 4px rgba(0, 119, 179, 0.3), 0 0 0 1px rgb(0, 119, 179) !important}:host(.user-is-tabbing) .duet-tooltip-button.duet-theme-turva:focus{box-shadow:0 0 0 4px rgba(23, 28, 58, 0.2), 0 0 0 1px rgb(23, 28, 58) !important}.duet-tooltip-button svg{width:20px;height:20px;pointer-events:none}.duet-tooltip-button-has-label{margin-right:0}.duet-tooltip-scrollable{padding:20px !important;width:100%;max-height:250px;padding-right:25px !important;overflow-y:auto;-webkit-hyphens:auto;hyphens:auto;border-radius:4px;-webkit-overflow-scrolling:touch}.duet-tooltip-scrollable:focus{outline:none}:host(.user-is-tabbing) .duet-tooltip-scrollable:focus{box-shadow:0 0 0 4px rgba(0, 119, 179, 0.3), 0 0 0 1px rgb(0, 119, 179)}:host(.user-is-tabbing) .duet-theme-turva .duet-tooltip-scrollable:focus{box-shadow:0 0 0 4px rgba(23, 28, 58, 0.2), 0 0 0 1px rgb(23, 28, 58)}.duet-tooltip-scrollable::-webkit-scrollbar{width:4px}.duet-tooltip-scrollable::-webkit-scrollbar-track{border-radius:4px}.duet-tooltip-scrollable::-webkit-scrollbar-thumb{background:rgb(225, 227, 230);border-radius:4px}.duet-theme-turva .duet-tooltip-scrollable::-webkit-scrollbar-thumb{background:rgb(228, 228, 230)}.duet-tooltip-label{position:relative;z-index:100;display:inline-block;max-width:calc(100% - 30px);margin-left:12px !important;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:600;line-height:1.25;text-align:left;white-space:normal;vertical-align:top}.duet-theme-turva .duet-tooltip-label{font-family:"turva-sans", -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Helvetica, Arial, sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol"}.duet-tooltip-close{position:absolute;top:8px;right:8px;display:flex;align-items:center;justify-content:center;width:17px;height:17px;min-height:0 !important;padding:0 !important;margin:0 !important;line-height:normal;color:rgb(0, 41, 77);cursor:pointer;background:rgb(245, 248, 250);border-radius:50%;-webkit-appearance:none;appearance:none}.duet-tooltip-close:focus{outline:none;box-shadow:0 0 0 2px rgb(0, 119, 179)}.duet-theme-turva .duet-tooltip-close:focus{color:rgb(23, 28, 58);box-shadow:0 0 0 2px rgb(23, 28, 58)}@media (min-width: 48em){.duet-tooltip.duet-mq-medium{right:-148px;width:320px;transform-origin:50% 100%}.duet-tooltip.duet-mq-medium::after{right:50%;transform:translateX(50%)}.duet-tooltip.duet-mq-medium::before{right:50%;transform:translateX(50%)}.duet-tooltip.duet-mq-medium.duet-tooltip-down{transform-origin:50% 0}}@media (min-width: 62em){.duet-tooltip.duet-mq-large{right:-148px;width:320px;transform-origin:50% 100%}.duet-tooltip.duet-mq-large::after{right:50%;transform:translateX(50%)}.duet-tooltip.duet-mq-large::before{right:50%;transform:translateX(50%)}.duet-tooltip.duet-mq-large.duet-tooltip-down{transform-origin:50% 0}}';var u=t("duet_tooltip",function(){function t(t){var o=this;e(this,t);this.tooltipId=a("DuetTooltip");this.lastScrollTop=0;this.openTooltip=function(){o.focusTarget="tooltip";o.active=true};this.closeTooltip=function(t){if(t===void 0){t=false}if(t){o.focusTarget="trigger"}o.active=false};this.toggleOpen=function(){o.active?o.closeTooltip():o.openTooltip()};this.handleFocusOut=function(t){if(!o.active){return}var e=t.relatedTarget;if(e==null||o.element.shadowRoot.contains(e)||o.element.contains(e)){return}o.closeTooltip()};this.handleKeyDown=function(t){var e=t.keyCode===27;var i=t.target===o.scrollableEl&&t.shiftKey&&t.keyCode===9;if(e||i){o.closeTooltip(true)}};this.handleCloseClick=function(){o.closeTooltip(true)};this.isElementInViewportVertically=function(){if(!o.tooltipEl){return false}var t=o.tooltipEl.getBoundingClientRect();return t.top>=100&&t.bottom<=(window.innerHeight||document.documentElement.clientHeight)};this.handleVerticalVisibility=function(){var t=window.pageYOffset||document.documentElement.scrollTop;if(!o.isElementInViewportVertically()){o.openDown=t>o.lastScrollTop}o.lastScrollTop=Math.max(0,t)};this.handleHorizontalVisibility=function(){var t=o.tooltipEl.getBoundingClientRect();var e=t.left>=0;var i=t.right<(window.innerWidth||document.documentElement.clientWidth);if(!e||o.direction!=="right"&&o.openRight){o.openRight=true}else{o.openRight=o.direction==="right"}if(!i||o.direction!=="left"&&o.openLeft){o.openLeft=true}else{o.openLeft=o.direction==="left"}};this.openDown=false;this.openLeft=false;this.openRight=false;this.theme="";this.language=l();this.accessibleLabelDefault={fi:"Näytä lisätietoja",en:"Show more information",sv:"Visa mer tilläggsuppgifter"};this.accessibleLabel=s(this.accessibleLabelDefault,this.language);this.accessibleInputLabel=undefined;this.accessibleCloseLabelDefault={fi:"Sulje lisätiedot",en:"Close details",sv:"Stäng tilläggsuppgifter"};this.accessibleCloseLabel=s(this.accessibleCloseLabelDefault,this.language);this.label="";this.breakpoint="medium";this.direction="auto";this.positionVertical="0";this.positionHorizontal="0";this.active=false}t.prototype.componentWillLoad=function(){n(this)};t.prototype.componentDidLoad=function(){this.handleHorizontalVisibility()};t.prototype.componentDidUpdate=function(){switch(this.focusTarget){case"tooltip":this.scrollableEl.focus({preventScroll:true});break;case"trigger":this.buttonEl.focus({preventScroll:true});break}this.focusTarget=null};t.prototype.onScroll=function(){var t=this;clearTimeout(this.scrollTimer);this.scrollTimer=setTimeout((function(){if(t.active){t.handleHorizontalVisibility();t.handleVerticalVisibility()}}),100)};t.prototype.handleDocumentClick=function(t){var e=this;if(!this.active){return}var o=t.composedPath();var i=o.every((function(t){return t!==e.element}));if(i){this.closeTooltip()}};t.prototype.handleActiveChange=function(t){return __awaiter(this,void 0,void 0,(function(){var e=this;return __generator(this,(function(o){if(t){this.handleHorizontalVisibility();this.openDown=!this.isElementInViewportVertically()}else{setTimeout((function(){return e.openDown=false}),300)}return[2]}))}))};t.prototype.render=function(){var t=this;var e={transform:"translateY(".concat(this.positionVertical,") translateX(").concat(this.positionHorizontal,")"),zIndex:this.active?"201":""};return o(i,{style:e},o("button",{ref:function(e){return t.buttonEl=e},"aria-controls":this.tooltipId,"aria-expanded":this.active?"true":"false",onClick:this.toggleOpen,type:"button",class:{"duet-tooltip-button":true,"duet-tooltip-button-has-label":!!this.label,"duet-theme-turva":this.theme==="turva"}},o("svg",{"aria-hidden":"true",role:"img",fill:"currentColor",viewBox:"0 0 24 24",xmlns:"http://www.w3.org/2000/svg"},o("path",{d:"m13.5 17.25c-1.241 0-2.25-1.009-2.25-2.25v-3.75h-.75c-.414 0-.75-.336-.75-.75s.336-.75.75-.75h.75c.827 0 1.5.673 1.5 1.5v3.75c0 .414.336.75.75.75h.75c.414 0 .75.336.75.75s-.336.75-.75.75z"}),o("circle",{cx:"11.625",cy:"7.125",r:"1.125"}),o("path",{d:"m12 24c-6.617 0-12-5.383-12-12s5.383-12 12-12 12 5.383 12 12-5.383 12-12 12zm0-22.5c-5.79 0-10.5 4.71-10.5 10.5s4.71 10.5 10.5 10.5 10.5-4.71 10.5-10.5-4.71-10.5-10.5-10.5z"})),this.label?o("span",{class:"duet-tooltip-label"},this.label):o("duet-visually-hidden",null,this.accessibleInputLabel?"".concat(this.accessibleInputLabel,", ").concat(this.accessibleLabel):this.accessibleLabel)),o("div",{ref:function(e){return t.tooltipEl=e},class:{"duet-tooltip":true,"duet-mq-large":this.breakpoint==="large","duet-mq-medium":this.breakpoint==="medium","duet-theme-turva":this.theme==="turva","duet-tooltip-down":this.openDown,"duet-tooltip-has-label":!!this.label,"duet-tooltip-left":this.openLeft,"duet-tooltip-right":this.openRight,"duet-tooltip-active":this.active===true},onClick:function(t){return t.stopPropagation()},onKeyDown:this.handleKeyDown,onFocusout:this.handleFocusOut},o("div",{ref:function(e){return t.scrollableEl=e},class:"duet-tooltip-scrollable",tabindex:"0",id:this.tooltipId},o("slot",null)),o("button",{type:"button",class:"duet-tooltip-close",onClick:this.handleCloseClick},o("duet-icon",{name:"navigation-close-small",margin:"none",color:"currentColor",size:"xxx-small"}),o("duet-visually-hidden",null,this.accessibleCloseLabel))))};Object.defineProperty(t.prototype,"element",{get:function(){return r(this)},enumerable:false,configurable:true});Object.defineProperty(t,"watchers",{get:function(){return{active:["handleActiveChange"]}},enumerable:false,configurable:true});return t}());u.style=p}}}));