@six-group/ui-library 0.0.0-insider.f272114 → 0.0.0-insider.f658e4f

package/dist/components/index.js

@@ -1,4 +1,3 @@
-import { SetAttributes } from './set-attributes.js';
 import { SixAlert } from './six-alert.js';
 import { SixAvatar } from './six-avatar.js';
 import { SixBadge } from './six-badge.js';
@@ -37,6 +36,7 @@ import { SixRange } from './six-range.js';
 import { SixRoot } from './six-root.js';
 import { SixSearchField } from './six-search-field.js';
 import { SixSelect } from './six-select.js';
+export { g as getErrorMessage, a as getLanguage, l as languages } from './six-select.js';
 import { SixSidebar } from './six-sidebar.js';
 import { SixSidebarItem } from './six-sidebar-item.js';
 import { SixSidebarItemGroup } from './six-sidebar-item-group.js';
@@ -51,163 +51,125 @@ import { SixTextarea } from './six-textarea.js';
 import { SixTile } from './six-tile.js';
 import { SixTimepicker } from './six-timepicker.js';
 import { SixTooltip } from './six-tooltip.js';
-export { setAssetPath, setNonce, setPlatformOptions } from '@stencil/core/internal/client';
+export { getAssetPath, setAssetPath, setNonce, setPlatformOptions } from '@stencil/core/internal/client';
 
-const dateFormat = new Intl.DateTimeFormat('de-CH');
 /**
- * Returns an error message for the given language and error.
+ * Displays an alert on the toast stack with a specified message and optional configuration.
+ *
+ * @param message - The message to be displayed in the alert.
+ * @param alertType - The type of the alert. Valid values are 'primary', 'info', 'success', 'warning', 'danger'. Default is 'info'.
+ * @param duration - The duration in milliseconds for which the alert is displayed. If not provided, a default duration is set based on the alert type.
+ * @param iconName - The name of the icon to be displayed in the alert. If not provided, a default icon is set based on the alert type.
  */
-function getErrorMessage(language, error) {
-  try {
-    const message = translation[language][error.key];
-    switch (error.key) {
-      case 'required':
-      case 'requiredtrue':
-      case 'email':
-        return message;
-      case 'minlength':
-      case 'maxlength':
-        return message.replace('{requiredLength}', String(error.requiredLength));
-      case 'pattern':
-        return message.replace('{pattern}', String(error.requiredPattern));
-      case 'min':
-        return message.replace('{min}', String(error.min));
-      case 'max':
-        return message.replace('{max}', String(error.max));
-      case 'mindate':
-        return message.replace('{mindate}', dateFormat.format(error.mindate));
-      case 'maxdate':
-        return message.replace('{maxdate}', dateFormat.format(error.maxdate));
-      case 'invaliddate':
-        return message;
-      case 'custom':
-        return error.text;
+function showAlert(message, alertType, duration, iconName) {
+    const type = alertType !== null && alertType !== void 0 ? alertType : 'info';
+    const icon = iconName !== null && iconName !== void 0 ? iconName : getIcon(type);
+    const alert = Object.assign(document.createElement('six-alert'), {
+        type,
+        duration: duration !== null && duration !== void 0 ? duration : getDuration(type),
+        innerHTML: `<six-icon slot="icon">${icon}</six-icon>${escapeHtml(message)}`,
+        closable: true,
+    });
+    document.body.append(alert);
+    alert.toast();
+}
+function escapeHtml(html) {
+    const div = document.createElement('div');
+    div.textContent = html;
+    return div.innerHTML;
+}
+function getIcon(messageType) {
+    switch (messageType) {
+        case 'primary':
+            return 'info';
+        case 'info':
+            return 'info';
+        case 'success':
+            return 'check_circle';
+        case 'warning':
+            return 'warning';
+        case 'danger':
+            return 'report';
+    }
+}
+function getDuration(messageType) {
+    switch (messageType) {
+        case 'primary':
+            return 10000;
+        case 'info':
+            return 10000;
+        case 'success':
+            return 10000;
+        case 'warning':
+            return 20000;
+        case 'danger':
+            return 20000;
     }
-  }
-  catch (e) {
-    console.warn(`no error message in '${language}' for error:`, error);
-    return undefined;
-  }
 }
-const translation = {
-  en: {
-    required: 'Please fill out this field.',
-    minlength: 'Please enter at least {requiredLength} characters.',
-    maxlength: 'Please enter no more than {requiredLength} characters.',
-    pattern: 'Please enter a value that matches the pattern: {pattern}.',
-    email: 'Please enter a valid email address.',
-    min: 'Please enter a value greater than or equal to {min}.',
-    max: 'Please enter a value less than or equal to {max}.',
-    requiredtrue: 'Please check this field.',
-    mindate: 'Please enter a date on or after {mindate}.',
-    maxdate: 'Please enter a date on or before {maxdate}.',
-    invaliddate: 'Please enter a valid date.',
-  },
-  fr: {
-    required: "Veuillez remplir ce champ s'il vous plaît.",
-    minlength: 'Veuillez entrer au moins {requiredLength} caractères.',
-    maxlength: 'Veuillez entrer au maximum {requiredLength} caractères.',
-    pattern: 'Veuillez entrer une valeur qui correspond au format : {pattern}.',
-    email: 'Veuillez entrer une adresse email valide.',
-    min: 'Veuillez entrer une valeur supérieure ou égale à {min}.',
-    max: 'Veuillez entrer une valeur inférieure ou égale à {max}.',
-    requiredtrue: "Veuillez cocher cette case s'il vous plaît.",
-    mindate: 'Veuillez entrer une date le {mindate} ou après.',
-    maxdate: 'Veuillez entrer une date le {maxdate} ou avant.',
-    invaliddate: 'Veuillez entrer une date valide.',
-  },
-  de: {
-    required: 'Bitte füllen Sie dieses Feld aus.',
-    minlength: 'Bitte geben Sie mindestens {requiredLength} Zeichen ein.',
-    maxlength: 'Bitte geben Sie höchstens {requiredLength} Zeichen ein.',
-    pattern: 'Bitte geben Sie einen Wert ein, der dem Muster entspricht: {pattern}.',
-    email: 'Bitte geben Sie eine gültige E-Mail-Adresse ein.',
-    min: 'Bitte geben Sie einen Wert größer oder gleich {min} ein.',
-    max: 'Bitte geben Sie einen Wert kleiner oder gleich {max} ein.',
-    requiredtrue: 'Bitte aktivieren Sie dieses Feld.',
-    mindate: 'Bitte geben Sie ein Datum am oder nach dem {mindate} ein.',
-    maxdate: 'Bitte geben Sie ein Datum am oder vor dem {maxdate} ein.',
-    invaliddate: 'Bitte geben Sie ein gültiges Datum ein.',
-  },
-  it: {
-    required: 'Si prega di compilare questo campo.',
-    minlength: 'Si prega di inserire almeno {requiredLength} caratteri.',
-    maxlength: 'Si prega di inserire al massimo {requiredLength} caratteri.',
-    pattern: 'Si prega di inserire un valore che corrisponde al formato: {pattern}.',
-    email: 'Si prega di inserire un indirizzo email valido.',
-    min: 'Si prega di inserire un valore maggiore o uguale a {min}.',
-    max: 'Si prega di inserire un valore minore o uguale a {max}.',
-    requiredtrue: 'Si prega di spuntare questo campo.',
-    mindate: 'Si prega di inserire una data il {mindate} o successiva.',
-    maxdate: 'Si prega di inserire una data il {maxdate} o precedente.',
-    invaliddate: 'Inserisci una data valida.',
-  },
-};
 
 const defineCustomElements = (opts) => {
-  if (typeof customElements !== 'undefined') {
-    [
-      SetAttributes,
-      SixAlert,
-      SixAvatar,
-      SixBadge,
-      SixButton,
-      SixCard,
-      SixCheckbox,
-      SixDatepicker,
-      SixDetails,
-      SixDialog,
-      SixDrawer,
-      SixDropdown,
-      SixError,
-      SixErrorPage,
-      SixFileList,
-      SixFileListItem,
-      SixFileUpload,
-      SixFooter,
-      SixGroupLabel,
-      SixHeader,
-      SixIcon,
-      SixIconButton,
-      SixInput,
-      SixItemPicker,
-      SixLanguageSwitcher,
-      SixLayoutGrid,
-      SixMainContainer,
-      SixMenu,
-      SixMenuDivider,
-      SixMenuItem,
-      SixMenuLabel,
-      SixPicto,
-      SixProgressBar,
-      SixProgressRing,
-      SixRadio,
-      SixRange,
-      SixRoot,
-      SixSearchField,
-      SixSelect,
-      SixSidebar,
-      SixSidebarItem,
-      SixSidebarItemGroup,
-      SixSpinner,
-      SixStageIndicator,
-      SixSwitch,
-      SixTab,
-      SixTabGroup,
-      SixTabPanel,
-      SixTag,
-      SixTextarea,
-      SixTile,
-      SixTimepicker,
-      SixTooltip,
-    ].forEach(cmp => {
-      if (!customElements.get(cmp.is)) {
-        customElements.define(cmp.is, cmp, opts);
-      }
-    });
-  }
+    if (typeof customElements !== 'undefined') {
+        [
+            SixAlert,
+            SixAvatar,
+            SixBadge,
+            SixButton,
+            SixCard,
+            SixCheckbox,
+            SixDatepicker,
+            SixDetails,
+            SixDialog,
+            SixDrawer,
+            SixDropdown,
+            SixError,
+            SixErrorPage,
+            SixFileList,
+            SixFileListItem,
+            SixFileUpload,
+            SixFooter,
+            SixGroupLabel,
+            SixHeader,
+            SixIcon,
+            SixIconButton,
+            SixInput,
+            SixItemPicker,
+            SixLanguageSwitcher,
+            SixLayoutGrid,
+            SixMainContainer,
+            SixMenu,
+            SixMenuDivider,
+            SixMenuItem,
+            SixMenuLabel,
+            SixPicto,
+            SixProgressBar,
+            SixProgressRing,
+            SixRadio,
+            SixRange,
+            SixRoot,
+            SixSearchField,
+            SixSelect,
+            SixSidebar,
+            SixSidebarItem,
+            SixSidebarItemGroup,
+            SixSpinner,
+            SixStageIndicator,
+            SixSwitch,
+            SixTab,
+            SixTabGroup,
+            SixTabPanel,
+            SixTag,
+            SixTextarea,
+            SixTile,
+            SixTimepicker,
+            SixTooltip,
+        ].forEach(cmp => {
+            if (!customElements.get(cmp.is)) {
+                customElements.define(cmp.is, cmp, opts);
+            }
+        });
+    }
 };
 
-export { defineCustomElements, getErrorMessage };
+export { defineCustomElements, showAlert };
 
 //# sourceMappingURL=index.js.map

package/dist/components/index.js.map

@@ -1 +1 @@
-{"file":"index.js","mappings":"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","names":[],"sources":["src/utils/error-messages.ts"],"sourcesContent":["export type Language = 'de' | 'fr' | 'it' | 'en';\n\nconst dateFormat = new Intl.DateTimeFormat('de-CH');\n\nexport type ValidationError =\n  | { key: 'required' }\n  | { key: 'requiredtrue' }\n  | { key: 'email'; requiredPattern: string }\n  | { key: 'minlength'; requiredLength: number }\n  | { key: 'maxlength'; requiredLength: number }\n  | { key: 'pattern'; requiredPattern: string }\n  | { key: 'min'; min: number }\n  | { key: 'max'; max: number }\n  | { key: 'mindate'; mindate: Date; actual: Date }\n  | { key: 'maxdate'; maxdate: Date; actual: Date }\n  | { key: 'invaliddate'; actual: Date }\n  | { key: 'custom'; text: string };\n\n/**\n * Returns an error message for the given language and error.\n */\nexport function getErrorMessage(language: Language, error: ValidationError): string | undefined {\n  try {\n    const message = translation[language][error.key];\n    switch (error.key) {\n      case 'required':\n      case 'requiredtrue':\n      case 'email':\n        return message;\n      case 'minlength':\n      case 'maxlength':\n        return message.replace('{requiredLength}', String(error.requiredLength));\n      case 'pattern':\n        return message.replace('{pattern}', String(error.requiredPattern));\n      case 'min':\n        return message.replace('{min}', String(error.min));\n      case 'max':\n        return message.replace('{max}', String(error.max));\n      case 'mindate':\n        return message.replace('{mindate}', dateFormat.format(error.mindate));\n      case 'maxdate':\n        return message.replace('{maxdate}', dateFormat.format(error.maxdate));\n      case 'invaliddate':\n        return message;\n      case 'custom':\n        return error.text;\n    }\n  } catch (e) {\n    console.warn(`no error message in '${language}' for error:`, error);\n    return undefined;\n  }\n}\n\nconst translation: Record<Language, Record<string, string>> = {\n  en: {\n    required: 'Please fill out this field.',\n    minlength: 'Please enter at least {requiredLength} characters.',\n    maxlength: 'Please enter no more than {requiredLength} characters.',\n    pattern: 'Please enter a value that matches the pattern: {pattern}.',\n    email: 'Please enter a valid email address.',\n    min: 'Please enter a value greater than or equal to {min}.',\n    max: 'Please enter a value less than or equal to {max}.',\n    requiredtrue: 'Please check this field.',\n    mindate: 'Please enter a date on or after {mindate}.',\n    maxdate: 'Please enter a date on or before {maxdate}.',\n    invaliddate: 'Please enter a valid date.',\n  },\n  fr: {\n    required: \"Veuillez remplir ce champ s'il vous plaît.\",\n    minlength: 'Veuillez entrer au moins {requiredLength} caractères.',\n    maxlength: 'Veuillez entrer au maximum {requiredLength} caractères.',\n    pattern: 'Veuillez entrer une valeur qui correspond au format : {pattern}.',\n    email: 'Veuillez entrer une adresse email valide.',\n    min: 'Veuillez entrer une valeur supérieure ou égale à {min}.',\n    max: 'Veuillez entrer une valeur inférieure ou égale à {max}.',\n    requiredtrue: \"Veuillez cocher cette case s'il vous plaît.\",\n    mindate: 'Veuillez entrer une date le {mindate} ou après.',\n    maxdate: 'Veuillez entrer une date le {maxdate} ou avant.',\n    invaliddate: 'Veuillez entrer une date valide.',\n  },\n  de: {\n    required: 'Bitte füllen Sie dieses Feld aus.',\n    minlength: 'Bitte geben Sie mindestens {requiredLength} Zeichen ein.',\n    maxlength: 'Bitte geben Sie höchstens {requiredLength} Zeichen ein.',\n    pattern: 'Bitte geben Sie einen Wert ein, der dem Muster entspricht: {pattern}.',\n    email: 'Bitte geben Sie eine gültige E-Mail-Adresse ein.',\n    min: 'Bitte geben Sie einen Wert größer oder gleich {min} ein.',\n    max: 'Bitte geben Sie einen Wert kleiner oder gleich {max} ein.',\n    requiredtrue: 'Bitte aktivieren Sie dieses Feld.',\n    mindate: 'Bitte geben Sie ein Datum am oder nach dem {mindate} ein.',\n    maxdate: 'Bitte geben Sie ein Datum am oder vor dem {maxdate} ein.',\n    invaliddate: 'Bitte geben Sie ein gültiges Datum ein.',\n  },\n  it: {\n    required: 'Si prega di compilare questo campo.',\n    minlength: 'Si prega di inserire almeno {requiredLength} caratteri.',\n    maxlength: 'Si prega di inserire al massimo {requiredLength} caratteri.',\n    pattern: 'Si prega di inserire un valore che corrisponde al formato: {pattern}.',\n    email: 'Si prega di inserire un indirizzo email valido.',\n    min: 'Si prega di inserire un valore maggiore o uguale a {min}.',\n    max: 'Si prega di inserire un valore minore o uguale a {max}.',\n    requiredtrue: 'Si prega di spuntare questo campo.',\n    mindate: 'Si prega di inserire una data il {mindate} o successiva.',\n    maxdate: 'Si prega di inserire una data il {maxdate} o precedente.',\n    invaliddate: 'Inserisci una data valida.',\n  },\n};\n"],"version":3}
+{"file":"index.js","mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAEA;;;;;;;;SAQgB,SAAS,CAAC,OAAe,EAAE,SAAqB,EAAE,QAAiB,EAAE,QAAiB;IACpG,MAAM,IAAI,GAAG,SAAS,aAAT,SAAS,cAAT,SAAS,GAAI,MAAM,CAAC;IACjC,MAAM,IAAI,GAAG,QAAQ,aAAR,QAAQ,cAAR,QAAQ,GAAI,OAAO,CAAC,IAAI,CAAC,CAAC;IACvC,MAAM,KAAK,GAAG,MAAM,CAAC,MAAM,CAAC,QAAQ,CAAC,aAAa,CAAC,WAAW,CAAC,EAAE;QAC/D,IAAI;QACJ,QAAQ,EAAE,QAAQ,aAAR,QAAQ,cAAR,QAAQ,GAAI,WAAW,CAAC,IAAI,CAAC;QACvC,SAAS,EAAE,yBAAyB,IAAI,cAAc,UAAU,CAAC,OAAO,CAAC,EAAE;QAC3E,QAAQ,EAAE,IAAI;KACf,CAAC,CAAC;IACH,QAAQ,CAAC,IAAI,CAAC,MAAM,CAAC,KAAK,CAAC,CAAC;IAC5B,KAAK,CAAC,KAAK,EAAE,CAAC;AAChB,CAAC;AAED,SAAS,UAAU,CAAC,IAAY;IAC9B,MAAM,GAAG,GAAG,QAAQ,CAAC,aAAa,CAAC,KAAK,CAAC,CAAC;IAC1C,GAAG,CAAC,WAAW,GAAG,IAAI,CAAC;IACvB,OAAO,GAAG,CAAC,SAAS,CAAC;AACvB,CAAC;AAED,SAAS,OAAO,CAAC,WAAsB;IACrC,QAAQ,WAAW;QACjB,KAAK,SAAS;YACZ,OAAO,MAAM,CAAC;QAChB,KAAK,MAAM;YACT,OAAO,MAAM,CAAC;QAChB,KAAK,SAAS;YACZ,OAAO,cAAc,CAAC;QACxB,KAAK,SAAS;YACZ,OAAO,SAAS,CAAC;QACnB,KAAK,QAAQ;YACX,OAAO,QAAQ,CAAC;KACnB;AACH,CAAC;AAED,SAAS,WAAW,CAAC,WAAsB;IACzC,QAAQ,WAAW;QACjB,KAAK,SAAS;YACZ,OAAO,KAAK,CAAC;QACf,KAAK,MAAM;YACT,OAAO,KAAK,CAAC;QACf,KAAK,SAAS;YACZ,OAAO,KAAK,CAAC;QACf,KAAK,SAAS;YACZ,OAAO,KAAK,CAAC;QACf,KAAK,QAAQ;YACX,OAAO,KAAK,CAAC;KAChB;AACH;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;","names":[],"sources":["src/utils/alert.ts"],"sourcesContent":["import { AlertType } from '../components/six-alert/six-alert';\n\n/**\n * Displays an alert on the toast stack with a specified message and optional configuration.\n *\n * @param message - The message to be displayed in the alert.\n * @param alertType - The type of the alert. Valid values are 'primary', 'info', 'success', 'warning', 'danger'. Default is 'info'.\n * @param duration - The duration in milliseconds for which the alert is displayed. If not provided, a default duration is set based on the alert type.\n * @param iconName - The name of the icon to be displayed in the alert. If not provided, a default icon is set based on the alert type.\n */\nexport function showAlert(message: string, alertType?: AlertType, duration?: number, iconName?: string): void {\n  const type = alertType ?? 'info';\n  const icon = iconName ?? getIcon(type);\n  const alert = Object.assign(document.createElement('six-alert'), {\n    type,\n    duration: duration ?? getDuration(type),\n    innerHTML: `<six-icon slot=\"icon\">${icon}</six-icon>${escapeHtml(message)}`,\n    closable: true,\n  });\n  document.body.append(alert);\n  alert.toast();\n}\n\nfunction escapeHtml(html: string): string {\n  const div = document.createElement('div');\n  div.textContent = html;\n  return div.innerHTML;\n}\n\nfunction getIcon(messageType: AlertType): string {\n  switch (messageType) {\n    case 'primary':\n      return 'info';\n    case 'info':\n      return 'info';\n    case 'success':\n      return 'check_circle';\n    case 'warning':\n      return 'warning';\n    case 'danger':\n      return 'report';\n  }\n}\n\nfunction getDuration(messageType: AlertType): number {\n  switch (messageType) {\n    case 'primary':\n      return 10000;\n    case 'info':\n      return 10000;\n    case 'success':\n      return 10000;\n    case 'warning':\n      return 20000;\n    case 'danger':\n      return 20000;\n  }\n}\n"],"version":3}

package/dist/components/modal.js

@@ -1,49 +1,33 @@
-//
-// Determines if the browser supports focus({ preventScroll })
-//
-const isPreventScrollSupported = () => {
-  let supported = false;
-  const element = document.createElement('div');
-  element.focus &&
-    element.focus({
-      get preventScroll() {
-        supported = true;
-        return false;
-      },
-    });
-  return supported;
-};
-
 let activeModals = [];
 class Modal {
-  constructor(element, options) {
-    this.element = element;
-    this.options = options;
-    this.handleFocusIn = this.handleFocusIn.bind(this);
-  }
-  activate() {
-    activeModals.push(this.element);
-    document.addEventListener('focusin', this.handleFocusIn);
-  }
-  deactivate() {
-    activeModals = activeModals.filter((modal) => modal !== this.element);
-    document.removeEventListener('focusin', this.handleFocusIn);
-  }
-  isActive() {
-    // The "active" modal is always the most recent one shown
-    return activeModals[activeModals.length - 1] === this.element;
-  }
-  handleFocusIn(event) {
-    var _a, _b;
-    const target = event.target;
-    const tagName = this.element.tagName.toLowerCase();
-    // If focus is lost while the modal is active, run the onFocusOut callback
-    if (this.isActive() && target.closest(tagName) !== this.element && typeof ((_a = this.options) === null || _a === void 0 ? void 0 : _a.onFocusOut) === 'function') {
-      (_b = this.options) === null || _b === void 0 ? void 0 : _b.onFocusOut(event);
+    constructor(element, options) {
+        this.element = element;
+        this.options = options;
+        this.handleFocusIn = this.handleFocusIn.bind(this);
+    }
+    activate() {
+        activeModals.push(this.element);
+        document.addEventListener('focusin', this.handleFocusIn);
+    }
+    deactivate() {
+        activeModals = activeModals.filter((modal) => modal !== this.element);
+        document.removeEventListener('focusin', this.handleFocusIn);
+    }
+    isActive() {
+        // The "active" modal is always the most recent one shown
+        return activeModals[activeModals.length - 1] === this.element;
+    }
+    handleFocusIn(event) {
+        var _a, _b;
+        const target = event.target;
+        const tagName = this.element.tagName.toLowerCase();
+        // If focus is lost while the modal is active, run the onFocusOut callback
+        if (this.isActive() && target.closest(tagName) !== this.element && typeof ((_a = this.options) === null || _a === void 0 ? void 0 : _a.onFocusOut) === 'function') {
+            (_b = this.options) === null || _b === void 0 ? void 0 : _b.onFocusOut(event);
+        }
     }
-  }
 }
 
-export { Modal as M, isPreventScrollSupported as i };
+export { Modal as M };
 
 //# sourceMappingURL=modal.js.map

package/dist/components/modal.js.map

@@ -1 +1 @@
-{"file":"modal.js","mappings":"AAAA;AACA;AACA;MACa,wBAAwB,GAAG;EACtC,IAAI,SAAS,GAAG,KAAK,CAAC;EAEtB,MAAM,OAAO,GAAG,QAAQ,CAAC,aAAa,CAAC,KAAK,CAAC,CAAC;EAC9C,OAAO,CAAC,KAAK;IACX,OAAO,CAAC,KAAK,CAAC;MACZ,IAAI,aAAa;QACf,SAAS,GAAG,IAAI,CAAC;QACjB,OAAO,KAAK,CAAC;OACd;KACF,CAAC,CAAC;EAEL,OAAO,SAAS,CAAC;AACnB;;ACZA,IAAI,YAAY,GAAkB,EAAE,CAAC;MAEhB,KAAK;EAIxB,YAAY,OAAoB,EAAE,OAAsB;IACtD,IAAI,CAAC,OAAO,GAAG,OAAO,CAAC;IACvB,IAAI,CAAC,OAAO,GAAG,OAAO,CAAC;IACvB,IAAI,CAAC,aAAa,GAAG,IAAI,CAAC,aAAa,CAAC,IAAI,CAAC,IAAI,CAAC,CAAC;GACpD;EAED,QAAQ;IACN,YAAY,CAAC,IAAI,CAAC,IAAI,CAAC,OAAO,CAAC,CAAC;IAChC,QAAQ,CAAC,gBAAgB,CAAC,SAAS,EAAE,IAAI,CAAC,aAAa,CAAC,CAAC;GAC1D;EAED,UAAU;IACR,YAAY,GAAG,YAAY,CAAC,MAAM,CAAC,CAAC,KAAK,KAAK,KAAK,KAAK,IAAI,CAAC,OAAO,CAAC,CAAC;IACtE,QAAQ,CAAC,mBAAmB,CAAC,SAAS,EAAE,IAAI,CAAC,aAAa,CAAC,CAAC;GAC7D;EAED,QAAQ;;IAEN,OAAO,YAAY,CAAC,YAAY,CAAC,MAAM,GAAG,CAAC,CAAC,KAAK,IAAI,CAAC,OAAO,CAAC;GAC/D;EAED,aAAa,CAAC,KAAY;;IACxB,MAAM,MAAM,GAAG,KAAK,CAAC,MAAqB,CAAC;IAC3C,MAAM,OAAO,GAAG,IAAI,CAAC,OAAO,CAAC,OAAO,CAAC,WAAW,EAAE,CAAC;;IAGnD,IAAI,IAAI,CAAC,QAAQ,EAAE,IAAI,MAAM,CAAC,OAAO,CAAC,OAAO,CAAC,KAAK,IAAI,CAAC,OAAO,IAAI,QAAO,MAAA,IAAI,CAAC,OAAO,0CAAE,UAAU,CAAA,KAAK,UAAU,EAAE;MACjH,MAAA,IAAI,CAAC,OAAO,0CAAE,UAAU,CAAC,KAAK,CAAC,CAAC;KACjC;GACF;;;;;","names":[],"sources":["src/utils/support.ts","src/utils/modal.ts"],"sourcesContent":["//\n// Determines if the browser supports focus({ preventScroll })\n//\nexport const isPreventScrollSupported = () => {\n  let supported = false;\n\n  const element = document.createElement('div');\n  element.focus &&\n    element.focus({\n      get preventScroll() {\n        supported = true;\n        return false;\n      },\n    });\n\n  return supported;\n};\n","interface ModalOptions {\n  onFocusOut?: (event: Event) => void;\n}\n\nlet activeModals: HTMLElement[] = [];\n\nexport default class Modal {\n  element: HTMLElement;\n  options?: ModalOptions;\n\n  constructor(element: HTMLElement, options?: ModalOptions) {\n    this.element = element;\n    this.options = options;\n    this.handleFocusIn = this.handleFocusIn.bind(this);\n  }\n\n  activate() {\n    activeModals.push(this.element);\n    document.addEventListener('focusin', this.handleFocusIn);\n  }\n\n  deactivate() {\n    activeModals = activeModals.filter((modal) => modal !== this.element);\n    document.removeEventListener('focusin', this.handleFocusIn);\n  }\n\n  isActive() {\n    // The \"active\" modal is always the most recent one shown\n    return activeModals[activeModals.length - 1] === this.element;\n  }\n\n  handleFocusIn(event: Event) {\n    const target = event.target as HTMLElement;\n    const tagName = this.element.tagName.toLowerCase();\n\n    // If focus is lost while the modal is active, run the onFocusOut callback\n    if (this.isActive() && target.closest(tagName) !== this.element && typeof this.options?.onFocusOut === 'function') {\n      this.options?.onFocusOut(event);\n    }\n  }\n}\n"],"version":3}
+{"file":"modal.js","mappings":"AAIA,IAAI,YAAY,GAAkB,EAAE,CAAC;MAEhB,KAAK;IAIxB,YAAY,OAAoB,EAAE,OAAsB;QACtD,IAAI,CAAC,OAAO,GAAG,OAAO,CAAC;QACvB,IAAI,CAAC,OAAO,GAAG,OAAO,CAAC;QACvB,IAAI,CAAC,aAAa,GAAG,IAAI,CAAC,aAAa,CAAC,IAAI,CAAC,IAAI,CAAC,CAAC;KACpD;IAED,QAAQ;QACN,YAAY,CAAC,IAAI,CAAC,IAAI,CAAC,OAAO,CAAC,CAAC;QAChC,QAAQ,CAAC,gBAAgB,CAAC,SAAS,EAAE,IAAI,CAAC,aAAa,CAAC,CAAC;KAC1D;IAED,UAAU;QACR,YAAY,GAAG,YAAY,CAAC,MAAM,CAAC,CAAC,KAAK,KAAK,KAAK,KAAK,IAAI,CAAC,OAAO,CAAC,CAAC;QACtE,QAAQ,CAAC,mBAAmB,CAAC,SAAS,EAAE,IAAI,CAAC,aAAa,CAAC,CAAC;KAC7D;IAED,QAAQ;;QAEN,OAAO,YAAY,CAAC,YAAY,CAAC,MAAM,GAAG,CAAC,CAAC,KAAK,IAAI,CAAC,OAAO,CAAC;KAC/D;IAED,aAAa,CAAC,KAAY;;QACxB,MAAM,MAAM,GAAG,KAAK,CAAC,MAAqB,CAAC;QAC3C,MAAM,OAAO,GAAG,IAAI,CAAC,OAAO,CAAC,OAAO,CAAC,WAAW,EAAE,CAAC;;QAGnD,IAAI,IAAI,CAAC,QAAQ,EAAE,IAAI,MAAM,CAAC,OAAO,CAAC,OAAO,CAAC,KAAK,IAAI,CAAC,OAAO,IAAI,QAAO,MAAA,IAAI,CAAC,OAAO,0CAAE,UAAU,CAAA,KAAK,UAAU,EAAE;YACjH,MAAA,IAAI,CAAC,OAAO,0CAAE,UAAU,CAAC,KAAK,CAAC,CAAC;SACjC;KACF;;;;;","names":[],"sources":["src/utils/modal.ts"],"sourcesContent":["interface ModalOptions {\n  onFocusOut?: (event: Event) => void;\n}\n\nlet activeModals: HTMLElement[] = [];\n\nexport default class Modal {\n  element: HTMLElement;\n  options?: ModalOptions;\n\n  constructor(element: HTMLElement, options?: ModalOptions) {\n    this.element = element;\n    this.options = options;\n    this.handleFocusIn = this.handleFocusIn.bind(this);\n  }\n\n  activate() {\n    activeModals.push(this.element);\n    document.addEventListener('focusin', this.handleFocusIn);\n  }\n\n  deactivate() {\n    activeModals = activeModals.filter((modal) => modal !== this.element);\n    document.removeEventListener('focusin', this.handleFocusIn);\n  }\n\n  isActive() {\n    // The \"active\" modal is always the most recent one shown\n    return activeModals[activeModals.length - 1] === this.element;\n  }\n\n  handleFocusIn(event: Event) {\n    const target = event.target as HTMLElement;\n    const tagName = this.element.tagName.toLowerCase();\n\n    // If focus is lost while the modal is active, run the onFocusOut callback\n    if (this.isActive() && target.closest(tagName) !== this.element && typeof this.options?.onFocusOut === 'function') {\n      this.options?.onFocusOut(event);\n    }\n  }\n}\n"],"version":3}

package/dist/components/popover.js

@@ -1791,113 +1791,113 @@ var createPopper = /*#__PURE__*/popperGenerator({
 
 //
 class Popover {
-  constructor(anchor, popover, options) {
-    this.handleTransitionEnd = this.handleTransitionEnd.bind(this);
-    this.anchor = anchor;
-    this.popover = popover;
-    this.options = Object.assign({
-      skidding: 0,
-      distance: 0,
-      placement: 'bottom-start',
-      strategy: 'absolute',
-      transitionElement: this.popover,
-      visibleClass: 'popover-visible',
-      onAfterShow: () => Promise,
-      onAfterHide: () => Promise,
-      onTransitionEnd: () => Promise,
-    }, options);
-    this.isVisible = false;
-    this.popover.hidden = true;
-    if (this.options.visibleClass != null) {
-      this.popover.classList.remove(this.options.visibleClass);
-    }
-    this.popover.addEventListener('transitionend', this.handleTransitionEnd);
-  }
-  handleTransitionEnd(event) {
-    var _a, _b;
-    const target = event.target;
-    // Make sure the transition event originates from from the correct element, and not one that has bubbled up
-    if (target === this.options.transitionElement) {
-      // This is called before the element is hidden so users can do things like reset scroll. It will fire once for
-      // every transition property. Use `event.propertyName` to determine which property has finished transitioning.
-      (_a = this.options.onTransitionEnd) === null || _a === void 0 ? void 0 : _a.call(this, event);
-      // Make sure we only do this once, since transitionend will fire for every transition
-      if (!this.isVisible && !this.popover.hidden) {
+    constructor(anchor, popover, options) {
+        this.handleTransitionEnd = this.handleTransitionEnd.bind(this);
+        this.anchor = anchor;
+        this.popover = popover;
+        this.options = Object.assign({
+            skidding: 0,
+            distance: 0,
+            placement: 'bottom-start',
+            strategy: 'absolute',
+            transitionElement: this.popover,
+            visibleClass: 'popover-visible',
+            onAfterShow: () => Promise,
+            onAfterHide: () => Promise,
+            onTransitionEnd: () => Promise,
+        }, options);
+        this.isVisible = false;
         this.popover.hidden = true;
         if (this.options.visibleClass != null) {
-          this.popover.classList.remove(this.options.visibleClass);
+            this.popover.classList.remove(this.options.visibleClass);
         }
-        (_b = this.options.onAfterHide) === null || _b === void 0 ? void 0 : _b.call(this);
-      }
+        this.popover.addEventListener('transitionend', this.handleTransitionEnd);
     }
-  }
-  destroy() {
-    this.popover.removeEventListener('transitionend', this.handleTransitionEnd);
-    if (this.popper) {
-      this.popper.destroy();
-      this.popper = undefined;
+    handleTransitionEnd(event) {
+        var _a, _b;
+        const target = event.target;
+        // Make sure the transition event originates from from the correct element, and not one that has bubbled up
+        if (target === this.options.transitionElement) {
+            // This is called before the element is hidden so users can do things like reset scroll. It will fire once for
+            // every transition property. Use `event.propertyName` to determine which property has finished transitioning.
+            (_a = this.options.onTransitionEnd) === null || _a === void 0 ? void 0 : _a.call(this, event);
+            // Make sure we only do this once, since transitionend will fire for every transition
+            if (!this.isVisible && !this.popover.hidden) {
+                this.popover.hidden = true;
+                if (this.options.visibleClass != null) {
+                    this.popover.classList.remove(this.options.visibleClass);
+                }
+                (_b = this.options.onAfterHide) === null || _b === void 0 ? void 0 : _b.call(this);
+            }
+        }
     }
-  }
-  show() {
-    this.isVisible = true;
-    this.popover.hidden = false;
-    requestAnimationFrame(() => {
-      if (this.options.visibleClass != null) {
-        this.popover.classList.add(this.options.visibleClass);
-      }
-    });
-    if (this.popper) {
-      this.popper.destroy();
+    destroy() {
+        this.popover.removeEventListener('transitionend', this.handleTransitionEnd);
+        if (this.popper) {
+            this.popper.destroy();
+            this.popper = undefined;
+        }
     }
-    this.popper = createPopper(this.anchor, this.popover, {
-      placement: this.options.placement,
-      strategy: this.options.strategy,
-      modifiers: [
-        {
-          name: 'flip',
-          options: {
-            boundary: 'viewport',
-          },
-        },
-        {
-          name: 'offset',
-          options: {
-            offset: [this.options.skidding, this.options.distance],
-          },
-        },
-      ],
-    });
-    this.popover.addEventListener('transitionend', () => { var _a; return (_a = this.options.onAfterShow) === null || _a === void 0 ? void 0 : _a.call(this); }, { once: true });
-    // Reposition the menu after it appears in case a modifier kicked in
-    requestAnimationFrame(() => { var _a; return (_a = this.popper) === null || _a === void 0 ? void 0 : _a.update(); });
-  }
-  reposition() {
-    var _a;
-    (_a = this.popper) === null || _a === void 0 ? void 0 : _a.update();
-  }
-  hide() {
-    // Apply the hidden styles and wait for the transition before hiding completely
-    this.isVisible = false;
-    if (this.options.visibleClass != null) {
-      this.popover.classList.remove(this.options.visibleClass);
+    show() {
+        this.isVisible = true;
+        this.popover.hidden = false;
+        requestAnimationFrame(() => {
+            if (this.options.visibleClass != null) {
+                this.popover.classList.add(this.options.visibleClass);
+            }
+        });
+        if (this.popper) {
+            this.popper.destroy();
+        }
+        this.popper = createPopper(this.anchor, this.popover, {
+            placement: this.options.placement,
+            strategy: this.options.strategy,
+            modifiers: [
+                {
+                    name: 'flip',
+                    options: {
+                        boundary: 'viewport',
+                    },
+                },
+                {
+                    name: 'offset',
+                    options: {
+                        offset: [this.options.skidding, this.options.distance],
+                    },
+                },
+            ],
+        });
+        this.popover.addEventListener('transitionend', () => { var _a; return (_a = this.options.onAfterShow) === null || _a === void 0 ? void 0 : _a.call(this); }, { once: true });
+        // Reposition the menu after it appears in case a modifier kicked in
+        requestAnimationFrame(() => { var _a; return (_a = this.popper) === null || _a === void 0 ? void 0 : _a.update(); });
     }
-  }
-  setOptions(options) {
-    this.options = Object.assign(this.options, options);
-    if (this.options.visibleClass != null) {
-      this.isVisible
-        ? this.popover.classList.add(this.options.visibleClass)
-        : this.popover.classList.remove(this.options.visibleClass);
+    reposition() {
+        var _a;
+        (_a = this.popper) === null || _a === void 0 ? void 0 : _a.update();
     }
-    // Update popper options
-    if (this.popper != null) {
-      void this.popper.setOptions({
-        placement: this.options.placement,
-        strategy: this.options.strategy,
-      });
-      requestAnimationFrame(() => { var _a; return (_a = this.popper) === null || _a === void 0 ? void 0 : _a.update(); });
+    hide() {
+        // Apply the hidden styles and wait for the transition before hiding completely
+        this.isVisible = false;
+        if (this.options.visibleClass != null) {
+            this.popover.classList.remove(this.options.visibleClass);
+        }
+    }
+    setOptions(options) {
+        this.options = Object.assign(this.options, options);
+        if (this.options.visibleClass != null) {
+            this.isVisible
+                ? this.popover.classList.add(this.options.visibleClass)
+                : this.popover.classList.remove(this.options.visibleClass);
+        }
+        // Update popper options
+        if (this.popper != null) {
+            void this.popper.setOptions({
+                placement: this.options.placement,
+                strategy: this.options.strategy,
+            });
+            requestAnimationFrame(() => { var _a; return (_a = this.popper) === null || _a === void 0 ? void 0 : _a.update(); });
+        }
     }
-  }
 }
 
 export { Popover as P };