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

package/react/components/Toast/sgds-toast.js.map

@@ -1 +1 @@
-{"version":3,"file":"sgds-toast.js","sources":["../../../../src/components/Toast/sgds-toast.ts"],"sourcesContent":["import { ScopedElementsMixin } from \"@open-wc/scoped-elements\";\nimport { html, nothing } from \"lit\";\nimport { property, query, queryAssignedNodes } from \"lit/decorators.js\";\nimport SgdsElement from \"../../base/sgds-element\";\nimport SgdsCloseButton from \"../../internals/CloseButton/sgds-close-button\";\nimport { animateTo } from \"../../utils/animate\";\nimport { getAnimation, setDefaultAnimation } from \"../../utils/animation-registry\";\nimport { waitForEvent } from \"../../utils/event\";\nimport { watch } from \"../../utils/watch\";\nimport toastStyle from \"./toast.css\";\n/**\n * @summary Toast allows you to convey quick messaging notifications to the user.\n *\n * @slot default - The content to pass into toast's body \n * @slot action - The content to pass into toast's action  \n * \n *\n * @event sgds-show - Emitted on show.\n * @event sgds-after-show - Emitted on show after animation has completed.\n * @event sgds-hide - Emitted on hide.\n * @event sgds-after-hide - Emitted on hide after animation has completed.\n \n * @cssproperty --toast-icon-margin-right - The margin right between toast's icon and title in its header.\n */\nexport class SgdsToast extends ScopedElementsMixin(SgdsElement) {\n  static styles = [...SgdsElement.styles, toastStyle];\n  /**@internal */\n  static get scopedElements() {\n    return {\n      \"sgds-close-button\": SgdsCloseButton\n    };\n  }\n\n  /**@internal */\n  @query(\"div.toast\") toast: HTMLElement;\n  /** Controls the appearance of toast */\n  @property({ type: Boolean, reflect: true }) show = false;\n  /** The header title of toast. It is required to assign a title to toast */\n  @property({ type: String, reflect: true }) title = \"Title\";\n  /** Controls whether the toast has fade animation during its appearance/disappearance */\n  @property({ type: Boolean, reflect: true }) noAnimation = false;\n  /** Controls if the toast will hide itself after the delay time. Works with delay property */\n  @property({ type: Boolean, reflect: true }) autohide = false;\n  /** The amount of time taken in miliseconds for toast to disappear after its first render. It takes effect only when autohide is set to true. Defaults to 5000ms */\n  @property({ type: Number, reflect: true }) delay = 5000;\n  /**The variant styles of toast */\n  @property({ type: String, reflect: true }) variant: \"success\" | \"warning\" | \"danger\" | \"info\" = \"info\";\n  /** Controls whether or not the Toast is dismissible */\n  @property({ type: Boolean, reflect: true }) dismissable = false;\n\n  /** Shows the toast */\n  public async showToast() {\n    if (this.show) {\n      return;\n    }\n\n    this.show = true;\n    return waitForEvent(this, \"sgds-after-show\");\n  }\n\n  /** Hide the toast */\n  public async hideToast() {\n    if (!this.show) {\n      return;\n    }\n    this.show = false;\n    return waitForEvent(this, \"sgds-after-hide\");\n  }\n\n  /** @internal */\n  handleCloseClick() {\n    this.show = false;\n    this.emit(\"sgds-close\");\n  }\n  /**@internal */\n  @watch(\"show\", { waitUntilFirstUpdate: true })\n  async handleShowChange() {\n    if (this.show) {\n      this.emit(\"sgds-show\");\n      this.toast.classList.remove(\"d-none\");\n      const toastAnimation = getAnimation(this, \"toast.show\");\n\n      if (!this.noAnimation) {\n        await animateTo(this.toast, toastAnimation.keyframes, toastAnimation.options);\n      }\n\n      this.emit(\"sgds-after-show\");\n    } else {\n      this.emit(\"sgds-hide\");\n\n      const toastAnimation = getAnimation(this, \"toast.hide\");\n      if (!this.noAnimation) {\n        await animateTo(this.toast, toastAnimation.keyframes, toastAnimation.options);\n      }\n      this.toast.classList.add(\"d-none\");\n\n      this.emit(\"sgds-after-hide\");\n    }\n  }\n\n  protected firstUpdated(): void {\n    if (!this.show) {\n      this.toast.classList.add(\"d-none\");\n    }\n\n    if (this._actionNodes.length === 0) {\n      return this.shadowRoot.querySelector(\"slot[name='action']\")?.classList.add(\"d-none\");\n    }\n  }\n\n  @queryAssignedNodes({ slot: \"action\", flatten: true })\n  _actionNodes!: Array<Node>;\n\n  render() {\n    if (this.autohide && this.show) {\n      setTimeout(() => {\n        this.show = false;\n      }, this.delay);\n    }\n    return html`\n      <div\n        class=\"toast\"\n        role=\"alert\"\n        aria-hidden=${this.show ? \"false\" : \"true\"}\n        aria-live=\"assertive\"\n        aria-atomic=\"true\"\n      >\n        <i>\n          <svg\n            xmlns=\"http://www.w3.org/2000/svg\"\n            width=\"16\"\n            height=\"16\"\n            fill=\"currentColor\"\n            class=\"bi bi-airplane\"\n            viewBox=\"0 0 16 16\"\n          >\n            <path\n              d=\"M6.428 1.151C6.708.591 7.213 0 8 0s1.292.592 1.572 1.151C9.861 1.73 10 2.431 10 3v3.691l5.17 2.585a1.5 1.5 0 0 1 .83 1.342V12a.5.5 0 0 1-.582.493l-5.507-.918-.375 2.253 1.318 1.318A.5.5 0 0 1 10.5 16h-5a.5.5 0 0 1-.354-.854l1.319-1.318-.376-2.253-5.507.918A.5.5 0 0 1 0 12v-1.382a1.5 1.5 0 0 1 .83-1.342L6 6.691V3c0-.568.14-1.271.428-1.849Zm.894.448C7.111 2.02 7 2.569 7 3v4a.5.5 0 0 1-.276.447l-5.448 2.724a.5.5 0 0 0-.276.447v.792l5.418-.903a.5.5 0 0 1 .575.41l.5 3a.5.5 0 0 1-.14.437L6.708 15h2.586l-.647-.646a.5.5 0 0 1-.14-.436l.5-3a.5.5 0 0 1 .576-.411L15 11.41v-.792a.5.5 0 0 0-.276-.447L9.276 7.447A.5.5 0 0 1 9 7V3c0-.432-.11-.979-.322-1.401C8.458 1.159 8.213 1 8 1c-.213 0-.458.158-.678.599Z\"\n            ></path>\n          </svg>\n        </i>\n        <div class=\"toast-content\">\n          <div class=\"toast-body\">\n            <strong>${this.title}</strong>\n            <slot></slot>\n          </div>\n          <slot class=\"toast-action\" name=\"action\"></slot>\n        </div>\n        ${this.dismissable\n          ? html`<sgds-close-button\n              class=\"close-btn\"\n              ariaLabel=\"close toast\"\n              @click=${this.handleCloseClick}\n            ></sgds-close-button>`\n          : nothing}\n      </div>\n    `;\n  }\n}\n\nexport default SgdsToast;\n\nsetDefaultAnimation(\"toast.show\", {\n  keyframes: [{ opacity: 0 }, { opacity: 1 }],\n  options: { duration: 400, easing: \"ease\" }\n});\nsetDefaultAnimation(\"toast.hide\", {\n  keyframes: [{ opacity: 1 }, { opacity: 0 }],\n  options: { duration: 400, easing: \"ease\" }\n});\n"],"names":["toastStyle"],"mappings":"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"}
+{"version":3,"file":"sgds-toast.js","sources":["../../../../src/components/Toast/sgds-toast.ts"],"sourcesContent":["import { ScopedElementsMixin } from \"@open-wc/scoped-elements\";\nimport { html, nothing } from \"lit\";\nimport { property, query, queryAssignedNodes } from \"lit/decorators.js\";\nimport SgdsElement from \"../../base/sgds-element\";\nimport SgdsCloseButton from \"../../internals/CloseButton/sgds-close-button\";\nimport { animateTo } from \"../../utils/animate\";\nimport { getAnimation, setDefaultAnimation } from \"../../utils/animation-registry\";\nimport { waitForEvent } from \"../../utils/event\";\nimport { watch } from \"../../utils/watch\";\nimport toastStyle from \"./toast.css\";\n/**\n * @summary Toast allows you to convey quick messaging notifications to the user.\n *\n * @slot default - The content to pass into toast's body \n * @slot action - The content to pass into toast's action  \n * @slot icon - The icon in toast\n * \n *\n * @event sgds-show - Emitted on show.\n * @event sgds-after-show - Emitted on show after animation has completed.\n * @event sgds-hide - Emitted on hide.\n * @event sgds-after-hide - Emitted on hide after animation has completed.\n \n * @cssproperty --toast-icon-margin-right - The margin right between toast's icon and title in its header.\n */\nexport class SgdsToast extends ScopedElementsMixin(SgdsElement) {\n  static styles = [...SgdsElement.styles, toastStyle];\n  /**@internal */\n  static get scopedElements() {\n    return {\n      \"sgds-close-button\": SgdsCloseButton\n    };\n  }\n\n  /**@internal */\n  @query(\"div.toast\") toast: HTMLElement;\n  /** Controls the appearance of toast */\n  @property({ type: Boolean, reflect: true }) show = false;\n  /** The header title of toast. It is required to assign a title to toast */\n  @property({ type: String, reflect: true }) title = \"Title\";\n  /** Controls whether the toast has fade animation during its appearance/disappearance */\n  @property({ type: Boolean, reflect: true }) noAnimation = false;\n  /** Controls if the toast will hide itself after the delay time. Works with delay property */\n  @property({ type: Boolean, reflect: true }) autohide = false;\n  /** The amount of time taken in miliseconds for toast to disappear after its first render. It takes effect only when autohide is set to true. Defaults to 5000ms */\n  @property({ type: Number, reflect: true }) delay = 5000;\n  /**The variant styles of toast */\n  @property({ type: String, reflect: true }) variant: \"success\" | \"warning\" | \"danger\" | \"info\" = \"info\";\n  /** Controls whether or not the Toast is dismissible */\n  @property({ type: Boolean, reflect: true }) dismissible = false;\n\n  /** Shows the toast */\n  public async showToast() {\n    if (this.show) {\n      return;\n    }\n\n    this.show = true;\n    return waitForEvent(this, \"sgds-after-show\");\n  }\n\n  /** Hide the toast */\n  public async hideToast() {\n    if (!this.show) {\n      return;\n    }\n    this.show = false;\n    return waitForEvent(this, \"sgds-after-hide\");\n  }\n\n  /** @internal */\n  handleCloseClick() {\n    this.show = false;\n    this.emit(\"sgds-close\");\n  }\n  /**@internal */\n  @watch(\"show\", { waitUntilFirstUpdate: true })\n  async handleShowChange() {\n    if (this.show) {\n      this.emit(\"sgds-show\");\n      this.toast.classList.remove(\"d-none\");\n      const toastAnimation = getAnimation(this, \"toast.show\");\n\n      if (!this.noAnimation) {\n        await animateTo(this.toast, toastAnimation.keyframes, toastAnimation.options);\n      }\n\n      this.emit(\"sgds-after-show\");\n    } else {\n      this.emit(\"sgds-hide\");\n\n      const toastAnimation = getAnimation(this, \"toast.hide\");\n      if (!this.noAnimation) {\n        await animateTo(this.toast, toastAnimation.keyframes, toastAnimation.options);\n      }\n      this.toast.classList.add(\"d-none\");\n\n      this.emit(\"sgds-after-hide\");\n    }\n  }\n\n  protected firstUpdated(): void {\n    if (!this.show) {\n      this.toast.classList.add(\"d-none\");\n    }\n\n    if (this._actionNodes.length === 0) {\n      return this.shadowRoot.querySelector(\"slot[name='action']\")?.classList.add(\"d-none\");\n    }\n  }\n\n  @queryAssignedNodes({ slot: \"action\", flatten: true })\n  _actionNodes!: Array<Node>;\n\n  render() {\n    if (this.autohide && this.show) {\n      setTimeout(() => {\n        this.show = false;\n      }, this.delay);\n    }\n    return html`\n      <div\n        class=\"toast\"\n        role=\"alert\"\n        aria-hidden=${this.show ? \"false\" : \"true\"}\n        aria-live=\"assertive\"\n        aria-atomic=\"true\"\n      >\n        <slot name=\"icon\"></slot>\n        <div class=\"toast-content\">\n          <div class=\"toast-body\">\n            <strong>${this.title}</strong>\n            <span><slot></slot></span>\n          </div>\n          <slot class=\"toast-action\" name=\"action\"></slot>\n        </div>\n        ${this.dismissible\n          ? html`<sgds-close-button\n              class=\"close-btn\"\n              ariaLabel=\"close toast\"\n              @click=${this.handleCloseClick}\n            ></sgds-close-button>`\n          : nothing}\n      </div>\n    `;\n  }\n}\n\nexport default SgdsToast;\n\nsetDefaultAnimation(\"toast.show\", {\n  keyframes: [{ opacity: 0 }, { opacity: 1 }],\n  options: { duration: 400, easing: \"ease\" }\n});\nsetDefaultAnimation(\"toast.hide\", {\n  keyframes: [{ opacity: 1 }, { opacity: 0 }],\n  options: { duration: 400, easing: \"ease\" }\n});\n"],"names":["toastStyle"],"mappings":"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"}

package/react/components/Toast/toast.cjs.js

@@ -5,7 +5,7 @@ Object.defineProperty(exports, '__esModule', { value: true });
 
 var lit = require('lit');
 
-var css_248z = lit.css`:host{--sgds-toast-border-radius:var(--sgds-border-radius-md)}.toast{--toast-border-color:var(--sgds-gray-800);--toast-header-color:light-dark(var(--sgds-gray-800),var(--sgds-gray-200));--toast-header-icon-color:var(--sgds-body-color);align-items:flex-start;background-clip:padding-box;background-color:var(--sgds-neutral-bg-inverse);border-radius:var(--sgds-border-radius-md);box-shadow:0 0 2px 0 rgba(0,0,0,.12),0 8px 16px 0 rgba(0,0,0,.14);color:var(--sgds-subtitle-color);display:flex;flex-direction:row;gap:var(--sgds-gap-xs);max-width:var(--sgds-dimension-480);min-width:var(--sgds-dimension-320);padding:var(--sgds-padding-md) var(--sgds-padding-md);pointer-events:auto;width:320px}.toast-content{word-wrap:break-word;color:var(--sgds-gray-600);gap:var(--sgds-gap-sm)}.toast-body,.toast-content{display:flex;flex-direction:column}.toast-action{word-wrap:break-word;color:var(--sgds-primary-color)}.toast-header strong{margin-right:auto;word-break:break-all}.close-btn{margin-left:auto}.d-none{display:none}`;
+var css_248z = lit.css`:host{--sgds-toast-border-radius:var(--sgds-border-radius-md)}:host([variant=info]) slot[name=icon]::slotted(*){color:var(--sgds-primary-color)}:host([variant=success]) slot[name=icon]::slotted(*){color:var(--sgds-success-color)}:host([variant=danger]) slot[name=icon]::slotted(*){color:var(--sgds-danger-color)}:host([variant=warning]) slot[name=icon]::slotted(*){color:var(--sgds-warning-color)}.toast{align-items:flex-start;background-clip:padding-box;background-color:var(--sgds-neutral-bg-inverse);border-radius:var(--sgds-border-radius-md);box-shadow:0 0 2px 0 rgba(0,0,0,.12),0 8px 16px 0 rgba(0,0,0,.14);display:flex;flex-direction:row;gap:var(--sgds-gap-xs);max-width:var(--sgds-dimension-480);min-width:var(--sgds-dimension-320);padding:var(--sgds-padding-md);pointer-events:auto;width:320px}.toast-content{word-wrap:break-word;gap:var(--sgds-gap-sm)}.toast-body,.toast-content{display:flex;flex-direction:column}.toast-body strong{line-height:var(--sgds-line-height-min)}.toast-body span{color:var(--sgds-default-color-subtle)}.toast-action{word-wrap:break-word;color:var(--sgds-primary-color)}.toast-header strong{margin-right:auto;word-break:break-all}.close-btn{margin-left:auto}.d-none{display:none}`;
 
 exports["default"] = css_248z;
 //# sourceMappingURL=toast.cjs.js.map

package/react/components/Toast/toast.js

@@ -1,7 +1,7 @@
 'use client';
 import { css } from 'lit';
 
-var css_248z = css`:host{--sgds-toast-border-radius:var(--sgds-border-radius-md)}.toast{--toast-border-color:var(--sgds-gray-800);--toast-header-color:light-dark(var(--sgds-gray-800),var(--sgds-gray-200));--toast-header-icon-color:var(--sgds-body-color);align-items:flex-start;background-clip:padding-box;background-color:var(--sgds-neutral-bg-inverse);border-radius:var(--sgds-border-radius-md);box-shadow:0 0 2px 0 rgba(0,0,0,.12),0 8px 16px 0 rgba(0,0,0,.14);color:var(--sgds-subtitle-color);display:flex;flex-direction:row;gap:var(--sgds-gap-xs);max-width:var(--sgds-dimension-480);min-width:var(--sgds-dimension-320);padding:var(--sgds-padding-md) var(--sgds-padding-md);pointer-events:auto;width:320px}.toast-content{word-wrap:break-word;color:var(--sgds-gray-600);gap:var(--sgds-gap-sm)}.toast-body,.toast-content{display:flex;flex-direction:column}.toast-action{word-wrap:break-word;color:var(--sgds-primary-color)}.toast-header strong{margin-right:auto;word-break:break-all}.close-btn{margin-left:auto}.d-none{display:none}`;
+var css_248z = css`:host{--sgds-toast-border-radius:var(--sgds-border-radius-md)}:host([variant=info]) slot[name=icon]::slotted(*){color:var(--sgds-primary-color)}:host([variant=success]) slot[name=icon]::slotted(*){color:var(--sgds-success-color)}:host([variant=danger]) slot[name=icon]::slotted(*){color:var(--sgds-danger-color)}:host([variant=warning]) slot[name=icon]::slotted(*){color:var(--sgds-warning-color)}.toast{align-items:flex-start;background-clip:padding-box;background-color:var(--sgds-neutral-bg-inverse);border-radius:var(--sgds-border-radius-md);box-shadow:0 0 2px 0 rgba(0,0,0,.12),0 8px 16px 0 rgba(0,0,0,.14);display:flex;flex-direction:row;gap:var(--sgds-gap-xs);max-width:var(--sgds-dimension-480);min-width:var(--sgds-dimension-320);padding:var(--sgds-padding-md);pointer-events:auto;width:320px}.toast-content{word-wrap:break-word;gap:var(--sgds-gap-sm)}.toast-body,.toast-content{display:flex;flex-direction:column}.toast-body strong{line-height:var(--sgds-line-height-min)}.toast-body span{color:var(--sgds-default-color-subtle)}.toast-action{word-wrap:break-word;color:var(--sgds-primary-color)}.toast-header strong{margin-right:auto;word-break:break-all}.close-btn{margin-left:auto}.d-none{display:none}`;
 
 export { css_248z as default };
 //# sourceMappingURL=toast.js.map

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

@@ -23,8 +23,8 @@ var Tooltip__default = /*#__PURE__*/_interopDefaultLegacy(Tooltip);
 class SgdsTooltip extends sgdsElement["default"] {
     constructor() {
         super(...arguments);
-        this.myTooltip = ref_js.createRef();
-        this.bsTooltip = null;
+        this._myTooltip = ref_js.createRef();
+        this._bsTooltip = null;
         /** The tooltip's content. Content has to be textual */
         this.content = "";
         /** The placement of tooltip relative to its target */
@@ -34,7 +34,7 @@ class SgdsTooltip extends sgdsElement["default"] {
     }
     _handleSlotChange() {
         // For a11y purpose
-        this.tooltipTargetElements.forEach(el => el.setAttribute("data-sgds-tooltip", this.content));
+        this._tooltipTargetElements.forEach(el => el.setAttribute("data-sgds-tooltip", this.content));
     }
     _handleClickOutOfElement(e, self) {
         if (!e.composedPath().includes(self)) {
@@ -53,7 +53,7 @@ class SgdsTooltip extends sgdsElement["default"] {
         document.removeEventListener("click", (event) => this._handleClickOutOfElement(event, this));
         document.removeEventListener("touchstart", (event) => this._handleClickOutOfElement(event, this));
     }
-    initializeTooltip() {
+    _initializeTooltip() {
         this.tooltipConfig = {
             popperConfig: (defaultConfig) => {
                 this.popperConfig = defaultConfig;
@@ -73,34 +73,34 @@ class SgdsTooltip extends sgdsElement["default"] {
             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__default["default"](this.myTooltip.value, this.tooltipConfig);
+        this._bsTooltip = new Tooltip__default["default"](this._myTooltip.value, this.tooltipConfig);
     }
     firstUpdated() {
-        this.initializeTooltip();
-        this.myTooltip.value.addEventListener("show.bs.tooltip", () => {
+        this._initializeTooltip();
+        this._myTooltip.value.addEventListener("show.bs.tooltip", () => {
             this.emit("sgds-show");
         });
-        this.myTooltip.value.addEventListener("shown.bs.tooltip", () => {
+        this._myTooltip.value.addEventListener("shown.bs.tooltip", () => {
             this.emit("sgds-after-show");
         });
-        this.myTooltip.value.addEventListener("hide.bs.tooltip", () => {
+        this._myTooltip.value.addEventListener("hide.bs.tooltip", () => {
             this.emit("sgds-hide");
         });
-        this.myTooltip.value.addEventListener("hidden.bs.tooltip", () => {
+        this._myTooltip.value.addEventListener("hidden.bs.tooltip", () => {
             this.emit("sgds-after-hide");
         });
     }
     /** Hides the Tooltip */
     hide() {
-        this.bsTooltip.hide();
+        this._bsTooltip.hide();
     }
     /** Shows the Tooltip */
     show() {
-        this.bsTooltip.show();
+        this._bsTooltip.show();
     }
     render() {
         return lit.html `
-      <div ${ref_js.ref(this.myTooltip)}>
+      <div ${ref_js.ref(this._myTooltip)}>
         <slot @slotchange=${this._handleSlotChange}></slot>
       </div>
     `;
@@ -121,7 +121,7 @@ tslib.__decorate([
 ], SgdsTooltip.prototype, "popperConfig", void 0);
 tslib.__decorate([
     decorators_js.queryAssignedElements()
-], SgdsTooltip.prototype, "tooltipTargetElements", void 0);
+], SgdsTooltip.prototype, "_tooltipTargetElements", void 0);
 
 exports.SgdsTooltip = SgdsTooltip;
 exports["default"] = SgdsTooltip;

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

@@ -1 +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 */\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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"}
+{"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\";\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 */\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  @state()\n  private popperConfig: Partial<PopperOptions>;\n\n  private tooltipConfig: Partial<BsTooltip.Options>;\n\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

@@ -15,8 +15,8 @@ import css_248z from './tooltip.js';
 class SgdsTooltip extends SgdsElement {
     constructor() {
         super(...arguments);
-        this.myTooltip = createRef();
-        this.bsTooltip = null;
+        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 */
@@ -26,7 +26,7 @@ class SgdsTooltip extends SgdsElement {
     }
     _handleSlotChange() {
         // For a11y purpose
-        this.tooltipTargetElements.forEach(el => el.setAttribute("data-sgds-tooltip", this.content));
+        this._tooltipTargetElements.forEach(el => el.setAttribute("data-sgds-tooltip", this.content));
     }
     _handleClickOutOfElement(e, self) {
         if (!e.composedPath().includes(self)) {
@@ -45,7 +45,7 @@ class SgdsTooltip extends SgdsElement {
         document.removeEventListener("click", (event) => this._handleClickOutOfElement(event, this));
         document.removeEventListener("touchstart", (event) => this._handleClickOutOfElement(event, this));
     }
-    initializeTooltip() {
+    _initializeTooltip() {
         this.tooltipConfig = {
             popperConfig: (defaultConfig) => {
                 this.popperConfig = defaultConfig;
@@ -65,34 +65,34 @@ class SgdsTooltip extends SgdsElement {
             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);
+        this._bsTooltip = new Tooltip(this._myTooltip.value, this.tooltipConfig);
     }
     firstUpdated() {
-        this.initializeTooltip();
-        this.myTooltip.value.addEventListener("show.bs.tooltip", () => {
+        this._initializeTooltip();
+        this._myTooltip.value.addEventListener("show.bs.tooltip", () => {
             this.emit("sgds-show");
         });
-        this.myTooltip.value.addEventListener("shown.bs.tooltip", () => {
+        this._myTooltip.value.addEventListener("shown.bs.tooltip", () => {
             this.emit("sgds-after-show");
         });
-        this.myTooltip.value.addEventListener("hide.bs.tooltip", () => {
+        this._myTooltip.value.addEventListener("hide.bs.tooltip", () => {
             this.emit("sgds-hide");
         });
-        this.myTooltip.value.addEventListener("hidden.bs.tooltip", () => {
+        this._myTooltip.value.addEventListener("hidden.bs.tooltip", () => {
             this.emit("sgds-after-hide");
         });
     }
     /** Hides the Tooltip */
     hide() {
-        this.bsTooltip.hide();
+        this._bsTooltip.hide();
     }
     /** Shows the Tooltip */
     show() {
-        this.bsTooltip.show();
+        this._bsTooltip.show();
     }
     render() {
         return html `
-      <div ${ref(this.myTooltip)}>
+      <div ${ref(this._myTooltip)}>
         <slot @slotchange=${this._handleSlotChange}></slot>
       </div>
     `;
@@ -113,7 +113,7 @@ __decorate([
 ], SgdsTooltip.prototype, "popperConfig", void 0);
 __decorate([
     queryAssignedElements()
-], SgdsTooltip.prototype, "tooltipTargetElements", void 0);
+], SgdsTooltip.prototype, "_tooltipTargetElements", void 0);
 
 export { SgdsTooltip, SgdsTooltip as default };
 //# sourceMappingURL=sgds-tooltip.js.map

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

@@ -1 +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 */\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":";;;;;;;;;AASA;;;;AAIG;AACG,MAAO,WAAY,SAAQ,WAAW,CAAA;AAA5C,IAAA,WAAA,GAAA;;QAGU,IAAS,CAAA,SAAA,GAAqB,SAAS,EAAE,CAAC;QAE1C,IAAS,CAAA,SAAA,GAAc,IAAI,CAAC;;QAIpC,IAAO,CAAA,OAAA,GAAG,EAAE,CAAC;;QAGb,IAAS,CAAA,SAAA,GAAwC,KAAK,CAAC;;QAGvD,IAAO,CAAA,OAAA,GAAgD,aAAa,CAAC;KA6FtE;IAjFS,iBAAiB,GAAA;;QAEvB,IAAI,CAAC,qBAAqB,CAAC,OAAO,CAAC,EAAE,IAAI,EAAE,CAAC,YAAY,CAAC,mBAAmB,EAAE,IAAI,CAAC,OAAO,CAAC,CAAC,CAAC;KAC9F;IAEO,wBAAwB,CAAC,CAA0B,EAAE,IAAiB,EAAA;QAC5E,IAAI,CAAC,CAAC,CAAC,YAAY,EAAE,CAAC,QAAQ,CAAC,IAAI,CAAC,EAAE;YACpC,IAAI,CAAC,IAAI,EAAE,CAAC;SACb;KACF;IAED,iBAAiB,GAAA;QACf,KAAK,CAAC,iBAAiB,EAAE,CAAC;AAE1B,QAAA,IAAI,IAAI,CAAC,OAAO,KAAK,OAAO,EAAE;AAC5B,YAAA,QAAQ,CAAC,gBAAgB,CAAC,OAAO,EAAE,CAAC,KAAiB,KAAK,IAAI,CAAC,wBAAwB,CAAC,KAAK,EAAE,IAAI,CAAC,CAAC,CAAC;AACtG,YAAA,QAAQ,CAAC,gBAAgB,CAAC,YAAY,EAAE,CAAC,KAAiB,KAAK,IAAI,CAAC,wBAAwB,CAAC,KAAK,EAAE,IAAI,CAAC,CAAC,CAAC;SAC5G;KACF;IAED,oBAAoB,GAAA;QAClB,KAAK,CAAC,oBAAoB,EAAE,CAAC;AAE7B,QAAA,QAAQ,CAAC,mBAAmB,CAAC,OAAO,EAAE,CAAC,KAAiB,KAAK,IAAI,CAAC,wBAAwB,CAAC,KAAK,EAAE,IAAI,CAAC,CAAC,CAAC;AACzG,QAAA,QAAQ,CAAC,mBAAmB,CAAC,YAAY,EAAE,CAAC,KAAiB,KAAK,IAAI,CAAC,wBAAwB,CAAC,KAAK,EAAE,IAAI,CAAC,CAAC,CAAC;KAC/G;IAEO,iBAAiB,GAAA;QACvB,IAAI,CAAC,aAAa,GAAG;AACnB,YAAA,YAAY,EAAE,CAAC,aAAsC,KAAI;AACvD,gBAAA,IAAI,CAAC,YAAY,GAAG,aAAa,CAAC;AAClC,gBAAA,MAAM,gBAAgB,GAAG,aAAa,CAAC,SAAS,CAAC;gBACjD,MAAM,YAAY,GAAG,gBAAgB,CAAC,GAAG,CAAC,GAAG,IAAG;AAC9C,oBAAA,IAAI,GAAG,CAAC,IAAI,KAAK,MAAM,EAAE;AACvB,wBAAA,GAAG,CAAC,OAAO,CAAC,kBAAkB,GAAG,EAAE,CAAC;qBACrC;AACD,oBAAA,OAAO,GAAG,CAAC;AACb,iBAAC,CAAC,CAAC;AACH,gBAAA,IAAI,CAAC,YAAY,CAAC,SAAS,GAAG,YAAY,CAAC;gBAC3C,OAAO,IAAI,CAAC,YAAY,CAAC;aAC1B;YACD,SAAS,EAAE,IAAI,CAAC,SAAS;YACzB,OAAO,EAAE,IAAI,CAAC,OAAO;YACrB,KAAK,EAAE,IAAI,CAAC,OAAO;AACnB,YAAA,IAAI,EAAE,IAAI;YACV,SAAS,EAAE,IAAI,CAAC,UAAU,CAAC,aAAa,CAAC,KAAK,CAAC;SAClB,CAAC;AAChC,QAAA,IAAI,CAAC,SAAS,GAAG,IAAI,OAAO,CAAC,IAAI,CAAC,SAAS,CAAC,KAAK,EAAE,IAAI,CAAC,aAAa,CAAC,CAAC;KACxE;IAED,YAAY,GAAA;QACV,IAAI,CAAC,iBAAiB,EAAE,CAAC;QACzB,IAAI,CAAC,SAAS,CAAC,KAAK,CAAC,gBAAgB,CAAC,iBAAiB,EAAE,MAAK;AAC5D,YAAA,IAAI,CAAC,IAAI,CAAC,WAAW,CAAC,CAAC;AACzB,SAAC,CAAC,CAAC;QACH,IAAI,CAAC,SAAS,CAAC,KAAK,CAAC,gBAAgB,CAAC,kBAAkB,EAAE,MAAK;AAC7D,YAAA,IAAI,CAAC,IAAI,CAAC,iBAAiB,CAAC,CAAC;AAC/B,SAAC,CAAC,CAAC;QACH,IAAI,CAAC,SAAS,CAAC,KAAK,CAAC,gBAAgB,CAAC,iBAAiB,EAAE,MAAK;AAC5D,YAAA,IAAI,CAAC,IAAI,CAAC,WAAW,CAAC,CAAC;AACzB,SAAC,CAAC,CAAC;QACH,IAAI,CAAC,SAAS,CAAC,KAAK,CAAC,gBAAgB,CAAC,mBAAmB,EAAE,MAAK;AAC9D,YAAA,IAAI,CAAC,IAAI,CAAC,iBAAiB,CAAC,CAAC;AAC/B,SAAC,CAAC,CAAC;KACJ;;IAEM,IAAI,GAAA;AACT,QAAA,IAAI,CAAC,SAAS,CAAC,IAAI,EAAE,CAAC;KACvB;;IAEM,IAAI,GAAA;AACT,QAAA,IAAI,CAAC,SAAS,CAAC,IAAI,EAAE,CAAC;KACvB;IAED,MAAM,GAAA;AACJ,QAAA,OAAO,IAAI,CAAA,CAAA;AACF,WAAA,EAAA,GAAG,CAAC,IAAI,CAAC,SAAS,CAAC,CAAA;AACJ,0BAAA,EAAA,IAAI,CAAC,iBAAiB,CAAA;;KAE7C,CAAC;KACH;;AA1GM,WAAM,CAAA,MAAA,GAAG,CAAC,GAAG,WAAW,CAAC,MAAM,EAAEA,QAAY,CAAvC,CAAyC;AAQtD,UAAA,CAAA;AADC,IAAA,QAAQ,CAAC,EAAE,IAAI,EAAE,MAAM,EAAE,CAAC;AACd,CAAA,EAAA,WAAA,CAAA,SAAA,EAAA,SAAA,EAAA,KAAA,CAAA,CAAA,CAAA;AAGb,UAAA,CAAA;AADC,IAAA,QAAQ,CAAC,EAAE,IAAI,EAAE,MAAM,EAAE,CAAC;AAC4B,CAAA,EAAA,WAAA,CAAA,SAAA,EAAA,WAAA,EAAA,KAAA,CAAA,CAAA,CAAA;AAGvD,UAAA,CAAA;AADC,IAAA,QAAQ,CAAC,EAAE,IAAI,EAAE,MAAM,EAAE,CAAC;AAC0C,CAAA,EAAA,WAAA,CAAA,SAAA,EAAA,SAAA,EAAA,KAAA,CAAA,CAAA,CAAA;AAI7D,UAAA,CAAA;AADP,IAAA,KAAK,EAAE;AACqC,CAAA,EAAA,WAAA,CAAA,SAAA,EAAA,cAAA,EAAA,KAAA,CAAA,CAAA,CAAA;AAMrC,UAAA,CAAA;AADP,IAAA,qBAAqB,EAAE;AAC0B,CAAA,EAAA,WAAA,CAAA,SAAA,EAAA,uBAAA,EAAA,KAAA,CAAA,CAAA;;;;"}
+{"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\";\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 */\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  @state()\n  private popperConfig: Partial<PopperOptions>;\n\n  private tooltipConfig: Partial<BsTooltip.Options>;\n\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/footer-item/index.cjs.js

@@ -0,0 +1,39 @@
+'use client';
+'use strict';
+
+Object.defineProperty(exports, '__esModule', { value: true });
+
+var React = require('react');
+var react = require('@lit-labs/react');
+var sgdsFooterItem = require('../components/Footer/sgds-footer-item.cjs.js');
+
+function _interopNamespace(e) {
+  if (e && e.__esModule) return e;
+  var n = Object.create(null);
+  if (e) {
+    Object.keys(e).forEach(function (k) {
+      if (k !== 'default') {
+        var d = Object.getOwnPropertyDescriptor(e, k);
+        Object.defineProperty(n, k, d.get ? d : {
+          enumerable: true,
+          get: function () { return e[k]; }
+        });
+      }
+    });
+  }
+  n["default"] = e;
+  return Object.freeze(n);
+}
+
+var React__namespace = /*#__PURE__*/_interopNamespace(React);
+
+customElements.define("sgds-footer-item", sgdsFooterItem.SgdsFooterItem);
+var index = react.createComponent({
+    react: React__namespace,
+    tagName: "sgds-footer-item",
+    elementClass: sgdsFooterItem.SgdsFooterItem,
+    events: {}
+});
+
+exports["default"] = index;
+//# sourceMappingURL=index.cjs.js.map

package/react/footer-item/index.cjs.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.cjs.js","sources":["../../../src/react/footer-item/index.ts"],"sourcesContent":["import * as React from \"react\";\nimport { createComponent } from \"@lit-labs/react\";\nimport Component from \"../../components/Footer/sgds-footer-item\";\n\ncustomElements.define(\"sgds-footer-item\", Component);\n\nexport default createComponent({\n  react: React,\n  tagName: \"sgds-footer-item\",\n  elementClass: Component,\n  events: {}\n});\n"],"names":["Component","createComponent","React"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAIA,cAAc,CAAC,MAAM,CAAC,kBAAkB,EAAEA,6BAAS,CAAC,CAAC;AAErD,YAAeC,qBAAe,CAAC;AAC7B,IAAA,KAAK,EAAEC,gBAAK;AACZ,IAAA,OAAO,EAAE,kBAAkB;AAC3B,IAAA,YAAY,EAAEF,6BAAS;AACvB,IAAA,MAAM,EAAE,EAAE;AACX,CAAA,CAAC;;;;"}

package/react/footer-item/index.d.ts

@@ -0,0 +1,3 @@
+import Component from "../../components/Footer/sgds-footer-item";
+declare const _default: import("@lit-labs/react").ReactWebComponent<Component, {}>;
+export default _default;

package/react/footer-item/index.js

@@ -0,0 +1,15 @@
+'use client';
+import * as React from 'react';
+import { createComponent } from '@lit-labs/react';
+import { SgdsFooterItem } from '../components/Footer/sgds-footer-item.js';
+
+customElements.define("sgds-footer-item", SgdsFooterItem);
+var index = createComponent({
+    react: React,
+    tagName: "sgds-footer-item",
+    elementClass: SgdsFooterItem,
+    events: {}
+});
+
+export { index as default };
+//# sourceMappingURL=index.js.map

package/react/footer-item/index.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.js","sources":["../../../src/react/footer-item/index.ts"],"sourcesContent":["import * as React from \"react\";\nimport { createComponent } from \"@lit-labs/react\";\nimport Component from \"../../components/Footer/sgds-footer-item\";\n\ncustomElements.define(\"sgds-footer-item\", Component);\n\nexport default createComponent({\n  react: React,\n  tagName: \"sgds-footer-item\",\n  elementClass: Component,\n  events: {}\n});\n"],"names":["Component"],"mappings":";;;;;AAIA,cAAc,CAAC,MAAM,CAAC,kBAAkB,EAAEA,cAAS,CAAC,CAAC;AAErD,YAAe,eAAe,CAAC;AAC7B,IAAA,KAAK,EAAE,KAAK;AACZ,IAAA,OAAO,EAAE,kBAAkB;AAC3B,IAAA,YAAY,EAAEA,cAAS;AACvB,IAAA,MAAM,EAAE,EAAE;AACX,CAAA,CAAC;;;;"}

package/react/icon/index.cjs.js

@@ -0,0 +1,42 @@
+'use client';
+'use strict';
+
+Object.defineProperty(exports, '__esModule', { value: true });
+
+var React = require('react');
+var react = require('@lit-labs/react');
+var sgdsIcon = require('../components/Icon/sgds-icon.cjs.js');
+
+function _interopNamespace(e) {
+  if (e && e.__esModule) return e;
+  var n = Object.create(null);
+  if (e) {
+    Object.keys(e).forEach(function (k) {
+      if (k !== 'default') {
+        var d = Object.getOwnPropertyDescriptor(e, k);
+        Object.defineProperty(n, k, d.get ? d : {
+          enumerable: true,
+          get: function () { return e[k]; }
+        });
+      }
+    });
+  }
+  n["default"] = e;
+  return Object.freeze(n);
+}
+
+var React__namespace = /*#__PURE__*/_interopNamespace(React);
+
+customElements.define("sgds-icon", sgdsIcon.SgdsIcon);
+var index = react.createComponent({
+    react: React__namespace,
+    tagName: "sgds-icon",
+    elementClass: sgdsIcon.SgdsIcon,
+    events: {
+        onSgdsBlur: "sgds-blur",
+        onSgdsFocus: "sgds-focus"
+    }
+});
+
+exports["default"] = index;
+//# sourceMappingURL=index.cjs.js.map

package/react/icon/index.cjs.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.cjs.js","sources":["../../../src/react/icon/index.ts"],"sourcesContent":["import * as React from \"react\";\nimport { createComponent } from \"@lit-labs/react\";\nimport Component from \"../../components/Icon/sgds-icon\";\n\ncustomElements.define(\"sgds-icon\", Component);\n\nexport default createComponent({\n  react: React,\n  tagName: \"sgds-icon\",\n  elementClass: Component,\n  events: {\n    onSgdsBlur: \"sgds-blur\",\n    onSgdsFocus: \"sgds-focus\"\n  }\n});\n"],"names":["Component","createComponent","React"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAIA,cAAc,CAAC,MAAM,CAAC,WAAW,EAAEA,iBAAS,CAAC,CAAC;AAE9C,YAAeC,qBAAe,CAAC;AAC7B,IAAA,KAAK,EAAEC,gBAAK;AACZ,IAAA,OAAO,EAAE,WAAW;AACpB,IAAA,YAAY,EAAEF,iBAAS;AACvB,IAAA,MAAM,EAAE;AACN,QAAA,UAAU,EAAE,WAAW;AACvB,QAAA,WAAW,EAAE,YAAY;AAC1B,KAAA;AACF,CAAA,CAAC;;;;"}

package/react/icon/index.d.ts

@@ -0,0 +1,6 @@
+import Component from "../../components/Icon/sgds-icon";
+declare const _default: import("@lit-labs/react").ReactWebComponent<Component, {
+    onSgdsBlur: string;
+    onSgdsFocus: string;
+}>;
+export default _default;

package/react/icon/index.js

@@ -0,0 +1,18 @@
+'use client';
+import * as React from 'react';
+import { createComponent } from '@lit-labs/react';
+import { SgdsIcon } from '../components/Icon/sgds-icon.js';
+
+customElements.define("sgds-icon", SgdsIcon);
+var index = createComponent({
+    react: React,
+    tagName: "sgds-icon",
+    elementClass: SgdsIcon,
+    events: {
+        onSgdsBlur: "sgds-blur",
+        onSgdsFocus: "sgds-focus"
+    }
+});
+
+export { index as default };
+//# sourceMappingURL=index.js.map

package/react/icon/index.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.js","sources":["../../../src/react/icon/index.ts"],"sourcesContent":["import * as React from \"react\";\nimport { createComponent } from \"@lit-labs/react\";\nimport Component from \"../../components/Icon/sgds-icon\";\n\ncustomElements.define(\"sgds-icon\", Component);\n\nexport default createComponent({\n  react: React,\n  tagName: \"sgds-icon\",\n  elementClass: Component,\n  events: {\n    onSgdsBlur: \"sgds-blur\",\n    onSgdsFocus: \"sgds-focus\"\n  }\n});\n"],"names":["Component"],"mappings":";;;;;AAIA,cAAc,CAAC,MAAM,CAAC,WAAW,EAAEA,QAAS,CAAC,CAAC;AAE9C,YAAe,eAAe,CAAC;AAC7B,IAAA,KAAK,EAAE,KAAK;AACZ,IAAA,OAAO,EAAE,WAAW;AACpB,IAAA,YAAY,EAAEA,QAAS;AACvB,IAAA,MAAM,EAAE;AACN,QAAA,UAAU,EAAE,WAAW;AACvB,QAAA,WAAW,EAAE,YAAY;AAC1B,KAAA;AACF,CAAA,CAAC;;;;"}