@agnos-ui/core 0.7.0 → 0.8.0-next.0

package/{slider-6LI4-f5s.js → slider-C-BSdQ0b.js}

@@ -1,7 +1,7 @@
-import { computed, writable } from "@amadeus-it-group/tansu";
-import { j as createBrowserStoreDirective, k as mergeDirectives, n as createAttributesDirective } from "./directive-CKEccryv.js";
-import { n as noop } from "./func-DR0n-ShK.js";
-import { writablesForProps, bindableProp, stateStores } from "./utils/stores.js";
+import { computed, writable, readable } from "@amadeus-it-group/tansu";
+import { j as createBrowserStoreDirective, k as mergeDirectives, n as createAttributesDirective } from "./dom-BB9jLllr.js";
+import { noop } from "./utils/func.js";
+import { writablesForProps, bindableProp, stateStores, true$ } from "./utils/stores.js";
 import { h as typeArray, a as typeNumber, b as typeNumberInRangeFactory, c as typeBoolean, f as typeFunction, e as typeString } from "./writables-DCiBdIBK.js";
 import { createResizeObserver } from "./services/resizeObserver.js";
 const decimalRegExp = /(?:\.(\d+))?(?:[eE]([+-]?\d+))?$/;
@@ -23,12 +23,16 @@ const defaultSliderConfig = {
   disabled: false,
   vertical: false,
   className: "",
-  ariaLabelHandle: (value) => "" + value,
-  ariaValueText: (value) => "" + value,
+  ariaLabel: () => "Value",
+  ariaLabelledBy: () => "",
+  ariaValueText: () => "",
   onValuesChange: noop,
   values: [0],
   showValueLabels: true,
   showMinMaxLabels: true,
+  showTicks: false,
+  showTickValues: true,
+  tickInterval: 0,
   rtl: false
 };
 function getSliderDefaultConfig() {
@@ -41,12 +45,16 @@ const configValidator = {
   readonly: typeBoolean,
   disabled: typeBoolean,
   vertical: typeBoolean,
-  ariaLabelHandle: typeFunction,
+  ariaLabel: typeFunction,
+  ariaLabelledBy: typeFunction,
   ariaValueText: typeFunction,
   onValuesChange: typeFunction,
   values: typeArray,
   showValueLabels: typeBoolean,
   showMinMaxLabels: typeBoolean,
+  showTicks: typeBoolean,
+  showTickValues: typeBoolean,
+  tickInterval: typeNumberInRangeFactory(0, Infinity, { strict: true }),
   rtl: typeBoolean,
   className: typeString
 };
@@ -91,11 +99,15 @@ function createSlider(config) {
       stepSize$,
       rtl$,
       values$: _dirtyValues$,
-      ariaLabelHandle$,
+      ariaLabel$,
+      ariaLabelledBy$,
       ariaValueText$,
       onValuesChange$,
       showValueLabels$,
       showMinMaxLabels$,
+      showTicks$,
+      showTickValues$,
+      tickInterval$,
       ...stateProps
     },
     patch
@@ -177,12 +189,13 @@ function createSlider(config) {
     }).sort((a, b) => a.value - b.value);
   });
   const sortedHandles$ = computed(() => {
-    const ariaLabelHandle = ariaLabelHandle$(), ariaValueText = ariaValueText$();
+    const ariaLabelHandle = ariaLabel$(), ariaValueText = ariaValueText$(), ariaLabelledBy = ariaLabelledBy$();
     return _sortedHandlesValues$().map((sortedValue, index) => {
       return {
         ...sortedValue,
-        ariaLabel: ariaLabelHandle(sortedValue.value, index, sortedValue.id),
-        ariaValueText: ariaValueText(sortedValue.value, index, sortedValue.id)
+        ariaLabel: ariaLabelledBy(index) ? void 0 : ariaLabelHandle(index),
+        ariaLabelledBy: ariaLabelledBy(index) || void 0,
+        ariaValueText: ariaValueText(sortedValue.value, index) || void 0
       };
     });
   });
@@ -190,8 +203,9 @@ function createSlider(config) {
   const sortedValuesPercent$ = computed(() => [...valuesPercent$()].sort((a, b) => a - b));
   const minLabelWidth$ = computed(() => minLabelDomRect$().width / sliderDomRectSize$() * 100);
   const maxLabelWidth$ = computed(() => maxLabelDomRect$().width / sliderDomRectSize$() * 100);
+  const adjustedShowValueLabels$ = computed(() => showValueLabels$() && (!showTicks$() || !showTickValues$()));
   const minValueLabelDisplay$ = computed(() => {
-    if (!showMinMaxLabels$()) {
+    if (!showMinMaxLabels$() || showTicks$() && showTickValues$()) {
       return false;
     } else if (!showValueLabels$()) {
       return true;
@@ -200,7 +214,7 @@ function createSlider(config) {
     return rtl$() ? !valuesPercent$().some((percent2) => 100 - percent2 > 100 - minLabelWidth - 1) : !valuesPercent$().some((percent2) => percent2 < minLabelWidth + 1);
   });
   const maxValueLabelDisplay$ = computed(() => {
-    if (!showMinMaxLabels$()) {
+    if (!showMinMaxLabels$() || showTicks$() && showTickValues$()) {
       return false;
     } else if (!showValueLabels$()) {
       return true;
@@ -260,9 +274,48 @@ function createSlider(config) {
       }).slice(0, sortedValuesPercent.length - 1);
     }
   });
-  const percentCompute = (value) => {
+  const computeTicks$ = computed(() => {
+    if (!showTicks$()) {
+      return [];
+    }
+    const vertical = vertical$();
     const min = min$();
-    return (value - min) * 100 / (max$() - min);
+    const max = max$();
+    const rtl = rtl$();
+    const showTickValues = showTickValues$();
+    const tickInterval = tickInterval$() || stepSize$();
+    const tickArray = [];
+    const intStepSize = _intStepSize$();
+    const decimalPrecision = _decimalPrecision$();
+    const positionCompute = (position) => {
+      return !!rtl !== !!vertical ? 100 - position : position;
+    };
+    for (let step = min; step < max; step += tickInterval) {
+      const cleanValue = computeCleanValue(step, min, max, intStepSize, decimalPrecision);
+      const stepPercent = percentCompute(cleanValue);
+      tickArray.push({ position: positionCompute(stepPercent), selected: false, value: cleanValue, displayLabel: showTickValues });
+    }
+    tickArray.push({ position: positionCompute(100), selected: false, value: max, displayLabel: showTickValues });
+    return tickArray;
+  });
+  const ticks$ = computed(() => {
+    const sortedValues = sortedValues$();
+    const isTickSelected = (value) => {
+      const isMultiHandle = sortedValues.length > 1;
+      const currentMax = isMultiHandle ? sortedValues[sortedValues.length - 1] : sortedValues[0];
+      const currentMin = isMultiHandle ? sortedValues[0] : 0;
+      return value <= currentMax && value >= currentMin;
+    };
+    return computeTicks$().map((tick) => {
+      return {
+        ...tick,
+        selected: isTickSelected(tick.value)
+      };
+    });
+  });
+  const percentCompute = (value) => {
+    const min = min$(), max = max$();
+    return (value - min) * 100 / (max - min);
   };
   const getClosestSliderHandle = (clickedPercent) => {
     const values = values$();
@@ -270,9 +323,11 @@ function createSlider(config) {
       return 0;
     }
     const sortedValues = sortedValues$();
-    const closestBigger = sortedValues.find((sv) => sv > clickedPercent * 100);
+    const closestBigger = sortedValues.find((sv) => percentCompute(sv) > clickedPercent * 100);
     const closestBiggerIndex = closestBigger ? sortedValues.indexOf(closestBigger) : sortedValues.length - 1;
-    const midPoint = sortedValues[closestBiggerIndex - 1] + (sortedValues[closestBiggerIndex] - sortedValues[closestBiggerIndex - 1]) / 2;
+    const midPoint = percentCompute(
+      sortedValues[closestBiggerIndex - 1] + (sortedValues[closestBiggerIndex] - sortedValues[closestBiggerIndex - 1]) / 2
+    );
     const closestValue = sortedValues[clickedPercent * 100 <= midPoint ? closestBiggerIndex - 1 : closestBiggerIndex];
     return values.indexOf(closestValue);
   };
@@ -297,7 +352,7 @@ function createSlider(config) {
       class: stateProps.className$
     },
     classNames: {
-      "au-slider": true,
+      "au-slider": true$,
       "au-slider-vertical": vertical$,
       "au-slider-horizontal": horizontal$,
       disabled: disabled$
@@ -311,6 +366,9 @@ function createSlider(config) {
       "au-slider-label-min": horizontal$,
       "au-slider-rtl": rtl$,
       invisible: computed(() => !minValueLabelDisplay$())
+    },
+    attributes: {
+      "aria-hidden": readable("true")
     }
   }));
   const maxLabelDirective = createAttributesDirective(() => ({
@@ -321,6 +379,9 @@ function createSlider(config) {
       "au-slider-label-max": horizontal$,
       "au-slider-rtl": rtl$,
       invisible: computed(() => !maxValueLabelDisplay$())
+    },
+    attributes: {
+      "aria-hidden": readable("true")
     }
   }));
   const handleEventsDirective = createAttributesDirective((handleContext$) => ({
@@ -365,7 +426,6 @@ function createSlider(config) {
               return;
           }
           event.preventDefault();
-          event.stopPropagation();
         }
       },
       mousedown: (event) => {
@@ -394,7 +454,6 @@ function createSlider(config) {
         }
       },
       touchstart: (event) => {
-        event.preventDefault();
         const handleDrag = (e) => {
           e.preventDefault();
           const newCoord = vertical$() ? e.touches[0].clientY : e.touches[0].clientX;
@@ -444,9 +503,11 @@ function createSlider(config) {
       combinedLabelPositionTop$,
       progressDisplayOptions$,
       handleDisplayOptions$,
-      showValueLabels$,
+      showValueLabels$: adjustedShowValueLabels$,
       showMinMaxLabels$,
+      showTicks$,
       rtl$,
+      ticks$,
       ...stateProps
     }),
     patch,
@@ -463,7 +524,7 @@ function createSlider(config) {
           height: computed(() => percent(progressContext$().option.height))
         },
         classNames: {
-          "au-slider-progress": true
+          "au-slider-progress": true$
         }
       })),
       clickableAreaDirective: createAttributesDirective(() => ({
@@ -474,7 +535,8 @@ function createSlider(config) {
         },
         classNames: {
           "au-slider-clickable-area": horizontal$,
-          "au-slider-clickable-area-vertical": vertical$
+          "au-slider-clickable-area-vertical": vertical$,
+          "au-slider-clickable-area-with-ticks": computed(() => showTicks$() && tickInterval$() === 0)
         }
       })),
       handleEventsDirective,
@@ -482,12 +544,13 @@ function createSlider(config) {
         handleEventsDirective,
         createAttributesDirective((handleContext$) => ({
           attributes: {
-            role: "slider",
+            role: readable("slider"),
             "aria-valuemin": min$,
             "aria-valuemax": max$,
             "aria-valuenow": computed(() => handleContext$().item.value),
             "aria-valuetext": computed(() => handleContext$().item.ariaValueText),
             "aria-label": computed(() => handleContext$().item.ariaLabel),
+            "aria-labelledBy": computed(() => handleContext$().item.ariaLabelledBy),
             "aria-orientation": computed(() => vertical$() ? "vertical" : void 0),
             "aria-disabled": computed(() => disabled$() ? "true" : void 0),
             disabled: disabled$,
@@ -498,7 +561,7 @@ function createSlider(config) {
             top: computed(() => percent(handleDisplayOptions$()[handleContext$().item.id].top))
           },
           classNames: {
-            "au-slider-handle": true,
+            "au-slider-handle": true$,
             "au-slider-handle-vertical": vertical$,
             "au-slider-handle-horizontal": horizontal$
           }
@@ -516,6 +579,9 @@ function createSlider(config) {
         styles: {
           left: computed(() => percent(combinedLabelPositionLeft$())),
           top: computed(() => percent(combinedLabelPositionTop$()))
+        },
+        attributes: {
+          "aria-hidden": readable("true")
         }
       })),
       handleLabelDisplayDirective: createAttributesDirective((labelDisplayContext$) => ({
@@ -528,6 +594,41 @@ function createSlider(config) {
         styles: {
           left: computed(() => percent(handleDisplayOptions$()[labelDisplayContext$().index].left)),
           top: computed(() => percent(handleDisplayOptions$()[labelDisplayContext$().index].top))
+        },
+        attributes: {
+          "aria-hidden": readable("true")
+        }
+      })),
+      tickDirective: createAttributesDirective((tickContext$) => ({
+        classNames: {
+          "au-slider-tick": true$,
+          "au-slider-tick-horizontal": horizontal$,
+          "au-slider-tick-vertical": vertical$
+        },
+        styles: {
+          left: computed(() => vertical$() ? null : percent(tickContext$().tick.position)),
+          top: computed(() => vertical$() ? percent(tickContext$().tick.position) : null)
+        },
+        events: {
+          click: (event) => {
+            adjustCoordinate(vertical$() ? event.clientY : event.clientX);
+          }
+        },
+        attributes: {
+          "aria-hidden": readable("true")
+        }
+      })),
+      tickLabelDirective: createAttributesDirective((tickContext$) => ({
+        classNames: {
+          "au-slider-tick-label": true$,
+          "au-slider-tick-label-vertical": vertical$
+        },
+        styles: {
+          left: computed(() => vertical$() ? null : percent(tickContext$().tick.position)),
+          top: computed(() => vertical$() ? percent(tickContext$().tick.position) : null)
+        },
+        attributes: {
+          "aria-hidden": readable("true")
         }
       }))
     }

package/{toast-CpvsibAI.js → toast-Bw2QSzBX.js}

@@ -1,8 +1,9 @@
-import { computed } from "@amadeus-it-group/tansu";
+import { computed, readable } from "@amadeus-it-group/tansu";
 import { extendWidgetProps } from "./services/extendWidget.js";
-import { d as directiveSubscribe, n as createAttributesDirective } from "./directive-CKEccryv.js";
+import { d as directiveSubscribe, n as createAttributesDirective } from "./dom-BB9jLllr.js";
+import { true$ } from "./utils/stores.js";
 import { c as typeBoolean, b as typeNumberInRangeFactory } from "./writables-DCiBdIBK.js";
-import { g as getCommonAlertDefaultConfig, c as createCommonAlert } from "./common-Banw3FYN.js";
+import { g as getCommonAlertDefaultConfig, c as createCommonAlert } from "./common-CuZAeECD.js";
 const toastDefaultConfig = {
   autoHide: true,
   delay: 5e3
@@ -29,18 +30,18 @@ function createToast(config) {
   });
   const bodyDirective = createAttributesDirective(() => ({
     attributes: {
-      role: "alert",
-      "aria-atomic": "true",
+      role: readable("alert"),
+      "aria-atomic": readable("true"),
       class: computed(() => extendedAlert.stores.className$())
     },
     classNames: {
-      "au-toast": true,
-      toast: true
+      "au-toast": true$,
+      toast: true$
     }
   }));
   const closeButtonDirective = createAttributesDirective(() => ({
     attributes: {
-      type: "button",
+      type: readable("button"),
       "aria-label": computed(() => extendedAlert.stores.ariaCloseButtonLabel$())
     },
     events: {

package/{toast-D_uSrRZL.cjs → toast-CaIcB2sD.cjs}

@@ -1,9 +1,10 @@
 "use strict";
 const tansu = require("@amadeus-it-group/tansu");
 const services_extendWidget = require("./services/extendWidget.cjs");
-const utils_directive = require("./directive-DdlwGFtf.cjs");
+const utils_directive = require("./dom-CuBx1JPZ.cjs");
+const utils_stores = require("./utils/stores.cjs");
 const utils_writables = require("./writables-BPAJvaL_.cjs");
-const common = require("./common-DvPjK7SS.cjs");
+const common = require("./common-CcQOJ_hf.cjs");
 const toastDefaultConfig = {
   autoHide: true,
   delay: 5e3
@@ -30,18 +31,18 @@ function createToast(config) {
   });
   const bodyDirective = utils_directive.createAttributesDirective(() => ({
     attributes: {
-      role: "alert",
-      "aria-atomic": "true",
+      role: tansu.readable("alert"),
+      "aria-atomic": tansu.readable("true"),
       class: tansu.computed(() => extendedAlert.stores.className$())
     },
     classNames: {
-      "au-toast": true,
-      toast: true
+      "au-toast": utils_stores.true$,
+      toast: utils_stores.true$
     }
   }));
   const closeButtonDirective = utils_directive.createAttributesDirective(() => ({
     attributes: {
-      type: "button",
+      type: tansu.readable("button"),
       "aria-label": tansu.computed(() => extendedAlert.stores.ariaCloseButtonLabel$())
     },
     events: {

package/{tree-Bb5KFqXp.cjs → tree-D4t2SOql.cjs}

@@ -1,8 +1,8 @@
 "use strict";
 const tansu = require("@amadeus-it-group/tansu");
 const services_navManager = require("./services/navManager.cjs");
-const utils_directive = require("./directive-DdlwGFtf.cjs");
-const func = require("./func-Qd3cD9a3.cjs");
+const utils_directive = require("./dom-CuBx1JPZ.cjs");
+const utils_func = require("./utils/func.cjs");
 const utils_stores = require("./utils/stores.cjs");
 const utils_writables = require("./writables-BPAJvaL_.cjs");
 function getTreeDefaultConfig() {
@@ -13,7 +13,7 @@ function getTreeDefaultConfig() {
 const defaultTreeConfig = {
   className: "",
   nodes: [],
-  onExpandToggle: func.noop,
+  onExpandToggle: utils_func.noop,
   navSelector: (node) => node.querySelectorAll("button"),
   ariaLabelToggleFn: (label) => `Toggle ${label}`
 };
@@ -177,10 +177,10 @@ function createTree(config) {
         const { item } = treeItemContext$();
         return item === _lastFocusedTreeItem$() ? "0" : "-1";
       }),
-      type: "button"
+      type: tansu.readable("button")
     },
     classNames: {
-      "au-tree-expand-icon": true,
+      "au-tree-expand-icon": utils_stores.true$,
       "au-tree-expand-icon-expanded": tansu.computed(() => {
         _toggleChange$();
         const { item } = treeItemContext$();
@@ -206,8 +206,8 @@ function createTree(config) {
       itemToggleDirective: utils_directive.mergeDirectives(treeItemElementDirective, itemToggleAttributesDirective),
       itemAttributesDirective: utils_directive.createAttributesDirective((treeItemContext$) => ({
         attributes: {
-          role: "treeitem",
-          "aria-selected": "false",
+          role: tansu.readable("treeitem"),
+          "aria-selected": tansu.readable("false"),
           // TODO: adapt aria-selected to the actual selected state
           "aria-expanded": tansu.computed(() => {
             var _a;

package/{tree-B2Mr8b31.js → tree-DWv0zwFJ.js}

@@ -1,8 +1,8 @@
-import { writable, computed } from "@amadeus-it-group/tansu";
+import { writable, computed, readable } from "@amadeus-it-group/tansu";
 import { createNavManager } from "./services/navManager.js";
-import { a as bindDirective, k as mergeDirectives, n as createAttributesDirective, b as browserDirective } from "./directive-CKEccryv.js";
-import { n as noop } from "./func-DR0n-ShK.js";
-import { writablesForProps, stateStores } from "./utils/stores.js";
+import { a as bindDirective, k as mergeDirectives, n as createAttributesDirective, b as browserDirective } from "./dom-BB9jLllr.js";
+import { noop } from "./utils/func.js";
+import { writablesForProps, stateStores, true$ } from "./utils/stores.js";
 import { e as typeString, h as typeArray, f as typeFunction } from "./writables-DCiBdIBK.js";
 function getTreeDefaultConfig() {
   return {
@@ -176,10 +176,10 @@ function createTree(config) {
         const { item } = treeItemContext$();
         return item === _lastFocusedTreeItem$() ? "0" : "-1";
       }),
-      type: "button"
+      type: readable("button")
     },
     classNames: {
-      "au-tree-expand-icon": true,
+      "au-tree-expand-icon": true$,
       "au-tree-expand-icon-expanded": computed(() => {
         _toggleChange$();
         const { item } = treeItemContext$();
@@ -205,8 +205,8 @@ function createTree(config) {
       itemToggleDirective: mergeDirectives(treeItemElementDirective, itemToggleAttributesDirective),
       itemAttributesDirective: createAttributesDirective((treeItemContext$) => ({
         attributes: {
-          role: "treeitem",
-          "aria-selected": "false",
+          role: readable("treeitem"),
+          "aria-selected": readable("false"),
           // TODO: adapt aria-selected to the actual selected state
           "aria-expanded": computed(() => {
             var _a;

package/utils/directive.cjs

@@ -2,9 +2,8 @@
 Object.defineProperty(exports, Symbol.toStringTag, { value: "Module" });
 require("@amadeus-it-group/tansu");
 require("esm-env");
-const utils_directive = require("../directive-DdlwGFtf.cjs");
-require("../func-Qd3cD9a3.cjs");
-require("./stores.cjs");
+const utils_directive = require("../dom-CuBx1JPZ.cjs");
+require("./func.cjs");
 exports.attributesData = utils_directive.attributesData;
 exports.bindDirective = utils_directive.bindDirective;
 exports.bindDirectiveNoArg = utils_directive.bindDirectiveNoArg;

package/utils/directive.d.ts

@@ -1,5 +1,6 @@
 import type { ReadableSignal } from '@amadeus-it-group/tansu';
 import type { AttributeValue, Directive, DirectivesAndOptParam, SSRHTMLElement, StyleKey, StyleValue } from '../types';
+import { type ClassValue } from 'clsx';
 /**
  * On a browser environment, returns true if the given element is an HTMLElement.
  * On a server environment, always returns false.
@@ -221,19 +222,19 @@ xw
      * @remarks
      * The `style` attribute must be added separately.
      */
-    attributes?: Record<string, AttributeValue | ReadableSignal<AttributeValue>>;
+    attributes?: Record<string, ReadableSignal<AttributeValue>>;
     /**
      * Styles to be added to an HTML element.
      * @remarks
      * Key-value pairs where keys are CSS style properties and values are style values.
      */
-    styles?: Partial<Record<StyleKey, StyleValue | ReadableSignal<StyleValue>>>;
+    styles?: Partial<Record<StyleKey, ReadableSignal<StyleValue>>>;
     /**
      * Class names to be added to an HTML element.
      * @remarks
      * Key-value pairs where keys are class names and values indicate whether the class should be added (true) or removed (false).
      */
-    classNames?: Record<string, boolean | ReadableSignal<boolean>>;
+    classNames?: Record<string, ReadableSignal<boolean>>;
 }
 /**
  * Creates a directive that binds attributes, styles, class names, and events to a DOM node.
@@ -266,9 +267,10 @@ export declare const attributesData: <T extends any[]>(...directives: Directives
     style: Partial<Record<StyleKey, StyleValue>>;
 };
 /**
- * Directive that takes as an argument a string containing CSS classes to be put on the HTML element.
+ * Directive that takes as an argument a string, array or object containing CSS classes to be put on the HTML element.
+ * The class attribute is computed using the clsx library.
  */
-export declare const classDirective: Directive<string>;
+export declare const classDirective: Directive<ClassValue>;
 /**
  * Combines multiple directives into a single attributes object.
  *

package/utils/directive.js

@@ -1,8 +1,7 @@
 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 "../directive-CKEccryv.js";
-import "../func-DR0n-ShK.js";
-import "./stores.js";
+import { o, a, c, b, p, n, g, j, f, h, q, d, e, i, m, k, l, r, s } from "../dom-BB9jLllr.js";
+import "./func.js";
 export {
   o as attributesData,
   a as bindDirective,

package/{func-Qd3cD9a3.cjs → utils/func.cjs}

@@ -1,4 +1,5 @@
 "use strict";
+Object.defineProperty(exports, Symbol.toStringTag, { value: "Module" });
 const noop = () => {
 };
 const identity = (x) => x;

package/{func-DR0n-ShK.js → utils/func.js}

@@ -2,6 +2,6 @@ const noop = () => {
 };
 const identity = (x) => x;
 export {
-  identity as i,
-  noop as n
+  identity,
+  noop
 };

package/utils/stores.cjs

@@ -2,7 +2,8 @@
 Object.defineProperty(exports, Symbol.toStringTag, { value: "Module" });
 const tansu = require("@amadeus-it-group/tansu");
 const types = require("../types.cjs");
-const func = require("../func-Qd3cD9a3.cjs");
+const utils_func = require("./func.cjs");
+const utils_directive = require("../dom-CuBx1JPZ.cjs");
 function createPatch(stores) {
   return function(storesValues) {
     tansu.batch(() => {
@@ -30,7 +31,7 @@ function findChangedProperties(obj1, obj2) {
   return hasUpdate ? changedValues : null;
 }
 function writableWithDefault(defValue, config$ = tansu.readable(void 0), options = {}, own$ = tansu.writable(void 0)) {
-  const { normalizeValue = func.identity, equal = Object.is } = options;
+  const { normalizeValue = utils_func.identity, equal = Object.is } = options;
   const getDefValue = () => defValue;
   const callNormalizeValue = (value, defValue2 = getDefValue) => {
     const normalizedValue = value === void 0 ? void 0 : normalizeValue(value);
@@ -138,7 +139,7 @@ const bindableDerived = (onChange$, stores, adjustValue = (arg) => arg[0], equal
     stores[0].set.bind(stores[0])
   );
 };
-const bindableProp = (store$, onChange$, adjustValue = func.identity, equal = tansu.equal) => tansu.asWritable(
+const bindableProp = (store$, onChange$, adjustValue = utils_func.identity, equal = tansu.equal) => tansu.asWritable(
   tansu.computed(() => adjustValue(store$()), { equal }),
   (newValue) => {
     const adjustedValue = adjustValue(newValue);
@@ -148,16 +149,25 @@ const bindableProp = (store$, onChange$, adjustValue = func.identity, equal = ta
     }
   }
 );
+function idWithDefault(id$) {
+  const autoId$ = tansu.computed(() => utils_directive.generateId());
+  return tansu.computed(() => id$() || autoId$());
+}
+const true$ = tansu.readable(true);
+const false$ = tansu.readable(false);
 exports.bindableDerived = bindableDerived;
 exports.bindableProp = bindableProp;
 exports.createPatch = createPatch;
+exports.false$ = false$;
 exports.findChangedProperties = findChangedProperties;
+exports.idWithDefault = idWithDefault;
 exports.isStore = isStore;
 exports.mergeConfigStores = mergeConfigStores;
 exports.normalizeConfigStores = normalizeConfigStores;
 exports.stateStores = stateStores;
 exports.toReadableStore = toReadableStore;
 exports.toWritableStore = toWritableStore;
+exports.true$ = true$;
 exports.writableWithDefault = writableWithDefault;
 exports.writablesForProps = writablesForProps;
 exports.writablesWithDefault = writablesWithDefault;

package/utils/stores.d.ts

@@ -213,3 +213,12 @@ export declare const bindableDerived: <T, U extends [WritableSignal<T>, ...Store
  * @returns A writable signal that synchronizes with the provided store and triggers the onChange callback when updated.
  */
 export declare const bindableProp: <T>(store$: WritableSignal<T, T | undefined>, onChange$: ReadableSignal<(newValue: T) => void>, adjustValue?: (value: T) => T, equal?: (a: T, b: T) => boolean) => WritableSignal<T>;
+/**
+ * Wraps an id store in a computed so that undefined and empty values are replaced by a generated id.
+ *
+ * @param id$ - the id store to use
+ * @returns the id store with a default generation if the id is not provided
+ */
+export declare function idWithDefault(id$: ReadableSignal<string>): ReadableSignal<string>;
+export declare const true$: ReadableSignal<true>;
+export declare const false$: ReadableSignal<false>;

package/utils/stores.js

@@ -1,6 +1,7 @@
-import { batch, computed, asWritable, readable, writable, asReadable, get, derived, equal } from "@amadeus-it-group/tansu";
+import { readable, batch, computed, asWritable, writable, asReadable, get, derived, equal } from "@amadeus-it-group/tansu";
 import { INVALID_VALUE } from "../types.js";
-import { i as identity } from "../func-DR0n-ShK.js";
+import { identity } from "./func.js";
+import { t as generateId } from "../dom-BB9jLllr.js";
 function createPatch(stores) {
   return function(storesValues) {
     batch(() => {
@@ -146,17 +147,26 @@ const bindableProp = (store$, onChange$, adjustValue = identity, equal$1 = equal
     }
   }
 );
+function idWithDefault(id$) {
+  const autoId$ = computed(() => generateId());
+  return computed(() => id$() || autoId$());
+}
+const true$ = readable(true);
+const false$ = readable(false);
 export {
   bindableDerived,
   bindableProp,
   createPatch,
+  false$,
   findChangedProperties,
+  idWithDefault,
   isStore,
   mergeConfigStores,
   normalizeConfigStores,
   stateStores,
   toReadableStore,
   toWritableStore,
+  true$,
   writableWithDefault,
   writablesForProps,
   writablesWithDefault