@duetds/components 8.0.6 → 8.1.0

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

@@ -1,271 +0,0 @@
-/*!
- * Built with Duet Design System
- */
-import { p as proxyCustomElement, H, h, d as Host } from './p-7247d0b2.js';
-import { m as media_query_medium, a as media_query_large } from './p-64d43840.js';
-import { c as computePosition, f as flip, s as shift, a as arrow } from './p-00c8a755.js';
-import { i as inheritGlobalTheme } from './p-d48735b6.js';
-import { c as createID } from './p-45f71a69.js';
-import { b as isEscapeKey } from './p-56ac3289.js';
-import { a as getLanguage, g as getLocaleString, c as connectLanguageChangeObserver, d as disconnectLanguageChangeObserver } from './p-4883df66.js';
-import { d as defineCustomElement$4 } from './p-180c0d2d.js';
-import { d as defineCustomElement$3 } from './p-fd4877d1.js';
-import { d as defineCustomElement$2 } from './p-e4355989.js';
-import { d as defineCustomElement$1 } from './p-62e68de8.js';
-
-const duetTooltipCss = "*.sc-duet-tooltip,*.sc-duet-tooltip::after,*.sc-duet-tooltip::before{box-sizing:border-box;padding:0;margin:0;background:transparent;border:0;-moz-appearance:none;-webkit-appearance:none;appearance:none}.sc-duet-tooltip-h{box-sizing:border-box;padding:0;margin:0;background:transparent;border:0;-moz-appearance:none;-webkit-appearance:none;appearance:none;z-index:200;display:inline-flex;width:auto;margin-top:-16px !important;margin-left:-3px !important;-webkit-tap-highlight-color:transparent}duet-tooltip-button.sc-duet-tooltip{position:relative}duet-tooltip-popup.sc-duet-tooltip{position:absolute}";
-
-const DuetTooltip = /*@__PURE__*/ proxyCustomElement(class DuetTooltip extends H {
-  constructor() {
-    super();
-    this.__registerHost();
-    /**
-     * Own Properties.
-     */
-    this.mql = [
-      window.matchMedia(media_query_medium.replace(/'/g, "")),
-      window.matchMedia(media_query_large.replace(/'/g, "")),
-    ];
-    this.tooltipId = createID("DuetTooltip");
-    /**
-     * Local methods
-     */
-    this.openTooltip = () => {
-      this.active = true;
-      this.focusTarget = "tooltip";
-    };
-    this.closeTooltip = (moveFocusToButton = false) => {
-      this.active = false;
-      if (moveFocusToButton) {
-        this.focusTarget = "trigger";
-      }
-      setTimeout(() => {
-        this.updatePlacement();
-      }, 200);
-    };
-    this.toggleOpen = () => {
-      this.active ? this.closeTooltip() : this.openTooltip();
-    };
-    this.updatePlacement = async () => {
-      var _a, _b;
-      let preferRight = true;
-      if (this.breakpoint === "large" && !this.mql[1].matches) {
-        preferRight = false;
-      }
-      else if (this.breakpoint === "medium" && !this.mql[0].matches) {
-        preferRight = false;
-      }
-      let placement = preferRight ? "top-start" : "top-end";
-      if (this.direction === "left") {
-        placement = "top-end";
-      }
-      else if (this.direction === "right") {
-        placement = "top-start";
-      }
-      const position = await computePosition(this.buttonEl, this.popupElement, {
-        placement,
-        middleware: [flip(), shift({ padding: 5 }), arrow({ element: this.arrowEl })],
-      });
-      this.tooltipY = position.y;
-      this.tooltipX = position.x;
-      this.placement = position.placement;
-      this.arrowY = (_a = position.middlewareData.arrow) === null || _a === void 0 ? void 0 : _a.y;
-      this.arrowX = (_b = position.middlewareData.arrow) === null || _b === void 0 ? void 0 : _b.x;
-    };
-    this.placement = "bottom";
-    this.tooltipY = undefined;
-    this.tooltipX = undefined;
-    this.arrowX = undefined;
-    this.arrowY = undefined;
-    this.theme = "";
-    this.language = getLanguage();
-    this.accessibleLabelDefault = {
-      fi: "Näytä lisätietoja",
-      en: "Show more information",
-      sv: "Visa mer tilläggsuppgifter",
-    };
-    this.accessibleLabel = getLocaleString(this.accessibleLabelDefault, this.language);
-    this.accessibleInputLabel = undefined;
-    this.accessibleCloseLabelDefault = {
-      fi: "Sulje lisätiedot",
-      en: "Close details",
-      sv: "Stäng tilläggsuppgifter",
-    };
-    this.accessibleCloseLabel = getLocaleString(this.accessibleCloseLabelDefault, this.language);
-    this.label = "";
-    this.breakpoint = "medium";
-    this.direction = "auto";
-    this.positionVertical = "0";
-    this.positionHorizontal = "0";
-    this.active = false;
-  }
-  /**
-   * Component lifecycle events.
-   */
-  componentWillLoad() {
-    inheritGlobalTheme(this);
-  }
-  async componentDidLoad() {
-    this.arrowEl = await this.popupElement.getArrowElement();
-    this.contentEl = await this.popupElement.getContentElement();
-    {
-      this.updatePlacement();
-    }
-    if (this.active) {
-      this.openTooltip();
-    }
-    this.intersectionObserver = new IntersectionObserver(this.updatePlacement, { root: document.body });
-    this.intersectionObserver.observe(this.element);
-  }
-  componentDidUpdate() {
-    switch (this.focusTarget) {
-      case "tooltip":
-        // delay focus so button is correctly announced as "expanded"
-        setTimeout(() => this.contentEl.focus({ preventScroll: true }));
-        break;
-      case "trigger":
-        // delay focus so button is correctly announced as "collapsed"
-        setTimeout(() => this.buttonEl.setFocus({ preventScroll: true }));
-        break;
-    }
-    this.focusTarget = null;
-  }
-  connectedCallback() {
-    connectLanguageChangeObserver(this, [
-      { prop: "accessibleLabel", defaults: "accessibleLabelDefault" },
-      { prop: "accessibleCloseLabel", defaults: "accessibleCloseLabelDefault" },
-    ]);
-  }
-  disconnectedCallback() {
-    disconnectLanguageChangeObserver(this);
-  }
-  /**
-   * Component event handling.
-   */
-  onScroll() {
-    clearTimeout(this.scrollTimer);
-    this.scrollTimer = setTimeout(() => {
-      if (this.active) {
-        this.updatePlacement();
-      }
-    }, 100);
-  }
-  handleWindowResize() {
-    clearTimeout(this.resizeTimer);
-    this.resizeTimer = setTimeout(() => {
-      this.updatePlacement();
-    }, 100);
-  }
-  handleDocumentClick(e) {
-    if (!this.active) {
-      return;
-    }
-    const path = e.composedPath();
-    const isClickOutside = path.every(el => el !== this.element && el !== this.contentEl);
-    if (isClickOutside) {
-      this.closeTooltip();
-    }
-  }
-  handleKeyDown(e) {
-    if (this.active && isEscapeKey(e)) {
-      this.closeTooltip(true);
-    }
-  }
-  handlePopupClose() {
-    if (this.active) {
-      this.closeTooltip(true);
-    }
-  }
-  async handleActiveChange(newActiveValue) {
-    if (newActiveValue) {
-      setTimeout(() => this.updatePlacement(), 10);
-    }
-    else {
-      setTimeout(() => this.updatePlacement(), 300);
-    }
-  }
-  /**
-   * render() function.
-   * Always the last one in the class.
-   */
-  render() {
-    const tooltipStyles = {
-      transform: `translateY(${this.positionVertical}) translateX(${this.positionHorizontal})`,
-      // This is needed to that the active tooltip stacks on
-      // top of other tooltips and the header.
-      zIndex: this.active ? "201" : "",
-    };
-    const positionStyles = {
-      top: `${this.tooltipY}px`,
-      left: `${this.tooltipX}px`,
-      display: "block",
-      "pointer-events": this.active ? "auto" : "none",
-    };
-    const arrowStyles = {
-      top: this.arrowY ? `${this.arrowY}px` : undefined,
-      left: this.arrowX ? `${this.arrowX}px` : undefined,
-    };
-    return (h(Host, { style: tooltipStyles }, h("duet-tooltip-button", { ref: element => (this.buttonEl = element), active: this.active, tooltipId: this.tooltipId, label: this.label, accessibleLabel: this.accessibleInputLabel ? `${this.accessibleInputLabel}, ${this.accessibleLabel}` : this.accessibleLabel, onClick: this.toggleOpen, theme: this.theme }), h("duet-tooltip-popup", { ref: element => (this.popupElement = element), active: this.active, tooltipId: this.tooltipId, arrowStyles: arrowStyles, style: positionStyles, placement: this.placement, accessibleCloseLabel: this.accessibleCloseLabel, theme: this.theme }, h("slot", null))));
-  }
-  get element() { return this; }
-  static get watchers() { return {
-    "active": ["handleActiveChange"]
-  }; }
-  static get style() { return duetTooltipCss; }
-}, [6, "duet-tooltip", {
-    "theme": [1025],
-    "language": [1025],
-    "accessibleLabelDefault": [1, "accessible-label-default"],
-    "accessibleLabel": [1025, "accessible-label"],
-    "accessibleInputLabel": [1, "accessible-input-label"],
-    "accessibleCloseLabelDefault": [1, "accessible-close-label-default"],
-    "accessibleCloseLabel": [1025, "accessible-close-label"],
-    "label": [1],
-    "breakpoint": [1],
-    "direction": [1],
-    "positionVertical": [513, "position-vertical"],
-    "positionHorizontal": [513, "position-horizontal"],
-    "active": [1540],
-    "placement": [32],
-    "tooltipY": [32],
-    "tooltipX": [32],
-    "arrowX": [32],
-    "arrowY": [32]
-  }, [[9, "scroll", "onScroll"], [9, "resize", "handleWindowResize"], [4, "click", "handleDocumentClick"], [4, "keydown", "handleKeyDown"], [4, "tooltipPopupClosed", "handlePopupClose"]], {
-    "active": ["handleActiveChange"]
-  }]);
-function defineCustomElement() {
-  if (typeof customElements === "undefined") {
-    return;
-  }
-  const components = ["duet-tooltip", "duet-icon", "duet-tooltip-button", "duet-tooltip-popup", "duet-visually-hidden"];
-  components.forEach(tagName => { switch (tagName) {
-    case "duet-tooltip":
-      if (!customElements.get(tagName)) {
-        customElements.define(tagName, DuetTooltip);
-      }
-      break;
-    case "duet-icon":
-      if (!customElements.get(tagName)) {
-        defineCustomElement$4();
-      }
-      break;
-    case "duet-tooltip-button":
-      if (!customElements.get(tagName)) {
-        defineCustomElement$3();
-      }
-      break;
-    case "duet-tooltip-popup":
-      if (!customElements.get(tagName)) {
-        defineCustomElement$2();
-      }
-      break;
-    case "duet-visually-hidden":
-      if (!customElements.get(tagName)) {
-        defineCustomElement$1();
-      }
-      break;
-  } });
-}
-
-export { DuetTooltip as D, defineCustomElement as d };

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

@@ -1,60 +0,0 @@
-/*!
- * Built with Duet Design System
- */
-import { p as proxyCustomElement, H, h, d as Host } from './p-7247d0b2.js';
-import { i as inheritGlobalTheme } from './p-d48735b6.js';
-
-const duetCaptionCss = ":host{box-sizing:border-box;padding:0;margin:0;background:transparent;border:0;-moz-appearance:none;-webkit-appearance:none;appearance:none;margin-bottom:16px !important;display:flex;flex:0 0 100%;width:100%;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:rgb(101, 119, 135);vertical-align:top}:host.duet-p-0{padding:0 !important}:host.duet-m-0{margin:0 !important}:host(.duet-caption-small){font-size:0.875rem;line-height:1.25}:host(.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(116, 116, 117)}:host(.duet-caption-selected){color:rgb(0, 119, 179)}:host(.duet-caption-selected.duet-theme-turva){color:rgb(23, 28, 58)}:host(.duet-m-0){margin:0 !important}";
-
-const DuetCaption = /*@__PURE__*/ proxyCustomElement(class DuetCaption extends H {
-  constructor() {
-    super();
-    this.__registerHost();
-    this.__attachShadow();
-    this.theme = "";
-    this.margin = "auto";
-    this.selected = false;
-    this.size = "medium";
-  }
-  /**
-   * Component lifecycle events.
-   */
-  componentWillLoad() {
-    inheritGlobalTheme(this);
-  }
-  /**
-   * render() function
-   * Always the last one in the class.
-   */
-  render() {
-    return (h(Host, { class: {
-        "duet-caption": true,
-        "duet-caption-selected": this.selected,
-        "duet-caption-small": this.size === "small",
-        "duet-theme-turva": this.theme === "turva",
-        "duet-m-0": this.margin === "none",
-      } }, h("slot", null)));
-  }
-  get element() { return this; }
-  static get style() { return duetCaptionCss; }
-}, [1, "duet-caption", {
-    "theme": [1025],
-    "margin": [1],
-    "selected": [4],
-    "size": [1]
-  }]);
-function defineCustomElement() {
-  if (typeof customElements === "undefined") {
-    return;
-  }
-  const components = ["duet-caption"];
-  components.forEach(tagName => { switch (tagName) {
-    case "duet-caption":
-      if (!customElements.get(tagName)) {
-        customElements.define(tagName, DuetCaption);
-      }
-      break;
-  } });
-}
-
-export { DuetCaption as D, defineCustomElement as d };

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

@@ -1,76 +0,0 @@
-/*!
- * Built with Duet Design System
- */
-import { p as proxyCustomElement, H, h, d as Host } from './p-7247d0b2.js';
-import { i as inheritGlobalTheme } from './p-d48735b6.js';
-
-const duetGridItemCss = ".sc-duet-grid-item-h{box-sizing:border-box;padding:0;margin:0;background:transparent;border:0;-moz-appearance:none;-webkit-appearance:none;appearance:none;margin-bottom:16px !important;min-width:0;max-width:100%;flex:0 0 auto;padding-right:8px;padding-left:8px;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-style:normal;font-weight:400;line-height:1.5;color:rgb(0, 41, 77)}.duet-grid-direction-horizontal.sc-duet-grid-item-h:first-child,.duet-grid-direction-horizontal.sc-duet-grid-item-h:first-of-type{padding-left:0}.duet-grid-direction-horizontal.sc-duet-grid-item-h:last-child,.duet-grid-direction-horizontal.sc-duet-grid-item-h:last-of-type{padding-right:0}@media (max-width: 35.9375em){.duet-grid-item-responsive.sc-duet-grid-item-h{width:100% !important;min-width:0 !important;max-width:100% !important;padding-right:0;padding-left:0}}@media screen and (max-width: 47.9375em){.duet-grid-item-br-medium.sc-duet-grid-item-h{width:100% !important;min-width:0 !important;max-width:100% !important}}@media screen and (max-width: 47.9375em){.duet-grid-item-responsive.duet-grid-item-br-medium.sc-duet-grid-item-h{padding-right:0;padding-left:0}}@media screen and (max-width: 64em){.duet-grid-item-br-x-large.sc-duet-grid-item-h{width:100% !important;min-width:0 !important;max-width:100% !important}}@media screen and (max-width: 64em){.duet-grid-item-responsive.duet-grid-item-br-x-large.sc-duet-grid-item-h{padding-right:0;padding-left:0}}.duet-grid-item-fill.sc-duet-grid-item-h{flex:1 1 auto;width:100%}.duet-theme-turva.sc-duet-grid-item-h{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)}.duet-m-0.sc-duet-grid-item-h{padding:0 !important;margin:0 !important}";
-
-const DuetGridItem = /*@__PURE__*/ proxyCustomElement(class DuetGridItem extends H {
-  constructor() {
-    super();
-    this.__registerHost();
-    this.fill = false;
-    this.maxWidth = undefined;
-    this.minWidth = undefined;
-    this.theme = "";
-    this.margin = "auto";
-    this.responsive = false;
-    this.direction = "horizontal";
-    this.breakpoint = "small";
-  }
-  /**
-   * Component lifecycle events.
-   */
-  componentWillLoad() {
-    inheritGlobalTheme(this);
-  }
-  /**
-   * render() function
-   * Always the last one in the class.
-   */
-  render() {
-    return (h(Host, { style: {
-        "min-width": this.minWidth,
-        "max-width": this.maxWidth,
-      }, class: {
-        "duet-m-0": this.margin === "none",
-        "duet-theme-turva": this.theme === "turva",
-        "duet-grid-item": true,
-        "duet-grid-item-fill": this.fill,
-        "duet-grid-item-responsive": this.responsive,
-        "duet-grid-direction-horizontal": this.direction === "horizontal",
-        "duet-grid-direction-vertical": this.direction === "vertical",
-        "duet-grid-item-br-x-small": this.breakpoint === "x-small",
-        "duet-grid-item-br-small": this.breakpoint === "small",
-        "duet-grid-item-br-medium": this.breakpoint === "medium",
-        "duet-grid-item-br-large": this.breakpoint === "large",
-        "duet-grid-item-br-x-large": this.breakpoint === "x-large",
-      } }));
-  }
-  static get style() { return duetGridItemCss; }
-}, [2, "duet-grid-item", {
-    "fill": [4],
-    "maxWidth": [1, "max-width"],
-    "minWidth": [1, "min-width"],
-    "theme": [1025],
-    "margin": [1],
-    "responsive": [4],
-    "direction": [1],
-    "breakpoint": [1]
-  }]);
-function defineCustomElement() {
-  if (typeof customElements === "undefined") {
-    return;
-  }
-  const components = ["duet-grid-item"];
-  components.forEach(tagName => { switch (tagName) {
-    case "duet-grid-item":
-      if (!customElements.get(tagName)) {
-        customElements.define(tagName, DuetGridItem);
-      }
-      break;
-  } });
-}
-
-export { DuetGridItem as D, defineCustomElement as d };

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

@@ -1,110 +0,0 @@
-/*!
- * Built with Duet Design System
- */
-import { p as proxyCustomElement, H, h, d as Host } from './p-7247d0b2.js';
-import { d as defineCustomElement$1 } from './p-62e68de8.js';
-
-const DuetUploadAriaStatus = /*@__PURE__*/ proxyCustomElement(class DuetUploadAriaStatus extends H {
-  constructor() {
-    super();
-    this.__registerHost();
-    this.__attachShadow();
-    /**
-     * Private functions
-     */
-    this.replacePlaceHolders = (statusString) => {
-      const addFiles = (amount) => {
-        return amount > 1 ? `${amount} ${this.statusMessageLabel.files}` : `${amount} ${this.statusMessageLabel.file}`;
-      };
-      return statusString
-        .replace("{filesUploaded}", addFiles(this.valid))
-        .replace("{filesInProgress}", addFiles(this.inprogress))
-        .replace("{filesTotal}", addFiles(this.total))
-        .replace("{filesWithErrors}", addFiles(this.invalid));
-    };
-    this.getStatusMessage = () => {
-      const { done, inProgress, doneWithErrors, inProgressWithErrors } = this.statusMessageLabel;
-      const hasErrors = this.invalid > 0;
-      const isInProgress = this.inprogress > 0;
-      const isInProgressWithErrors = this.inprogress > 0 && hasErrors;
-      const isDone = this.valid === this.total && !isInProgress && !hasErrors;
-      const isDoneWithErrors = this.valid + this.invalid === this.total && !isInProgress;
-      if (isDone) {
-        this.statusMessage = this.replacePlaceHolders(done);
-        return;
-      }
-      else if (isInProgressWithErrors) {
-        this.statusMessage = this.replacePlaceHolders(inProgressWithErrors);
-        return;
-      }
-      else if (isInProgress) {
-        this.statusMessage = this.replacePlaceHolders(inProgress);
-        return;
-      }
-      else if (isDoneWithErrors) {
-        this.statusMessage = this.replacePlaceHolders(doneWithErrors);
-        return;
-      }
-      return;
-    };
-    this.statusMessage = null;
-    this.statusMessageLabel = null;
-    this.accessibleAriaLive = "polite";
-    this.valid = undefined;
-    this.total = undefined;
-    this.invalid = undefined;
-    this.inprogress = undefined;
-  }
-  watchHandler(newValue, oldValue) {
-    if (newValue !== oldValue) {
-      this.getStatusMessage();
-    }
-  }
-  /**
-   * render() function
-   * Always the last one in the class.
-   */
-  render() {
-    return (h(Host, { role: "status", "aria-live": "assertive", "aria-atomic": "true", "aria-relevant": "all" }, h("duet-visually-hidden", null, this.statusMessage)));
-  }
-  get element() { return this; }
-  static get watchers() { return {
-    "valid": ["watchHandler"],
-    "invalid": ["watchHandler"],
-    "inprogress": ["watchHandler"],
-    "total": ["watchHandler"]
-  }; }
-}, [1, "duet-upload-aria-status", {
-    "statusMessageLabel": [16],
-    "accessibleAriaLive": [1, "accessible-aria-live"],
-    "valid": [2],
-    "total": [2],
-    "invalid": [2],
-    "inprogress": [2],
-    "statusMessage": [32]
-  }, undefined, {
-    "valid": ["watchHandler"],
-    "invalid": ["watchHandler"],
-    "inprogress": ["watchHandler"],
-    "total": ["watchHandler"]
-  }]);
-function defineCustomElement() {
-  if (typeof customElements === "undefined") {
-    return;
-  }
-  const components = ["duet-upload-aria-status", "duet-visually-hidden"];
-  components.forEach(tagName => { switch (tagName) {
-    case "duet-upload-aria-status":
-      if (!customElements.get(tagName)) {
-        customElements.define(tagName, DuetUploadAriaStatus);
-      }
-      break;
-    case "duet-visually-hidden":
-      if (!customElements.get(tagName)) {
-        defineCustomElement$1();
-      }
-      break;
-  } });
-}
-
-export { DuetUploadAriaStatus as D, defineCustomElement as d };

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

@@ -1,72 +0,0 @@
-/*!
- * Built with Duet Design System
- */
-import { p as proxyCustomElement, H, h, d as Host } from './p-7247d0b2.js';
-import { i as inheritGlobalTheme } from './p-d48735b6.js';
-import { d as defineCustomElement$1 } from './p-62e68de8.js';
-
-const duetTooltipButtonCss = "*,*::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}.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 #0077b3 !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 #171c3a !important}.duet-tooltip-button svg{width:20px;height:20px;pointer-events:none}.duet-tooltip-button-has-label{margin-right:0}.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\"}";
-
-const DuetTooltipButton = /*@__PURE__*/ proxyCustomElement(class DuetTooltipButton extends H {
-  constructor() {
-    super();
-    this.__registerHost();
-    this.__attachShadow();
-    this.label = "";
-    this.accessibleLabel = undefined;
-    this.theme = "";
-    this.active = undefined;
-    this.tooltipId = undefined;
-  }
-  /**
-   * Component lifecycle events.
-   */
-  componentWillLoad() {
-    inheritGlobalTheme(this);
-  }
-  async setFocus(options) {
-    if (this.buttonElement) {
-      this.buttonElement.focus(options);
-    }
-  }
-  /**
-   * render() function.
-   * Always the last one in the class.
-   */
-  render() {
-    return (h(Host, null, h("button", { ref: el => (this.buttonElement = el), "aria-controls": this.tooltipId, "aria-expanded": this.active ? "true" : "false", type: "button", class: {
-        "duet-tooltip-button": true,
-        "duet-tooltip-button-has-label": !!this.label,
-        "duet-theme-turva": this.theme === "turva",
-      } }, h("svg", { "aria-hidden": "true", role: "img", fill: "currentColor", viewBox: "0 0 24 24", xmlns: "http://www.w3.org/2000/svg" }, h("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" }), h("circle", { cx: "11.625", cy: "7.125", r: "1.125" }), h("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 ? (h("span", { class: "duet-tooltip-label" }, this.label)) : (h("duet-visually-hidden", null, this.accessibleLabel)))));
-  }
-  get element() { return this; }
-  static get style() { return duetTooltipButtonCss; }
-}, [1, "duet-tooltip-button", {
-    "label": [1],
-    "accessibleLabel": [1, "accessible-label"],
-    "theme": [1025],
-    "active": [4],
-    "tooltipId": [1, "tooltip-id"],
-    "setFocus": [64]
-  }]);
-function defineCustomElement() {
-  if (typeof customElements === "undefined") {
-    return;
-  }
-  const components = ["duet-tooltip-button", "duet-visually-hidden"];
-  components.forEach(tagName => { switch (tagName) {
-    case "duet-tooltip-button":
-      if (!customElements.get(tagName)) {
-        customElements.define(tagName, DuetTooltipButton);
-      }
-      break;
-    case "duet-visually-hidden":
-      if (!customElements.get(tagName)) {
-        defineCustomElement$1();
-      }
-      break;
-  } });
-}
-
-export { DuetTooltipButton as D, defineCustomElement as d };