@govtechsg/sgds-web-component 3.6.0-rc.2 → 3.6.0

package/components/Modal/sgds-modal.d.ts

@@ -1,6 +1,6 @@
 import { PropertyValueMap } from "lit";
 import SgdsElement from "../../base/sgds-element";
-import SgdsCloseButton from "../../internals/CloseButton/sgds-close-button";
+import SgdsCloseButton from "../CloseButton/sgds-close-button";
 /**
  * @summary The modal component inform users about a specific task and may contain critical information which users then have to make a decision.
  *

package/components/Modal/sgds-modal.js

@@ -11,7 +11,7 @@ import Modal from '../../utils/modal.js';
 import { HasSlotController } from '../../utils/slot.js';
 import { unlockBodyScrolling, lockBodyScrolling } from '../../utils/scroll.js';
 import { SM_BREAKPOINT, MD_BREAKPOINT } from '../../utils/breakpoints.js';
-import { SgdsCloseButton } from '../../internals/CloseButton/sgds-close-button.js';
+import { SgdsCloseButton } from '../CloseButton/sgds-close-button.js';
 import css_248z$2 from './modal.js';
 import css_248z from '../../styles/header-class.js';
 import css_248z$1 from '../../styles/svg.js';
@@ -234,7 +234,7 @@ class SgdsModal extends SgdsElement {
                    <sgds-close-button
                 class="modal-header__close"
                 @click="${() => this.requestClose("close-button")}"
-                ariaLabel="close modal"
+                aria-label="close modal"
               ></sgds-close-button>
             <div class="modal-header">
               <div class="modal-header__title-description">

package/components/Modal/sgds-modal.js.map

@@ -1 +1 @@
-{"version":3,"file":"sgds-modal.js","sources":["../../../src/components/Modal/sgds-modal.ts"],"sourcesContent":["import { html, PropertyValueMap } from \"lit\";\nimport { property, query } from \"lit/decorators.js\";\nimport { classMap } from \"lit/directives/class-map.js\";\nimport SgdsElement from \"../../base/sgds-element\";\nimport { watch } from \"../../utils/watch\";\nimport { animateTo, stopAnimations } from \"../../utils/animate\";\nimport { getAnimation, setDefaultAnimation } from \"../../utils/animation-registry\";\nimport { waitForEvent } from \"../../utils/event\";\nimport Modal from \"../../utils/modal\";\nimport { HasSlotController } from \"../../utils/slot\";\nimport { lockBodyScrolling, unlockBodyScrolling } from \"../../utils/scroll\";\nimport { SM_BREAKPOINT, MD_BREAKPOINT } from \"../../utils/breakpoints\";\nimport SgdsButton from \"../Button/sgds-button\";\nimport SgdsCloseButton from \"../../internals/CloseButton/sgds-close-button\";\nimport modalStyle from \"./modal.css\";\nimport headerStyles from \"../../styles/header-class.css\";\nimport svgStyles from \"../../styles/svg.css\";\n/**\n * @summary The modal component inform users about a specific task and may contain critical information which users then have to make a decision.\n *\n * @slot default - The content of the Modal's body.\n * @slot title - The title of the Modal.\n * @slot description - The description of the Modal.\n * @slot footer - The content of the Modal's footer, typically used to pass in buttons for call to action.\n *\n * @event sgds-close - Emitted when the modal is called to close via mouseclick of close button, overlay or via keyboard esc key\n * @event sgds-show - Emitted when the modal opens\n * @event sgds-hide - Emitted when the modal closes\n * @event sgds-after-show - Emitted after modal opens and the animations has completed\n * @event sgds-after-hide - Emitted after modal closes and the animations has completed\n *\n */\nexport class SgdsModal extends SgdsElement {\n  static styles = [...SgdsElement.styles, headerStyles, svgStyles, modalStyle];\n  /**@internal */\n  static dependencies = {\n    \"sgds-close-button\": SgdsCloseButton\n  };\n  /**@internal */\n  @query(\".modal\") dialog: HTMLElement;\n  /**@internal */\n  @query(\".modal-panel\") panel: HTMLElement;\n  /**@internal */\n  @query(\".modal-overlay\") overlay: HTMLElement;\n  /**@internal */\n  @query(\".modal-title\") heading: HTMLElement;\n  /**@internal */\n  private readonly hasSlotController = new HasSlotController(this, \"footer\");\n  /**@internal */\n  private modal: Modal;\n  /**@internal */\n  private originalTrigger: HTMLElement | null;\n  private _resizeHandler: () => void;\n\n  /**Indicates whether or not the modal is open. You can use this in lieu of the show/hide methods. */\n  @property({ type: Boolean, reflect: true }) open = false;\n\n  /** Removes the default animation when opening and closing of modal */\n  @property({ type: Boolean, reflect: true }) noAnimation = false;\n\n  /** Specifies a small, medium, large or fullscreen modal, the size is medium by default. */\n  @property({ reflect: true }) size: \"sm\" | \"md\" | \"lg\" | \"fullscreen\" = \"md\";\n\n  /** Used only for SSR to indicate the presence of the `footer` slot. */\n  @property({ type: Boolean }) hasFooterSlot = false;\n\n  connectedCallback() {\n    super.connectedCallback();\n    this.handleDocumentKeyDown = this.handleDocumentKeyDown.bind(this);\n    this.modal = new Modal(this);\n    this._resizeHandler = this._debounce(this._onWindowResize.bind(this), 200);\n  }\n\n  disconnectedCallback() {\n    super.disconnectedCallback();\n    this._removeResizeListener();\n    unlockBodyScrolling(this);\n  }\n\n  firstUpdated(changedProperties: PropertyValueMap<this>) {\n    super.firstUpdated(changedProperties);\n    this._onWindowResize();\n    this.dialog.hidden = !this.open;\n\n    if (this.open) {\n      this.addOpenListeners();\n      this.modal.activate();\n      lockBodyScrolling(this);\n    }\n  }\n\n  updated() {\n    if (!this.hasFooterSlot) this.hasFooterSlot = this.hasSlotController.test(\"footer\");\n  }\n\n  private _debounce(func: (...args: any[]) => void, wait: number) {\n    let timeout: number;\n    return (...args: any[]) => {\n      clearTimeout(timeout);\n      timeout = window.setTimeout(() => func(...args), wait);\n    };\n  }\n\n  /** Handle the window resize event. */\n  private _onWindowResize() {\n    const panel = this.panel.getBoundingClientRect();\n    const panelWidth = panel.width;\n    const buttonElements = this.querySelectorAll(\"sgds-button[slot='footer']\");\n\n    if (!this.panel) return;\n\n    if (buttonElements.length <= 1) return;\n\n    if (panelWidth < SM_BREAKPOINT || (this.size === \"fullscreen\" && panelWidth < MD_BREAKPOINT)) {\n      buttonElements.forEach(buttonElement => {\n        const button = buttonElement as SgdsButton;\n        button.fullWidth = true;\n      });\n    } else {\n      buttonElements.forEach(buttonElement => {\n        const button = buttonElement as SgdsButton;\n        button.fullWidth = false;\n      });\n    }\n  }\n\n  /**  Add the resize event listener. */\n  private _addResizeListener() {\n    window.addEventListener(\"resize\", this._resizeHandler);\n  }\n\n  /** Remove the resize event listener. */\n  private _removeResizeListener() {\n    window.removeEventListener(\"resize\", this._resizeHandler);\n  }\n\n  /** Shows the dialog. */\n  public async show() {\n    if (this.open) {\n      return undefined;\n    }\n\n    this.open = true;\n    return waitForEvent(this, \"sgds-after-show\");\n  }\n\n  /** Hides the dialog */\n  public async hide() {\n    if (!this.open) {\n      return undefined;\n    }\n\n    this.open = false;\n    return waitForEvent(this, \"sgds-after-hide\");\n  }\n\n  private requestClose(source: \"close-button\" | \"keyboard\" | \"overlay\") {\n    const sgdsRequestClose = this.emit(\"sgds-close\", {\n      cancelable: true,\n      detail: { source }\n    });\n\n    if (sgdsRequestClose.defaultPrevented) {\n      const animation = getAnimation(this, \"modal.denyClose\");\n      animateTo(this.panel, animation.keyframes);\n      return;\n    }\n\n    this.hide();\n  }\n\n  addOpenListeners() {\n    document.addEventListener(\"keydown\", this.handleDocumentKeyDown);\n  }\n\n  removeOpenListeners() {\n    document.removeEventListener(\"keydown\", this.handleDocumentKeyDown);\n  }\n\n  handleDocumentKeyDown(event: KeyboardEvent) {\n    if (this.open && event.key === \"Escape\") {\n      event.stopPropagation();\n      this.requestClose(\"keyboard\");\n    }\n  }\n\n  private _overlayClickHandler() {\n    if (this.size === \"fullscreen\") {\n      return;\n    }\n\n    this.requestClose(\"overlay\");\n  }\n\n  @watch(\"open\", { waitUntilFirstUpdate: true })\n  async handleOpenChange() {\n    if (this.open) {\n      // Show\n      this.emit(\"sgds-show\");\n      this.addOpenListeners();\n      this.originalTrigger = document.activeElement as HTMLElement;\n      this.modal.activate();\n\n      lockBodyScrolling(this);\n\n      await Promise.all([stopAnimations(this.dialog), stopAnimations(this.overlay)]);\n      this.dialog.hidden = false;\n\n      const panelAnimation = getAnimation(this, \"modal.show\");\n      const overlayAnimation = getAnimation(this, \"modal.overlay.show\");\n      !this.noAnimation &&\n        (await Promise.all([\n          animateTo(this.panel, panelAnimation.keyframes, panelAnimation.options),\n          animateTo(this.overlay, overlayAnimation.keyframes, overlayAnimation.options)\n        ]));\n\n      this.emit(\"sgds-after-show\");\n\n      // Add focus on modal heading after opening it\n      this.heading.focus();\n\n      // Add resize listener only when the modal is shown\n      this._addResizeListener();\n    } else {\n      // Hide\n      this.emit(\"sgds-hide\");\n      this.removeOpenListeners();\n      this.modal.deactivate();\n\n      await Promise.all([stopAnimations(this.dialog), stopAnimations(this.overlay)]);\n      const panelAnimation = getAnimation(this, \"modal.hide\");\n      const overlayAnimation = getAnimation(this, \"modal.overlay.hide\");\n\n      // Animate the overlay and the panel at the same time. Because animation durations might be different, we need to\n      // hide each one individually when the animation finishes, otherwise the first one that finishes will reappear\n      // unexpectedly. We'll unhide them after all animations have completed.\n      !this.noAnimation &&\n        (await Promise.all([\n          animateTo(this.overlay, overlayAnimation.keyframes, overlayAnimation.options).then(() => {\n            this.overlay.hidden = true;\n          }),\n          animateTo(this.panel, panelAnimation.keyframes, panelAnimation.options).then(() => {\n            this.panel.hidden = true;\n          })\n        ]));\n\n      this.dialog.hidden = true;\n\n      // Now that the dialog is hidden, restore the overlay and panel for next time\n      this.overlay.hidden = false;\n      this.panel.hidden = false;\n\n      unlockBodyScrolling(this);\n\n      // Restore focus to the original trigger\n      const trigger = this.originalTrigger;\n      if (typeof trigger?.focus === \"function\") {\n        setTimeout(() => trigger.focus());\n      }\n\n      this.emit(\"sgds-after-hide\");\n\n      // Remove resize listener when the modal is hidden\n      this._removeResizeListener();\n    }\n  }\n\n  render() {\n    return html`\n      <div\n        class=${classMap({\n          modal: true,\n          show: this.open,\n          \"has-footer\": this.hasFooterSlot\n        })}\n      >\n        <div class=\"modal-overlay\" @click=${this._overlayClickHandler}></div>\n\n        <div\n          class=\"modal-panel\"\n          role=\"dialog\"\n          aria-modal=\"true\"\n          aria-hidden=${this.open ? \"false\" : \"true\"}\n          aria-labelledby=\"title\"\n          tabindex=\"-1\"\n        >\n          <div class=\"modal-content\">\n                   <sgds-close-button\n                class=\"modal-header__close\"\n                @click=\"${() => this.requestClose(\"close-button\")}\"\n                ariaLabel=\"close modal\"\n              ></sgds-close-button>\n            <div class=\"modal-header\">\n              <div class=\"modal-header__title-description\">\n                <slot class=\"modal-title\" id=\"title\" name=\"title\"></slot>\n                <slot name=\"description\"></slot>\n              </div>\n            </div>\n            <div class=\"modal-body\">\n              <slot></slot>\n            </div>\n          </div class=\"modal-content\">\n          <div class=\"modal-footer\">\n            <slot name=\"footer\"></slot>\n          </div>\n        </div>\n      </div>\n    `;\n  }\n}\n\nsetDefaultAnimation(\"modal.show\", {\n  keyframes: [\n    { opacity: 0, transform: \"scale(1) translate(0, -100%)\" },\n    { opacity: 1, transform: \"scale(1) translate(0, 0%)\" }\n  ],\n  options: { duration: 400, easing: \"ease\" }\n});\n\nsetDefaultAnimation(\"modal.hide\", {\n  keyframes: [\n    { opacity: 1, transform: \"scale(1) translate(0, 0)\" },\n    { opacity: 0, transform: \"scale(1) translate(0, -100%)\" }\n  ],\n  options: { duration: 400, easing: \"ease\" }\n});\n\nsetDefaultAnimation(\"modal.denyClose\", {\n  keyframes: [{ transform: \"scale(1)\" }, { transform: \"scale(1.02)\" }, { transform: \"scale(1)\" }],\n  options: { duration: 400 }\n});\n\nsetDefaultAnimation(\"modal.overlay.show\", {\n  keyframes: [{ opacity: 0 }, { opacity: 1 }],\n  options: { duration: 400 }\n});\n\nsetDefaultAnimation(\"modal.overlay.hide\", {\n  keyframes: [{ opacity: 1 }, { opacity: 0 }],\n  options: { duration: 400 }\n});\n\nexport default SgdsModal;\n"],"names":["headerStyles","svgStyles","modalStyle"],"mappings":"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"}
+{"version":3,"file":"sgds-modal.js","sources":["../../../src/components/Modal/sgds-modal.ts"],"sourcesContent":["import { html, PropertyValueMap } from \"lit\";\nimport { property, query } from \"lit/decorators.js\";\nimport { classMap } from \"lit/directives/class-map.js\";\nimport SgdsElement from \"../../base/sgds-element\";\nimport { watch } from \"../../utils/watch\";\nimport { animateTo, stopAnimations } from \"../../utils/animate\";\nimport { getAnimation, setDefaultAnimation } from \"../../utils/animation-registry\";\nimport { waitForEvent } from \"../../utils/event\";\nimport Modal from \"../../utils/modal\";\nimport { HasSlotController } from \"../../utils/slot\";\nimport { lockBodyScrolling, unlockBodyScrolling } from \"../../utils/scroll\";\nimport { SM_BREAKPOINT, MD_BREAKPOINT } from \"../../utils/breakpoints\";\nimport SgdsButton from \"../Button/sgds-button\";\nimport SgdsCloseButton from \"../CloseButton/sgds-close-button\";\nimport modalStyle from \"./modal.css\";\nimport headerStyles from \"../../styles/header-class.css\";\nimport svgStyles from \"../../styles/svg.css\";\n/**\n * @summary The modal component inform users about a specific task and may contain critical information which users then have to make a decision.\n *\n * @slot default - The content of the Modal's body.\n * @slot title - The title of the Modal.\n * @slot description - The description of the Modal.\n * @slot footer - The content of the Modal's footer, typically used to pass in buttons for call to action.\n *\n * @event sgds-close - Emitted when the modal is called to close via mouseclick of close button, overlay or via keyboard esc key\n * @event sgds-show - Emitted when the modal opens\n * @event sgds-hide - Emitted when the modal closes\n * @event sgds-after-show - Emitted after modal opens and the animations has completed\n * @event sgds-after-hide - Emitted after modal closes and the animations has completed\n *\n */\nexport class SgdsModal extends SgdsElement {\n  static styles = [...SgdsElement.styles, headerStyles, svgStyles, modalStyle];\n  /**@internal */\n  static dependencies = {\n    \"sgds-close-button\": SgdsCloseButton\n  };\n  /**@internal */\n  @query(\".modal\") dialog: HTMLElement;\n  /**@internal */\n  @query(\".modal-panel\") panel: HTMLElement;\n  /**@internal */\n  @query(\".modal-overlay\") overlay: HTMLElement;\n  /**@internal */\n  @query(\".modal-title\") heading: HTMLElement;\n  /**@internal */\n  private readonly hasSlotController = new HasSlotController(this, \"footer\");\n  /**@internal */\n  private modal: Modal;\n  /**@internal */\n  private originalTrigger: HTMLElement | null;\n  private _resizeHandler: () => void;\n\n  /**Indicates whether or not the modal is open. You can use this in lieu of the show/hide methods. */\n  @property({ type: Boolean, reflect: true }) open = false;\n\n  /** Removes the default animation when opening and closing of modal */\n  @property({ type: Boolean, reflect: true }) noAnimation = false;\n\n  /** Specifies a small, medium, large or fullscreen modal, the size is medium by default. */\n  @property({ reflect: true }) size: \"sm\" | \"md\" | \"lg\" | \"fullscreen\" = \"md\";\n\n  /** Used only for SSR to indicate the presence of the `footer` slot. */\n  @property({ type: Boolean }) hasFooterSlot = false;\n\n  connectedCallback() {\n    super.connectedCallback();\n    this.handleDocumentKeyDown = this.handleDocumentKeyDown.bind(this);\n    this.modal = new Modal(this);\n    this._resizeHandler = this._debounce(this._onWindowResize.bind(this), 200);\n  }\n\n  disconnectedCallback() {\n    super.disconnectedCallback();\n    this._removeResizeListener();\n    unlockBodyScrolling(this);\n  }\n\n  firstUpdated(changedProperties: PropertyValueMap<this>) {\n    super.firstUpdated(changedProperties);\n    this._onWindowResize();\n    this.dialog.hidden = !this.open;\n\n    if (this.open) {\n      this.addOpenListeners();\n      this.modal.activate();\n      lockBodyScrolling(this);\n    }\n  }\n\n  updated() {\n    if (!this.hasFooterSlot) this.hasFooterSlot = this.hasSlotController.test(\"footer\");\n  }\n\n  private _debounce(func: (...args: any[]) => void, wait: number) {\n    let timeout: number;\n    return (...args: any[]) => {\n      clearTimeout(timeout);\n      timeout = window.setTimeout(() => func(...args), wait);\n    };\n  }\n\n  /** Handle the window resize event. */\n  private _onWindowResize() {\n    const panel = this.panel.getBoundingClientRect();\n    const panelWidth = panel.width;\n    const buttonElements = this.querySelectorAll(\"sgds-button[slot='footer']\");\n\n    if (!this.panel) return;\n\n    if (buttonElements.length <= 1) return;\n\n    if (panelWidth < SM_BREAKPOINT || (this.size === \"fullscreen\" && panelWidth < MD_BREAKPOINT)) {\n      buttonElements.forEach(buttonElement => {\n        const button = buttonElement as SgdsButton;\n        button.fullWidth = true;\n      });\n    } else {\n      buttonElements.forEach(buttonElement => {\n        const button = buttonElement as SgdsButton;\n        button.fullWidth = false;\n      });\n    }\n  }\n\n  /**  Add the resize event listener. */\n  private _addResizeListener() {\n    window.addEventListener(\"resize\", this._resizeHandler);\n  }\n\n  /** Remove the resize event listener. */\n  private _removeResizeListener() {\n    window.removeEventListener(\"resize\", this._resizeHandler);\n  }\n\n  /** Shows the dialog. */\n  public async show() {\n    if (this.open) {\n      return undefined;\n    }\n\n    this.open = true;\n    return waitForEvent(this, \"sgds-after-show\");\n  }\n\n  /** Hides the dialog */\n  public async hide() {\n    if (!this.open) {\n      return undefined;\n    }\n\n    this.open = false;\n    return waitForEvent(this, \"sgds-after-hide\");\n  }\n\n  private requestClose(source: \"close-button\" | \"keyboard\" | \"overlay\") {\n    const sgdsRequestClose = this.emit(\"sgds-close\", {\n      cancelable: true,\n      detail: { source }\n    });\n\n    if (sgdsRequestClose.defaultPrevented) {\n      const animation = getAnimation(this, \"modal.denyClose\");\n      animateTo(this.panel, animation.keyframes);\n      return;\n    }\n\n    this.hide();\n  }\n\n  addOpenListeners() {\n    document.addEventListener(\"keydown\", this.handleDocumentKeyDown);\n  }\n\n  removeOpenListeners() {\n    document.removeEventListener(\"keydown\", this.handleDocumentKeyDown);\n  }\n\n  handleDocumentKeyDown(event: KeyboardEvent) {\n    if (this.open && event.key === \"Escape\") {\n      event.stopPropagation();\n      this.requestClose(\"keyboard\");\n    }\n  }\n\n  private _overlayClickHandler() {\n    if (this.size === \"fullscreen\") {\n      return;\n    }\n\n    this.requestClose(\"overlay\");\n  }\n\n  @watch(\"open\", { waitUntilFirstUpdate: true })\n  async handleOpenChange() {\n    if (this.open) {\n      // Show\n      this.emit(\"sgds-show\");\n      this.addOpenListeners();\n      this.originalTrigger = document.activeElement as HTMLElement;\n      this.modal.activate();\n\n      lockBodyScrolling(this);\n\n      await Promise.all([stopAnimations(this.dialog), stopAnimations(this.overlay)]);\n      this.dialog.hidden = false;\n\n      const panelAnimation = getAnimation(this, \"modal.show\");\n      const overlayAnimation = getAnimation(this, \"modal.overlay.show\");\n      !this.noAnimation &&\n        (await Promise.all([\n          animateTo(this.panel, panelAnimation.keyframes, panelAnimation.options),\n          animateTo(this.overlay, overlayAnimation.keyframes, overlayAnimation.options)\n        ]));\n\n      this.emit(\"sgds-after-show\");\n\n      // Add focus on modal heading after opening it\n      this.heading.focus();\n\n      // Add resize listener only when the modal is shown\n      this._addResizeListener();\n    } else {\n      // Hide\n      this.emit(\"sgds-hide\");\n      this.removeOpenListeners();\n      this.modal.deactivate();\n\n      await Promise.all([stopAnimations(this.dialog), stopAnimations(this.overlay)]);\n      const panelAnimation = getAnimation(this, \"modal.hide\");\n      const overlayAnimation = getAnimation(this, \"modal.overlay.hide\");\n\n      // Animate the overlay and the panel at the same time. Because animation durations might be different, we need to\n      // hide each one individually when the animation finishes, otherwise the first one that finishes will reappear\n      // unexpectedly. We'll unhide them after all animations have completed.\n      !this.noAnimation &&\n        (await Promise.all([\n          animateTo(this.overlay, overlayAnimation.keyframes, overlayAnimation.options).then(() => {\n            this.overlay.hidden = true;\n          }),\n          animateTo(this.panel, panelAnimation.keyframes, panelAnimation.options).then(() => {\n            this.panel.hidden = true;\n          })\n        ]));\n\n      this.dialog.hidden = true;\n\n      // Now that the dialog is hidden, restore the overlay and panel for next time\n      this.overlay.hidden = false;\n      this.panel.hidden = false;\n\n      unlockBodyScrolling(this);\n\n      // Restore focus to the original trigger\n      const trigger = this.originalTrigger;\n      if (typeof trigger?.focus === \"function\") {\n        setTimeout(() => trigger.focus());\n      }\n\n      this.emit(\"sgds-after-hide\");\n\n      // Remove resize listener when the modal is hidden\n      this._removeResizeListener();\n    }\n  }\n\n  render() {\n    return html`\n      <div\n        class=${classMap({\n          modal: true,\n          show: this.open,\n          \"has-footer\": this.hasFooterSlot\n        })}\n      >\n        <div class=\"modal-overlay\" @click=${this._overlayClickHandler}></div>\n\n        <div\n          class=\"modal-panel\"\n          role=\"dialog\"\n          aria-modal=\"true\"\n          aria-hidden=${this.open ? \"false\" : \"true\"}\n          aria-labelledby=\"title\"\n          tabindex=\"-1\"\n        >\n          <div class=\"modal-content\">\n                   <sgds-close-button\n                class=\"modal-header__close\"\n                @click=\"${() => this.requestClose(\"close-button\")}\"\n                aria-label=\"close modal\"\n              ></sgds-close-button>\n            <div class=\"modal-header\">\n              <div class=\"modal-header__title-description\">\n                <slot class=\"modal-title\" id=\"title\" name=\"title\"></slot>\n                <slot name=\"description\"></slot>\n              </div>\n            </div>\n            <div class=\"modal-body\">\n              <slot></slot>\n            </div>\n          </div class=\"modal-content\">\n          <div class=\"modal-footer\">\n            <slot name=\"footer\"></slot>\n          </div>\n        </div>\n      </div>\n    `;\n  }\n}\n\nsetDefaultAnimation(\"modal.show\", {\n  keyframes: [\n    { opacity: 0, transform: \"scale(1) translate(0, -100%)\" },\n    { opacity: 1, transform: \"scale(1) translate(0, 0%)\" }\n  ],\n  options: { duration: 400, easing: \"ease\" }\n});\n\nsetDefaultAnimation(\"modal.hide\", {\n  keyframes: [\n    { opacity: 1, transform: \"scale(1) translate(0, 0)\" },\n    { opacity: 0, transform: \"scale(1) translate(0, -100%)\" }\n  ],\n  options: { duration: 400, easing: \"ease\" }\n});\n\nsetDefaultAnimation(\"modal.denyClose\", {\n  keyframes: [{ transform: \"scale(1)\" }, { transform: \"scale(1.02)\" }, { transform: \"scale(1)\" }],\n  options: { duration: 400 }\n});\n\nsetDefaultAnimation(\"modal.overlay.show\", {\n  keyframes: [{ opacity: 0 }, { opacity: 1 }],\n  options: { duration: 400 }\n});\n\nsetDefaultAnimation(\"modal.overlay.hide\", {\n  keyframes: [{ opacity: 1 }, { opacity: 0 }],\n  options: { duration: 400 }\n});\n\nexport default SgdsModal;\n"],"names":["headerStyles","svgStyles","modalStyle"],"mappings":"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"}

package/components/Pagination/index.umd.min.js

@@ -74,7 +74,7 @@ const et=1;class tt{constructor(e){}get _$isConnected(){return this._$parent._$i
    * @license
    * Copyright 2020 Google LLC
    * SPDX-License-Identifier: BSD-3-Clause
-   */,rt=Symbol.for(""),st=e=>{if(e?.r===rt)return e?._$litStatic$},ot=(e,...t)=>({_$litStatic$:t.reduce(((t,i,a)=>t+(e=>{if(void 0!==e._$litStatic$)return e._$litStatic$;throw new Error(`Value passed to 'literal' function must be a 'literal' result: ${e}. Use 'unsafeStatic' to pass non-literal values, but\n            take care to ensure page security.`)})(i)+e[a+1]),e[0]),r:rt}),nt=new Map,ct=(ht=Y,(e,...t)=>{const i=t.length;let a,l;const r=[],s=[];let o,n=0,c=!1;for(;n<i;){for(o=e[n];n<i&&void 0!==(l=t[n],a=st(l));)o+=a+e[++n],c=!0;n!==i&&s.push(l),r.push(o),n++}if(n===i&&r.push(e[i]),c){const i=r.join("$$lit$$");void 0===(e=nt.get(i))&&(r.raw=r,nt.set(i,e=r)),t=s}return ht(e,...t)});var ht,dt,vt,gt=xe`:host{--btn-font-weight:var(--sgds-font-weight-regular);--btn-color:var(--sgds-color-fixed-light);--btn-bg:var(--sgds-primary-surface-default);--btn-hover-bg:var(--sgds-primary-surface-emphasis);--btn-border-radius:var(--sgds-border-radius-md);--btn-opacity:var(--sgds-opacity-100,1)}:host([variant=danger]){--btn-bg:var(--sgds-danger-surface-default);--btn-hover-bg:var(--sgds-danger-surface-emphasis);--btn-color:var(--sgds-color-fixed-light)}:host([variant=primary][tone=brand]){--btn-bg:var(--sgds-primary-surface-default);--btn-color:var(--sgds-color-fixed-light)}:host([variant=outline]){--btn-border-width:var(--sgds-border-width-1)}:host([variant=outline][tone=brand]){--btn-border-color:var(--sgds-primary-border-color-default);--btn-bg:var(--sgds-bg-transparent);--btn-color:var(--sgds-primary-color-default);--btn-hover-bg:var(--sgds-primary-bg-translucent)}:host([variant=ghost][tone=brand]){--btn-bg:var(--sgds-bg-transparent);--btn-hover-bg:var(--sgds-primary-surface-translucent);--btn-color:var(--sgds-primary-color-default)}:host([variant=primary][tone=danger]){--btn-bg:var(--sgds-danger-surface-default);--btn-hover-bg:var(--sgds-danger-surface-emphasis);--btn-color:var(--sgds-color-fixed-light)}:host([variant=outline][tone=danger]){--btn-border-color:var(--sgds-danger-border-color-default);--btn-bg:var(--sgds-bg-transparent);--btn-hover-bg:var(--sgds-danger-surface-translucent);--btn-color:var(--sgds-danger-color-default)}:host([variant=ghost][tone=danger]){--btn-bg:var(--sgds-bg-transparent);--btn-hover-bg:var(--sgds-danger-surface-translucent);--btn-color:var(--sgds-danger-color-default)}:host([variant=primary][tone=fixed-light]){--btn-bg:var(--sgds-surface-fixed-light);--btn-hover-bg:linear-gradient(0deg,var(--sgds-bg-translucent-fixed-dark,hsla(0,0%,5%,.2)) 0%,var(--sgds-bg-translucent-fixed-dark,hsla(0,0%,5%,.2)) 100%),var(--sgds-surface-fixed-light,#fff);--btn-color:var(--sgds-color-fixed-dark)}:host([variant=outline][tone=fixed-light]){--btn-border-color:var(--sgds-border-color-fixed-light);--btn-bg:var(--sgds-bg-transparent);--btn-hover-bg:linear-gradient(0deg,var(--sgds-bg-translucent-fixed-dark) 0%,var(--sgds-bg-translucent-fixed-dark) 100%),var(--sgds-bg-transparent);--btn-color:var(--sgds-color-fixed-light)}:host([variant=ghost][tone=fixed-light]){--btn-bg:var(--sgds-bg-transparent);--btn-hover-bg:linear-gradient(0deg,var(--sgds-bg-translucent-fixed-dark) 0%,var(--sgds-bg-translucent-fixed-dark) 100%),var(--sgds-bg-transparent);--btn-color:var(--sgds-color-fixed-light)}:host([variant=primary][tone=neutral]){--btn-bg:var(--sgds-surface-inverse);--btn-hover-bg:linear-gradient(0deg,var(--sgds-bg-translucent-inverse) 0%,var(--sgds-bg-translucent-inverse) 100%),var(--sgds-surface-inverse);--btn-color:var(--sgds-color-inverse)}:host([variant=outline][tone=neutral]){--btn-border-color:var(--sgds-border-color-emphasis);--btn-bg:var(--sgds-bg-transparent);--btn-hover-bg:linear-gradient(0deg,var(--sgds-bg-translucent-inverse) 0%,var(--sgds-bg-translucent-inverse) 100%),var(--sgds-bg-translucent-subtle);--btn-color:var(--sgds-color-default)}:host([variant=ghost][tone=neutral]){--btn-bg:var(--sgds-bg-transparent);--btn-hover-bg:var(--sgds-bg-translucent-subtle);--btn-color:var(--sgds-color-default)}:host([variant=ghost]) .btn,:host([variant=outline]) .btn,:host([variant=primary]) .btn{color:var(--btn-color)}:host([variant=outline]) .btn{border:var(--btn-border-width) solid var(--btn-border-color)}:host([size=lg]) .btn{font-size:var(--sgds-font-size-3);height:var(--sgds-dimension-56);line-height:var(--sgds-line-height-32);min-width:var(--sgds-dimension-112);padding:var(--sgds-padding-none) var(--sgds-padding-xl)}:host([size=sm]) .btn{font-size:var(--sgds-font-size-1);height:var(--sgds-dimension-40);line-height:var(--sgds-line-height-20);min-width:var(--sgds-dimension-80);padding:var(--sgds-padding-none) var(--sgds-padding-md)}:host([size=xs]) .btn{font-size:var(--sgds-font-size-1);height:var(--sgds-dimension-32);line-height:var(--sgds-line-height-16);min-width:var(--sgds-dimension-64);padding:var(--sgds-padding-none) var(--sgds-padding-sm)}.btn{align-items:center;background-color:var(--btn-bg);border:1px solid var(--sgds-border-color-transparent);border-radius:var(--btn-border-radius);color:var(--sgds-color-fixed-light);cursor:pointer;display:inline-flex;font-size:var(--sgds-font-size-2);font-weight:var(--btn-font-weight);gap:var(--sgds-gap-2-xs);height:var(--sgds-dimension-48);justify-content:center;line-height:var(--sgds-line-height-24);min-width:var(--sgds-dimension-96);opacity:var(--btn-opacity);padding:var(--sgds-padding-none) var(--sgds-padding-lg);text-align:center;text-decoration:none;transition:color .15s ease-in-out,background-color .15s ease-in-out,border-color .15s ease-in-out,box-shadow .15s ease-in-out;user-select:none;vertical-align:middle;white-space:nowrap;width:inherit}@media (prefers-reduced-motion:reduce){.btn{transition:none}}.btn.active,.btn:hover{background:var(--btn-hover-bg)}.btn:focus,.btn:focus-visible{background:var(--btn-hover-bg);border-color:transparent;outline:var(--sgds-outline-focus);outline-offset:var(--sgds-outline-offset-focus)}.btn.disabled,.btn:disabled{color:var(--btn-color);cursor:not-allowed;opacity:var(--sgds-opacity-40)}.btn.loading{cursor:default}.btn slot::slotted(*){color:var(--btn-color)}`;class pt extends Qe{constructor(){super(...arguments),this.variant="primary",this.tone="brand",this.size="md",this.active=!1,this.disabled=!1,this.target="_self"}focus(e){this.button.focus(e)}click(){this.button.click()}blur(){this.button.blur()}_handleBlur(){this.emit("sgds-blur")}_handleFocus(){this.emit("sgds-focus")}_handleClick(e){if(this.disabled||this.loading)return e.preventDefault(),void e.stopPropagation()}_handleKeydown(e){if("Enter"===e.key&&this.loading)return e.preventDefault(),void e.stopPropagation()}_assignSpinnerSize(e){return"xs"===e||"sm"===e?"xs":"md"===e||"lg"===e?"sm":void 0}_assignSpinnerTone(e,t){return"fixed-light"===e&&"primary"===t?"fixed-dark":"neutral"===e&&"primary"===t?"inverse":"fixed-light"===e||"primary"===t?"fixed-light":"neutral"!==e||"outline"!==t&&"ghost"!==t?"brand":"neutral"}}pt.styles=[...Qe.styles,gt],e([(dt=".btn",(e,t,i)=>{const a=e=>{const i=e.renderRoot?.querySelector(dt)??null;if(null===i&&vt&&!e.hasUpdated){const e="object"==typeof t?t.name:t;Xe("",`@query'd field ${JSON.stringify(String(e))} with the 'cache' flag set for selector '${dt}' has been accessed before the first update and returned null. This is expected if the renderRoot tree has not been provided beforehand (e.g. via Declarative Shadow DOM). Therefore the value hasn't been cached.`)}return i};if(vt){const{get:l,set:r}="object"==typeof t?e:i??(()=>{const e=Symbol(`${String(t)} (@query() cache)`);return{get(){return this[e]},set(t){this[e]=t}}})();return Ge(e,t,{get(){let e=l.call(this);return void 0===e&&(e=a(this),(null!==e||this.hasUpdated)&&r.call(this,e)),e}})}return Ge(e,t,{get(){return a(this)}})})],pt.prototype,"button",void 0),e([Ke({reflect:!0})],pt.prototype,"variant",void 0),e([Ke({reflect:!0})],pt.prototype,"tone",void 0),e([Ke({reflect:!0})],pt.prototype,"size",void 0),e([Ke({type:Boolean,reflect:!0})],pt.prototype,"active",void 0),e([Ke({type:Boolean,reflect:!0})],pt.prototype,"disabled",void 0),e([Ke({type:String,reflect:!0})],pt.prototype,"href",void 0),e([Ke({type:String,reflect:!0})],pt.prototype,"target",void 0),e([Ke({type:String,reflect:!0})],pt.prototype,"download",void 0),e([Ke({type:String})],pt.prototype,"ariaLabel",void 0),e([Ke({type:Boolean})],pt.prototype,"loading",void 0);class ut{constructor(e,...t){this.slotNames=[],(this.host=e).addController(this),this.slotNames=t,this.handleSlotChange=this.handleSlotChange.bind(this)}hasDefaultSlot(){return[...this.host.childNodes].some((e=>{var t;if(e.nodeType===e.TEXT_NODE&&""!==(null===(t=e.textContent)||void 0===t?void 0:t.trim()))return!0;if(e.nodeType===e.ELEMENT_NODE){const t=e;if("sl-visually-hidden"===t.tagName.toLowerCase())return!1;if(!t.hasAttribute("slot"))return!0}return!1}))}hasNamedSlot(e){return null!==this.host.querySelector(`:scope > [slot="${e}"]`)}test(e){return"[default]"===e?this.hasDefaultSlot():this.hasNamedSlot(e)}hostConnected(){var e;null===(e=this.host.shadowRoot)||void 0===e||e.addEventListener("slotchange",this.handleSlotChange)}hostDisconnected(){var e;null===(e=this.host.shadowRoot)||void 0===e||e.removeEventListener("slotchange",this.handleSlotChange)}handleSlotChange(e){const t=e.target;(this.slotNames.includes("[default]")&&!t.name||t.name&&this.slotNames.includes(t.name))&&this.host.requestUpdate()}}class wt{constructor(e,t){(this.host=e).addController(this),this.options=Object.assign({form:e=>e.closest("form")},t)}hostConnected(){this.form=this.options.form(this.host)}hostDisconnected(){this.form&&(this.form=void 0)}doAction(e,t){if(this.form){const i=document.createElement("button");i.type=e,i.style.position="absolute",i.style.width="0",i.style.height="0",i.style.clipPath="inset(50%)",i.style.overflow="hidden",i.style.whiteSpace="nowrap",t&&["formaction","formmethod","formnovalidate","formtarget"].forEach((e=>{t.hasAttribute(e)&&i.setAttribute(e,t.getAttribute(e))})),this.form.append(i),i.click(),i.remove()}}reset(e){this.doAction("reset",e)}submit(e){this.doAction("submit",e)}}var ft=xe`::slotted(a[target=_blank]:after),a[target=_blank]:after{background-color:currentColor;content:"/";display:inline-block;margin:0 .125rem;-webkit-mask-image:url("data:image/svg+xml;charset=utf-8,%3Csvg xmlns='http://www.w3.org/2000/svg' width='24' height='24' fill='none'%3E%3Cpath fill-rule='evenodd' clip-rule='evenodd' d='M9.274 3.9H9.3a.6.6 0 0 1 0 1.2c-.85 0-1.451 0-1.922.039-.463.038-.745.11-.968.223A2.4 2.4 0 0 0 5.361 6.41c-.113.223-.184.505-.222.968-.039.47-.04 1.072-.04 1.922v5.4c0 .85.001 1.451.04 1.922.038.463.11.745.222.968a2.4 2.4 0 0 0 1.05 1.048c.222.114.504.185.967.223.47.038 1.072.039 1.922.039h5.4c.85 0 1.451 0 1.921-.039.464-.038.746-.11.969-.223a2.4 2.4 0 0 0 1.048-1.048c.113-.223.185-.505.223-.968.038-.47.039-1.072.039-1.922a.6.6 0 1 1 1.2 0v.026c0 .818 0 1.469-.043 1.993-.044.538-.136.996-.35 1.415a3.6 3.6 0 0 1-1.573 1.574c-.42.213-.878.305-1.415.35-.525.042-1.175.042-1.993.042H9.274c-.818 0-1.469 0-1.993-.043-.538-.044-.996-.136-1.415-.35a3.6 3.6 0 0 1-1.574-1.573c-.213-.42-.305-.877-.35-1.415-.042-.524-.042-1.175-.042-1.993V9.274c0-.818 0-1.468.043-1.993.044-.538.136-.996.35-1.415a3.6 3.6 0 0 1 1.573-1.574c.42-.213.877-.305 1.415-.35C7.805 3.9 8.456 3.9 9.274 3.9Zm3.626.6a.6.6 0 0 1 .6-.6h6a.6.6 0 0 1 .6.6v6a.6.6 0 1 1-1.2 0V5.949l-5.976 5.975a.6.6 0 0 1-.848-.848L18.05 5.1H13.5a.6.6 0 0 1-.6-.6Z' fill='%230E0E0E'/%3E%3C/svg%3E");mask-image:url("data:image/svg+xml;charset=utf-8,%3Csvg xmlns='http://www.w3.org/2000/svg' width='24' height='24' fill='none'%3E%3Cpath fill-rule='evenodd' clip-rule='evenodd' d='M9.274 3.9H9.3a.6.6 0 0 1 0 1.2c-.85 0-1.451 0-1.922.039-.463.038-.745.11-.968.223A2.4 2.4 0 0 0 5.361 6.41c-.113.223-.184.505-.222.968-.039.47-.04 1.072-.04 1.922v5.4c0 .85.001 1.451.04 1.922.038.463.11.745.222.968a2.4 2.4 0 0 0 1.05 1.048c.222.114.504.185.967.223.47.038 1.072.039 1.922.039h5.4c.85 0 1.451 0 1.921-.039.464-.038.746-.11.969-.223a2.4 2.4 0 0 0 1.048-1.048c.113-.223.185-.505.223-.968.038-.47.039-1.072.039-1.922a.6.6 0 1 1 1.2 0v.026c0 .818 0 1.469-.043 1.993-.044.538-.136.996-.35 1.415a3.6 3.6 0 0 1-1.573 1.574c-.42.213-.878.305-1.415.35-.525.042-1.175.042-1.993.042H9.274c-.818 0-1.469 0-1.993-.043-.538-.044-.996-.136-1.415-.35a3.6 3.6 0 0 1-1.574-1.573c-.213-.42-.305-.877-.35-1.415-.042-.524-.042-1.175-.042-1.993V9.274c0-.818 0-1.468.043-1.993.044-.538.136-.996.35-1.415a3.6 3.6 0 0 1 1.573-1.574c.42-.213.877-.305 1.415-.35C7.805 3.9 8.456 3.9 9.274 3.9Zm3.626.6a.6.6 0 0 1 .6-.6h6a.6.6 0 0 1 .6.6v6a.6.6 0 1 1-1.2 0V5.949l-5.976 5.975a.6.6 0 0 1-.848-.848L18.05 5.1H13.5a.6.6 0 0 1-.6-.6Z' fill='%230E0E0E'/%3E%3C/svg%3E");-webkit-mask-position:center;mask-position:center;-webkit-mask-repeat:no-repeat;mask-repeat:no-repeat;mask-size:73%;-webkit-mask-size:73%;padding:0 .45em}`,mt=xe`:host{display:inline-block}:host([fullWidth]),:host([fullWidth]) .btn{width:100%}:host([fullWidth]) .btn.has-left-icon{justify-content:flex-start}:host([fullWidth]) .btn.has-right-icon{justify-content:space-between}:host([fullWidth]) .btn.has-left-icon.has-right-icon{justify-content:center}.btn span{padding:0 var(--sgds-padding-2-xs)}.btn.no-icon{gap:var(--sgds-gap-none)}.loading{cursor:default}`;class bt extends pt{constructor(){super(...arguments),this.formSubmitController=new wt(this,{form:e=>{if(e.hasAttribute("form")){const t=e.getRootNode(),i=e.getAttribute("form");return t.getElementById(i)}return e.closest("form")}}),this.type="button",this.fullWidth=!1,this.hasLeftIconSlot=!1,this.hasRightIconSlot=!1,this.hasSlotController=new ut(this,"leftIcon","rightIcon"),this._clickHandler=()=>{"submit"===this.type&&this.formSubmitController.submit(this),"reset"===this.type&&this.formSubmitController.reset(this)}}updated(){this.hasLeftIconSlot||(this.hasLeftIconSlot=this.hasSlotController.test("leftIcon")),this.hasRightIconSlot||(this.hasRightIconSlot=this.hasSlotController.test("rightIcon"))}_handleClick(e){if(this.disabled||this.loading)return e.preventDefault(),void e.stopPropagation();this.removeEventListener("click",this._clickHandler),this.addEventListener("click",this._clickHandler)}render(){const e=this.href,t=e?ot`a`:ot`button`,i=!this.hasLeftIconSlot&&!this.hasRightIconSlot;return ct`
+   */,rt=Symbol.for(""),st=e=>{if(e?.r===rt)return e?._$litStatic$},ot=(e,...t)=>({_$litStatic$:t.reduce(((t,i,a)=>t+(e=>{if(void 0!==e._$litStatic$)return e._$litStatic$;throw new Error(`Value passed to 'literal' function must be a 'literal' result: ${e}. Use 'unsafeStatic' to pass non-literal values, but\n            take care to ensure page security.`)})(i)+e[a+1]),e[0]),r:rt}),nt=new Map,ct=(ht=Y,(e,...t)=>{const i=t.length;let a,l;const r=[],s=[];let o,n=0,c=!1;for(;n<i;){for(o=e[n];n<i&&void 0!==(l=t[n],a=st(l));)o+=a+e[++n],c=!0;n!==i&&s.push(l),r.push(o),n++}if(n===i&&r.push(e[i]),c){const i=r.join("$$lit$$");void 0===(e=nt.get(i))&&(r.raw=r,nt.set(i,e=r)),t=s}return ht(e,...t)});var ht,dt,vt,gt=xe`:host{--btn-font-weight:var(--sgds-font-weight-regular);--btn-color:var(--sgds-color-fixed-light);--btn-bg:var(--sgds-primary-surface-default);--btn-hover-bg:var(--sgds-primary-surface-emphasis);--btn-border-radius:var(--sgds-border-radius-md);--btn-opacity:var(--sgds-opacity-100,1)}:host([variant=danger]){--btn-bg:var(--sgds-danger-surface-default);--btn-hover-bg:var(--sgds-danger-surface-emphasis);--btn-color:var(--sgds-color-fixed-light)}:host([variant=primary][tone=brand]){--btn-bg:var(--sgds-primary-surface-default);--btn-color:var(--sgds-color-fixed-light)}:host([variant=outline]){--btn-border-width:var(--sgds-border-width-1)}:host([variant=outline][tone=brand]){--btn-border-color:var(--sgds-primary-border-color-default);--btn-bg:var(--sgds-bg-transparent);--btn-color:var(--sgds-primary-color-default);--btn-hover-bg:var(--sgds-primary-bg-translucent)}:host([variant=ghost][tone=brand]){--btn-bg:var(--sgds-bg-transparent);--btn-hover-bg:var(--sgds-primary-surface-translucent);--btn-color:var(--sgds-primary-color-default)}:host([variant=primary][tone=danger]){--btn-bg:var(--sgds-danger-surface-default);--btn-hover-bg:var(--sgds-danger-surface-emphasis);--btn-color:var(--sgds-color-fixed-light)}:host([variant=outline][tone=danger]){--btn-border-color:var(--sgds-danger-border-color-default);--btn-bg:var(--sgds-bg-transparent);--btn-hover-bg:var(--sgds-danger-surface-translucent);--btn-color:var(--sgds-danger-color-default)}:host([variant=ghost][tone=danger]){--btn-bg:var(--sgds-bg-transparent);--btn-hover-bg:var(--sgds-danger-surface-translucent);--btn-color:var(--sgds-danger-color-default)}:host([variant=primary][tone=fixed-light]){--btn-bg:var(--sgds-surface-fixed-light);--btn-hover-bg:linear-gradient(0deg,var(--sgds-bg-translucent-fixed-dark,hsla(0,0%,5%,.2)) 0%,var(--sgds-bg-translucent-fixed-dark,hsla(0,0%,5%,.2)) 100%),var(--sgds-surface-fixed-light,#fff);--btn-color:var(--sgds-color-fixed-dark)}:host([variant=outline][tone=fixed-light]){--btn-border-color:var(--sgds-border-color-fixed-light);--btn-bg:var(--sgds-bg-transparent);--btn-hover-bg:linear-gradient(0deg,var(--sgds-bg-translucent-fixed-dark) 0%,var(--sgds-bg-translucent-fixed-dark) 100%),var(--sgds-bg-transparent);--btn-color:var(--sgds-color-fixed-light)}:host([variant=ghost][tone=fixed-light]){--btn-bg:var(--sgds-bg-transparent);--btn-hover-bg:linear-gradient(0deg,var(--sgds-bg-translucent-fixed-dark) 0%,var(--sgds-bg-translucent-fixed-dark) 100%),var(--sgds-bg-transparent);--btn-color:var(--sgds-color-fixed-light)}:host([variant=primary][tone=neutral]){--btn-bg:var(--sgds-surface-inverse);--btn-hover-bg:linear-gradient(0deg,var(--sgds-bg-translucent-inverse) 0%,var(--sgds-bg-translucent-inverse) 100%),var(--sgds-surface-inverse);--btn-color:var(--sgds-color-inverse)}:host([variant=outline][tone=neutral]){--btn-border-color:var(--sgds-border-color-emphasis);--btn-bg:var(--sgds-bg-transparent);--btn-hover-bg:linear-gradient(0deg,var(--sgds-bg-translucent-inverse) 0%,var(--sgds-bg-translucent-inverse) 100%),var(--sgds-bg-translucent-subtle);--btn-color:var(--sgds-color-default)}:host([variant=ghost][tone=neutral]){--btn-bg:var(--sgds-bg-transparent);--btn-hover-bg:var(--sgds-bg-translucent-subtle);--btn-color:var(--sgds-color-default)}:host([variant=ghost]) .btn,:host([variant=outline]) .btn,:host([variant=primary]) .btn{color:var(--btn-color)}:host([variant=outline]) .btn{border:var(--btn-border-width) solid var(--btn-border-color)}:host([size=lg]) .btn{font-size:var(--sgds-font-size-3);height:var(--sgds-dimension-56);line-height:var(--sgds-line-height-32);min-width:var(--sgds-dimension-112);padding:var(--sgds-padding-none) var(--sgds-padding-xl)}:host([size=sm]) .btn{font-size:var(--sgds-font-size-1);height:var(--sgds-dimension-40);line-height:var(--sgds-line-height-20);min-width:var(--sgds-dimension-80);padding:var(--sgds-padding-none) var(--sgds-padding-md)}:host([size=xs]) .btn{font-size:var(--sgds-font-size-0);height:var(--sgds-dimension-32);line-height:var(--sgds-line-height-16);min-width:var(--sgds-dimension-64);padding:var(--sgds-padding-none) var(--sgds-padding-sm)}.btn{align-items:center;background-color:var(--btn-bg);border:1px solid var(--sgds-border-color-transparent);border-radius:var(--btn-border-radius);color:var(--sgds-color-fixed-light);cursor:pointer;display:inline-flex;font-size:var(--sgds-font-size-2);font-weight:var(--btn-font-weight);gap:var(--sgds-gap-2-xs);height:var(--sgds-dimension-48);justify-content:center;line-height:var(--sgds-line-height-24);min-width:var(--sgds-dimension-96);opacity:var(--btn-opacity);padding:var(--sgds-padding-none) var(--sgds-padding-lg);text-align:center;text-decoration:none;transition:color .15s ease-in-out,background-color .15s ease-in-out,border-color .15s ease-in-out,box-shadow .15s ease-in-out;user-select:none;vertical-align:middle;white-space:nowrap;width:inherit}@media (prefers-reduced-motion:reduce){.btn{transition:none}}.btn.active,.btn:hover{background:var(--btn-hover-bg)}.btn:focus,.btn:focus-visible{background:var(--btn-hover-bg);border-color:transparent;outline:var(--sgds-outline-focus);outline-offset:var(--sgds-outline-offset-focus)}.btn.disabled,.btn:disabled{color:var(--btn-color);cursor:not-allowed;opacity:var(--sgds-opacity-40)}.btn.loading{cursor:default}.btn slot::slotted(*){color:var(--btn-color)}`;class pt extends Qe{constructor(){super(...arguments),this.variant="primary",this.tone="brand",this.size="md",this.active=!1,this.disabled=!1,this.target="_self"}focus(e){this.button.focus(e)}click(){this.button.click()}blur(){this.button.blur()}_handleBlur(){this.emit("sgds-blur")}_handleFocus(){this.emit("sgds-focus")}_handleClick(e){if(this.disabled||this.loading)return e.preventDefault(),void e.stopPropagation()}_handleKeydown(e){if("Enter"===e.key&&this.loading)return e.preventDefault(),void e.stopPropagation()}_assignSpinnerSize(e){return"xs"===e||"sm"===e?"xs":"md"===e||"lg"===e?"sm":void 0}_assignSpinnerTone(e,t){return"fixed-light"===e&&"primary"===t?"fixed-dark":"neutral"===e&&"primary"===t?"inverse":"fixed-light"===e||"primary"===t?"fixed-light":"neutral"!==e||"outline"!==t&&"ghost"!==t?"brand":"neutral"}}pt.styles=[...Qe.styles,gt],e([(dt=".btn",(e,t,i)=>{const a=e=>{const i=e.renderRoot?.querySelector(dt)??null;if(null===i&&vt&&!e.hasUpdated){const e="object"==typeof t?t.name:t;Xe("",`@query'd field ${JSON.stringify(String(e))} with the 'cache' flag set for selector '${dt}' has been accessed before the first update and returned null. This is expected if the renderRoot tree has not been provided beforehand (e.g. via Declarative Shadow DOM). Therefore the value hasn't been cached.`)}return i};if(vt){const{get:l,set:r}="object"==typeof t?e:i??(()=>{const e=Symbol(`${String(t)} (@query() cache)`);return{get(){return this[e]},set(t){this[e]=t}}})();return Ge(e,t,{get(){let e=l.call(this);return void 0===e&&(e=a(this),(null!==e||this.hasUpdated)&&r.call(this,e)),e}})}return Ge(e,t,{get(){return a(this)}})})],pt.prototype,"button",void 0),e([Ke({reflect:!0})],pt.prototype,"variant",void 0),e([Ke({reflect:!0})],pt.prototype,"tone",void 0),e([Ke({reflect:!0})],pt.prototype,"size",void 0),e([Ke({type:Boolean,reflect:!0})],pt.prototype,"active",void 0),e([Ke({type:Boolean,reflect:!0})],pt.prototype,"disabled",void 0),e([Ke({type:String,reflect:!0})],pt.prototype,"href",void 0),e([Ke({type:String,reflect:!0})],pt.prototype,"target",void 0),e([Ke({type:String,reflect:!0})],pt.prototype,"download",void 0),e([Ke({type:String})],pt.prototype,"ariaLabel",void 0),e([Ke({type:Boolean})],pt.prototype,"loading",void 0);class ut{constructor(e,...t){this.slotNames=[],(this.host=e).addController(this),this.slotNames=t,this.handleSlotChange=this.handleSlotChange.bind(this)}hasDefaultSlot(){return[...this.host.childNodes].some((e=>{var t;if(e.nodeType===e.TEXT_NODE&&""!==(null===(t=e.textContent)||void 0===t?void 0:t.trim()))return!0;if(e.nodeType===e.ELEMENT_NODE){const t=e;if("sl-visually-hidden"===t.tagName.toLowerCase())return!1;if(!t.hasAttribute("slot"))return!0}return!1}))}hasNamedSlot(e){return null!==this.host.querySelector(`:scope > [slot="${e}"]`)}test(e){return"[default]"===e?this.hasDefaultSlot():this.hasNamedSlot(e)}hostConnected(){var e;null===(e=this.host.shadowRoot)||void 0===e||e.addEventListener("slotchange",this.handleSlotChange)}hostDisconnected(){var e;null===(e=this.host.shadowRoot)||void 0===e||e.removeEventListener("slotchange",this.handleSlotChange)}handleSlotChange(e){const t=e.target;(this.slotNames.includes("[default]")&&!t.name||t.name&&this.slotNames.includes(t.name))&&this.host.requestUpdate()}}class wt{constructor(e,t){(this.host=e).addController(this),this.options=Object.assign({form:e=>e.closest("form")},t)}hostConnected(){this.form=this.options.form(this.host)}hostDisconnected(){this.form&&(this.form=void 0)}doAction(e,t){if(this.form){const i=document.createElement("button");i.type=e,i.style.position="absolute",i.style.width="0",i.style.height="0",i.style.clipPath="inset(50%)",i.style.overflow="hidden",i.style.whiteSpace="nowrap",t&&["formaction","formmethod","formnovalidate","formtarget"].forEach((e=>{t.hasAttribute(e)&&i.setAttribute(e,t.getAttribute(e))})),this.form.append(i),i.click(),i.remove()}}reset(e){this.doAction("reset",e)}submit(e){this.doAction("submit",e)}}var ft=xe`::slotted(a[target=_blank]:after),a[target=_blank]:after{background-color:currentColor;content:"/";display:inline-block;margin:0 .125rem;-webkit-mask-image:url("data:image/svg+xml;charset=utf-8,%3Csvg xmlns='http://www.w3.org/2000/svg' width='24' height='24' fill='none'%3E%3Cpath fill-rule='evenodd' clip-rule='evenodd' d='M9.274 3.9H9.3a.6.6 0 0 1 0 1.2c-.85 0-1.451 0-1.922.039-.463.038-.745.11-.968.223A2.4 2.4 0 0 0 5.361 6.41c-.113.223-.184.505-.222.968-.039.47-.04 1.072-.04 1.922v5.4c0 .85.001 1.451.04 1.922.038.463.11.745.222.968a2.4 2.4 0 0 0 1.05 1.048c.222.114.504.185.967.223.47.038 1.072.039 1.922.039h5.4c.85 0 1.451 0 1.921-.039.464-.038.746-.11.969-.223a2.4 2.4 0 0 0 1.048-1.048c.113-.223.185-.505.223-.968.038-.47.039-1.072.039-1.922a.6.6 0 1 1 1.2 0v.026c0 .818 0 1.469-.043 1.993-.044.538-.136.996-.35 1.415a3.6 3.6 0 0 1-1.573 1.574c-.42.213-.878.305-1.415.35-.525.042-1.175.042-1.993.042H9.274c-.818 0-1.469 0-1.993-.043-.538-.044-.996-.136-1.415-.35a3.6 3.6 0 0 1-1.574-1.573c-.213-.42-.305-.877-.35-1.415-.042-.524-.042-1.175-.042-1.993V9.274c0-.818 0-1.468.043-1.993.044-.538.136-.996.35-1.415a3.6 3.6 0 0 1 1.573-1.574c.42-.213.877-.305 1.415-.35C7.805 3.9 8.456 3.9 9.274 3.9Zm3.626.6a.6.6 0 0 1 .6-.6h6a.6.6 0 0 1 .6.6v6a.6.6 0 1 1-1.2 0V5.949l-5.976 5.975a.6.6 0 0 1-.848-.848L18.05 5.1H13.5a.6.6 0 0 1-.6-.6Z' fill='%230E0E0E'/%3E%3C/svg%3E");mask-image:url("data:image/svg+xml;charset=utf-8,%3Csvg xmlns='http://www.w3.org/2000/svg' width='24' height='24' fill='none'%3E%3Cpath fill-rule='evenodd' clip-rule='evenodd' d='M9.274 3.9H9.3a.6.6 0 0 1 0 1.2c-.85 0-1.451 0-1.922.039-.463.038-.745.11-.968.223A2.4 2.4 0 0 0 5.361 6.41c-.113.223-.184.505-.222.968-.039.47-.04 1.072-.04 1.922v5.4c0 .85.001 1.451.04 1.922.038.463.11.745.222.968a2.4 2.4 0 0 0 1.05 1.048c.222.114.504.185.967.223.47.038 1.072.039 1.922.039h5.4c.85 0 1.451 0 1.921-.039.464-.038.746-.11.969-.223a2.4 2.4 0 0 0 1.048-1.048c.113-.223.185-.505.223-.968.038-.47.039-1.072.039-1.922a.6.6 0 1 1 1.2 0v.026c0 .818 0 1.469-.043 1.993-.044.538-.136.996-.35 1.415a3.6 3.6 0 0 1-1.573 1.574c-.42.213-.878.305-1.415.35-.525.042-1.175.042-1.993.042H9.274c-.818 0-1.469 0-1.993-.043-.538-.044-.996-.136-1.415-.35a3.6 3.6 0 0 1-1.574-1.573c-.213-.42-.305-.877-.35-1.415-.042-.524-.042-1.175-.042-1.993V9.274c0-.818 0-1.468.043-1.993.044-.538.136-.996.35-1.415a3.6 3.6 0 0 1 1.573-1.574c.42-.213.877-.305 1.415-.35C7.805 3.9 8.456 3.9 9.274 3.9Zm3.626.6a.6.6 0 0 1 .6-.6h6a.6.6 0 0 1 .6.6v6a.6.6 0 1 1-1.2 0V5.949l-5.976 5.975a.6.6 0 0 1-.848-.848L18.05 5.1H13.5a.6.6 0 0 1-.6-.6Z' fill='%230E0E0E'/%3E%3C/svg%3E");-webkit-mask-position:center;mask-position:center;-webkit-mask-repeat:no-repeat;mask-repeat:no-repeat;mask-size:73%;-webkit-mask-size:73%;padding:0 .45em}`,mt=xe`:host{display:inline-block}:host([fullWidth]),:host([fullWidth]) .btn{width:100%}:host([fullWidth]) .btn.has-left-icon{justify-content:flex-start}:host([fullWidth]) .btn.has-right-icon{justify-content:space-between}:host([fullWidth]) .btn.has-left-icon.has-right-icon{justify-content:center}.btn span{padding:0 var(--sgds-padding-2-xs)}.btn.no-icon{gap:var(--sgds-gap-none)}.loading{cursor:default}`;class bt extends pt{constructor(){super(...arguments),this.formSubmitController=new wt(this,{form:e=>{if(e.hasAttribute("form")){const t=e.getRootNode(),i=e.getAttribute("form");return t.getElementById(i)}return e.closest("form")}}),this.type="button",this.fullWidth=!1,this.hasLeftIconSlot=!1,this.hasRightIconSlot=!1,this.hasSlotController=new ut(this,"leftIcon","rightIcon"),this._clickHandler=()=>{"submit"===this.type&&this.formSubmitController.submit(this),"reset"===this.type&&this.formSubmitController.reset(this)}}updated(){this.hasLeftIconSlot||(this.hasLeftIconSlot=this.hasSlotController.test("leftIcon")),this.hasRightIconSlot||(this.hasRightIconSlot=this.hasSlotController.test("rightIcon"))}_handleClick(e){if(this.disabled||this.loading)return e.preventDefault(),void e.stopPropagation();this.removeEventListener("click",this._clickHandler),this.addEventListener("click",this._clickHandler)}render(){const e=this.href,t=e?ot`a`:ot`button`,i=!this.hasLeftIconSlot&&!this.hasRightIconSlot;return ct`
       <${t}
         class="btn ${it({disabled:this.disabled,active:this.active,"has-left-icon":this.hasLeftIconSlot,"has-right-icon":this.hasRightIconSlot,"no-icon":i,loading:this.loading})}"
         ?disabled=${lt(e?void 0:this.disabled)}

package/components/QuantityToggle/index.umd.min.js

@@ -88,7 +88,7 @@ const Re=globalThis,De=Re.ShadowRoot&&(void 0===Re.ShadyCSS||Re.ShadyCSS.nativeS
    * @license
    * Copyright 2017 Google LLC
    * SPDX-License-Identifier: BSD-3-Clause
-   */;let vt;{const e=globalThis.litIssuedWarnings??=new Set;vt=(t,i)=>{i+=` See https://lit.dev/msg/${t} for more information.`,e.has(i)||(console.warn(i),e.add(i))}}class pt extends ht{constructor(){super(...arguments),this.renderOptions={host:this},this.__childPart=void 0}createRenderRoot(){const e=super.createRenderRoot();return this.renderOptions.renderBefore??=e.firstChild,e}update(e){const t=this.render();this.hasUpdated||(this.renderOptions.isConnected=this.isConnected),super.update(e),this.__childPart=Ve(t,this.renderRoot,this.renderOptions)}connectedCallback(){super.connectedCallback(),this.__childPart?.setConnected(!0)}disconnectedCallback(){super.disconnectedCallback(),this.__childPart?.setConnected(!1)}render(){return de}}var gt;pt._$litElement$=!0,pt[(gt="finalized",gt)]=!0,globalThis.litElementHydrateSupport?.({LitElement:pt});const ut=globalThis.litElementPolyfillSupportDevMode;ut?.({LitElement:pt}),(globalThis.litElementVersions??=[]).push("4.1.0"),globalThis.litElementVersions.length>1&&vt("multiple-versions","Multiple versions of Lit loaded. Loading multiple versions is not recommended.");var wt=je`.invalid-feedback-container{display:flex;gap:var(--sgds-form-gap-sm)}.invalid-feedback,.invalid-feedback-container{color:var(--sgds-form-danger-color-default);line-height:var(--sgds-line-height-20)}.invalid-feedback{font-size:var(--sgds-font-size-1);font-weight:var(--sgds-font-weight-regular)}.valid-icon{color:var(--sgds-form-success-color-default)}`,ft=je`.form-text{color:var(--sgds-form-color-subtle);font-size:var(--sgds-font-size-1);line-height:var(--sgds-line-height-20)}.form-text.disabled{opacity:var(--sgds-opacity-50)}`,mt=je`.form-label{color:var(--sgds-form-color-default);margin-bottom:0}.form-label.disabled{opacity:var(--sgds-opacity-50)}.form-check-label{color:var(--sgds-form-color-default)}.form-check-input:disabled~.form-check-label,.form-check-input[disabled]~.form-check-label{cursor:not-allowed}`,bt=je`.form-control::placeholder{color:var(--sgds-form-color-subtle);font-family:var(--sgds-font-family-brand);font-weight:var(--sgds-font-weight-light);line-height:var(--sgds-line-height-24)}`,yt=je`:host{-webkit-text-size-adjust:100%;-webkit-tap-highlight-color:rgba(0,0,0,0);color:var(--sgds-body-color-default);font-family:var(--sgds-font-family-brand);font-size:var(--sgds-font-size-2);font-weight:var(--sgds-font-weight-regular);line-height:var(--sgds-line-height-24);margin:0;*,:after,:before{-webkit-box-sizing:border-box;-moz-box-sizing:border-box;box-sizing:border-box}:disabled{cursor:not-allowed}@media (prefers-reduced-motion:no-preference){:root{scroll-behavior:smooth}}::slotted(a[target=_blank]):after,a[target=_blank]:after{background-color:currentColor;content:"/";display:inline-block;height:var(--sgds-icon-size-lg);margin-left:.25rem;-webkit-mask-image:url("data:image/svg+xml;charset=utf-8,%3Csvg xmlns='http://www.w3.org/2000/svg' width='24' height='24' fill='none'%3E%3Cpath fill-rule='evenodd' clip-rule='evenodd' d='M9.774 4.4H9.8a.6.6 0 1 1 0 1.2c-.85 0-1.451 0-1.922.039-.463.038-.745.11-.968.223A2.4 2.4 0 0 0 5.861 6.91c-.113.223-.184.505-.222.968-.039.47-.04 1.072-.04 1.922v4.4c0 .85.001 1.451.04 1.922.038.463.11.745.222.968a2.4 2.4 0 0 0 1.05 1.048c.222.114.504.185.967.223.47.038 1.072.039 1.922.039h4.4c.85 0 1.451 0 1.921-.039.464-.038.746-.11.969-.223a2.4 2.4 0 0 0 1.048-1.048c.113-.223.185-.505.223-.968.038-.47.039-1.072.039-1.922a.6.6 0 1 1 1.2 0v.026c0 .818 0 1.468-.043 1.993-.044.538-.136.996-.35 1.415a3.6 3.6 0 0 1-1.573 1.574c-.42.213-.878.305-1.415.35-.525.042-1.175.042-1.993.042H9.774c-.818 0-1.469 0-1.993-.043-.538-.044-.996-.136-1.415-.35a3.6 3.6 0 0 1-1.574-1.573c-.213-.42-.305-.877-.35-1.415-.042-.525-.042-1.175-.042-1.993V9.774c0-.818 0-1.468.043-1.993.044-.538.136-.996.35-1.415a3.6 3.6 0 0 1 1.573-1.574c.42-.213.877-.305 1.415-.35C8.305 4.4 8.956 4.4 9.774 4.4ZM12.4 5a.6.6 0 0 1 .6-.6h6a.6.6 0 0 1 .6.6v6a.6.6 0 1 1-1.2 0V6.449l-5.976 5.975a.6.6 0 0 1-.848-.848L17.55 5.6H13a.6.6 0 0 1-.6-.6Z' fill='%230E0E0E'/%3E%3C/svg%3E");mask-image:url("data:image/svg+xml;charset=utf-8,%3Csvg xmlns='http://www.w3.org/2000/svg' width='24' height='24' fill='none'%3E%3Cpath fill-rule='evenodd' clip-rule='evenodd' d='M9.774 4.4H9.8a.6.6 0 1 1 0 1.2c-.85 0-1.451 0-1.922.039-.463.038-.745.11-.968.223A2.4 2.4 0 0 0 5.861 6.91c-.113.223-.184.505-.222.968-.039.47-.04 1.072-.04 1.922v4.4c0 .85.001 1.451.04 1.922.038.463.11.745.222.968a2.4 2.4 0 0 0 1.05 1.048c.222.114.504.185.967.223.47.038 1.072.039 1.922.039h4.4c.85 0 1.451 0 1.921-.039.464-.038.746-.11.969-.223a2.4 2.4 0 0 0 1.048-1.048c.113-.223.185-.505.223-.968.038-.47.039-1.072.039-1.922a.6.6 0 1 1 1.2 0v.026c0 .818 0 1.468-.043 1.993-.044.538-.136.996-.35 1.415a3.6 3.6 0 0 1-1.573 1.574c-.42.213-.878.305-1.415.35-.525.042-1.175.042-1.993.042H9.774c-.818 0-1.469 0-1.993-.043-.538-.044-.996-.136-1.415-.35a3.6 3.6 0 0 1-1.574-1.573c-.213-.42-.305-.877-.35-1.415-.042-.525-.042-1.175-.042-1.993V9.774c0-.818 0-1.468.043-1.993.044-.538.136-.996.35-1.415a3.6 3.6 0 0 1 1.573-1.574c.42-.213.877-.305 1.415-.35C8.305 4.4 8.956 4.4 9.774 4.4ZM12.4 5a.6.6 0 0 1 .6-.6h6a.6.6 0 0 1 .6.6v6a.6.6 0 1 1-1.2 0V6.449l-5.976 5.975a.6.6 0 0 1-.848-.848L17.55 5.6H13a.6.6 0 0 1-.6-.6Z' fill='%230E0E0E'/%3E%3C/svg%3E");-webkit-mask-position:center;mask-position:center;-webkit-mask-repeat:no-repeat;mask-repeat:no-repeat;vertical-align:bottom;width:var(--sgds-icon-size-lg)}::slotted(svg){vertical-align:middle}}`;class xt extends pt{emit(e,t){const i=new CustomEvent(e,Object.assign({bubbles:!0,cancelable:!1,composed:!0,detail:{}},t));return this.dispatchEvent(i),i}static define(e,t=this,i={}){if(customElements.get(e));else try{customElements.define(e,t,i)}catch(a){customElements.define(e,class extends t{},i)}}constructor(){super(),this.ssr=Boolean(this.shadowRoot),Object.entries(this.constructor.dependencies).forEach((([e,t])=>{this.constructor.define(e,t)}))}firstUpdated(e){var t;super.firstUpdated(e),this.ssr&&(null===(t=this.shadowRoot)||void 0===t||t.querySelectorAll("slot").forEach((e=>{e.dispatchEvent(new Event("slotchange",{bubbles:!0,composed:!1,cancelable:!1}))})))}}function Ct(e="",t=""){return`id-${Math.random().toString().substring(2,6)}-sgds-${e}-${t}`}xt.styles=[yt],xt.dependencies={},e([H({type:Boolean,reflect:!0})],xt.prototype,"ssr",void 0);class Zt extends xt{constructor(){super(...arguments),this.label="",this.hintText="",this.disabled=!1,this.invalid=!1,this._controlId=Ct("input"),this._labelId=Ct("label")}setInvalid(e){this.invalid=e,e?this.emit("sgds-invalid"):this.emit("sgds-valid")}}Zt.styles=[...xt.styles,wt,ft,mt,bt],e([H({reflect:!0})],Zt.prototype,"label",void 0),e([H({reflect:!0})],Zt.prototype,"hintText",void 0),e([H({reflect:!0})],Zt.prototype,"name",void 0),e([H({type:Boolean,reflect:!0})],Zt.prototype,"disabled",void 0),e([H({type:Boolean,reflect:!0})],Zt.prototype,"invalid",void 0);var _t=je`svg{vertical-align:middle}`;const Mt=(e="value")=>(t,i)=>{const a=t.constructor,l=a.prototype.attributeChangedCallback;a.prototype.attributeChangedCallback=function(t,r,s){var o;const n=a.getPropertyOptions(e);if(t===("string"==typeof n.attribute?n.attribute:e).toLowerCase()){const t=n.converter||nt,a=("function"==typeof t?t:null!==(o=null==t?void 0:t.fromAttribute)&&void 0!==o?o:nt.fromAttribute)(s,n.type);this[e]!==a&&(this[i]=a)}l.call(this,t,r,s)}};class Vt{constructor(e,t){(this.host=e).addController(this),this._internals=this.host.attachInternals(),this.options=Object.assign({setInvalid:(e,t)=>{e.invalid=t},value:e=>e.value,input:e=>e.input},t)}hostConnected(){this.host.addEventListener("invalid",(e=>this.handleInvalid(e)))}hostDisconnected(){this.host.removeEventListener("invalid",(e=>this.handleInvalid(e)))}handleInvalid(e){e.preventDefault(),this.options.setInvalid(this.host,!0)}handleInput(e){const t=e.target;this.options.setInvalid(this.host,!1),this.validateInput(t)}handleChange(e){const t=e.target;this.validateInput(t),this.options.setInvalid(this.host,!this.checkValidity())}get form(){return this._internals.form}get validity(){return this._internals.validity}get validationMessage(){return this._internals.validationMessage}get willValidate(){return this._internals.willValidate}updateInvalidState(){this.options.setInvalid(this.host,!this.checkValidity())}resetValidity(){return this._internals.setValidity({})}checkValidity(){return this._internals.checkValidity()}reportValidity(){return this._internals.reportValidity()}setValidity(e,t,i){return this._internals.setValidity(e,t,i)}setFormValue(){const e=this.options.value(this.host);this._internals.setFormValue(e)}validateInput(e){if(this.options.input(this.host).disabled)return this._internals.setValidity({});const t=e.validity;if(t.valid)this._internals.setValidity({});else for(const i in t)t[i]&&(this.validationError=i.toString(),this._internals.setValidity({[this.validationError]:!0},e.validationMessage,e))}}const $t=t=>{class i extends t{constructor(){super(...arguments),this._isTouched=!1}connectedCallback(){var e;super.connectedCallback(),this._mixinShouldSkipSgdsValidation()||null!==(e=this.inputValidationController)&&void 0!==e||(this.inputValidationController=new Vt(this))}async firstUpdated(e){super.firstUpdated(e),this.input=this.shadowRoot.querySelector("input")||await this.sgdsInput||this.shadowRoot.querySelector("textarea")||await this.sgdsDatepickerInput,this._mixinShouldSkipSgdsValidation()||this._mixinValidate(this.input)}formResetCallback(){this._mixinResetFormControl?this._mixinResetFormControl():(this.value=this.defaultValue,this._mixinResetValidity(this.input)),this._mixinSetFormValue()}_mixinHandleChange(e){this._mixinSetFormValue(),this.inputValidationController.handleChange(e)}_mixinHandleInputChange(e){this._mixinSetFormValue(),this.inputValidationController.handleInput(e)}_mixinResetValidity(e){this.inputValidationController.resetValidity(),this.inputValidationController.updateInvalidState(),this.inputValidationController.validateInput(e),this._isTouched&&(this._isTouched=!1)}_mixinValidate(e){this.inputValidationController.validateInput(e)}_mixinSetFormValue(){this.inputValidationController.setFormValue()}_mixinCheckValidity(){return this.inputValidationController.checkValidity()}_mixinReportValidity(){return this.inputValidationController.reportValidity()}_mixinGetValidity(){return this.inputValidationController.validity}_mixinGetValidationMessage(){return this.inputValidationController.validationMessage}_mixinSetValidity(e,t,i){return this.inputValidationController.setValidity(e,t,i)}_mixinShouldSkipSgdsValidation(){const e=this.closest("form");return(null==e?void 0:e.noValidate)||this.noValidate}}return i.formAssociated=!0,e([L("sgds-input")],i.prototype,"sgdsInput",void 0),e([L("sgds-datepicker-input")],i.prototype,"sgdsDatepickerInput",void 0),i};var Ht=je`:host{--btn-font-weight:var(--sgds-font-weight-regular);--btn-color:var(--sgds-color-fixed-light);--btn-bg:var(--sgds-primary-surface-default);--btn-hover-bg:var(--sgds-primary-surface-emphasis);--btn-border-radius:var(--sgds-border-radius-md);--btn-opacity:var(--sgds-opacity-100,1)}:host([variant=danger]){--btn-bg:var(--sgds-danger-surface-default);--btn-hover-bg:var(--sgds-danger-surface-emphasis);--btn-color:var(--sgds-color-fixed-light)}:host([variant=primary][tone=brand]){--btn-bg:var(--sgds-primary-surface-default);--btn-color:var(--sgds-color-fixed-light)}:host([variant=outline]){--btn-border-width:var(--sgds-border-width-1)}:host([variant=outline][tone=brand]){--btn-border-color:var(--sgds-primary-border-color-default);--btn-bg:var(--sgds-bg-transparent);--btn-color:var(--sgds-primary-color-default);--btn-hover-bg:var(--sgds-primary-bg-translucent)}:host([variant=ghost][tone=brand]){--btn-bg:var(--sgds-bg-transparent);--btn-hover-bg:var(--sgds-primary-surface-translucent);--btn-color:var(--sgds-primary-color-default)}:host([variant=primary][tone=danger]){--btn-bg:var(--sgds-danger-surface-default);--btn-hover-bg:var(--sgds-danger-surface-emphasis);--btn-color:var(--sgds-color-fixed-light)}:host([variant=outline][tone=danger]){--btn-border-color:var(--sgds-danger-border-color-default);--btn-bg:var(--sgds-bg-transparent);--btn-hover-bg:var(--sgds-danger-surface-translucent);--btn-color:var(--sgds-danger-color-default)}:host([variant=ghost][tone=danger]){--btn-bg:var(--sgds-bg-transparent);--btn-hover-bg:var(--sgds-danger-surface-translucent);--btn-color:var(--sgds-danger-color-default)}:host([variant=primary][tone=fixed-light]){--btn-bg:var(--sgds-surface-fixed-light);--btn-hover-bg:linear-gradient(0deg,var(--sgds-bg-translucent-fixed-dark,hsla(0,0%,5%,.2)) 0%,var(--sgds-bg-translucent-fixed-dark,hsla(0,0%,5%,.2)) 100%),var(--sgds-surface-fixed-light,#fff);--btn-color:var(--sgds-color-fixed-dark)}:host([variant=outline][tone=fixed-light]){--btn-border-color:var(--sgds-border-color-fixed-light);--btn-bg:var(--sgds-bg-transparent);--btn-hover-bg:linear-gradient(0deg,var(--sgds-bg-translucent-fixed-dark) 0%,var(--sgds-bg-translucent-fixed-dark) 100%),var(--sgds-bg-transparent);--btn-color:var(--sgds-color-fixed-light)}:host([variant=ghost][tone=fixed-light]){--btn-bg:var(--sgds-bg-transparent);--btn-hover-bg:linear-gradient(0deg,var(--sgds-bg-translucent-fixed-dark) 0%,var(--sgds-bg-translucent-fixed-dark) 100%),var(--sgds-bg-transparent);--btn-color:var(--sgds-color-fixed-light)}:host([variant=primary][tone=neutral]){--btn-bg:var(--sgds-surface-inverse);--btn-hover-bg:linear-gradient(0deg,var(--sgds-bg-translucent-inverse) 0%,var(--sgds-bg-translucent-inverse) 100%),var(--sgds-surface-inverse);--btn-color:var(--sgds-color-inverse)}:host([variant=outline][tone=neutral]){--btn-border-color:var(--sgds-border-color-emphasis);--btn-bg:var(--sgds-bg-transparent);--btn-hover-bg:linear-gradient(0deg,var(--sgds-bg-translucent-inverse) 0%,var(--sgds-bg-translucent-inverse) 100%),var(--sgds-bg-translucent-subtle);--btn-color:var(--sgds-color-default)}:host([variant=ghost][tone=neutral]){--btn-bg:var(--sgds-bg-transparent);--btn-hover-bg:var(--sgds-bg-translucent-subtle);--btn-color:var(--sgds-color-default)}:host([variant=ghost]) .btn,:host([variant=outline]) .btn,:host([variant=primary]) .btn{color:var(--btn-color)}:host([variant=outline]) .btn{border:var(--btn-border-width) solid var(--btn-border-color)}:host([size=lg]) .btn{font-size:var(--sgds-font-size-3);height:var(--sgds-dimension-56);line-height:var(--sgds-line-height-32);min-width:var(--sgds-dimension-112);padding:var(--sgds-padding-none) var(--sgds-padding-xl)}:host([size=sm]) .btn{font-size:var(--sgds-font-size-1);height:var(--sgds-dimension-40);line-height:var(--sgds-line-height-20);min-width:var(--sgds-dimension-80);padding:var(--sgds-padding-none) var(--sgds-padding-md)}:host([size=xs]) .btn{font-size:var(--sgds-font-size-1);height:var(--sgds-dimension-32);line-height:var(--sgds-line-height-16);min-width:var(--sgds-dimension-64);padding:var(--sgds-padding-none) var(--sgds-padding-sm)}.btn{align-items:center;background-color:var(--btn-bg);border:1px solid var(--sgds-border-color-transparent);border-radius:var(--btn-border-radius);color:var(--sgds-color-fixed-light);cursor:pointer;display:inline-flex;font-size:var(--sgds-font-size-2);font-weight:var(--btn-font-weight);gap:var(--sgds-gap-2-xs);height:var(--sgds-dimension-48);justify-content:center;line-height:var(--sgds-line-height-24);min-width:var(--sgds-dimension-96);opacity:var(--btn-opacity);padding:var(--sgds-padding-none) var(--sgds-padding-lg);text-align:center;text-decoration:none;transition:color .15s ease-in-out,background-color .15s ease-in-out,border-color .15s ease-in-out,box-shadow .15s ease-in-out;user-select:none;vertical-align:middle;white-space:nowrap;width:inherit}@media (prefers-reduced-motion:reduce){.btn{transition:none}}.btn.active,.btn:hover{background:var(--btn-hover-bg)}.btn:focus,.btn:focus-visible{background:var(--btn-hover-bg);border-color:transparent;outline:var(--sgds-outline-focus);outline-offset:var(--sgds-outline-offset-focus)}.btn.disabled,.btn:disabled{color:var(--btn-color);cursor:not-allowed;opacity:var(--sgds-opacity-40)}.btn.loading{cursor:default}.btn slot::slotted(*){color:var(--btn-color)}`;class St extends xt{constructor(){super(...arguments),this.variant="primary",this.tone="brand",this.size="md",this.active=!1,this.disabled=!1,this.target="_self"}focus(e){this.button.focus(e)}click(){this.button.click()}blur(){this.button.blur()}_handleBlur(){this.emit("sgds-blur")}_handleFocus(){this.emit("sgds-focus")}_handleClick(e){if(this.disabled||this.loading)return e.preventDefault(),void e.stopPropagation()}_handleKeydown(e){if("Enter"===e.key&&this.loading)return e.preventDefault(),void e.stopPropagation()}_assignSpinnerSize(e){return"xs"===e||"sm"===e?"xs":"md"===e||"lg"===e?"sm":void 0}_assignSpinnerTone(e,t){return"fixed-light"===e&&"primary"===t?"fixed-dark":"neutral"===e&&"primary"===t?"inverse":"fixed-light"===e||"primary"===t?"fixed-light":"neutral"!==e||"outline"!==t&&"ghost"!==t?"brand":"neutral"}}St.styles=[...xt.styles,Ht],e([P(".btn")],St.prototype,"button",void 0),e([H({reflect:!0})],St.prototype,"variant",void 0),e([H({reflect:!0})],St.prototype,"tone",void 0),e([H({reflect:!0})],St.prototype,"size",void 0),e([H({type:Boolean,reflect:!0})],St.prototype,"active",void 0),e([H({type:Boolean,reflect:!0})],St.prototype,"disabled",void 0),e([H({type:String,reflect:!0})],St.prototype,"href",void 0),e([H({type:String,reflect:!0})],St.prototype,"target",void 0),e([H({type:String,reflect:!0})],St.prototype,"download",void 0),e([H({type:String})],St.prototype,"ariaLabel",void 0),e([H({type:Boolean})],St.prototype,"loading",void 0);const kt={archive:ne`
+   */;let vt;{const e=globalThis.litIssuedWarnings??=new Set;vt=(t,i)=>{i+=` See https://lit.dev/msg/${t} for more information.`,e.has(i)||(console.warn(i),e.add(i))}}class pt extends ht{constructor(){super(...arguments),this.renderOptions={host:this},this.__childPart=void 0}createRenderRoot(){const e=super.createRenderRoot();return this.renderOptions.renderBefore??=e.firstChild,e}update(e){const t=this.render();this.hasUpdated||(this.renderOptions.isConnected=this.isConnected),super.update(e),this.__childPart=Ve(t,this.renderRoot,this.renderOptions)}connectedCallback(){super.connectedCallback(),this.__childPart?.setConnected(!0)}disconnectedCallback(){super.disconnectedCallback(),this.__childPart?.setConnected(!1)}render(){return de}}var gt;pt._$litElement$=!0,pt[(gt="finalized",gt)]=!0,globalThis.litElementHydrateSupport?.({LitElement:pt});const ut=globalThis.litElementPolyfillSupportDevMode;ut?.({LitElement:pt}),(globalThis.litElementVersions??=[]).push("4.1.0"),globalThis.litElementVersions.length>1&&vt("multiple-versions","Multiple versions of Lit loaded. Loading multiple versions is not recommended.");var wt=je`.invalid-feedback-container{display:flex;gap:var(--sgds-form-gap-sm)}.invalid-feedback,.invalid-feedback-container{color:var(--sgds-form-danger-color-default);line-height:var(--sgds-line-height-20)}.invalid-feedback{font-size:var(--sgds-font-size-1);font-weight:var(--sgds-font-weight-regular)}.valid-icon{color:var(--sgds-form-success-color-default)}`,ft=je`.form-text{color:var(--sgds-form-color-subtle);font-size:var(--sgds-font-size-1);line-height:var(--sgds-line-height-20)}.form-text.disabled{opacity:var(--sgds-opacity-50)}`,mt=je`.form-label{color:var(--sgds-form-color-default);margin-bottom:0}.form-label.disabled{opacity:var(--sgds-opacity-50)}.form-check-label{color:var(--sgds-form-color-default)}.form-check-input:disabled~.form-check-label,.form-check-input[disabled]~.form-check-label{cursor:not-allowed}`,bt=je`.form-control::placeholder{color:var(--sgds-form-color-subtle);font-family:var(--sgds-font-family-brand);font-weight:var(--sgds-font-weight-light);line-height:var(--sgds-line-height-24)}`,yt=je`:host{-webkit-text-size-adjust:100%;-webkit-tap-highlight-color:rgba(0,0,0,0);color:var(--sgds-body-color-default);font-family:var(--sgds-font-family-brand);font-size:var(--sgds-font-size-2);font-weight:var(--sgds-font-weight-regular);line-height:var(--sgds-line-height-24);margin:0;*,:after,:before{-webkit-box-sizing:border-box;-moz-box-sizing:border-box;box-sizing:border-box}:disabled{cursor:not-allowed}@media (prefers-reduced-motion:no-preference){:root{scroll-behavior:smooth}}::slotted(a[target=_blank]):after,a[target=_blank]:after{background-color:currentColor;content:"/";display:inline-block;height:var(--sgds-icon-size-lg);margin-left:.25rem;-webkit-mask-image:url("data:image/svg+xml;charset=utf-8,%3Csvg xmlns='http://www.w3.org/2000/svg' width='24' height='24' fill='none'%3E%3Cpath fill-rule='evenodd' clip-rule='evenodd' d='M9.774 4.4H9.8a.6.6 0 1 1 0 1.2c-.85 0-1.451 0-1.922.039-.463.038-.745.11-.968.223A2.4 2.4 0 0 0 5.861 6.91c-.113.223-.184.505-.222.968-.039.47-.04 1.072-.04 1.922v4.4c0 .85.001 1.451.04 1.922.038.463.11.745.222.968a2.4 2.4 0 0 0 1.05 1.048c.222.114.504.185.967.223.47.038 1.072.039 1.922.039h4.4c.85 0 1.451 0 1.921-.039.464-.038.746-.11.969-.223a2.4 2.4 0 0 0 1.048-1.048c.113-.223.185-.505.223-.968.038-.47.039-1.072.039-1.922a.6.6 0 1 1 1.2 0v.026c0 .818 0 1.468-.043 1.993-.044.538-.136.996-.35 1.415a3.6 3.6 0 0 1-1.573 1.574c-.42.213-.878.305-1.415.35-.525.042-1.175.042-1.993.042H9.774c-.818 0-1.469 0-1.993-.043-.538-.044-.996-.136-1.415-.35a3.6 3.6 0 0 1-1.574-1.573c-.213-.42-.305-.877-.35-1.415-.042-.525-.042-1.175-.042-1.993V9.774c0-.818 0-1.468.043-1.993.044-.538.136-.996.35-1.415a3.6 3.6 0 0 1 1.573-1.574c.42-.213.877-.305 1.415-.35C8.305 4.4 8.956 4.4 9.774 4.4ZM12.4 5a.6.6 0 0 1 .6-.6h6a.6.6 0 0 1 .6.6v6a.6.6 0 1 1-1.2 0V6.449l-5.976 5.975a.6.6 0 0 1-.848-.848L17.55 5.6H13a.6.6 0 0 1-.6-.6Z' fill='%230E0E0E'/%3E%3C/svg%3E");mask-image:url("data:image/svg+xml;charset=utf-8,%3Csvg xmlns='http://www.w3.org/2000/svg' width='24' height='24' fill='none'%3E%3Cpath fill-rule='evenodd' clip-rule='evenodd' d='M9.774 4.4H9.8a.6.6 0 1 1 0 1.2c-.85 0-1.451 0-1.922.039-.463.038-.745.11-.968.223A2.4 2.4 0 0 0 5.861 6.91c-.113.223-.184.505-.222.968-.039.47-.04 1.072-.04 1.922v4.4c0 .85.001 1.451.04 1.922.038.463.11.745.222.968a2.4 2.4 0 0 0 1.05 1.048c.222.114.504.185.967.223.47.038 1.072.039 1.922.039h4.4c.85 0 1.451 0 1.921-.039.464-.038.746-.11.969-.223a2.4 2.4 0 0 0 1.048-1.048c.113-.223.185-.505.223-.968.038-.47.039-1.072.039-1.922a.6.6 0 1 1 1.2 0v.026c0 .818 0 1.468-.043 1.993-.044.538-.136.996-.35 1.415a3.6 3.6 0 0 1-1.573 1.574c-.42.213-.878.305-1.415.35-.525.042-1.175.042-1.993.042H9.774c-.818 0-1.469 0-1.993-.043-.538-.044-.996-.136-1.415-.35a3.6 3.6 0 0 1-1.574-1.573c-.213-.42-.305-.877-.35-1.415-.042-.525-.042-1.175-.042-1.993V9.774c0-.818 0-1.468.043-1.993.044-.538.136-.996.35-1.415a3.6 3.6 0 0 1 1.573-1.574c.42-.213.877-.305 1.415-.35C8.305 4.4 8.956 4.4 9.774 4.4ZM12.4 5a.6.6 0 0 1 .6-.6h6a.6.6 0 0 1 .6.6v6a.6.6 0 1 1-1.2 0V6.449l-5.976 5.975a.6.6 0 0 1-.848-.848L17.55 5.6H13a.6.6 0 0 1-.6-.6Z' fill='%230E0E0E'/%3E%3C/svg%3E");-webkit-mask-position:center;mask-position:center;-webkit-mask-repeat:no-repeat;mask-repeat:no-repeat;vertical-align:bottom;width:var(--sgds-icon-size-lg)}::slotted(svg){vertical-align:middle}}`;class xt extends pt{emit(e,t){const i=new CustomEvent(e,Object.assign({bubbles:!0,cancelable:!1,composed:!0,detail:{}},t));return this.dispatchEvent(i),i}static define(e,t=this,i={}){if(customElements.get(e));else try{customElements.define(e,t,i)}catch(a){customElements.define(e,class extends t{},i)}}constructor(){super(),this.ssr=Boolean(this.shadowRoot),Object.entries(this.constructor.dependencies).forEach((([e,t])=>{this.constructor.define(e,t)}))}firstUpdated(e){var t;super.firstUpdated(e),this.ssr&&(null===(t=this.shadowRoot)||void 0===t||t.querySelectorAll("slot").forEach((e=>{e.dispatchEvent(new Event("slotchange",{bubbles:!0,composed:!1,cancelable:!1}))})))}}function Ct(e="",t=""){return`id-${Math.random().toString().substring(2,6)}-sgds-${e}-${t}`}xt.styles=[yt],xt.dependencies={},e([H({type:Boolean,reflect:!0})],xt.prototype,"ssr",void 0);class Zt extends xt{constructor(){super(...arguments),this.label="",this.hintText="",this.disabled=!1,this.invalid=!1,this._controlId=Ct("input"),this._labelId=Ct("label")}setInvalid(e){this.invalid=e,e?this.emit("sgds-invalid"):this.emit("sgds-valid")}}Zt.styles=[...xt.styles,wt,ft,mt,bt],e([H({reflect:!0})],Zt.prototype,"label",void 0),e([H({reflect:!0})],Zt.prototype,"hintText",void 0),e([H({reflect:!0})],Zt.prototype,"name",void 0),e([H({type:Boolean,reflect:!0})],Zt.prototype,"disabled",void 0),e([H({type:Boolean,reflect:!0})],Zt.prototype,"invalid",void 0);var _t=je`svg{vertical-align:middle}`;const Mt=(e="value")=>(t,i)=>{const a=t.constructor,l=a.prototype.attributeChangedCallback;a.prototype.attributeChangedCallback=function(t,r,s){var o;const n=a.getPropertyOptions(e);if(t===("string"==typeof n.attribute?n.attribute:e).toLowerCase()){const t=n.converter||nt,a=("function"==typeof t?t:null!==(o=null==t?void 0:t.fromAttribute)&&void 0!==o?o:nt.fromAttribute)(s,n.type);this[e]!==a&&(this[i]=a)}l.call(this,t,r,s)}};class Vt{constructor(e,t){(this.host=e).addController(this),this._internals=this.host.attachInternals(),this.options=Object.assign({setInvalid:(e,t)=>{e.invalid=t},value:e=>e.value,input:e=>e.input},t)}hostConnected(){this.host.addEventListener("invalid",(e=>this.handleInvalid(e)))}hostDisconnected(){this.host.removeEventListener("invalid",(e=>this.handleInvalid(e)))}handleInvalid(e){e.preventDefault(),this.options.setInvalid(this.host,!0)}handleInput(e){const t=e.target;this.options.setInvalid(this.host,!1),this.validateInput(t)}handleChange(e){const t=e.target;this.validateInput(t),this.options.setInvalid(this.host,!this.checkValidity())}get form(){return this._internals.form}get validity(){return this._internals.validity}get validationMessage(){return this._internals.validationMessage}get willValidate(){return this._internals.willValidate}updateInvalidState(){this.options.setInvalid(this.host,!this.checkValidity())}resetValidity(){return this._internals.setValidity({})}checkValidity(){return this._internals.checkValidity()}reportValidity(){return this._internals.reportValidity()}setValidity(e,t,i){return this._internals.setValidity(e,t,i)}setFormValue(){const e=this.options.value(this.host);this._internals.setFormValue(e)}validateInput(e){if(this.options.input(this.host).disabled)return this._internals.setValidity({});const t=e.validity;if(t.valid)this._internals.setValidity({});else for(const i in t)t[i]&&(this.validationError=i.toString(),this._internals.setValidity({[this.validationError]:!0},e.validationMessage,e))}}const $t=t=>{class i extends t{constructor(){super(...arguments),this._isTouched=!1}connectedCallback(){var e;super.connectedCallback(),this._mixinShouldSkipSgdsValidation()||null!==(e=this.inputValidationController)&&void 0!==e||(this.inputValidationController=new Vt(this))}async firstUpdated(e){super.firstUpdated(e),this.input=this.shadowRoot.querySelector("input")||await this.sgdsInput||this.shadowRoot.querySelector("textarea")||await this.sgdsDatepickerInput,this._mixinShouldSkipSgdsValidation()||this._mixinValidate(this.input)}formResetCallback(){this._mixinResetFormControl?this._mixinResetFormControl():(this.value=this.defaultValue,this._mixinResetValidity(this.input)),this._mixinSetFormValue()}_mixinHandleChange(e){this._mixinSetFormValue(),this.inputValidationController.handleChange(e)}_mixinHandleInputChange(e){this._mixinSetFormValue(),this.inputValidationController.handleInput(e)}_mixinResetValidity(e){this.inputValidationController.resetValidity(),this.inputValidationController.updateInvalidState(),this.inputValidationController.validateInput(e),this._isTouched&&(this._isTouched=!1)}_mixinValidate(e){this.inputValidationController.validateInput(e)}_mixinSetFormValue(){this.inputValidationController.setFormValue()}_mixinCheckValidity(){return this.inputValidationController.checkValidity()}_mixinReportValidity(){return this.inputValidationController.reportValidity()}_mixinGetValidity(){return this.inputValidationController.validity}_mixinGetValidationMessage(){return this.inputValidationController.validationMessage}_mixinSetValidity(e,t,i){return this.inputValidationController.setValidity(e,t,i)}_mixinShouldSkipSgdsValidation(){const e=this.closest("form");return(null==e?void 0:e.noValidate)||this.noValidate}}return i.formAssociated=!0,e([L("sgds-input")],i.prototype,"sgdsInput",void 0),e([L("sgds-datepicker-input")],i.prototype,"sgdsDatepickerInput",void 0),i};var Ht=je`:host{--btn-font-weight:var(--sgds-font-weight-regular);--btn-color:var(--sgds-color-fixed-light);--btn-bg:var(--sgds-primary-surface-default);--btn-hover-bg:var(--sgds-primary-surface-emphasis);--btn-border-radius:var(--sgds-border-radius-md);--btn-opacity:var(--sgds-opacity-100,1)}:host([variant=danger]){--btn-bg:var(--sgds-danger-surface-default);--btn-hover-bg:var(--sgds-danger-surface-emphasis);--btn-color:var(--sgds-color-fixed-light)}:host([variant=primary][tone=brand]){--btn-bg:var(--sgds-primary-surface-default);--btn-color:var(--sgds-color-fixed-light)}:host([variant=outline]){--btn-border-width:var(--sgds-border-width-1)}:host([variant=outline][tone=brand]){--btn-border-color:var(--sgds-primary-border-color-default);--btn-bg:var(--sgds-bg-transparent);--btn-color:var(--sgds-primary-color-default);--btn-hover-bg:var(--sgds-primary-bg-translucent)}:host([variant=ghost][tone=brand]){--btn-bg:var(--sgds-bg-transparent);--btn-hover-bg:var(--sgds-primary-surface-translucent);--btn-color:var(--sgds-primary-color-default)}:host([variant=primary][tone=danger]){--btn-bg:var(--sgds-danger-surface-default);--btn-hover-bg:var(--sgds-danger-surface-emphasis);--btn-color:var(--sgds-color-fixed-light)}:host([variant=outline][tone=danger]){--btn-border-color:var(--sgds-danger-border-color-default);--btn-bg:var(--sgds-bg-transparent);--btn-hover-bg:var(--sgds-danger-surface-translucent);--btn-color:var(--sgds-danger-color-default)}:host([variant=ghost][tone=danger]){--btn-bg:var(--sgds-bg-transparent);--btn-hover-bg:var(--sgds-danger-surface-translucent);--btn-color:var(--sgds-danger-color-default)}:host([variant=primary][tone=fixed-light]){--btn-bg:var(--sgds-surface-fixed-light);--btn-hover-bg:linear-gradient(0deg,var(--sgds-bg-translucent-fixed-dark,hsla(0,0%,5%,.2)) 0%,var(--sgds-bg-translucent-fixed-dark,hsla(0,0%,5%,.2)) 100%),var(--sgds-surface-fixed-light,#fff);--btn-color:var(--sgds-color-fixed-dark)}:host([variant=outline][tone=fixed-light]){--btn-border-color:var(--sgds-border-color-fixed-light);--btn-bg:var(--sgds-bg-transparent);--btn-hover-bg:linear-gradient(0deg,var(--sgds-bg-translucent-fixed-dark) 0%,var(--sgds-bg-translucent-fixed-dark) 100%),var(--sgds-bg-transparent);--btn-color:var(--sgds-color-fixed-light)}:host([variant=ghost][tone=fixed-light]){--btn-bg:var(--sgds-bg-transparent);--btn-hover-bg:linear-gradient(0deg,var(--sgds-bg-translucent-fixed-dark) 0%,var(--sgds-bg-translucent-fixed-dark) 100%),var(--sgds-bg-transparent);--btn-color:var(--sgds-color-fixed-light)}:host([variant=primary][tone=neutral]){--btn-bg:var(--sgds-surface-inverse);--btn-hover-bg:linear-gradient(0deg,var(--sgds-bg-translucent-inverse) 0%,var(--sgds-bg-translucent-inverse) 100%),var(--sgds-surface-inverse);--btn-color:var(--sgds-color-inverse)}:host([variant=outline][tone=neutral]){--btn-border-color:var(--sgds-border-color-emphasis);--btn-bg:var(--sgds-bg-transparent);--btn-hover-bg:linear-gradient(0deg,var(--sgds-bg-translucent-inverse) 0%,var(--sgds-bg-translucent-inverse) 100%),var(--sgds-bg-translucent-subtle);--btn-color:var(--sgds-color-default)}:host([variant=ghost][tone=neutral]){--btn-bg:var(--sgds-bg-transparent);--btn-hover-bg:var(--sgds-bg-translucent-subtle);--btn-color:var(--sgds-color-default)}:host([variant=ghost]) .btn,:host([variant=outline]) .btn,:host([variant=primary]) .btn{color:var(--btn-color)}:host([variant=outline]) .btn{border:var(--btn-border-width) solid var(--btn-border-color)}:host([size=lg]) .btn{font-size:var(--sgds-font-size-3);height:var(--sgds-dimension-56);line-height:var(--sgds-line-height-32);min-width:var(--sgds-dimension-112);padding:var(--sgds-padding-none) var(--sgds-padding-xl)}:host([size=sm]) .btn{font-size:var(--sgds-font-size-1);height:var(--sgds-dimension-40);line-height:var(--sgds-line-height-20);min-width:var(--sgds-dimension-80);padding:var(--sgds-padding-none) var(--sgds-padding-md)}:host([size=xs]) .btn{font-size:var(--sgds-font-size-0);height:var(--sgds-dimension-32);line-height:var(--sgds-line-height-16);min-width:var(--sgds-dimension-64);padding:var(--sgds-padding-none) var(--sgds-padding-sm)}.btn{align-items:center;background-color:var(--btn-bg);border:1px solid var(--sgds-border-color-transparent);border-radius:var(--btn-border-radius);color:var(--sgds-color-fixed-light);cursor:pointer;display:inline-flex;font-size:var(--sgds-font-size-2);font-weight:var(--btn-font-weight);gap:var(--sgds-gap-2-xs);height:var(--sgds-dimension-48);justify-content:center;line-height:var(--sgds-line-height-24);min-width:var(--sgds-dimension-96);opacity:var(--btn-opacity);padding:var(--sgds-padding-none) var(--sgds-padding-lg);text-align:center;text-decoration:none;transition:color .15s ease-in-out,background-color .15s ease-in-out,border-color .15s ease-in-out,box-shadow .15s ease-in-out;user-select:none;vertical-align:middle;white-space:nowrap;width:inherit}@media (prefers-reduced-motion:reduce){.btn{transition:none}}.btn.active,.btn:hover{background:var(--btn-hover-bg)}.btn:focus,.btn:focus-visible{background:var(--btn-hover-bg);border-color:transparent;outline:var(--sgds-outline-focus);outline-offset:var(--sgds-outline-offset-focus)}.btn.disabled,.btn:disabled{color:var(--btn-color);cursor:not-allowed;opacity:var(--sgds-opacity-40)}.btn.loading{cursor:default}.btn slot::slotted(*){color:var(--btn-color)}`;class St extends xt{constructor(){super(...arguments),this.variant="primary",this.tone="brand",this.size="md",this.active=!1,this.disabled=!1,this.target="_self"}focus(e){this.button.focus(e)}click(){this.button.click()}blur(){this.button.blur()}_handleBlur(){this.emit("sgds-blur")}_handleFocus(){this.emit("sgds-focus")}_handleClick(e){if(this.disabled||this.loading)return e.preventDefault(),void e.stopPropagation()}_handleKeydown(e){if("Enter"===e.key&&this.loading)return e.preventDefault(),void e.stopPropagation()}_assignSpinnerSize(e){return"xs"===e||"sm"===e?"xs":"md"===e||"lg"===e?"sm":void 0}_assignSpinnerTone(e,t){return"fixed-light"===e&&"primary"===t?"fixed-dark":"neutral"===e&&"primary"===t?"inverse":"fixed-light"===e||"primary"===t?"fixed-light":"neutral"!==e||"outline"!==t&&"ghost"!==t?"brand":"neutral"}}St.styles=[...xt.styles,Ht],e([P(".btn")],St.prototype,"button",void 0),e([H({reflect:!0})],St.prototype,"variant",void 0),e([H({reflect:!0})],St.prototype,"tone",void 0),e([H({reflect:!0})],St.prototype,"size",void 0),e([H({type:Boolean,reflect:!0})],St.prototype,"active",void 0),e([H({type:Boolean,reflect:!0})],St.prototype,"disabled",void 0),e([H({type:String,reflect:!0})],St.prototype,"href",void 0),e([H({type:String,reflect:!0})],St.prototype,"target",void 0),e([H({type:String,reflect:!0})],St.prototype,"download",void 0),e([H({type:String})],St.prototype,"ariaLabel",void 0),e([H({type:Boolean})],St.prototype,"loading",void 0);const kt={archive:ne`
   <svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" fill="none" viewBox="0 0 24 24">
     <path
       fill="currentColor"