@zag-js/slider 0.1.2 → 0.1.5

package/dist/index.js

@@ -212,10 +212,6 @@ function getOwnerWindow(el) {
   var _a;
   return (_a = el == null ? void 0 : el.ownerDocument.defaultView) != null ? _a : window;
 }
-function getNativeEvent(event) {
-  var _a;
-  return (_a = event.nativeEvent) != null ? _a : event;
-}
 function getDescriptor(el, options) {
   var _a;
   const { type, property } = options;
@@ -254,6 +250,10 @@ function trackInputPropertyMutation(el, options) {
     run = false;
   };
 }
+function getNativeEvent(event) {
+  var _a;
+  return (_a = event.nativeEvent) != null ? _a : event;
+}
 function getClosestFormElement(el) {
   if (isFormElement(el))
     return el.form;
@@ -309,6 +309,30 @@ function getEventStep(event) {
     return isSkipKey ? 10 : 1;
   }
 }
+function itemById(v, id) {
+  return v.find((node) => node.id === id);
+}
+function indexOfId(v, id) {
+  const item = itemById(v, id);
+  return item ? v.indexOf(item) : -1;
+}
+var getValueText = (item) => {
+  var _a, _b;
+  return (_b = (_a = item.dataset.valuetext) != null ? _a : item.textContent) != null ? _b : "";
+};
+var match = (valueText, query2) => valueText.toLowerCase().startsWith(query2.toLowerCase());
+var wrap = (v, idx) => {
+  return v.map((_, index) => v[(Math.max(idx, 0) + index) % v.length]);
+};
+function findByText(v, text, currentId) {
+  const index = currentId ? indexOfId(v, currentId) : -1;
+  let items = currentId ? wrap(v, index) : v;
+  const isSingleKey = text.length === 1;
+  if (isSingleKey) {
+    items = items.filter((item) => item.id !== currentId);
+  }
+  return items.find((item) => match(getValueText(item), text));
+}
 var state = "default";
 var savedUserSelect = "";
 var modifiedElementMap = /* @__PURE__ */ new WeakMap();
@@ -372,13 +396,37 @@ function trackPointerMove(opts) {
   };
   return pipe(addPointerEvent(doc, "pointermove", handlePointerMove, false), addPointerEvent(doc, "pointerup", onPointerUp, false), addPointerEvent(doc, "pointercancel", onPointerUp, false), addPointerEvent(doc, "contextmenu", onPointerUp, false), disableTextSelection({ doc }));
 }
+function findByTypeahead(_items, options) {
+  const { state: state2, activeId, key, timeout = 350 } = options;
+  const search = state2.keysSoFar + key;
+  const isRepeated = search.length > 1 && Array.from(search).every((char) => char === search[0]);
+  const query2 = isRepeated ? search[0] : search;
+  let items = _items.slice();
+  const next = findByText(items, query2, activeId);
+  function cleanup() {
+    clearTimeout(state2.timer);
+    state2.timer = -1;
+  }
+  function update(value) {
+    state2.keysSoFar = value;
+    cleanup();
+    if (value !== "") {
+      state2.timer = +setTimeout(() => {
+        update("");
+        cleanup();
+      }, timeout);
+    }
+  }
+  update(search);
+  return next;
+}
+findByTypeahead.defaultOptions = {
+  keysSoFar: "",
+  timer: -1
+};
 
 // ../../utilities/number/dist/index.mjs
 var __pow2 = Math.pow;
-var nf = new Intl.NumberFormat("en-US", { style: "decimal" });
-function formatter(n) {
-  return parseFloat(nf.format(n));
-}
 function round(v, t2) {
   let num = valueOf(v);
   const p = __pow2(10, t2 != null ? t2 : 10);
@@ -390,13 +438,18 @@ var percentToValue = (v, r) => r.min + (r.max - r.min) * valueOf(v);
 function clamp(v, o) {
   return Math.min(Math.max(valueOf(v), o.min), o.max);
 }
-function countDecimals(v) {
-  var _a, _b;
-  return (_b = (_a = nf.formatToParts(v).find((p) => p.type === "fraction")) == null ? void 0 : _a.value.length) != null ? _b : 0;
+function countDecimals(value) {
+  if (!Number.isFinite(value))
+    return 0;
+  let e = 1, p = 0;
+  while (Math.round(value * e) / e !== value) {
+    e *= 10;
+    p += 1;
+  }
+  return p;
 }
-var increment = (v, s) => formatter(valueOf(v) + s);
-var decrement = (v, s) => formatter(valueOf(v) - s);
-var multiply = (v, s) => formatter(valueOf(v) * s);
+var increment = (v, s) => decimalOperation(valueOf(v), "+", s);
+var decrement = (v, s) => decimalOperation(valueOf(v), "-", s);
 function snapToStep(value, step) {
   const num = valueOf(value);
   const p = countDecimals(step);
@@ -409,6 +462,18 @@ function valueOf(v) {
   const num = parseFloat(v.toString().replace(/[^\w.-]+/g, ""));
   return !Number.isNaN(num) ? num : 0;
 }
+function decimalOperation(a, op, b) {
+  let result = op === "+" ? a + b : a - b;
+  if (a % 1 !== 0 || b % 1 !== 0) {
+    const multiplier = __pow2(10, Math.max(countDecimals(a), countDecimals(b)));
+    a = Math.round(a * multiplier);
+    b = Math.round(b * multiplier);
+    result = op === "+" ? a + b : a - b;
+    result /= multiplier;
+  }
+  return result;
+}
+var nf = new Intl.NumberFormat("en-US", { style: "decimal", maximumFractionDigits: 20 });
 var transform = (a, b) => {
   const i = { min: a[0], max: a[1] };
   const o = { min: b[0], max: b[1] };
@@ -529,6 +594,10 @@ var dom = {
     var _a;
     return (_a = ctx.doc) != null ? _a : document;
   },
+  getRootNode: (ctx) => {
+    var _a;
+    return (_a = ctx.rootNode) != null ? _a : dom.getDoc(ctx);
+  },
   getRootId: (ctx) => {
     var _a, _b;
     return (_b = (_a = ctx.ids) == null ? void 0 : _a.root) != null ? _b : `slider:${ctx.uid}`;
@@ -559,9 +628,9 @@ var dom = {
     return (_b = (_a = ctx.ids) == null ? void 0 : _a.label) != null ? _b : `slider:${ctx.uid}:label`;
   },
   getMarkerId: (ctx, value) => `slider:${ctx.uid}:marker:${value}`,
-  getThumbEl: (ctx) => dom.getDoc(ctx).getElementById(dom.getThumbId(ctx)),
-  getControlEl: (ctx) => dom.getDoc(ctx).getElementById(dom.getControlId(ctx)),
-  getInputEl: (ctx) => dom.getDoc(ctx).getElementById(dom.getInputId(ctx)),
+  getThumbEl: (ctx) => dom.getRootNode(ctx).getElementById(dom.getThumbId(ctx)),
+  getControlEl: (ctx) => dom.getRootNode(ctx).getElementById(dom.getControlId(ctx)),
+  getInputEl: (ctx) => dom.getRootNode(ctx).getElementById(dom.getInputId(ctx)),
   getControlStyle,
   getThumbStyle,
   getRangeStyle,
@@ -607,7 +676,7 @@ var normalizeProp = createNormalizer((v) => v);
 
 // ../../utilities/core/dist/index.mjs
 var isLeftClick2 = (v) => v.button === 0;
-var isModifiedEvent = (v) => v.ctrlKey || v.altKey || v.metaKey || v.shiftKey;
+var isModifiedEvent = (v) => v.ctrlKey || v.altKey || v.metaKey;
 
 // src/slider.connect.ts
 function connect(state2, send, normalize = normalizeProp) {
@@ -697,7 +766,7 @@ function connect(state2, send, normalize = normalizeProp) {
       onKeyDown(event) {
         if (!isInteractive)
           return;
-        const step = multiply(getEventStep(event), state2.context.step);
+        const step = getEventStep(event) * state2.context.step;
         let prevent = true;
         const keyMap = {
           ArrowUp() {
@@ -984,6 +1053,8 @@ function machine(ctx = {}) {
       setupDocument(ctx2, evt) {
         if (evt.doc)
           ctx2.doc = (0, import_core.ref)(evt.doc);
+        if (evt.root)
+          ctx2.rootNode = (0, import_core.ref)(evt.root);
         ctx2.uid = evt.id;
       },
       checkValue(ctx2) {