@govtechsg/sgds-web-component 2.1.0 → 2.1.2

package/react/components/Tooltip/sgds-tooltip.cjs.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"sgds-tooltip.cjs.js","sources":["../../../../src/components/Tooltip/sgds-tooltip.ts"],"sourcesContent":["import type { Options as PopperOptions } from \"@popperjs/core\";\nimport Tooltip from \"bootstrap/js/src/tooltip\";\nimport type { Tooltip as BsTooltip } from \"bootstrap\";\n\nimport { html } from \"lit\";\nimport { property, queryAssignedElements, state } from \"lit/decorators.js\";\nimport { Ref, createRef, ref } from \"lit/directives/ref.js\";\nimport SgdsElement from \"../../base/sgds-element\";\nimport tooltipStyle from \"./tooltip.css\";\n/**\n * @summary Tooltips display more information when users hover over, focus on, or interact with an element.\n * @slot default - The element to target the tooltip to.\n *\n * @cssproperty --tooltip-max-width - The max width of tooltip\n *\n */\nexport class SgdsTooltip extends SgdsElement {\n  static styles = [...SgdsElement.styles, tooltipStyle];\n\n  private myTooltip: Ref<HTMLElement> = createRef();\n\n  private bsTooltip: BsTooltip = null;\n\n  /** The tooltip's content. Content has to be textual */\n  @property({ type: String })\n  content = \"\";\n  /** The placement of tooltip relative to its target */\n  @property({ type: String })\n  placement: \"top\" | \"bottom\" | \"left\" | \"right\" = \"top\";\n  /** The method to invoke the tooltip. `hover focus` is the default value which allows tooltip to be triggered via mouse hover and keyboard focus. Add `tabindex=0 `for HTMLelements that are not tabbable. */\n  @property({ type: String })\n  trigger: \"click\" | \"hover\" | \"focus\" | \"hover focus\" = \"hover focus\";\n\n  /**@internal */\n  @state()\n  private popperConfig: Partial<PopperOptions>;\n  /**@internal */\n\n  private tooltipConfig: Partial<BsTooltip.Options>;\n  /**@internal */\n  @queryAssignedElements()\n  private tooltipTargetElements: Array<HTMLElement>;\n\n  private _handleSlotChange(): void {\n    // For a11y purpose\n    this.tooltipTargetElements.forEach(el => el.setAttribute(\"data-sgds-tooltip\", this.content));\n  }\n\n  private _handleClickOutOfElement(e: MouseEvent | TouchEvent, self: SgdsTooltip) {\n    if (!e.composedPath().includes(self)) {\n      this.hide();\n    }\n  }\n\n  connectedCallback() {\n    super.connectedCallback();\n\n    if (this.trigger === \"click\") {\n      document.addEventListener(\"click\", (event: MouseEvent) => this._handleClickOutOfElement(event, this));\n      document.addEventListener(\"touchstart\", (event: TouchEvent) => this._handleClickOutOfElement(event, this));\n    }\n  }\n\n  disconnectedCallback() {\n    super.disconnectedCallback();\n\n    document.removeEventListener(\"click\", (event: MouseEvent) => this._handleClickOutOfElement(event, this));\n    document.removeEventListener(\"touchstart\", (event: TouchEvent) => this._handleClickOutOfElement(event, this));\n  }\n\n  private initializeTooltip() {\n    this.tooltipConfig = {\n      popperConfig: (defaultConfig?: Partial<PopperOptions>) => {\n        this.popperConfig = defaultConfig;\n        const defaultModifiers = defaultConfig.modifiers;\n        const newModifiers = defaultModifiers.map(mod => {\n          if (mod.name === \"flip\") {\n            mod.options.fallbackPlacements = [];\n          }\n          return mod;\n        });\n        this.popperConfig.modifiers = newModifiers;\n        return this.popperConfig;\n      },\n      placement: this.placement,\n      trigger: this.trigger,\n      title: this.content,\n      html: true,\n      container: this.shadowRoot.querySelector(\"div\") // tooltip to appear inside the shadow root of sgds-tooltip instead of anywhere in the DOM, so that scoped styles can apply\n    } as Partial<BsTooltip.Options>;\n    this.bsTooltip = new Tooltip(this.myTooltip.value, this.tooltipConfig);\n  }\n\n  firstUpdated() {\n    this.initializeTooltip();\n    this.myTooltip.value.addEventListener(\"show.bs.tooltip\", () => {\n      this.emit(\"sgds-show\");\n    });\n    this.myTooltip.value.addEventListener(\"shown.bs.tooltip\", () => {\n      this.emit(\"sgds-after-show\");\n    });\n    this.myTooltip.value.addEventListener(\"hide.bs.tooltip\", () => {\n      this.emit(\"sgds-hide\");\n    });\n    this.myTooltip.value.addEventListener(\"hidden.bs.tooltip\", () => {\n      this.emit(\"sgds-after-hide\");\n    });\n  }\n  /** Hides the Tooltip */\n  public hide() {\n    this.bsTooltip.hide();\n  }\n  /** Shows the Tooltip */\n  public show() {\n    this.bsTooltip.show();\n  }\n\n  render() {\n    return html`\n      <div ${ref(this.myTooltip)}>\n        <slot @slotchange=${this._handleSlotChange}></slot>\n      </div>\n    `;\n  }\n}\n\nexport default SgdsTooltip;\n"],"names":["SgdsElement","createRef","Tooltip","html","ref","tooltipStyle","__decorate","property","state","queryAssignedElements"],"mappings":"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"}

package/react/components/Tooltip/sgds-tooltip.js

@@ -0,0 +1,121 @@
+'use client';
+import { __decorate } from 'tslib';
+import Tooltip from 'bootstrap/js/src/tooltip';
+import { html } from 'lit';
+import { property, state, queryAssignedElements } from 'lit/decorators.js';
+import { createRef, ref } from 'lit/directives/ref.js';
+import SgdsElement from '../../base/sgds-element.js';
+import css_248z from './tooltip.js';
+
+/**
+ * @summary Tooltips display more information when users hover over, focus on, or interact with an element.
+ * @slot default - The element to target the tooltip to.
+ *
+ * @cssproperty --tooltip-max-width - The max width of tooltip
+ *
+ */
+class SgdsTooltip extends SgdsElement {
+    constructor() {
+        super(...arguments);
+        this.myTooltip = createRef();
+        this.bsTooltip = null;
+        /** The tooltip's content. Content has to be textual */
+        this.content = "";
+        /** The placement of tooltip relative to its target */
+        this.placement = "top";
+        /** The method to invoke the tooltip. `hover focus` is the default value which allows tooltip to be triggered via mouse hover and keyboard focus. Add `tabindex=0 `for HTMLelements that are not tabbable. */
+        this.trigger = "hover focus";
+    }
+    _handleSlotChange() {
+        // For a11y purpose
+        this.tooltipTargetElements.forEach(el => el.setAttribute("data-sgds-tooltip", this.content));
+    }
+    _handleClickOutOfElement(e, self) {
+        if (!e.composedPath().includes(self)) {
+            this.hide();
+        }
+    }
+    connectedCallback() {
+        super.connectedCallback();
+        if (this.trigger === "click") {
+            document.addEventListener("click", (event) => this._handleClickOutOfElement(event, this));
+            document.addEventListener("touchstart", (event) => this._handleClickOutOfElement(event, this));
+        }
+    }
+    disconnectedCallback() {
+        super.disconnectedCallback();
+        document.removeEventListener("click", (event) => this._handleClickOutOfElement(event, this));
+        document.removeEventListener("touchstart", (event) => this._handleClickOutOfElement(event, this));
+    }
+    initializeTooltip() {
+        this.tooltipConfig = {
+            popperConfig: (defaultConfig) => {
+                this.popperConfig = defaultConfig;
+                const defaultModifiers = defaultConfig.modifiers;
+                const newModifiers = defaultModifiers.map(mod => {
+                    if (mod.name === "flip") {
+                        mod.options.fallbackPlacements = [];
+                    }
+                    return mod;
+                });
+                this.popperConfig.modifiers = newModifiers;
+                return this.popperConfig;
+            },
+            placement: this.placement,
+            trigger: this.trigger,
+            title: this.content,
+            html: true,
+            container: this.shadowRoot.querySelector("div") // tooltip to appear inside the shadow root of sgds-tooltip instead of anywhere in the DOM, so that scoped styles can apply
+        };
+        this.bsTooltip = new Tooltip(this.myTooltip.value, this.tooltipConfig);
+    }
+    firstUpdated() {
+        this.initializeTooltip();
+        this.myTooltip.value.addEventListener("show.bs.tooltip", () => {
+            this.emit("sgds-show");
+        });
+        this.myTooltip.value.addEventListener("shown.bs.tooltip", () => {
+            this.emit("sgds-after-show");
+        });
+        this.myTooltip.value.addEventListener("hide.bs.tooltip", () => {
+            this.emit("sgds-hide");
+        });
+        this.myTooltip.value.addEventListener("hidden.bs.tooltip", () => {
+            this.emit("sgds-after-hide");
+        });
+    }
+    /** Hides the Tooltip */
+    hide() {
+        this.bsTooltip.hide();
+    }
+    /** Shows the Tooltip */
+    show() {
+        this.bsTooltip.show();
+    }
+    render() {
+        return html `
+      <div ${ref(this.myTooltip)}>
+        <slot @slotchange=${this._handleSlotChange}></slot>
+      </div>
+    `;
+    }
+}
+SgdsTooltip.styles = [...SgdsElement.styles, css_248z];
+__decorate([
+    property({ type: String })
+], SgdsTooltip.prototype, "content", void 0);
+__decorate([
+    property({ type: String })
+], SgdsTooltip.prototype, "placement", void 0);
+__decorate([
+    property({ type: String })
+], SgdsTooltip.prototype, "trigger", void 0);
+__decorate([
+    state()
+], SgdsTooltip.prototype, "popperConfig", void 0);
+__decorate([
+    queryAssignedElements()
+], SgdsTooltip.prototype, "tooltipTargetElements", void 0);
+
+export { SgdsTooltip, SgdsTooltip as default };
+//# sourceMappingURL=sgds-tooltip.js.map

package/react/components/Tooltip/sgds-tooltip.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"sgds-tooltip.js","sources":["../../../../src/components/Tooltip/sgds-tooltip.ts"],"sourcesContent":["import type { Options as PopperOptions } from \"@popperjs/core\";\nimport Tooltip from \"bootstrap/js/src/tooltip\";\nimport type { Tooltip as BsTooltip } from \"bootstrap\";\n\nimport { html } from \"lit\";\nimport { property, queryAssignedElements, state } from \"lit/decorators.js\";\nimport { Ref, createRef, ref } from \"lit/directives/ref.js\";\nimport SgdsElement from \"../../base/sgds-element\";\nimport tooltipStyle from \"./tooltip.css\";\n/**\n * @summary Tooltips display more information when users hover over, focus on, or interact with an element.\n * @slot default - The element to target the tooltip to.\n *\n * @cssproperty --tooltip-max-width - The max width of tooltip\n *\n */\nexport class SgdsTooltip extends SgdsElement {\n  static styles = [...SgdsElement.styles, tooltipStyle];\n\n  private myTooltip: Ref<HTMLElement> = createRef();\n\n  private bsTooltip: BsTooltip = null;\n\n  /** The tooltip's content. Content has to be textual */\n  @property({ type: String })\n  content = \"\";\n  /** The placement of tooltip relative to its target */\n  @property({ type: String })\n  placement: \"top\" | \"bottom\" | \"left\" | \"right\" = \"top\";\n  /** The method to invoke the tooltip. `hover focus` is the default value which allows tooltip to be triggered via mouse hover and keyboard focus. Add `tabindex=0 `for HTMLelements that are not tabbable. */\n  @property({ type: String })\n  trigger: \"click\" | \"hover\" | \"focus\" | \"hover focus\" = \"hover focus\";\n\n  /**@internal */\n  @state()\n  private popperConfig: Partial<PopperOptions>;\n  /**@internal */\n\n  private tooltipConfig: Partial<BsTooltip.Options>;\n  /**@internal */\n  @queryAssignedElements()\n  private tooltipTargetElements: Array<HTMLElement>;\n\n  private _handleSlotChange(): void {\n    // For a11y purpose\n    this.tooltipTargetElements.forEach(el => el.setAttribute(\"data-sgds-tooltip\", this.content));\n  }\n\n  private _handleClickOutOfElement(e: MouseEvent | TouchEvent, self: SgdsTooltip) {\n    if (!e.composedPath().includes(self)) {\n      this.hide();\n    }\n  }\n\n  connectedCallback() {\n    super.connectedCallback();\n\n    if (this.trigger === \"click\") {\n      document.addEventListener(\"click\", (event: MouseEvent) => this._handleClickOutOfElement(event, this));\n      document.addEventListener(\"touchstart\", (event: TouchEvent) => this._handleClickOutOfElement(event, this));\n    }\n  }\n\n  disconnectedCallback() {\n    super.disconnectedCallback();\n\n    document.removeEventListener(\"click\", (event: MouseEvent) => this._handleClickOutOfElement(event, this));\n    document.removeEventListener(\"touchstart\", (event: TouchEvent) => this._handleClickOutOfElement(event, this));\n  }\n\n  private initializeTooltip() {\n    this.tooltipConfig = {\n      popperConfig: (defaultConfig?: Partial<PopperOptions>) => {\n        this.popperConfig = defaultConfig;\n        const defaultModifiers = defaultConfig.modifiers;\n        const newModifiers = defaultModifiers.map(mod => {\n          if (mod.name === \"flip\") {\n            mod.options.fallbackPlacements = [];\n          }\n          return mod;\n        });\n        this.popperConfig.modifiers = newModifiers;\n        return this.popperConfig;\n      },\n      placement: this.placement,\n      trigger: this.trigger,\n      title: this.content,\n      html: true,\n      container: this.shadowRoot.querySelector(\"div\") // tooltip to appear inside the shadow root of sgds-tooltip instead of anywhere in the DOM, so that scoped styles can apply\n    } as Partial<BsTooltip.Options>;\n    this.bsTooltip = new Tooltip(this.myTooltip.value, this.tooltipConfig);\n  }\n\n  firstUpdated() {\n    this.initializeTooltip();\n    this.myTooltip.value.addEventListener(\"show.bs.tooltip\", () => {\n      this.emit(\"sgds-show\");\n    });\n    this.myTooltip.value.addEventListener(\"shown.bs.tooltip\", () => {\n      this.emit(\"sgds-after-show\");\n    });\n    this.myTooltip.value.addEventListener(\"hide.bs.tooltip\", () => {\n      this.emit(\"sgds-hide\");\n    });\n    this.myTooltip.value.addEventListener(\"hidden.bs.tooltip\", () => {\n      this.emit(\"sgds-after-hide\");\n    });\n  }\n  /** Hides the Tooltip */\n  public hide() {\n    this.bsTooltip.hide();\n  }\n  /** Shows the Tooltip */\n  public show() {\n    this.bsTooltip.show();\n  }\n\n  render() {\n    return html`\n      <div ${ref(this.myTooltip)}>\n        <slot @slotchange=${this._handleSlotChange}></slot>\n      </div>\n    `;\n  }\n}\n\nexport default SgdsTooltip;\n"],"names":["tooltipStyle"],"mappings":"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"}

package/react/components/Tooltip/tooltip.js

@@ -0,0 +1,7 @@
+'use client';
+import { css } from 'lit';
+
+var css_248z = css`:host{--tooltip-max-width:20rem;display:inline-block}.tooltip{word-wrap:break-word;display:block;font-size:.875rem;line-break:auto;opacity:0;text-align:left;text-decoration:none;text-shadow:none;text-transform:none;white-space:normal;word-break:normal;word-spacing:normal;z-index:1080}.tooltip.show{opacity:.9}.tooltip-inner{background-color:var(--sgds-gray-600);border-radius:var(--sgds-border-radius);color:var(--sgds-body-bg);max-width:var(--tooltip-max-width);padding:var(--sgds-spacer-1) var(--sgds-spacer-2);text-align:center}div{max-width:fit-content}`;
+
+export { css_248z as default };
+//# sourceMappingURL=tooltip.js.map

package/react/components/Tooltip/tooltip.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"tooltip.js","sources":[],"sourcesContent":[],"names":[],"mappings":";;;;;;;"}

package/react/datepicker/index.cjs.js

@@ -5,7 +5,7 @@ Object.defineProperty(exports, '__esModule', { value: true });
 
 var React = require('react');
 var react = require('@lit-labs/react');
-var sgdsDatepicker = require('../../components/Datepicker/sgds-datepicker.cjs.js');
+var sgdsDatepicker = require('../components/Datepicker/sgds-datepicker.cjs.js');
 
 function _interopNamespace(e) {
   if (e && e.__esModule) return e;

package/react/datepicker/index.js

@@ -1,7 +1,7 @@
 'use client';
 import * as React from 'react';
 import { createComponent } from '@lit-labs/react';
-import { SgdsDatepicker } from '../../components/Datepicker/sgds-datepicker.js';
+import { SgdsDatepicker } from '../components/Datepicker/sgds-datepicker.js';
 
 customElements.define("sgds-datepicker", SgdsDatepicker);
 var index = createComponent({

package/react/drawer/index.cjs.js

@@ -5,7 +5,7 @@ Object.defineProperty(exports, '__esModule', { value: true });
 
 var React = require('react');
 var react = require('@lit-labs/react');
-var sgdsDrawer = require('../../components/Drawer/sgds-drawer.cjs.js');
+var sgdsDrawer = require('../components/Drawer/sgds-drawer.cjs.js');
 
 function _interopNamespace(e) {
   if (e && e.__esModule) return e;

package/react/drawer/index.js

@@ -1,7 +1,7 @@
 'use client';
 import * as React from 'react';
 import { createComponent } from '@lit-labs/react';
-import { SgdsDrawer } from '../../components/Drawer/sgds-drawer.js';
+import { SgdsDrawer } from '../components/Drawer/sgds-drawer.js';
 
 customElements.define("sgds-drawer", SgdsDrawer);
 var index = createComponent({

package/react/dropdown/index.cjs.js

@@ -5,7 +5,7 @@ Object.defineProperty(exports, '__esModule', { value: true });
 
 var React = require('react');
 var react = require('@lit-labs/react');
-var sgdsDropdown = require('../../components/Dropdown/sgds-dropdown.cjs.js');
+var sgdsDropdown = require('../components/Dropdown/sgds-dropdown.cjs.js');
 
 function _interopNamespace(e) {
   if (e && e.__esModule) return e;

package/react/dropdown/index.js

@@ -1,7 +1,7 @@
 'use client';
 import * as React from 'react';
 import { createComponent } from '@lit-labs/react';
-import { SgdsDropdown } from '../../components/Dropdown/sgds-dropdown.js';
+import { SgdsDropdown } from '../components/Dropdown/sgds-dropdown.js';
 
 customElements.define("sgds-dropdown", SgdsDropdown);
 var index = createComponent({

package/react/dropdown-item/index.cjs.js

@@ -5,7 +5,7 @@ Object.defineProperty(exports, '__esModule', { value: true });
 
 var React = require('react');
 var react = require('@lit-labs/react');
-var sgdsDropdownItem = require('../../components/Dropdown/sgds-dropdown-item.cjs.js');
+var sgdsDropdownItem = require('../components/Dropdown/sgds-dropdown-item.cjs.js');
 
 function _interopNamespace(e) {
   if (e && e.__esModule) return e;

package/react/dropdown-item/index.js

@@ -1,7 +1,7 @@
 'use client';
 import * as React from 'react';
 import { createComponent } from '@lit-labs/react';
-import { SgdsDropdownItem } from '../../components/Dropdown/sgds-dropdown-item.js';
+import { SgdsDropdownItem } from '../components/Dropdown/sgds-dropdown-item.js';
 
 customElements.define("sgds-dropdown-item", SgdsDropdownItem);
 var index = createComponent({

package/react/file-upload/index.cjs.js

@@ -5,7 +5,7 @@ Object.defineProperty(exports, '__esModule', { value: true });
 
 var React = require('react');
 var react = require('@lit-labs/react');
-var sgdsFileUpload = require('../../components/FileUpload/sgds-file-upload.cjs.js');
+var sgdsFileUpload = require('../components/FileUpload/sgds-file-upload.cjs.js');
 
 function _interopNamespace(e) {
   if (e && e.__esModule) return e;

package/react/file-upload/index.js

@@ -1,7 +1,7 @@
 'use client';
 import * as React from 'react';
 import { createComponent } from '@lit-labs/react';
-import { SgdsFileUpload } from '../../components/FileUpload/sgds-file-upload.js';
+import { SgdsFileUpload } from '../components/FileUpload/sgds-file-upload.js';
 
 customElements.define("sgds-file-upload", SgdsFileUpload);
 var index = createComponent({

package/react/footer/index.cjs.js

@@ -5,7 +5,7 @@ Object.defineProperty(exports, '__esModule', { value: true });
 
 var React = require('react');
 var react = require('@lit-labs/react');
-var sgdsFooter = require('../../components/Footer/sgds-footer.cjs.js');
+var sgdsFooter = require('../components/Footer/sgds-footer.cjs.js');
 
 function _interopNamespace(e) {
   if (e && e.__esModule) return e;

package/react/footer/index.js

@@ -1,7 +1,7 @@
 'use client';
 import * as React from 'react';
 import { createComponent } from '@lit-labs/react';
-import { SgdsFooter } from '../../components/Footer/sgds-footer.js';
+import { SgdsFooter } from '../components/Footer/sgds-footer.js';
 
 customElements.define("sgds-footer", SgdsFooter);
 var index = createComponent({

package/react/input/index.cjs.js

@@ -5,7 +5,7 @@ Object.defineProperty(exports, '__esModule', { value: true });
 
 var React = require('react');
 var react = require('@lit-labs/react');
-var sgdsInput = require('../../components/Input/sgds-input.cjs.js');
+var sgdsInput = require('../components/Input/sgds-input.cjs.js');
 
 function _interopNamespace(e) {
   if (e && e.__esModule) return e;

package/react/input/index.js

@@ -1,7 +1,7 @@
 'use client';
 import * as React from 'react';
 import { createComponent } from '@lit-labs/react';
-import { SgdsInput } from '../../components/Input/sgds-input.js';
+import { SgdsInput } from '../components/Input/sgds-input.js';
 
 customElements.define("sgds-input", SgdsInput);
 var index = createComponent({

package/react/internals/CloseButton/close-button.js

@@ -0,0 +1,7 @@
+'use client';
+import { css } from 'lit';
+
+var css_248z = css`:host{display:inline-flex}:host(:focus){box-shadow:var(--sgds-focus-box-shadow)}.btn-close{--sgds-close-btn-image:url("data:image/svg+xml;charset=utf-8,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16' fill='currentColor'%3E%3Cpath d='M.293.293a1 1 0 0 1 1.414 0L8 6.586 14.293.293a1 1 0 1 1 1.414 1.414L9.414 8l6.293 6.293a1 1 0 0 1-1.414 1.414L8 9.414l-6.293 6.293a1 1 0 0 1-1.414-1.414L6.586 8 .293 1.707a1 1 0 0 1 0-1.414z'/%3E%3C/svg%3E");--sgds-close-btn-size:1rem;background-color:currentColor;border:0;border-radius:var(--sgds-border-radius);box-sizing:content-box;cursor:pointer;height:var(--sgds-close-btn-size);-webkit-mask-image:var(--sgds-close-btn-image);mask-image:var(--sgds-close-btn-image);-webkit-mask-position:center;mask-position:center;-webkit-mask-repeat:no-repeat;mask-repeat:no-repeat;opacity:1;padding:0;width:var(--sgds-close-btn-size)}.btn-close,.btn-close:hover{color:var(--sgds-body-color)}.btn-close:hover{opacity:.75;text-decoration:none}.btn-close:focus{box-shadow:var(--sgds-focus-box-shadow);opacity:1;outline:0}.btn-close.disabled,.btn-close:disabled{opacity:var(--sgds-disabled-opacity);pointer-events:none;user-select:none}`;
+
+export { css_248z as default };
+//# sourceMappingURL=close-button.js.map

package/react/internals/CloseButton/close-button.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"close-button.js","sources":[],"sourcesContent":[],"names":[],"mappings":";;;;;;;"}

package/react/internals/CloseButton/sgds-close-button.cjs.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"sgds-close-button.cjs.js","sources":["../../../../src/internals/CloseButton/sgds-close-button.ts"],"sourcesContent":["import { property } from \"lit/decorators.js\";\nimport SgdsElement from \"../../base/sgds-element\";\nimport { html } from \"lit\";\nimport { ifDefined } from \"lit/directives/if-defined.js\";\nimport closeButtonStyles from \"./close-button.css\";\nimport { classMap } from \"lit/directives/class-map.js\";\n/**\n * @summary Close button for closing actions. Used in Modal, Drawer, Alert and Toast.\n *\n */\nexport class SgdsCloseButton extends SgdsElement {\n  static styles = [closeButtonStyles];\n\n  @property({ type: String, reflect: true }) ariaLabel = \"Close button\";\n  /** The disabled state of the button */\n  @property({ type: Boolean, reflect: true }) disabled = false;\n\n  private _handleClick(event: MouseEvent) {\n    if (this.disabled) {\n      event.preventDefault();\n      event.stopPropagation();\n      return;\n    }\n\n    this.removeEventListener(\"click\", this._clickHandler);\n    this.addEventListener(\"click\", this._clickHandler);\n  }\n\n  private _clickHandler = () => {\n    return;\n  };\n\n  render() {\n    return html`\n      <button\n        class=${classMap({\n          \"btn-close\": true\n        })}\n        aria-label=${ifDefined(this.ariaLabel)}\n        @click=${this._handleClick}\n        ?disabled=${this.disabled}\n      ></button>\n    `;\n  }\n}\n\nexport default SgdsCloseButton;\n"],"names":["SgdsElement","html","classMap","ifDefined","closeButtonStyles","__decorate","property"],"mappings":";;;;;;;;;;;;;AAMA;;;AAGG;AACG,MAAO,eAAgB,SAAQA,sBAAW,CAAA;AAAhD,IAAA,WAAA,GAAA;;QAG6C,IAAS,CAAA,SAAA,GAAG,cAAc,CAAC;;QAE1B,IAAQ,CAAA,QAAA,GAAG,KAAK,CAAC;QAarD,IAAa,CAAA,aAAA,GAAG,MAAK;YAC3B,OAAO;AACT,SAAC,CAAC;KAcH;AA3BS,IAAA,YAAY,CAAC,KAAiB,EAAA;AACpC,QAAA,IAAI,IAAI,CAAC,QAAQ,EAAE;YACjB,KAAK,CAAC,cAAc,EAAE,CAAC;YACvB,KAAK,CAAC,eAAe,EAAE,CAAC;YACxB,OAAO;SACR;QAED,IAAI,CAAC,mBAAmB,CAAC,OAAO,EAAE,IAAI,CAAC,aAAa,CAAC,CAAC;QACtD,IAAI,CAAC,gBAAgB,CAAC,OAAO,EAAE,IAAI,CAAC,aAAa,CAAC,CAAC;KACpD;IAMD,MAAM,GAAA;AACJ,QAAA,OAAOC,QAAI,CAAA,CAAA;;AAEC,cAAA,EAAAC,oBAAQ,CAAC;AACf,YAAA,WAAW,EAAE,IAAI;SAClB,CAAC,CAAA;AACW,mBAAA,EAAAC,sBAAS,CAAC,IAAI,CAAC,SAAS,CAAC,CAAA;AAC7B,eAAA,EAAA,IAAI,CAAC,YAAY,CAAA;AACd,kBAAA,EAAA,IAAI,CAAC,QAAQ,CAAA;;KAE5B,CAAC;KACH;;AAhCM,eAAA,CAAA,MAAM,GAAG,CAACC,sBAAiB,CAAC,CAAC;AAEOC,gBAAA,CAAA;IAA1CC,sBAAQ,CAAC,EAAE,IAAI,EAAE,MAAM,EAAE,OAAO,EAAE,IAAI,EAAE,CAAC;AAA4B,CAAA,EAAA,eAAA,CAAA,SAAA,EAAA,WAAA,EAAA,KAAA,CAAA,CAAA,CAAA;AAE1BD,gBAAA,CAAA;IAA3CC,sBAAQ,CAAC,EAAE,IAAI,EAAE,OAAO,EAAE,OAAO,EAAE,IAAI,EAAE,CAAC;AAAkB,CAAA,EAAA,eAAA,CAAA,SAAA,EAAA,UAAA,EAAA,KAAA,CAAA,CAAA;;;;;"}

package/react/internals/CloseButton/sgds-close-button.js

@@ -0,0 +1,55 @@
+'use client';
+import { __decorate } from 'tslib';
+import { property } from 'lit/decorators.js';
+import SgdsElement from '../../base/sgds-element.js';
+import { html } from 'lit';
+import { ifDefined } from 'lit/directives/if-defined.js';
+import css_248z from './close-button.js';
+import { classMap } from 'lit/directives/class-map.js';
+
+/**
+ * @summary Close button for closing actions. Used in Modal, Drawer, Alert and Toast.
+ *
+ */
+class SgdsCloseButton extends SgdsElement {
+    constructor() {
+        super(...arguments);
+        this.ariaLabel = "Close button";
+        /** The disabled state of the button */
+        this.disabled = false;
+        this._clickHandler = () => {
+            return;
+        };
+    }
+    _handleClick(event) {
+        if (this.disabled) {
+            event.preventDefault();
+            event.stopPropagation();
+            return;
+        }
+        this.removeEventListener("click", this._clickHandler);
+        this.addEventListener("click", this._clickHandler);
+    }
+    render() {
+        return html `
+      <button
+        class=${classMap({
+            "btn-close": true
+        })}
+        aria-label=${ifDefined(this.ariaLabel)}
+        @click=${this._handleClick}
+        ?disabled=${this.disabled}
+      ></button>
+    `;
+    }
+}
+SgdsCloseButton.styles = [css_248z];
+__decorate([
+    property({ type: String, reflect: true })
+], SgdsCloseButton.prototype, "ariaLabel", void 0);
+__decorate([
+    property({ type: Boolean, reflect: true })
+], SgdsCloseButton.prototype, "disabled", void 0);
+
+export { SgdsCloseButton, SgdsCloseButton as default };
+//# sourceMappingURL=sgds-close-button.js.map

package/react/internals/CloseButton/sgds-close-button.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"sgds-close-button.js","sources":["../../../../src/internals/CloseButton/sgds-close-button.ts"],"sourcesContent":["import { property } from \"lit/decorators.js\";\nimport SgdsElement from \"../../base/sgds-element\";\nimport { html } from \"lit\";\nimport { ifDefined } from \"lit/directives/if-defined.js\";\nimport closeButtonStyles from \"./close-button.css\";\nimport { classMap } from \"lit/directives/class-map.js\";\n/**\n * @summary Close button for closing actions. Used in Modal, Drawer, Alert and Toast.\n *\n */\nexport class SgdsCloseButton extends SgdsElement {\n  static styles = [closeButtonStyles];\n\n  @property({ type: String, reflect: true }) ariaLabel = \"Close button\";\n  /** The disabled state of the button */\n  @property({ type: Boolean, reflect: true }) disabled = false;\n\n  private _handleClick(event: MouseEvent) {\n    if (this.disabled) {\n      event.preventDefault();\n      event.stopPropagation();\n      return;\n    }\n\n    this.removeEventListener(\"click\", this._clickHandler);\n    this.addEventListener(\"click\", this._clickHandler);\n  }\n\n  private _clickHandler = () => {\n    return;\n  };\n\n  render() {\n    return html`\n      <button\n        class=${classMap({\n          \"btn-close\": true\n        })}\n        aria-label=${ifDefined(this.ariaLabel)}\n        @click=${this._handleClick}\n        ?disabled=${this.disabled}\n      ></button>\n    `;\n  }\n}\n\nexport default SgdsCloseButton;\n"],"names":["closeButtonStyles"],"mappings":";;;;;;;;;AAMA;;;AAGG;AACG,MAAO,eAAgB,SAAQ,WAAW,CAAA;AAAhD,IAAA,WAAA,GAAA;;QAG6C,IAAS,CAAA,SAAA,GAAG,cAAc,CAAC;;QAE1B,IAAQ,CAAA,QAAA,GAAG,KAAK,CAAC;QAarD,IAAa,CAAA,aAAA,GAAG,MAAK;YAC3B,OAAO;AACT,SAAC,CAAC;KAcH;AA3BS,IAAA,YAAY,CAAC,KAAiB,EAAA;AACpC,QAAA,IAAI,IAAI,CAAC,QAAQ,EAAE;YACjB,KAAK,CAAC,cAAc,EAAE,CAAC;YACvB,KAAK,CAAC,eAAe,EAAE,CAAC;YACxB,OAAO;SACR;QAED,IAAI,CAAC,mBAAmB,CAAC,OAAO,EAAE,IAAI,CAAC,aAAa,CAAC,CAAC;QACtD,IAAI,CAAC,gBAAgB,CAAC,OAAO,EAAE,IAAI,CAAC,aAAa,CAAC,CAAC;KACpD;IAMD,MAAM,GAAA;AACJ,QAAA,OAAO,IAAI,CAAA,CAAA;;AAEC,cAAA,EAAA,QAAQ,CAAC;AACf,YAAA,WAAW,EAAE,IAAI;SAClB,CAAC,CAAA;AACW,mBAAA,EAAA,SAAS,CAAC,IAAI,CAAC,SAAS,CAAC,CAAA;AAC7B,eAAA,EAAA,IAAI,CAAC,YAAY,CAAA;AACd,kBAAA,EAAA,IAAI,CAAC,QAAQ,CAAA;;KAE5B,CAAC;KACH;;AAhCM,eAAA,CAAA,MAAM,GAAG,CAACA,QAAiB,CAAC,CAAC;AAEO,UAAA,CAAA;IAA1C,QAAQ,CAAC,EAAE,IAAI,EAAE,MAAM,EAAE,OAAO,EAAE,IAAI,EAAE,CAAC;AAA4B,CAAA,EAAA,eAAA,CAAA,SAAA,EAAA,WAAA,EAAA,KAAA,CAAA,CAAA,CAAA;AAE1B,UAAA,CAAA;IAA3C,QAAQ,CAAC,EAAE,IAAI,EAAE,OAAO,EAAE,OAAO,EAAE,IAAI,EAAE,CAAC;AAAkB,CAAA,EAAA,eAAA,CAAA,SAAA,EAAA,UAAA,EAAA,KAAA,CAAA,CAAA;;;;"}

package/react/mainnav/index.cjs.js

@@ -5,7 +5,7 @@ Object.defineProperty(exports, '__esModule', { value: true });
 
 var React = require('react');
 var react = require('@lit-labs/react');
-var sgdsMainnav = require('../../components/Mainnav/sgds-mainnav.cjs.js');
+var sgdsMainnav = require('../components/Mainnav/sgds-mainnav.cjs.js');
 
 function _interopNamespace(e) {
   if (e && e.__esModule) return e;

package/react/mainnav/index.js

@@ -1,7 +1,7 @@
 'use client';
 import * as React from 'react';
 import { createComponent } from '@lit-labs/react';
-import { SgdsMainnav } from '../../components/Mainnav/sgds-mainnav.js';
+import { SgdsMainnav } from '../components/Mainnav/sgds-mainnav.js';
 
 customElements.define("sgds-mainnav", SgdsMainnav);
 var index = createComponent({

package/react/mainnav-dropdown/index.cjs.js

@@ -5,7 +5,7 @@ Object.defineProperty(exports, '__esModule', { value: true });
 
 var React = require('react');
 var react = require('@lit-labs/react');
-var sgdsMainnavDropdown = require('../../components/Mainnav/sgds-mainnav-dropdown.cjs.js');
+var sgdsMainnavDropdown = require('../components/Mainnav/sgds-mainnav-dropdown.cjs.js');
 
 function _interopNamespace(e) {
   if (e && e.__esModule) return e;

package/react/mainnav-dropdown/index.js

@@ -1,7 +1,7 @@
 'use client';
 import * as React from 'react';
 import { createComponent } from '@lit-labs/react';
-import { SgdsMainnavDropdown } from '../../components/Mainnav/sgds-mainnav-dropdown.js';
+import { SgdsMainnavDropdown } from '../components/Mainnav/sgds-mainnav-dropdown.js';
 
 customElements.define("sgds-mainnav-dropdown", SgdsMainnavDropdown);
 var index = createComponent({

package/react/mainnav-item/index.cjs.js

@@ -5,7 +5,7 @@ Object.defineProperty(exports, '__esModule', { value: true });
 
 var React = require('react');
 var react = require('@lit-labs/react');
-var sgdsMainnavItem = require('../../components/Mainnav/sgds-mainnav-item.cjs.js');
+var sgdsMainnavItem = require('../components/Mainnav/sgds-mainnav-item.cjs.js');
 
 function _interopNamespace(e) {
   if (e && e.__esModule) return e;

package/react/mainnav-item/index.js

@@ -1,7 +1,7 @@
 'use client';
 import * as React from 'react';
 import { createComponent } from '@lit-labs/react';
-import { SgdsMainnavItem } from '../../components/Mainnav/sgds-mainnav-item.js';
+import { SgdsMainnavItem } from '../components/Mainnav/sgds-mainnav-item.js';
 
 customElements.define("sgds-mainnav-item", SgdsMainnavItem);
 var index = createComponent({

package/react/masthead/index.cjs.js

@@ -5,7 +5,7 @@ Object.defineProperty(exports, '__esModule', { value: true });
 
 var React = require('react');
 var react = require('@lit-labs/react');
-var sgdsMasthead = require('../../components/Masthead/sgds-masthead.cjs.js');
+var sgdsMasthead = require('../components/Masthead/sgds-masthead.cjs.js');
 
 function _interopNamespace(e) {
   if (e && e.__esModule) return e;

package/react/masthead/index.js

@@ -1,7 +1,7 @@
 'use client';
 import * as React from 'react';
 import { createComponent } from '@lit-labs/react';
-import { SgdsMasthead } from '../../components/Masthead/sgds-masthead.js';
+import { SgdsMasthead } from '../components/Masthead/sgds-masthead.js';
 
 customElements.define("sgds-masthead", SgdsMasthead);
 var index = createComponent({

package/react/modal/index.cjs.js

@@ -5,7 +5,7 @@ Object.defineProperty(exports, '__esModule', { value: true });
 
 var React = require('react');
 var react = require('@lit-labs/react');
-var sgdsModal = require('../../components/Modal/sgds-modal.cjs.js');
+var sgdsModal = require('../components/Modal/sgds-modal.cjs.js');
 
 function _interopNamespace(e) {
   if (e && e.__esModule) return e;

package/react/modal/index.js

@@ -1,7 +1,7 @@
 'use client';
 import * as React from 'react';
 import { createComponent } from '@lit-labs/react';
-import { SgdsModal } from '../../components/Modal/sgds-modal.js';
+import { SgdsModal } from '../components/Modal/sgds-modal.js';
 
 customElements.define("sgds-modal", SgdsModal);
 var index = createComponent({

package/react/pagination/index.cjs.js

@@ -5,7 +5,7 @@ Object.defineProperty(exports, '__esModule', { value: true });
 
 var React = require('react');
 var react = require('@lit-labs/react');
-var sgdsPagination = require('../../components/Pagination/sgds-pagination.cjs.js');
+var sgdsPagination = require('../components/Pagination/sgds-pagination.cjs.js');
 
 function _interopNamespace(e) {
   if (e && e.__esModule) return e;

package/react/pagination/index.js

@@ -1,7 +1,7 @@
 'use client';
 import * as React from 'react';
 import { createComponent } from '@lit-labs/react';
-import { SgdsPagination } from '../../components/Pagination/sgds-pagination.js';
+import { SgdsPagination } from '../components/Pagination/sgds-pagination.js';
 
 customElements.define("sgds-pagination", SgdsPagination);
 var index = createComponent({

package/react/progress/index.cjs.js

@@ -5,7 +5,7 @@ Object.defineProperty(exports, '__esModule', { value: true });
 
 var React = require('react');
 var react = require('@lit-labs/react');
-var sgdsProgress = require('../../components/Progress/sgds-progress.cjs.js');
+var sgdsProgress = require('../components/Progress/sgds-progress.cjs.js');
 
 function _interopNamespace(e) {
   if (e && e.__esModule) return e;

package/react/progress/index.js

@@ -1,7 +1,7 @@
 'use client';
 import * as React from 'react';
 import { createComponent } from '@lit-labs/react';
-import { SgdsProgress } from '../../components/Progress/sgds-progress.js';
+import { SgdsProgress } from '../components/Progress/sgds-progress.js';
 
 customElements.define("sgds-progress", SgdsProgress);
 var index = createComponent({

package/react/progress-bar/index.cjs.js

@@ -5,7 +5,7 @@ Object.defineProperty(exports, '__esModule', { value: true });
 
 var React = require('react');
 var react = require('@lit-labs/react');
-var sgdsProgressBar = require('../../components/Progress/sgds-progress-bar.cjs.js');
+var sgdsProgressBar = require('../components/Progress/sgds-progress-bar.cjs.js');
 
 function _interopNamespace(e) {
   if (e && e.__esModule) return e;

package/react/progress-bar/index.js

@@ -1,7 +1,7 @@
 'use client';
 import * as React from 'react';
 import { createComponent } from '@lit-labs/react';
-import { SgdsProgressBar } from '../../components/Progress/sgds-progress-bar.js';
+import { SgdsProgressBar } from '../components/Progress/sgds-progress-bar.js';
 
 customElements.define("sgds-progress-bar", SgdsProgressBar);
 var index = createComponent({

package/react/quantity-toggle/index.cjs.js

@@ -5,7 +5,7 @@ Object.defineProperty(exports, '__esModule', { value: true });
 
 var React = require('react');
 var react = require('@lit-labs/react');
-var sgdsQuantityToggle = require('../../components/QuantityToggle/sgds-quantity-toggle.cjs.js');
+var sgdsQuantityToggle = require('../components/QuantityToggle/sgds-quantity-toggle.cjs.js');
 
 function _interopNamespace(e) {
   if (e && e.__esModule) return e;

package/react/quantity-toggle/index.js

@@ -1,7 +1,7 @@
 'use client';
 import * as React from 'react';
 import { createComponent } from '@lit-labs/react';
-import { SgdsQuantityToggle } from '../../components/QuantityToggle/sgds-quantity-toggle.js';
+import { SgdsQuantityToggle } from '../components/QuantityToggle/sgds-quantity-toggle.js';
 
 customElements.define("sgds-quantity-toggle", SgdsQuantityToggle);
 var index = createComponent({

package/react/radio/index.cjs.js

@@ -5,7 +5,7 @@ Object.defineProperty(exports, '__esModule', { value: true });
 
 var React = require('react');
 var react = require('@lit-labs/react');
-var sgdsRadio = require('../../components/Radio/sgds-radio.cjs.js');
+var sgdsRadio = require('../components/Radio/sgds-radio.cjs.js');
 
 function _interopNamespace(e) {
   if (e && e.__esModule) return e;

package/react/radio/index.js

@@ -1,7 +1,7 @@
 'use client';
 import * as React from 'react';
 import { createComponent } from '@lit-labs/react';
-import { SgdsRadio } from '../../components/Radio/sgds-radio.js';
+import { SgdsRadio } from '../components/Radio/sgds-radio.js';
 
 customElements.define("sgds-radio", SgdsRadio);
 var index = createComponent({

package/react/radio-group/index.cjs.js

@@ -5,7 +5,7 @@ Object.defineProperty(exports, '__esModule', { value: true });
 
 var React = require('react');
 var react = require('@lit-labs/react');
-var sgdsRadioGroup = require('../../components/Radio/sgds-radio-group.cjs.js');
+var sgdsRadioGroup = require('../components/Radio/sgds-radio-group.cjs.js');
 
 function _interopNamespace(e) {
   if (e && e.__esModule) return e;