@govtechsg/sgds-web-component 2.0.0-rc.0 → 2.0.0-rc.2

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

@@ -17,7 +17,7 @@ var scroll = require('../../utils/scroll.cjs.js');
 var slot = require('../../utils/slot.cjs.js');
 var watch = require('../../utils/watch.cjs.js');
 var modal$1 = require('./modal.cjs.js');
-var litElement_js = require('@open-wc/scoped-elements/lit-element.js');
+var scopedElements = require('@open-wc/scoped-elements');
 var sgdsCloseButton = require('../../internals/CloseButton/sgds-close-button.cjs.js');
 var headerClass = require('../../styles/header-class.cjs.js');
 var svg = require('../../styles/svg.cjs.js');
@@ -51,7 +51,7 @@ var svg = require('../../styles/svg.cjs.js');
  * @cssproperty --modal-header-border-bottom - The bottom border of header
  * @cssproperty --modal-overlay-bg - The overlay's background color
  */
-class SgdsModal extends litElement_js.ScopedElementsMixin(sgdsElement["default"]) {
+class SgdsModal extends scopedElements.ScopedElementsMixin(sgdsElement["default"]) {
     constructor() {
         super(...arguments);
         /**@internal */

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

@@ -1 +1 @@
-{"version":3,"file":"sgds-modal.cjs.js","sources":["../../../src/components/Modal/sgds-modal.ts"],"sourcesContent":["import { html, nothing } from \"lit\";\nimport { property, query } from \"lit/decorators.js\";\nimport { classMap } from \"lit/directives/class-map.js\";\nimport { ifDefined } from \"lit/directives/if-defined.js\";\nimport { unsafeSVG } from \"lit/directives/unsafe-svg.js\";\nimport SgdsElement from \"../../base/sgds-element\";\nimport { animateTo, stopAnimations } from \"../../utils/animate\";\nimport { getAnimation, setDefaultAnimation } from \"../../utils/animation-registry\";\nimport { waitForEvent } from \"../../utils/event\";\nimport Modal from \"../../utils/modal\";\nimport { lockBodyScrolling, unlockBodyScrolling } from \"../../utils/scroll\";\nimport { HasSlotController } from \"../../utils/slot\";\nimport { watch } from \"../../utils/watch\";\nimport modalStyle from \"./modal.css\";\nimport { ScopedElementsMixin } from \"@open-wc/scoped-elements/lit-element.js\";\nimport SgdsCloseButton from \"../../internals/CloseButton/sgds-close-button\";\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 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 * @csspart base - The component's base wrapper\n * @csspart overlay - The overlay that covers the screen behind the dialog\n * @csspart panel - The modal's dialog panel\n * @csspart header - The modal's header that wraps the title, titleIcon and close button\n * @csspart title - The h3 element wrapping title and titleIcon\n * @csspart body - The modal's body where the content lies\n * @csspart footers - The modal's footer\n *\n * @cssproperty --modal-panel-padding - The general modal padding of modal component. Applied to body, footer and header.\n * @cssproperty --modal-panel-z-index - The z-index of modal panel\n * @cssproperty --modal-panel-width - The width of modal panel.\n * @cssproperty --modal-panel-height - The height of modal panel.\n * @cssproperty --modal-panel-bg - The background color of modal panel\n * @cssproperty --modal-panel-border-radius - The border radius of modal panel\n * @cssproperty --modal-header-border-bottom - The bottom border of header\n * @cssproperty --modal-overlay-bg - The overlay's background color\n */\nexport class SgdsModal extends ScopedElementsMixin(SgdsElement) {\n  static styles = [...SgdsElement.styles, headerStyles, svgStyles, modalStyle];\n  /**@internal */\n  static get scopedElements() {\n    return {\n      \"sgds-close-button\": SgdsCloseButton\n    };\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\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  /**The modal's title as displayed in the header */\n  @property({ reflect: true }) title = \"\";\n  /**The modal's icon as displayed in the header. Pass in SVG format icons as string directly  */\n  @property({ reflect: true }) titleIcon = \"\";\n  /** Disables the header. This will also remove the default close button */\n  @property({ type: Boolean, reflect: true }) noHeader = false;\n  /** Centers the modal vertically in page */\n  @property({ type: Boolean, reflect: true }) centered = false;\n  /** Centers the contents inside the modal */\n  @property({ type: Boolean, reflect: true }) centeredAlignVariant = false;\n  /** Removes the default animation when opening and closing of modal */\n  @property({ type: Boolean, reflect: true }) noAnimation = false;\n  /** Removes the close button from modal header */\n  @property({ type: Boolean, reflect: true }) noCloseButton = false;\n\n  connectedCallback() {\n    super.connectedCallback();\n    this.handleDocumentKeyDown = this.handleDocumentKeyDown.bind(this);\n    this.modal = new Modal(this);\n  }\n\n  firstUpdated() {\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  disconnectedCallback() {\n    super.disconnectedCallback();\n    unlockBodyScrolling(this);\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  @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    } 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  }\n\n  render() {\n    const withLabelIcon = html`${unsafeSVG(this.titleIcon)}`;\n    return html`\n      <div\n        part=\"base\"\n        class=${classMap({\n          modal: true,\n          \"modal--open\": this.open,\n          \"modal--has-footer\": this.hasSlotController.test(\"footer\"),\n          centered: this.centered\n        })}\n      >\n        <div part=\"overlay\" class=\"modal-overlay\" @click=${() => this.requestClose(\"overlay\")}></div>\n\n        <div\n          part=\"panel\"\n          class=\"modal-panel\"\n          role=\"dialog\"\n          aria-modal=\"true\"\n          aria-hidden=${this.open ? \"false\" : \"true\"}\n          aria-label=${ifDefined(this.noHeader ? this.title : undefined)}\n          aria-labelledby=${ifDefined(!this.noHeader ? \"title\" : undefined)}\n          tabindex=\"-1\"\n        >\n          ${!this.noHeader\n            ? html`\n                <div\n                  part=\"header\"\n                  class=${classMap({\n                    \"modal-header\": true,\n                    centered: this.centeredAlignVariant\n                  })}\n                >\n                  <h3\n                    part=\"title\"\n                    class=${classMap({\n                      \"modal-title\": true,\n                      centered: this.centeredAlignVariant\n                    })}\n                    id=\"title\"\n                    tabindex=\"-1\"\n                  >\n                    ${this.titleIcon ? withLabelIcon : \"\"} ${this.title}\n                  </h3>\n                  ${this.noCloseButton\n                    ? nothing\n                    : html`<sgds-close-button\n                        class=${classMap({\n                          \"modal-close\": true,\n                          centered: this.centeredAlignVariant\n                        })}\n                        @click=\"${() => this.requestClose(\"close-button\")}\"\n                        ariaLabel=\"close modal\"\n                      ></sgds-close-button>`}\n                </div>\n              `\n            : \"\"}\n\n          <div\n            part=\"body\"\n            class=${classMap({\n              \"modal-body\": true,\n              centered: this.centeredAlignVariant\n            })}\n          >\n            <slot></slot>\n          </div>\n\n          <footer\n            part=\"footer\"\n            class=${classMap({\n              \"modal-footer\": true,\n              centered: this.centeredAlignVariant\n            })}\n          >\n            <slot name=\"footer\"></slot>\n          </footer>\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":["ScopedElementsMixin","SgdsElement","HasSlotController","SgdsCloseButton","Modal","lockBodyScrolling","unlockBodyScrolling","waitForEvent","getAnimation","animateTo","stopAnimations","html","unsafeSVG","classMap","ifDefined","nothing","headerStyles","svgStyles","modalStyle","__decorate","query","property","watch","setDefaultAnimation"],"mappings":"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"}
+{"version":3,"file":"sgds-modal.cjs.js","sources":["../../../src/components/Modal/sgds-modal.ts"],"sourcesContent":["import { html, nothing } from \"lit\";\nimport { property, query } from \"lit/decorators.js\";\nimport { classMap } from \"lit/directives/class-map.js\";\nimport { ifDefined } from \"lit/directives/if-defined.js\";\nimport { unsafeSVG } from \"lit/directives/unsafe-svg.js\";\nimport SgdsElement from \"../../base/sgds-element\";\nimport { animateTo, stopAnimations } from \"../../utils/animate\";\nimport { getAnimation, setDefaultAnimation } from \"../../utils/animation-registry\";\nimport { waitForEvent } from \"../../utils/event\";\nimport Modal from \"../../utils/modal\";\nimport { lockBodyScrolling, unlockBodyScrolling } from \"../../utils/scroll\";\nimport { HasSlotController } from \"../../utils/slot\";\nimport { watch } from \"../../utils/watch\";\nimport modalStyle from \"./modal.css\";\nimport { ScopedElementsMixin } from \"@open-wc/scoped-elements\";\nimport SgdsCloseButton from \"../../internals/CloseButton/sgds-close-button\";\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 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 * @csspart base - The component's base wrapper\n * @csspart overlay - The overlay that covers the screen behind the dialog\n * @csspart panel - The modal's dialog panel\n * @csspart header - The modal's header that wraps the title, titleIcon and close button\n * @csspart title - The h3 element wrapping title and titleIcon\n * @csspart body - The modal's body where the content lies\n * @csspart footers - The modal's footer\n *\n * @cssproperty --modal-panel-padding - The general modal padding of modal component. Applied to body, footer and header.\n * @cssproperty --modal-panel-z-index - The z-index of modal panel\n * @cssproperty --modal-panel-width - The width of modal panel.\n * @cssproperty --modal-panel-height - The height of modal panel.\n * @cssproperty --modal-panel-bg - The background color of modal panel\n * @cssproperty --modal-panel-border-radius - The border radius of modal panel\n * @cssproperty --modal-header-border-bottom - The bottom border of header\n * @cssproperty --modal-overlay-bg - The overlay's background color\n */\nexport class SgdsModal extends ScopedElementsMixin(SgdsElement) {\n  static styles = [...SgdsElement.styles, headerStyles, svgStyles, modalStyle];\n  /**@internal */\n  static get scopedElements() {\n    return {\n      \"sgds-close-button\": SgdsCloseButton\n    };\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\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  /**The modal's title as displayed in the header */\n  @property({ reflect: true }) title = \"\";\n  /**The modal's icon as displayed in the header. Pass in SVG format icons as string directly  */\n  @property({ reflect: true }) titleIcon = \"\";\n  /** Disables the header. This will also remove the default close button */\n  @property({ type: Boolean, reflect: true }) noHeader = false;\n  /** Centers the modal vertically in page */\n  @property({ type: Boolean, reflect: true }) centered = false;\n  /** Centers the contents inside the modal */\n  @property({ type: Boolean, reflect: true }) centeredAlignVariant = false;\n  /** Removes the default animation when opening and closing of modal */\n  @property({ type: Boolean, reflect: true }) noAnimation = false;\n  /** Removes the close button from modal header */\n  @property({ type: Boolean, reflect: true }) noCloseButton = false;\n\n  connectedCallback() {\n    super.connectedCallback();\n    this.handleDocumentKeyDown = this.handleDocumentKeyDown.bind(this);\n    this.modal = new Modal(this);\n  }\n\n  firstUpdated() {\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  disconnectedCallback() {\n    super.disconnectedCallback();\n    unlockBodyScrolling(this);\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  @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    } 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  }\n\n  render() {\n    const withLabelIcon = html`${unsafeSVG(this.titleIcon)}`;\n    return html`\n      <div\n        part=\"base\"\n        class=${classMap({\n          modal: true,\n          \"modal--open\": this.open,\n          \"modal--has-footer\": this.hasSlotController.test(\"footer\"),\n          centered: this.centered\n        })}\n      >\n        <div part=\"overlay\" class=\"modal-overlay\" @click=${() => this.requestClose(\"overlay\")}></div>\n\n        <div\n          part=\"panel\"\n          class=\"modal-panel\"\n          role=\"dialog\"\n          aria-modal=\"true\"\n          aria-hidden=${this.open ? \"false\" : \"true\"}\n          aria-label=${ifDefined(this.noHeader ? this.title : undefined)}\n          aria-labelledby=${ifDefined(!this.noHeader ? \"title\" : undefined)}\n          tabindex=\"-1\"\n        >\n          ${!this.noHeader\n            ? html`\n                <div\n                  part=\"header\"\n                  class=${classMap({\n                    \"modal-header\": true,\n                    centered: this.centeredAlignVariant\n                  })}\n                >\n                  <h3\n                    part=\"title\"\n                    class=${classMap({\n                      \"modal-title\": true,\n                      centered: this.centeredAlignVariant\n                    })}\n                    id=\"title\"\n                    tabindex=\"-1\"\n                  >\n                    ${this.titleIcon ? withLabelIcon : \"\"} ${this.title}\n                  </h3>\n                  ${this.noCloseButton\n                    ? nothing\n                    : html`<sgds-close-button\n                        class=${classMap({\n                          \"modal-close\": true,\n                          centered: this.centeredAlignVariant\n                        })}\n                        @click=\"${() => this.requestClose(\"close-button\")}\"\n                        ariaLabel=\"close modal\"\n                      ></sgds-close-button>`}\n                </div>\n              `\n            : \"\"}\n\n          <div\n            part=\"body\"\n            class=${classMap({\n              \"modal-body\": true,\n              centered: this.centeredAlignVariant\n            })}\n          >\n            <slot></slot>\n          </div>\n\n          <footer\n            part=\"footer\"\n            class=${classMap({\n              \"modal-footer\": true,\n              centered: this.centeredAlignVariant\n            })}\n          >\n            <slot name=\"footer\"></slot>\n          </footer>\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":["ScopedElementsMixin","SgdsElement","HasSlotController","SgdsCloseButton","Modal","lockBodyScrolling","unlockBodyScrolling","waitForEvent","getAnimation","animateTo","stopAnimations","html","unsafeSVG","classMap","ifDefined","nothing","headerStyles","svgStyles","modalStyle","__decorate","query","property","watch","setDefaultAnimation"],"mappings":"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"}

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

@@ -1,6 +1,6 @@
 import SgdsElement from "../../base/sgds-element";
 import SgdsCloseButton from "../../internals/CloseButton/sgds-close-button";
-declare const SgdsModal_base: typeof SgdsElement & import("@open-wc/scoped-elements/lit-element.js").ScopedElementsHostConstructor;
+declare const SgdsModal_base: typeof SgdsElement & import("@open-wc/dedupe-mixin").Constructor<import("@open-wc/scoped-elements/types/src/types").ScopedElementsHost>;
 /**
  * @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

@@ -13,7 +13,7 @@ import { lockBodyScrolling, unlockBodyScrolling } from '../../utils/scroll.js';
 import { HasSlotController } from '../../utils/slot.js';
 import { watch } from '../../utils/watch.js';
 import css_248z$2 from './modal.js';
-import { ScopedElementsMixin } from '@open-wc/scoped-elements/lit-element.js';
+import { ScopedElementsMixin } from '@open-wc/scoped-elements';
 import { SgdsCloseButton } from '../../internals/CloseButton/sgds-close-button.js';
 import css_248z from '../../styles/header-class.js';
 import css_248z$1 from '../../styles/svg.js';

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, nothing } from \"lit\";\nimport { property, query } from \"lit/decorators.js\";\nimport { classMap } from \"lit/directives/class-map.js\";\nimport { ifDefined } from \"lit/directives/if-defined.js\";\nimport { unsafeSVG } from \"lit/directives/unsafe-svg.js\";\nimport SgdsElement from \"../../base/sgds-element\";\nimport { animateTo, stopAnimations } from \"../../utils/animate\";\nimport { getAnimation, setDefaultAnimation } from \"../../utils/animation-registry\";\nimport { waitForEvent } from \"../../utils/event\";\nimport Modal from \"../../utils/modal\";\nimport { lockBodyScrolling, unlockBodyScrolling } from \"../../utils/scroll\";\nimport { HasSlotController } from \"../../utils/slot\";\nimport { watch } from \"../../utils/watch\";\nimport modalStyle from \"./modal.css\";\nimport { ScopedElementsMixin } from \"@open-wc/scoped-elements/lit-element.js\";\nimport SgdsCloseButton from \"../../internals/CloseButton/sgds-close-button\";\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 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 * @csspart base - The component's base wrapper\n * @csspart overlay - The overlay that covers the screen behind the dialog\n * @csspart panel - The modal's dialog panel\n * @csspart header - The modal's header that wraps the title, titleIcon and close button\n * @csspart title - The h3 element wrapping title and titleIcon\n * @csspart body - The modal's body where the content lies\n * @csspart footers - The modal's footer\n *\n * @cssproperty --modal-panel-padding - The general modal padding of modal component. Applied to body, footer and header.\n * @cssproperty --modal-panel-z-index - The z-index of modal panel\n * @cssproperty --modal-panel-width - The width of modal panel.\n * @cssproperty --modal-panel-height - The height of modal panel.\n * @cssproperty --modal-panel-bg - The background color of modal panel\n * @cssproperty --modal-panel-border-radius - The border radius of modal panel\n * @cssproperty --modal-header-border-bottom - The bottom border of header\n * @cssproperty --modal-overlay-bg - The overlay's background color\n */\nexport class SgdsModal extends ScopedElementsMixin(SgdsElement) {\n  static styles = [...SgdsElement.styles, headerStyles, svgStyles, modalStyle];\n  /**@internal */\n  static get scopedElements() {\n    return {\n      \"sgds-close-button\": SgdsCloseButton\n    };\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\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  /**The modal's title as displayed in the header */\n  @property({ reflect: true }) title = \"\";\n  /**The modal's icon as displayed in the header. Pass in SVG format icons as string directly  */\n  @property({ reflect: true }) titleIcon = \"\";\n  /** Disables the header. This will also remove the default close button */\n  @property({ type: Boolean, reflect: true }) noHeader = false;\n  /** Centers the modal vertically in page */\n  @property({ type: Boolean, reflect: true }) centered = false;\n  /** Centers the contents inside the modal */\n  @property({ type: Boolean, reflect: true }) centeredAlignVariant = false;\n  /** Removes the default animation when opening and closing of modal */\n  @property({ type: Boolean, reflect: true }) noAnimation = false;\n  /** Removes the close button from modal header */\n  @property({ type: Boolean, reflect: true }) noCloseButton = false;\n\n  connectedCallback() {\n    super.connectedCallback();\n    this.handleDocumentKeyDown = this.handleDocumentKeyDown.bind(this);\n    this.modal = new Modal(this);\n  }\n\n  firstUpdated() {\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  disconnectedCallback() {\n    super.disconnectedCallback();\n    unlockBodyScrolling(this);\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  @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    } 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  }\n\n  render() {\n    const withLabelIcon = html`${unsafeSVG(this.titleIcon)}`;\n    return html`\n      <div\n        part=\"base\"\n        class=${classMap({\n          modal: true,\n          \"modal--open\": this.open,\n          \"modal--has-footer\": this.hasSlotController.test(\"footer\"),\n          centered: this.centered\n        })}\n      >\n        <div part=\"overlay\" class=\"modal-overlay\" @click=${() => this.requestClose(\"overlay\")}></div>\n\n        <div\n          part=\"panel\"\n          class=\"modal-panel\"\n          role=\"dialog\"\n          aria-modal=\"true\"\n          aria-hidden=${this.open ? \"false\" : \"true\"}\n          aria-label=${ifDefined(this.noHeader ? this.title : undefined)}\n          aria-labelledby=${ifDefined(!this.noHeader ? \"title\" : undefined)}\n          tabindex=\"-1\"\n        >\n          ${!this.noHeader\n            ? html`\n                <div\n                  part=\"header\"\n                  class=${classMap({\n                    \"modal-header\": true,\n                    centered: this.centeredAlignVariant\n                  })}\n                >\n                  <h3\n                    part=\"title\"\n                    class=${classMap({\n                      \"modal-title\": true,\n                      centered: this.centeredAlignVariant\n                    })}\n                    id=\"title\"\n                    tabindex=\"-1\"\n                  >\n                    ${this.titleIcon ? withLabelIcon : \"\"} ${this.title}\n                  </h3>\n                  ${this.noCloseButton\n                    ? nothing\n                    : html`<sgds-close-button\n                        class=${classMap({\n                          \"modal-close\": true,\n                          centered: this.centeredAlignVariant\n                        })}\n                        @click=\"${() => this.requestClose(\"close-button\")}\"\n                        ariaLabel=\"close modal\"\n                      ></sgds-close-button>`}\n                </div>\n              `\n            : \"\"}\n\n          <div\n            part=\"body\"\n            class=${classMap({\n              \"modal-body\": true,\n              centered: this.centeredAlignVariant\n            })}\n          >\n            <slot></slot>\n          </div>\n\n          <footer\n            part=\"footer\"\n            class=${classMap({\n              \"modal-footer\": true,\n              centered: this.centeredAlignVariant\n            })}\n          >\n            <slot name=\"footer\"></slot>\n          </footer>\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, nothing } from \"lit\";\nimport { property, query } from \"lit/decorators.js\";\nimport { classMap } from \"lit/directives/class-map.js\";\nimport { ifDefined } from \"lit/directives/if-defined.js\";\nimport { unsafeSVG } from \"lit/directives/unsafe-svg.js\";\nimport SgdsElement from \"../../base/sgds-element\";\nimport { animateTo, stopAnimations } from \"../../utils/animate\";\nimport { getAnimation, setDefaultAnimation } from \"../../utils/animation-registry\";\nimport { waitForEvent } from \"../../utils/event\";\nimport Modal from \"../../utils/modal\";\nimport { lockBodyScrolling, unlockBodyScrolling } from \"../../utils/scroll\";\nimport { HasSlotController } from \"../../utils/slot\";\nimport { watch } from \"../../utils/watch\";\nimport modalStyle from \"./modal.css\";\nimport { ScopedElementsMixin } from \"@open-wc/scoped-elements\";\nimport SgdsCloseButton from \"../../internals/CloseButton/sgds-close-button\";\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 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 * @csspart base - The component's base wrapper\n * @csspart overlay - The overlay that covers the screen behind the dialog\n * @csspart panel - The modal's dialog panel\n * @csspart header - The modal's header that wraps the title, titleIcon and close button\n * @csspart title - The h3 element wrapping title and titleIcon\n * @csspart body - The modal's body where the content lies\n * @csspart footers - The modal's footer\n *\n * @cssproperty --modal-panel-padding - The general modal padding of modal component. Applied to body, footer and header.\n * @cssproperty --modal-panel-z-index - The z-index of modal panel\n * @cssproperty --modal-panel-width - The width of modal panel.\n * @cssproperty --modal-panel-height - The height of modal panel.\n * @cssproperty --modal-panel-bg - The background color of modal panel\n * @cssproperty --modal-panel-border-radius - The border radius of modal panel\n * @cssproperty --modal-header-border-bottom - The bottom border of header\n * @cssproperty --modal-overlay-bg - The overlay's background color\n */\nexport class SgdsModal extends ScopedElementsMixin(SgdsElement) {\n  static styles = [...SgdsElement.styles, headerStyles, svgStyles, modalStyle];\n  /**@internal */\n  static get scopedElements() {\n    return {\n      \"sgds-close-button\": SgdsCloseButton\n    };\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\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  /**The modal's title as displayed in the header */\n  @property({ reflect: true }) title = \"\";\n  /**The modal's icon as displayed in the header. Pass in SVG format icons as string directly  */\n  @property({ reflect: true }) titleIcon = \"\";\n  /** Disables the header. This will also remove the default close button */\n  @property({ type: Boolean, reflect: true }) noHeader = false;\n  /** Centers the modal vertically in page */\n  @property({ type: Boolean, reflect: true }) centered = false;\n  /** Centers the contents inside the modal */\n  @property({ type: Boolean, reflect: true }) centeredAlignVariant = false;\n  /** Removes the default animation when opening and closing of modal */\n  @property({ type: Boolean, reflect: true }) noAnimation = false;\n  /** Removes the close button from modal header */\n  @property({ type: Boolean, reflect: true }) noCloseButton = false;\n\n  connectedCallback() {\n    super.connectedCallback();\n    this.handleDocumentKeyDown = this.handleDocumentKeyDown.bind(this);\n    this.modal = new Modal(this);\n  }\n\n  firstUpdated() {\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  disconnectedCallback() {\n    super.disconnectedCallback();\n    unlockBodyScrolling(this);\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  @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    } 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  }\n\n  render() {\n    const withLabelIcon = html`${unsafeSVG(this.titleIcon)}`;\n    return html`\n      <div\n        part=\"base\"\n        class=${classMap({\n          modal: true,\n          \"modal--open\": this.open,\n          \"modal--has-footer\": this.hasSlotController.test(\"footer\"),\n          centered: this.centered\n        })}\n      >\n        <div part=\"overlay\" class=\"modal-overlay\" @click=${() => this.requestClose(\"overlay\")}></div>\n\n        <div\n          part=\"panel\"\n          class=\"modal-panel\"\n          role=\"dialog\"\n          aria-modal=\"true\"\n          aria-hidden=${this.open ? \"false\" : \"true\"}\n          aria-label=${ifDefined(this.noHeader ? this.title : undefined)}\n          aria-labelledby=${ifDefined(!this.noHeader ? \"title\" : undefined)}\n          tabindex=\"-1\"\n        >\n          ${!this.noHeader\n            ? html`\n                <div\n                  part=\"header\"\n                  class=${classMap({\n                    \"modal-header\": true,\n                    centered: this.centeredAlignVariant\n                  })}\n                >\n                  <h3\n                    part=\"title\"\n                    class=${classMap({\n                      \"modal-title\": true,\n                      centered: this.centeredAlignVariant\n                    })}\n                    id=\"title\"\n                    tabindex=\"-1\"\n                  >\n                    ${this.titleIcon ? withLabelIcon : \"\"} ${this.title}\n                  </h3>\n                  ${this.noCloseButton\n                    ? nothing\n                    : html`<sgds-close-button\n                        class=${classMap({\n                          \"modal-close\": true,\n                          centered: this.centeredAlignVariant\n                        })}\n                        @click=\"${() => this.requestClose(\"close-button\")}\"\n                        ariaLabel=\"close modal\"\n                      ></sgds-close-button>`}\n                </div>\n              `\n            : \"\"}\n\n          <div\n            part=\"body\"\n            class=${classMap({\n              \"modal-body\": true,\n              centered: this.centeredAlignVariant\n            })}\n          >\n            <slot></slot>\n          </div>\n\n          <footer\n            part=\"footer\"\n            class=${classMap({\n              \"modal-footer\": true,\n              centered: this.centeredAlignVariant\n            })}\n          >\n            <slot name=\"footer\"></slot>\n          </footer>\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/Progress/index.umd.js

@@ -3190,9 +3190,7 @@
      */
     const styleMap = directive(StyleMapDirective);
 
-    var css_248z = css`:host{width:100%}:host([variant=secondary]) .progress-bar{--sgds-progress-bar-bg:var(--sgds-secondary-filled)}:host([variant=warning]) .progress-bar{--sgds-progress-bar-bg:var(--sgds-warning-filled)}:host([variant=danger]) .progress-bar{--sgds-progress-bar-bg:var(--sgds-danger-filled)}:host([variant=success]) .progress-bar{--sgds-progress-bar-bg:var(--sgds-success-filled)}:host([variant=info]) .progress-bar{--sgds-progress-bar-bg:var(--sgds-info-filled)}:host([variant=dark]) .progress-bar{--sgds-progress-bar-bg:var(--sgds-dark-filled)}progress{vertical-align:baseline}.progress-bar{--sgds-progress-bar-bg:var(--sgds-primary-filled);--sgds-progress-bar-transition:width 0.6s ease;--sgds-progress-bar-color:var(--sgds-white);--sgds-progress-bar-font-size:0.75rem;background-color:var(--sgds-progress-bar-bg);color:var(--sgds-progress-bar-color);display:flex;flex-direction:column;font-size:var(--sgds-progress-bar-font-size);height:100%;justify-content:center;overflow:hidden;text-align:center;transition:var(--sgds-progress-bar-transition);white-space:nowrap}@media (prefers-reduced-motion:reduce){.progress-bar{transition:none}}.progress-bar-striped{background-image:linear-gradient(45deg,hsla(0,0%,100%,.15) 25%,transparent 0,transparent 50%,hsla(0,0%,100%,.15) 0,hsla(0,0%,100%,.15) 75%,transparent 0,transparent);background-size:var(--sgds-progress-height) var(--sgds-progress-height)}.progress-bar-animated{animation:progress-bar-stripes 1s linear infinite}@media (prefers-reduced-motion:reduce){.progress-bar-animated{animation:none}}
-
-/*! CSS Used keyframes */@keyframes progress-bar-stripes{0%{background-position-x:1rem}}`;
+    var css_248z = css`:host{width:100%}:host([variant=secondary]) .progress-bar{--sgds-progress-bar-bg:var(--sgds-secondary)}:host([variant=warning]) .progress-bar{--sgds-progress-bar-bg:var(--sgds-warning)}:host([variant=danger]) .progress-bar{--sgds-progress-bar-bg:var(--sgds-danger)}:host([variant=success]) .progress-bar{--sgds-progress-bar-bg:var(--sgds-success)}:host([variant=info]) .progress-bar{--sgds-progress-bar-bg:var(--sgds-info)}:host([variant=dark]) .progress-bar{--sgds-progress-bar-bg:var(--sgds-dark)}progress{vertical-align:baseline}.progress-bar{--sgds-progress-bar-bg:var(--sgds-primary);--sgds-progress-bar-transition:width 0.6s ease;--sgds-progress-bar-color:var(--sgds-white);--sgds-progress-bar-font-size:0.75rem;background-color:var(--sgds-progress-bar-bg);color:var(--sgds-progress-bar-color);display:flex;flex-direction:column;font-size:var(--sgds-progress-bar-font-size);height:100%;justify-content:center;overflow:hidden;text-align:center;transition:var(--sgds-progress-bar-transition);white-space:nowrap}@media (prefers-reduced-motion:reduce){.progress-bar{transition:none}}`;
 
     class SgdsProgressBar extends SgdsElement {
         constructor() {
@@ -3201,14 +3199,6 @@
              * Sets the aria label for assistive devices.
              */
             this.arialabel = "";
-            /** Apply a stripe over the progress bar */
-            this.striped = false;
-            /**
-             * Animated stripes over the progress bar.
-             *
-             * Use in conjunction with striped property
-             */
-            this.animated = false;
             /** Add label on top of progress bar */
             this.label = "";
         }
@@ -3216,9 +3206,7 @@
             return html `
       <div
         class=${classMap({
-            "progress-bar": true,
-            "progress-bar-striped": this.striped,
-            "progress-bar-animated": this.animated
+            "progress-bar": true
         })}
         role="progressbar"
         style=${styleMap({ width: `${this.value}%` })}
@@ -3248,12 +3236,6 @@
     __decorate([
         property({ type: String, reflect: true })
     ], SgdsProgressBar.prototype, "arialabel", void 0);
-    __decorate([
-        property({ type: Boolean, reflect: true })
-    ], SgdsProgressBar.prototype, "striped", void 0);
-    __decorate([
-        property({ type: Boolean, reflect: true })
-    ], SgdsProgressBar.prototype, "animated", void 0);
     __decorate([
         property({ type: String, reflect: true })
     ], SgdsProgressBar.prototype, "label", void 0);