@agnos-ui/core 0.9.2 → 0.10.0-next.0

package/toaster-UDglac7x.cjs

@@ -0,0 +1,187 @@
+"use strict";
+const tansu = require("@amadeus-it-group/tansu");
+const services_extendWidget = require("./services/extendWidget.cjs");
+const utils_directive = require("./dom-C2gi9OCP.cjs");
+const utils_stores = require("./utils/stores.cjs");
+const utils_writables = require("./writables-DcGT98a7.cjs");
+const common = require("./common-D3QcdJ6S.cjs");
+const utils_widget = require("./utils/widget.cjs");
+const toastDefaultConfig = {
+  autoHide: true,
+  delay: 5e3
+};
+const toastConfigValidator = {
+  autoHide: utils_writables.typeBoolean,
+  delay: utils_writables.typeNumberInRangeFactory(0, Infinity, { strict: true })
+};
+function getToastDefaultConfig() {
+  return { ...common.getCommonAlertDefaultConfig(), ...toastDefaultConfig };
+}
+const createToast = utils_widget.createWidgetFactory("toast", (config) => {
+  let _timeout;
+  const extendedAlert = services_extendWidget.extendWidgetProps(
+    common.createCommonAlert,
+    toastDefaultConfig,
+    toastConfigValidator
+  )(config);
+  const time$ = tansu.computed(() => {
+    clearTimeout(_timeout);
+    if (extendedAlert.stores.autoHide$()) {
+      _timeout = setTimeout(() => extendedAlert.api.close(), extendedAlert.stores.delay$());
+    }
+  });
+  const bodyDirective = utils_directive.createAttributesDirective(() => ({
+    attributes: {
+      role: tansu.readable("alert"),
+      "aria-atomic": tansu.readable("true"),
+      class: tansu.computed(() => extendedAlert.stores.className$())
+    },
+    classNames: {
+      "au-toast": utils_stores.true$,
+      toast: utils_stores.true$
+    }
+  }));
+  const closeButtonDirective = utils_directive.createAttributesDirective(() => ({
+    attributes: {
+      type: tansu.readable("button"),
+      "aria-label": tansu.computed(() => extendedAlert.stores.ariaCloseButtonLabel$())
+    },
+    events: {
+      click: extendedAlert.api.close
+    }
+  }));
+  return {
+    ...extendedAlert,
+    directives: {
+      ...extendedAlert.directives,
+      autoHideDirective: utils_directive.directiveSubscribe(time$),
+      bodyDirective,
+      closeButtonDirective
+    }
+  };
+});
+const defaultToasterProps = {
+  duration: 5e3,
+  position: "bottomRight",
+  dismissible: false
+};
+class Toaster {
+  #idCount = 0;
+  #toasts = tansu.writable([]);
+  /**
+   * Get the toasts value from the store
+   * @returns The array of toasts.
+   */
+  toasts = tansu.computed(
+    () => this.#toasts().sort((a, b) => b.id - a.id).slice(0, this.options().limit)
+  );
+  options = tansu.writable(defaultToasterProps);
+  #timers = /* @__PURE__ */ new Map();
+  /**
+   * Get the timers value from the store
+   * @returns The map of timers.
+   */
+  get timers() {
+    return new Map(this.#timers);
+  }
+  constructor(props) {
+    this.options.set({
+      ...defaultToasterProps,
+      ...props
+    });
+    this.options.subscribe(() => {
+      this.updateToasts();
+    });
+  }
+  /**
+   * Add timer for a toast
+   * @param id Id of the toast
+   * @param duration Duration of the timer, by default taken from options
+   */
+  addTimer = (id, duration = this.options().duration) => {
+    if (duration > 0) {
+      this.#timers.set(id, {
+        timeout: setTimeout(() => this.removeToast(id), duration),
+        started: performance.now(),
+        duration
+      });
+    }
+  };
+  /**
+   * Pause a timer for a toast
+   * @param id Id of the toast
+   */
+  pauseTimer = (id) => {
+    if (this.#timers.has(id)) {
+      const timer = this.#timers.get(id);
+      if (timer && timer.timeout) {
+        clearTimeout(timer.timeout);
+        timer.timeout = null;
+        timer.paused = performance.now();
+      }
+    }
+  };
+  /**
+   * Resume a timer for a toast
+   * @param id Id of the toast
+   */
+  resumeTimer = (id) => {
+    if (this.#timers.has(id)) {
+      const timer = this.#timers.get(id);
+      if (timer) {
+        const paused = timer.paused ?? timer.started;
+        const elapsed = paused - timer.started;
+        const remaining = (timer.duration ?? 0) - elapsed;
+        this.addTimer(id, remaining);
+        timer.duration = remaining;
+        timer.paused = void 0;
+      }
+    }
+  };
+  /**
+   * Events directive is used to set events on the Toast component, to keep track for example of pointer enter/leave,
+   * used to pause / resume the timer in case of duration and pauseOnHover are specified.
+   */
+  eventsDirective = utils_directive.createAttributesDirective((id) => ({
+    events: {
+      pointerenter: () => this.options().pauseOnHover && this.pauseTimer(id()),
+      pointerleave: () => this.options().pauseOnHover && this.resumeTimer(id())
+    }
+  }));
+  /**
+   * Helper to add a toast to the viewport.
+   * @param props Options for the toast.
+   * @returns The ID of the added toast.
+   */
+  addToast = (props) => {
+    const autoHide = props.autoHide ?? this.options().duration > 0;
+    this.#toasts.update((toasts) => [...toasts, { id: this.#idCount++, props }]);
+    if (autoHide) {
+      this.addTimer(this.#idCount - 1, props.delay);
+    }
+    return this.#idCount - 1;
+  };
+  /**
+   * Helper to remove a toast to the viewport.
+   * @param id Id of the toast to remove.
+   */
+  removeToast = (id) => {
+    this.#timers.delete(id);
+    this.#toasts.update((toasts) => toasts.filter((toast) => toast.id !== id));
+  };
+  /** Helper to update toasts when options change */
+  updateToasts = () => {
+    if (this.options().duration === 0) {
+      this.options().dismissible = true;
+    }
+  };
+  /** Helper to close all toasts at once */
+  closeAll = () => {
+    this.#toasts.set([]);
+    this.#timers.clear();
+  };
+}
+exports.Toaster = Toaster;
+exports.createToast = createToast;
+exports.defaultToasterProps = defaultToasterProps;
+exports.getToastDefaultConfig = getToastDefaultConfig;

package/toaster-_p1GTtHI.js

@@ -0,0 +1,188 @@
+import { computed, readable, writable } from "@amadeus-it-group/tansu";
+import { extendWidgetProps } from "./services/extendWidget.js";
+import { p as createAttributesDirective, d as directiveSubscribe } from "./dom-Bcg9ORcA.js";
+import { true$ } from "./utils/stores.js";
+import { b as typeNumberInRangeFactory, c as typeBoolean } from "./writables-e0tyaQpe.js";
+import { g as getCommonAlertDefaultConfig, c as createCommonAlert } from "./common-DK0ADNTX.js";
+import { createWidgetFactory } from "./utils/widget.js";
+const toastDefaultConfig = {
+  autoHide: true,
+  delay: 5e3
+};
+const toastConfigValidator = {
+  autoHide: typeBoolean,
+  delay: typeNumberInRangeFactory(0, Infinity, { strict: true })
+};
+function getToastDefaultConfig() {
+  return { ...getCommonAlertDefaultConfig(), ...toastDefaultConfig };
+}
+const createToast = createWidgetFactory("toast", (config) => {
+  let _timeout;
+  const extendedAlert = extendWidgetProps(
+    createCommonAlert,
+    toastDefaultConfig,
+    toastConfigValidator
+  )(config);
+  const time$ = computed(() => {
+    clearTimeout(_timeout);
+    if (extendedAlert.stores.autoHide$()) {
+      _timeout = setTimeout(() => extendedAlert.api.close(), extendedAlert.stores.delay$());
+    }
+  });
+  const bodyDirective = createAttributesDirective(() => ({
+    attributes: {
+      role: readable("alert"),
+      "aria-atomic": readable("true"),
+      class: computed(() => extendedAlert.stores.className$())
+    },
+    classNames: {
+      "au-toast": true$,
+      toast: true$
+    }
+  }));
+  const closeButtonDirective = createAttributesDirective(() => ({
+    attributes: {
+      type: readable("button"),
+      "aria-label": computed(() => extendedAlert.stores.ariaCloseButtonLabel$())
+    },
+    events: {
+      click: extendedAlert.api.close
+    }
+  }));
+  return {
+    ...extendedAlert,
+    directives: {
+      ...extendedAlert.directives,
+      autoHideDirective: directiveSubscribe(time$),
+      bodyDirective,
+      closeButtonDirective
+    }
+  };
+});
+const defaultToasterProps = {
+  duration: 5e3,
+  position: "bottomRight",
+  dismissible: false
+};
+class Toaster {
+  #idCount = 0;
+  #toasts = writable([]);
+  /**
+   * Get the toasts value from the store
+   * @returns The array of toasts.
+   */
+  toasts = computed(
+    () => this.#toasts().sort((a, b) => b.id - a.id).slice(0, this.options().limit)
+  );
+  options = writable(defaultToasterProps);
+  #timers = /* @__PURE__ */ new Map();
+  /**
+   * Get the timers value from the store
+   * @returns The map of timers.
+   */
+  get timers() {
+    return new Map(this.#timers);
+  }
+  constructor(props) {
+    this.options.set({
+      ...defaultToasterProps,
+      ...props
+    });
+    this.options.subscribe(() => {
+      this.updateToasts();
+    });
+  }
+  /**
+   * Add timer for a toast
+   * @param id Id of the toast
+   * @param duration Duration of the timer, by default taken from options
+   */
+  addTimer = (id, duration = this.options().duration) => {
+    if (duration > 0) {
+      this.#timers.set(id, {
+        timeout: setTimeout(() => this.removeToast(id), duration),
+        started: performance.now(),
+        duration
+      });
+    }
+  };
+  /**
+   * Pause a timer for a toast
+   * @param id Id of the toast
+   */
+  pauseTimer = (id) => {
+    if (this.#timers.has(id)) {
+      const timer = this.#timers.get(id);
+      if (timer && timer.timeout) {
+        clearTimeout(timer.timeout);
+        timer.timeout = null;
+        timer.paused = performance.now();
+      }
+    }
+  };
+  /**
+   * Resume a timer for a toast
+   * @param id Id of the toast
+   */
+  resumeTimer = (id) => {
+    if (this.#timers.has(id)) {
+      const timer = this.#timers.get(id);
+      if (timer) {
+        const paused = timer.paused ?? timer.started;
+        const elapsed = paused - timer.started;
+        const remaining = (timer.duration ?? 0) - elapsed;
+        this.addTimer(id, remaining);
+        timer.duration = remaining;
+        timer.paused = void 0;
+      }
+    }
+  };
+  /**
+   * Events directive is used to set events on the Toast component, to keep track for example of pointer enter/leave,
+   * used to pause / resume the timer in case of duration and pauseOnHover are specified.
+   */
+  eventsDirective = createAttributesDirective((id) => ({
+    events: {
+      pointerenter: () => this.options().pauseOnHover && this.pauseTimer(id()),
+      pointerleave: () => this.options().pauseOnHover && this.resumeTimer(id())
+    }
+  }));
+  /**
+   * Helper to add a toast to the viewport.
+   * @param props Options for the toast.
+   * @returns The ID of the added toast.
+   */
+  addToast = (props) => {
+    const autoHide = props.autoHide ?? this.options().duration > 0;
+    this.#toasts.update((toasts) => [...toasts, { id: this.#idCount++, props }]);
+    if (autoHide) {
+      this.addTimer(this.#idCount - 1, props.delay);
+    }
+    return this.#idCount - 1;
+  };
+  /**
+   * Helper to remove a toast to the viewport.
+   * @param id Id of the toast to remove.
+   */
+  removeToast = (id) => {
+    this.#timers.delete(id);
+    this.#toasts.update((toasts) => toasts.filter((toast) => toast.id !== id));
+  };
+  /** Helper to update toasts when options change */
+  updateToasts = () => {
+    if (this.options().duration === 0) {
+      this.options().dismissible = true;
+    }
+  };
+  /** Helper to close all toasts at once */
+  closeAll = () => {
+    this.#toasts.set([]);
+    this.#timers.clear();
+  };
+}
+export {
+  Toaster as T,
+  createToast as c,
+  defaultToasterProps as d,
+  getToastDefaultConfig as g
+};

package/{tree-BFrXdJox.js → tree-DV0tfPlZ.js}

@@ -1,9 +1,9 @@
 import { writable, computed, readable } from "@amadeus-it-group/tansu";
 import { createNavManager } from "./services/navManager.js";
-import { k as mergeDirectives, n as createAttributesDirective, b as browserDirective, a as bindDirective } from "./dom-gfxqXJpK.js";
+import { n as mergeDirectives, p as createAttributesDirective, b as browserDirective, a as bindDirective } from "./dom-Bcg9ORcA.js";
 import { noop } from "./utils/func.js";
 import { writablesForProps, stateStores, true$ } from "./utils/stores.js";
-import { g as typeFunction, i as typeArray, e as typeString } from "./writables-CgpOQ4hA.js";
+import { g as typeFunction, i as typeArray, e as typeString } from "./writables-e0tyaQpe.js";
 import { createWidgetFactory } from "./utils/widget.js";
 function getTreeDefaultConfig() {
   return {
@@ -62,13 +62,12 @@ const createTree = createWidgetFactory("tree", (config) => {
     selector: navSelector$()
   }));
   const traverseTree = (node, level, parent) => {
-    var _a;
     const copyNode = {
       ...node,
       ariaLabel: node.ariaLabel ?? node.label,
       level,
       children: [],
-      isExpanded: ((_a = node.children) == null ? void 0 : _a.length) ? node.isExpanded ?? false : void 0
+      isExpanded: node.children?.length ? node.isExpanded ?? false : void 0
     };
     treeMap.set(copyNode, {
       parent
@@ -117,9 +116,8 @@ const createTree = createWidgetFactory("tree", (config) => {
     }
   );
   const focusElementIfExists = (itemToFocus) => {
-    var _a;
     if (itemToFocus) {
-      const mapItemHtml = (_a = getTreeItemInfo(itemToFocus)) == null ? void 0 : _a.htmlElement;
+      const mapItemHtml = getTreeItemInfo(itemToFocus)?.htmlElement;
       if (mapItemHtml) {
         const index = elementsInDomOrder$().indexOf(mapItemHtml);
         focusIndex(index, 0);
@@ -137,7 +135,6 @@ const createTree = createWidgetFactory("tree", (config) => {
         toggleExpanded(item);
       },
       keydown: (event) => {
-        var _a, _b;
         const { key } = event;
         const { item } = treeItemContext$();
         const isExpanded = item.isExpanded;
@@ -151,14 +148,14 @@ const createTree = createWidgetFactory("tree", (config) => {
             if (isExpanded) {
               toggleExpanded(item);
             } else {
-              focusElementIfExists((_a = getTreeItemInfo(item)) == null ? void 0 : _a.parent);
+              focusElementIfExists(getTreeItemInfo(item)?.parent);
             }
             break;
           case "ArrowRight":
             if (!isExpanded) {
               toggleExpanded(item);
             } else {
-              focusElementIfExists((_b = item.children) == null ? void 0 : _b[0]);
+              focusElementIfExists(item.children?.[0]);
             }
             break;
           default:
@@ -210,10 +207,9 @@ const createTree = createWidgetFactory("tree", (config) => {
           "aria-selected": readable("false"),
           // TODO: adapt aria-selected to the actual selected state
           "aria-expanded": computed(() => {
-            var _a;
             const { item } = treeItemContext$();
             _toggleChange$();
-            return (_a = item.isExpanded) == null ? void 0 : _a.toString();
+            return item.isExpanded?.toString();
           })
         }
       }))

package/{tree-Pvr2rZ-D.cjs → tree-rGHtmCnS.cjs}

@@ -1,10 +1,10 @@
 "use strict";
 const tansu = require("@amadeus-it-group/tansu");
 const services_navManager = require("./services/navManager.cjs");
-const utils_directive = require("./dom-CuBx1JPZ.cjs");
+const utils_directive = require("./dom-C2gi9OCP.cjs");
 const utils_func = require("./utils/func.cjs");
 const utils_stores = require("./utils/stores.cjs");
-const utils_writables = require("./writables-Bn3uhKEG.cjs");
+const utils_writables = require("./writables-DcGT98a7.cjs");
 const utils_widget = require("./utils/widget.cjs");
 function getTreeDefaultConfig() {
   return {
@@ -63,13 +63,12 @@ const createTree = utils_widget.createWidgetFactory("tree", (config) => {
     selector: navSelector$()
   }));
   const traverseTree = (node, level, parent) => {
-    var _a;
     const copyNode = {
       ...node,
       ariaLabel: node.ariaLabel ?? node.label,
       level,
       children: [],
-      isExpanded: ((_a = node.children) == null ? void 0 : _a.length) ? node.isExpanded ?? false : void 0
+      isExpanded: node.children?.length ? node.isExpanded ?? false : void 0
     };
     treeMap.set(copyNode, {
       parent
@@ -118,9 +117,8 @@ const createTree = utils_widget.createWidgetFactory("tree", (config) => {
     }
   );
   const focusElementIfExists = (itemToFocus) => {
-    var _a;
     if (itemToFocus) {
-      const mapItemHtml = (_a = getTreeItemInfo(itemToFocus)) == null ? void 0 : _a.htmlElement;
+      const mapItemHtml = getTreeItemInfo(itemToFocus)?.htmlElement;
       if (mapItemHtml) {
         const index = elementsInDomOrder$().indexOf(mapItemHtml);
         focusIndex(index, 0);
@@ -138,7 +136,6 @@ const createTree = utils_widget.createWidgetFactory("tree", (config) => {
         toggleExpanded(item);
       },
       keydown: (event) => {
-        var _a, _b;
         const { key } = event;
         const { item } = treeItemContext$();
         const isExpanded = item.isExpanded;
@@ -152,14 +149,14 @@ const createTree = utils_widget.createWidgetFactory("tree", (config) => {
             if (isExpanded) {
               toggleExpanded(item);
             } else {
-              focusElementIfExists((_a = getTreeItemInfo(item)) == null ? void 0 : _a.parent);
+              focusElementIfExists(getTreeItemInfo(item)?.parent);
             }
             break;
           case "ArrowRight":
             if (!isExpanded) {
               toggleExpanded(item);
             } else {
-              focusElementIfExists((_b = item.children) == null ? void 0 : _b[0]);
+              focusElementIfExists(item.children?.[0]);
             }
             break;
           default:
@@ -211,10 +208,9 @@ const createTree = utils_widget.createWidgetFactory("tree", (config) => {
           "aria-selected": tansu.readable("false"),
           // TODO: adapt aria-selected to the actual selected state
           "aria-expanded": tansu.computed(() => {
-            var _a;
             const { item } = treeItemContext$();
             _toggleChange$();
-            return (_a = item.isExpanded) == null ? void 0 : _a.toString();
+            return item.isExpanded?.toString();
           })
         }
       }))

package/utils/directive.cjs

@@ -2,7 +2,7 @@
 Object.defineProperty(exports, Symbol.toStringTag, { value: "Module" });
 require("@amadeus-it-group/tansu");
 require("esm-env");
-const utils_directive = require("../dom-CuBx1JPZ.cjs");
+const utils_directive = require("../dom-C2gi9OCP.cjs");
 require("./func.cjs");
 exports.attributesData = utils_directive.attributesData;
 exports.bindDirective = utils_directive.bindDirective;
@@ -12,6 +12,8 @@ exports.classDirective = utils_directive.classDirective;
 exports.createAttributesDirective = utils_directive.createAttributesDirective;
 exports.createBrowserStoreArrayDirective = utils_directive.createBrowserStoreArrayDirective;
 exports.createBrowserStoreDirective = utils_directive.createBrowserStoreDirective;
+exports.createConditionalBrowserStoreArrayDirective = utils_directive.createConditionalBrowserStoreArrayDirective;
+exports.createConditionalStoreArrayDirective = utils_directive.createConditionalStoreArrayDirective;
 exports.createStoreArrayDirective = utils_directive.createStoreArrayDirective;
 exports.createStoreDirective = utils_directive.createStoreDirective;
 exports.directiveAttributes = utils_directive.directiveAttributes;

package/utils/directive.d.ts

@@ -88,6 +88,30 @@ export declare const directiveUpdate: <T>(update: (arg: T) => void) => Directive
 export declare const registrationArray: <T>() => ReadableSignal<T[]> & {
     register: (element: T) => () => void;
 };
+/**
+ * Returns a directive and a store. The store contains at any time the array of all the DOM elements on which the directive is
+ * currently used.
+ *
+ *  The directive is applied depending on the value of its argument:
+ * - `true` or `undefined`: Apply directive to the element.
+ * - `false`: Do not apply apply directive to the element.
+ *
+ * @remarks
+ * It is the same as {@link createConditionalBrowserStoreArrayDirective}, but the returned directive is also executed in a server environment
+ * and the type of the elements is {@link SSRHTMLElement} instead of HTMLElement.
+ *
+ * If the directive is intended to be used on a single element element, it may be more appropriate to use
+ * {@link createStoreDirective} instead.
+ *
+ *
+ * @returns An object with two properties: the `directive` property that is the directive to use on some DOM elements,
+ * and the `elements$` property that is the store containing an array of all the elements on which the directive is currently
+ * used.
+ */
+export declare const createConditionalStoreArrayDirective: () => {
+    directive: Directive<boolean | undefined>;
+    elements$: ReadableSignal<SSRHTMLElement[]>;
+};
 /**
  * Returns a directive and a store. The store contains at any time the array of all the DOM elements on which the directive is
  * currently used.
@@ -126,6 +150,29 @@ export declare const createBrowserStoreArrayDirective: () => {
     directive: Directive<void, SSRHTMLElement>;
     elements$: ReadableSignal<HTMLElement[]>;
 };
+/**
+ * Returns a directive and a store. The store contains at any time the array of all the DOM elements on which the directive is
+ * currently used.
+ *
+ *  The directive is applied depending on the value of its argument:
+ * - `true` or `undefined`: Apply directive to the element.
+ * - `false`: Do not apply apply directive to the element.
+ *
+ * @remarks
+ * It is the same as {@link createConditionalStoreArrayDirective}, but the returned directive is only executed in a browser environment
+ * and the type of the elements is HTMLElement instead of {@link SSRHTMLElement}.
+ *
+ * If the directive is intended to be used on a single element element, it may be more appropriate to use
+ * {@link createBrowserStoreDirective} instead.
+ *
+ * @returns An object with two properties: the `directive` property that is the directive to use on some DOM elements,
+ * and the `elements$` property that is the store containing an array of all the elements on which the directive is currently
+ * used.
+ */
+export declare const createConditionalBrowserStoreArrayDirective: () => {
+    directive: Directive<boolean | undefined, SSRHTMLElement>;
+    elements$: ReadableSignal<HTMLElement[]>;
+};
 /**
  * Returns a directive and a store. When the directive is used on a DOM element, the store contains that DOM element.
  * When the directive is not used, the store contains null.

package/utils/directive.js

@@ -1,25 +1,27 @@
 import "@amadeus-it-group/tansu";
 import "esm-env";
-import { o, a, c, b, p, n, g, j, f, h, q, d, e, i, m, k, l, r, s } from "../dom-gfxqXJpK.js";
+import { q, a, c, b, s, p, h, l, j, f, g, k, t, d, e, i, m, n, o, r, u } from "../dom-Bcg9ORcA.js";
 import "./func.js";
 export {
-  o as attributesData,
+  q as attributesData,
   a as bindDirective,
   c as bindDirectiveNoArg,
   b as browserDirective,
-  p as classDirective,
-  n as createAttributesDirective,
-  g as createBrowserStoreArrayDirective,
-  j as createBrowserStoreDirective,
-  f as createStoreArrayDirective,
-  h as createStoreDirective,
-  q as directiveAttributes,
+  s as classDirective,
+  p as createAttributesDirective,
+  h as createBrowserStoreArrayDirective,
+  l as createBrowserStoreDirective,
+  j as createConditionalBrowserStoreArrayDirective,
+  f as createConditionalStoreArrayDirective,
+  g as createStoreArrayDirective,
+  k as createStoreDirective,
+  t as directiveAttributes,
   d as directiveSubscribe,
   e as directiveUpdate,
   i as isBrowserHTMLElement,
   m as mapDirectiveArg,
-  k as mergeDirectives,
-  l as multiDirective,
+  n as mergeDirectives,
+  o as multiDirective,
   r as registrationArray,
-  s as ssrAttributes
+  u as ssrAttributes
 };

package/utils/stores.cjs

@@ -3,13 +3,12 @@ Object.defineProperty(exports, Symbol.toStringTag, { value: "Module" });
 const tansu = require("@amadeus-it-group/tansu");
 const types = require("../types.cjs");
 const utils_func = require("./func.cjs");
-const utils_directive = require("../dom-CuBx1JPZ.cjs");
+const utils_directive = require("../dom-C2gi9OCP.cjs");
 function createPatch(stores) {
   return function(storesValues) {
     tansu.batch(() => {
-      var _a;
       for (const [name, value] of Object.entries(storesValues)) {
-        (_a = stores[`${name}$`]) == null ? void 0 : _a.set(value);
+        stores[`${name}$`]?.set(value);
       }
     });
   };
@@ -74,8 +73,8 @@ const normalizeConfigStores = (keys, config) => {
 const mergeConfigStores = (keys, config1, config2) => {
   const res = {};
   for (const key of keys) {
-    const config1Store = config1 == null ? void 0 : config1[key];
-    const config2Store = config2 == null ? void 0 : config2[key];
+    const config1Store = config1?.[key];
+    const config2Store = config2?.[key];
     res[key] = config1Store && config2Store ? tansu.computed(() => config1Store() ?? config2Store()) : config1Store || config2Store;
   }
   return res;
@@ -83,11 +82,11 @@ const mergeConfigStores = (keys, config1, config2) => {
 const writablesWithDefault = (defConfig, propsConfig, options) => {
   const res = {};
   const keys = Object.keys(defConfig);
-  const configStores = normalizeConfigStores(keys, propsConfig == null ? void 0 : propsConfig.config);
-  const props = propsConfig == null ? void 0 : propsConfig.props;
+  const configStores = normalizeConfigStores(keys, propsConfig?.config);
+  const props = propsConfig?.props;
   for (const key of keys) {
-    const propValue = props == null ? void 0 : props[key];
-    res[`${key}$`] = writableWithDefault(defConfig[key], configStores[key], options == null ? void 0 : options[key], toWritableStore(propValue));
+    const propValue = props?.[key];
+    res[`${key}$`] = writableWithDefault(defConfig[key], configStores[key], options?.[key], toWritableStore(propValue));
   }
   return res;
 };