@zag-js/number-input 0.1.9 → 0.1.12

package/dist/index.mjs

@@ -19,103 +19,95 @@ var __spreadValues = (a, b) => {
 var __spreadProps = (a, b) => __defProps(a, __getOwnPropDescs(b));
 
 // ../../utilities/dom/dist/index.mjs
+var __defProp2 = Object.defineProperty;
+var __getOwnPropSymbols2 = Object.getOwnPropertySymbols;
+var __hasOwnProp2 = Object.prototype.hasOwnProperty;
+var __propIsEnum2 = Object.prototype.propertyIsEnumerable;
+var __defNormalProp2 = (obj, key, value) => key in obj ? __defProp2(obj, key, { enumerable: true, configurable: true, writable: true, value }) : obj[key] = value;
+var __spreadValues2 = (a, b) => {
+  for (var prop in b || (b = {}))
+    if (__hasOwnProp2.call(b, prop))
+      __defNormalProp2(a, prop, b[prop]);
+  if (__getOwnPropSymbols2)
+    for (var prop of __getOwnPropSymbols2(b)) {
+      if (__propIsEnum2.call(b, prop))
+        __defNormalProp2(a, prop, b[prop]);
+    }
+  return a;
+};
 var dataAttr = (guard) => {
   return guard ? "" : void 0;
 };
 var ariaAttr = (guard) => {
   return guard ? "true" : void 0;
 };
-function raf(fn) {
-  const id = globalThis.requestAnimationFrame(fn);
-  return function cleanup() {
-    globalThis.cancelAnimationFrame(id);
-  };
-}
-var isDom = () => typeof window !== "undefined";
-var hasProp = (obj, prop) => Object.prototype.hasOwnProperty.call(obj, prop);
-var isTouchDevice = isDom() && !!navigator.maxTouchPoints;
+var MAX_Z_INDEX = 2147483647;
 var runIfFn = (v, ...a) => {
   const res = typeof v === "function" ? v(...a) : v;
   return res != null ? res : void 0;
 };
-var noop = () => {
+var callAll = (...fns) => (...a) => {
+  fns.forEach(function(fn) {
+    fn == null ? void 0 : fn(...a);
+  });
 };
-var pipe = (...fns) => (v) => fns.reduce((a, b) => b(a), v);
-function getListenerElements() {
-  ;
-  globalThis.__listenerElements__ = globalThis.__listenerElements__ || /* @__PURE__ */ new Map();
-  return globalThis.__listenerElements__;
+var isArray = (v) => Array.isArray(v);
+var isObject = (v) => !(v == null || typeof v !== "object" || isArray(v));
+var hasProp = (obj, prop) => Object.prototype.hasOwnProperty.call(obj, prop);
+var isDom = () => typeof window !== "undefined";
+function getPlatform() {
+  var _a;
+  const agent = navigator.userAgentData;
+  return (_a = agent == null ? void 0 : agent.platform) != null ? _a : navigator.platform;
+}
+var pt = (v) => isDom() && v.test(getPlatform());
+var vn = (v) => isDom() && v.test(navigator.vendor);
+var isTouchDevice = () => isDom() && !!navigator.maxTouchPoints;
+var isMac = () => pt(/^Mac/) && !isTouchDevice;
+var isSafari = () => isApple() && vn(/apple/i);
+var isApple = () => pt(/mac|iphone|ipad|ipod/i);
+var isIos = () => isApple() && !isMac();
+function isDocument(el) {
+  return el.nodeType === Node.DOCUMENT_NODE;
 }
-function getListenerCache() {
-  ;
-  globalThis.__listenerCache__ = globalThis.__listenerCache__ || /* @__PURE__ */ new Map();
-  return globalThis.__listenerCache__;
+function isWindow(value) {
+  return (value == null ? void 0 : value.toString()) === "[object Window]";
 }
-function addGlobalEventListener(node, type, handler, options) {
+function getDocument(el) {
   var _a;
-  if (!node)
-    return noop;
-  const hash = JSON.stringify({ type, options });
-  const listenerElements = getListenerElements();
-  const listenerCache = getListenerCache();
-  const group = listenerElements.get(node);
-  if (!listenerElements.has(node)) {
-    const group2 = /* @__PURE__ */ new Map([[hash, /* @__PURE__ */ new Set([handler])]]);
-    listenerElements.set(node, group2);
-  } else if (group == null ? void 0 : group.has(hash)) {
-    (_a = group == null ? void 0 : group.get(hash)) == null ? void 0 : _a.add(handler);
-  } else {
-    group == null ? void 0 : group.set(hash, /* @__PURE__ */ new Set([handler]));
-  }
-  function attach(node2) {
-    var _a2, _b;
-    function listener(event) {
-      var _a3;
-      const group2 = listenerElements.get(node2);
-      (_a3 = group2 == null ? void 0 : group2.get(hash)) == null ? void 0 : _a3.forEach((fn) => fn(event));
-    }
-    if (!(listenerCache == null ? void 0 : listenerCache.has(node2))) {
-      listenerCache.set(node2, /* @__PURE__ */ new Map([[hash, listener]]));
-      node2.addEventListener(type, listener, options);
-      return;
-    }
-    if (!((_a2 = listenerCache == null ? void 0 : listenerCache.get(node2)) == null ? void 0 : _a2.has(hash))) {
-      (_b = listenerCache.get(node2)) == null ? void 0 : _b.set(hash, listener);
-      node2.addEventListener(type, listener, options);
-    }
-  }
-  attach(node);
-  return function remove() {
-    var _a2, _b, _c, _d;
-    if (!listenerElements.has(node))
-      return;
-    const group2 = listenerElements.get(node);
-    (_a2 = group2 == null ? void 0 : group2.get(hash)) == null ? void 0 : _a2.delete(handler);
-    if (((_b = group2 == null ? void 0 : group2.get(hash)) == null ? void 0 : _b.size) === 0) {
-      const listener = (_c = listenerCache.get(node)) == null ? void 0 : _c.get(hash);
-      node.removeEventListener(type, listener, options);
-      group2 == null ? void 0 : group2.delete(hash);
-      (_d = listenerCache.get(node)) == null ? void 0 : _d.delete(hash);
-      if ((group2 == null ? void 0 : group2.size) === 0) {
-        listenerElements.delete(node);
-        listenerCache.delete(node);
-      }
-    }
-  };
+  if (isWindow(el))
+    return el.document;
+  if (isDocument(el))
+    return el;
+  return (_a = el == null ? void 0 : el.ownerDocument) != null ? _a : document;
 }
-var isRef = (v) => hasProp(v, "current");
-function addDomEvent(target, event, listener, options) {
-  const node = isRef(target) ? target.current : runIfFn(target);
-  return addGlobalEventListener(node, event, listener, options);
+function defineDomHelpers(helpers) {
+  const dom2 = {
+    getRootNode: (ctx) => {
+      var _a, _b;
+      return (_b = (_a = ctx.getRootNode) == null ? void 0 : _a.call(ctx)) != null ? _b : document;
+    },
+    getDoc: (ctx) => getDocument(dom2.getRootNode(ctx)),
+    getWin: (ctx) => {
+      var _a;
+      return (_a = dom2.getDoc(ctx).defaultView) != null ? _a : window;
+    },
+    getActiveElement: (ctx) => dom2.getDoc(ctx).activeElement,
+    getById: (ctx, id) => dom2.getRootNode(ctx).getElementById(id)
+  };
+  return __spreadValues2(__spreadValues2({}, dom2), helpers);
 }
-var MAX_Z_INDEX = 2147483647;
 function getNativeEvent(e) {
   var _a;
   return (_a = e.nativeEvent) != null ? _a : e;
 }
+var supportsPointerEvent = () => isDom() && window.onpointerdown === null;
+var isTouchEvent = (v) => isObject(v) && hasProp(v, "touches");
+var isLeftClick = (v) => v.button === 0;
+var isModifiedEvent = (v) => v.ctrlKey || v.altKey || v.metaKey;
 function observeAttributes(node, attributes, fn) {
   if (!node)
-    return noop;
+    return;
   const attrs = Array.isArray(attributes) ? attributes : [attributes];
   const win = node.ownerDocument.defaultView || window;
   const obs = new win.MutationObserver((changes) => {
@@ -128,6 +120,17 @@ function observeAttributes(node, attributes, fn) {
   obs.observe(node, { attributes: true, attributeFilter: attrs });
   return () => obs.disconnect();
 }
+var fallback = {
+  pageX: 0,
+  pageY: 0,
+  clientX: 0,
+  clientY: 0
+};
+function getEventPoint(event, type = "page") {
+  var _a, _b;
+  const point = isTouchEvent(event) ? (_b = (_a = event.touches[0]) != null ? _a : event.changedTouches[0]) != null ? _b : fallback : event;
+  return { x: point[`${type}X`], y: point[`${type}Y`] };
+}
 var PAGE_KEYS = /* @__PURE__ */ new Set(["PageUp", "PageDown"]);
 var ARROW_KEYS = /* @__PURE__ */ new Set(["ArrowUp", "ArrowDown", "ArrowLeft", "ArrowRight"]);
 function getEventStep(event) {
@@ -139,29 +142,19 @@ 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 isRef = (v) => hasProp(v, "current");
+function addDomEvent(target, eventName, handler, options) {
+  const node = isRef(target) ? target.current : runIfFn(target);
+  node == null ? void 0 : node.addEventListener(eventName, handler, options);
+  return () => {
+    node == null ? void 0 : node.removeEventListener(eventName, handler, options);
+  };
 }
-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));
+function raf(fn) {
+  const id = globalThis.requestAnimationFrame(fn);
+  return function cleanup() {
+    globalThis.cancelAnimationFrame(id);
+  };
 }
 function addPointerlockChangeListener(doc, fn) {
   return addDomEvent(doc, "pointerlockchange", fn, false);
@@ -195,7 +188,7 @@ function requestPointerLock(doc, handlers = {}) {
   if (!supported)
     return;
   body.requestPointerLock();
-  const cleanup = pipe(addPointerlockChangeListener(doc, onPointerChange), addPointerlockErrorListener(doc, onPointerError));
+  const cleanup = callAll(addPointerlockChangeListener(doc, onPointerChange), addPointerlockErrorListener(doc, onPointerError));
   return function dispose() {
     if (!supported)
       return;
@@ -203,38 +196,10 @@ function requestPointerLock(doc, handlers = {}) {
     exit();
   };
 }
-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 __pow = Math.pow;
-function wrap2(num, max) {
+function wrap(num, max) {
   return (num % max + max) % max;
 }
 function roundToDevicePixel(num) {
@@ -297,91 +262,37 @@ function decimalOperation(a, op, b) {
 }
 var nf = new Intl.NumberFormat("en-US", { style: "decimal", maximumFractionDigits: 20 });
 
-// ../../utilities/rect/dist/index.mjs
-var isDom2 = () => typeof window !== "undefined";
-var isArray = (v) => Array.isArray(v);
-var isObject = (v) => !(v == null || typeof v !== "object" || isArray(v));
-var hasProp2 = (obj, prop) => Object.prototype.hasOwnProperty.call(obj, prop);
-var isTouchDevice2 = isDom2() && !!navigator.maxTouchPoints;
-var isTouchEvent = (v) => isObject(v) && hasProp2(v, "touches");
-var fallback = { pageX: 0, pageY: 0, clientX: 0, clientY: 0 };
-function getEventPoint(e, t = "page") {
-  const p = isTouchEvent(e) ? e.touches[0] || e.changedTouches[0] || fallback : e;
-  return { x: p[`${t}X`], y: p[`${t}Y`] };
-}
-
-// ../../types/dist/index.mjs
-function createNormalizer(fn) {
-  return new Proxy({}, {
-    get() {
-      return fn;
-    }
-  });
-}
-var normalizeProp = createNormalizer((v) => v);
-
-// ../../utilities/core/dist/index.mjs
-var isDom3 = () => typeof window !== "undefined";
-function getPlatform() {
-  var _a;
-  const agent = navigator.userAgentData;
-  return (_a = agent == null ? void 0 : agent.platform) != null ? _a : navigator.platform;
-}
-var pt = (v) => isDom3() && v.test(getPlatform());
-var vn = (v) => isDom3() && v.test(navigator.vendor);
-var isTouchDevice3 = isDom3() && !!navigator.maxTouchPoints;
-var isMac = () => pt(/^Mac/) && !isTouchDevice3;
-var isSafari = () => isApple() && vn(/apple/i);
-var isApple = () => pt(/mac|iphone|ipad|ipod/i);
-var isIos = () => isApple() && !isMac();
-var supportsPointerEvent = () => isDom3() && window.onpointerdown === null;
-var isLeftClick = (v) => v.button === 0;
-var isModifiedEvent = (v) => v.ctrlKey || v.altKey || v.metaKey;
-var pipe2 = (...fns) => (v) => fns.reduce((a, b) => b(a), v);
-
 // src/number-input.dom.ts
-var dom = {
-  getDoc: (ctx) => {
-    var _a;
-    return (_a = ctx.doc) != null ? _a : document;
-  },
-  getWin: (ctx) => {
-    var _a;
-    return (_a = dom.getDoc(ctx).defaultView) != null ? _a : window;
-  },
-  getRootNode: (ctx) => {
-    var _a;
-    return (_a = ctx.rootNode) != null ? _a : dom.getDoc(ctx);
-  },
+var dom = defineDomHelpers({
   getRootId: (ctx) => {
     var _a, _b;
-    return (_b = (_a = ctx.ids) == null ? void 0 : _a.root) != null ? _b : `number-input:${ctx.uid}`;
+    return (_b = (_a = ctx.ids) == null ? void 0 : _a.root) != null ? _b : `number-input:${ctx.id}`;
   },
   getInputId: (ctx) => {
     var _a, _b;
-    return (_b = (_a = ctx.ids) == null ? void 0 : _a.input) != null ? _b : `number-input:${ctx.uid}:input`;
+    return (_b = (_a = ctx.ids) == null ? void 0 : _a.input) != null ? _b : `number-input:${ctx.id}:input`;
   },
   getIncButtonId: (ctx) => {
     var _a, _b;
-    return (_b = (_a = ctx.ids) == null ? void 0 : _a.incBtn) != null ? _b : `number-input:${ctx.uid}:inc-btn`;
+    return (_b = (_a = ctx.ids) == null ? void 0 : _a.incBtn) != null ? _b : `number-input:${ctx.id}:inc-btn`;
   },
   getDecButtonId: (ctx) => {
     var _a, _b;
-    return (_b = (_a = ctx.ids) == null ? void 0 : _a.decBtn) != null ? _b : `number-input:${ctx.uid}:dec-btn`;
+    return (_b = (_a = ctx.ids) == null ? void 0 : _a.decBtn) != null ? _b : `number-input:${ctx.id}:dec-btn`;
   },
   getScrubberId: (ctx) => {
     var _a, _b;
-    return (_b = (_a = ctx.ids) == null ? void 0 : _a.scrubber) != null ? _b : `number-input:${ctx.uid}:scrubber`;
+    return (_b = (_a = ctx.ids) == null ? void 0 : _a.scrubber) != null ? _b : `number-input:${ctx.id}:scrubber`;
   },
-  getCursorId: (ctx) => `number-input:${ctx.uid}:cursor`,
+  getCursorId: (ctx) => `number-input:${ctx.id}:cursor`,
   getLabelId: (ctx) => {
     var _a, _b;
-    return (_b = (_a = ctx.ids) == null ? void 0 : _a.label) != null ? _b : `number-input:${ctx.uid}:label`;
+    return (_b = (_a = ctx.ids) == null ? void 0 : _a.label) != null ? _b : `number-input:${ctx.id}:label`;
   },
-  getInputEl: (ctx) => dom.getRootNode(ctx).getElementById(dom.getInputId(ctx)),
-  getIncButtonEl: (ctx) => dom.getRootNode(ctx).getElementById(dom.getIncButtonId(ctx)),
-  getDecButtonEl: (ctx) => dom.getRootNode(ctx).getElementById(dom.getDecButtonId(ctx)),
-  getScrubberEl: (ctx) => dom.getRootNode(ctx).getElementById(dom.getScrubberId(ctx)),
+  getInputEl: (ctx) => dom.getById(ctx, dom.getInputId(ctx)),
+  getIncButtonEl: (ctx) => dom.getById(ctx, dom.getIncButtonId(ctx)),
+  getDecButtonEl: (ctx) => dom.getById(ctx, dom.getDecButtonId(ctx)),
+  getScrubberEl: (ctx) => dom.getById(ctx, dom.getScrubberId(ctx)),
   getCursorEl: (ctx) => dom.getDoc(ctx).getElementById(dom.getCursorId(ctx)),
   getMousementValue(ctx, event) {
     const x = roundToDevicePixel(event.movementX);
@@ -398,7 +309,7 @@ var dom = {
     const win = dom.getWin(ctx);
     const width = win.innerWidth;
     const half = roundToDevicePixel(7.5);
-    point.x = wrap2(point.x + half, width) - half;
+    point.x = wrap(point.x + half, width) - half;
     return { hint, point };
   },
   createVirtualCursor(ctx) {
@@ -426,7 +337,7 @@ var dom = {
         </svg>`;
     doc.body.appendChild(el);
   }
-};
+});
 
 // src/number-input.utils.ts
 var utils = {
@@ -471,16 +382,18 @@ var utils = {
 };
 
 // src/number-input.connect.ts
-function connect(state, send, normalize = normalizeProp) {
+function connect(state, send, normalize) {
   const isFocused = state.hasTag("focus");
   const isInvalid = state.context.isOutOfRange || !!state.context.invalid;
   const isDisabled = !!state.context.disabled;
+  const isValueEmpty = state.context.isValueEmpty;
   const isIncrementDisabled = isDisabled || !state.context.canIncrement;
   const isDecrementDisabled = isDisabled || !state.context.canDecrement;
   const messages = state.context.messages;
   return {
     isFocused,
     isInvalid,
+    isValueEmpty,
     value: state.context.formattedValue,
     valueAsNumber: state.context.valueAsNumber,
     setValue(value) {
@@ -659,14 +572,22 @@ function connect(state, send, normalize = normalizeProp) {
 }
 
 // src/number-input.machine.ts
-import { choose, createMachine, guards, ref } from "@zag-js/core";
+import { choose, createMachine, guards } from "@zag-js/core";
+
+// ../../utilities/core/dist/index.mjs
+var callAll2 = (...fns) => (...a) => {
+  fns.forEach(function(fn) {
+    fn == null ? void 0 : fn(...a);
+  });
+};
+
+// src/number-input.machine.ts
 var { not, and } = guards;
-function machine(ctx = {}) {
+function machine(ctx) {
   return createMachine({
     id: "number-input",
     initial: "unknown",
     context: __spreadProps(__spreadValues({
-      uid: "",
       dir: "ltr",
       focusInputOnChange: true,
       clampValueOnBlur: true,
@@ -692,6 +613,7 @@ function machine(ctx = {}) {
       isAtMin: (ctx2) => isAtMin(ctx2.value, ctx2),
       isAtMax: (ctx2) => isAtMax(ctx2.value, ctx2),
       isOutOfRange: (ctx2) => !isWithinRange(ctx2.value, ctx2),
+      isValueEmpty: (ctx2) => ctx2.value === "",
       canIncrement: (ctx2) => ctx2.allowOverflow || !ctx2.isAtMax,
       canDecrement: (ctx2) => ctx2.allowOverflow || !ctx2.isAtMin,
       valueText: (ctx2) => {
@@ -726,7 +648,7 @@ function machine(ctx = {}) {
         on: {
           SETUP: {
             target: "idle",
-            actions: ["setupDocument", "syncInputValue"]
+            actions: "syncInputValue"
           }
         }
       },
@@ -778,7 +700,7 @@ function machine(ctx = {}) {
               actions: ["clearValue", "clearHint"]
             },
             {
-              guard: and("clampOnBlur", not("isInRange")),
+              guard: and("clampOnBlur", not("isInRange"), not("isEmptyValue")),
               target: "idle",
               actions: ["clampValue", "clearHint"]
             },
@@ -868,6 +790,7 @@ function machine(ctx = {}) {
         var _a;
         return ((_a = evt.hint) != null ? _a : ctx2.hint) === "decrement";
       },
+      isEmptyValue: (ctx2) => ctx2.isValueEmpty,
       isIncrementHint: (ctx2, evt) => {
         var _a;
         return ((_a = evt.hint) != null ? _a : ctx2.hint) === "increment";
@@ -927,17 +850,10 @@ function machine(ctx = {}) {
         function onMouseup() {
           send("POINTER_UP_SCRUBBER");
         }
-        return pipe2(addDomEvent(doc, "mousemove", onMousemove, false), addDomEvent(doc, "mouseup", onMouseup, false));
+        return callAll2(addDomEvent(doc, "mousemove", onMousemove, false), addDomEvent(doc, "mouseup", onMouseup, false));
       }
     },
     actions: {
-      setupDocument: (ctx2, evt) => {
-        if (evt.doc)
-          ctx2.doc = ref(evt.doc);
-        if (evt.root)
-          ctx2.rootNode = ref(evt.root);
-        ctx2.uid = evt.id;
-      },
       focusInput(ctx2) {
         if (!ctx2.focusInputOnChange)
           return;
@@ -961,7 +877,7 @@ function machine(ctx = {}) {
       setValue(ctx2, evt) {
         var _a, _b;
         const value = (_b = (_a = evt.target) == null ? void 0 : _a.value) != null ? _b : evt.value;
-        ctx2.value = utils.sanitize(ctx2, utils.parse(ctx2, value));
+        ctx2.value = utils.sanitize(ctx2, utils.parse(ctx2, value.toString()));
       },
       clearValue(ctx2) {
         ctx2.value = "";
@@ -1050,4 +966,3 @@ export {
   connect,
   machine
 };
-//# sourceMappingURL=index.mjs.map

package/dist/number-input.connect.d.ts

@@ -1,8 +1,9 @@
-import { PropTypes, ReactPropTypes } from "@zag-js/types";
-import { Send, State } from "./number-input.types";
-export declare function connect<T extends PropTypes = ReactPropTypes>(state: State, send: Send, normalize?: import("@zag-js/types").NormalizeProps): {
+import type { NormalizeProps, PropTypes } from "@zag-js/types";
+import type { Send, State } from "./number-input.types";
+export declare function connect<T extends PropTypes>(state: State, send: Send, normalize: NormalizeProps<T>): {
     isFocused: boolean;
     isInvalid: boolean;
+    isValueEmpty: boolean;
     value: string;
     valueAsNumber: number;
     setValue(value: string | number): void;
@@ -20,4 +21,3 @@ export declare function connect<T extends PropTypes = ReactPropTypes>(state: Sta
     incrementButtonProps: T["button"];
     scrubberProps: T["element"];
 };
-//# sourceMappingURL=number-input.connect.d.ts.map

package/dist/number-input.dom.d.ts

@@ -1,8 +1,21 @@
-import { MachineContext as Ctx } from "./number-input.types";
+import type { MachineContext as Ctx } from "./number-input.types";
 export declare const dom: {
-    getDoc: (ctx: Ctx) => Document;
-    getWin: (ctx: Ctx) => Window & typeof globalThis;
-    getRootNode: (ctx: Ctx) => Document | ShadowRoot;
+    getRootNode: (ctx: {
+        getRootNode?: () => Node | Document | ShadowRoot;
+    }) => Document | ShadowRoot;
+    getDoc: (ctx: {
+        getRootNode?: () => Node | Document | ShadowRoot;
+    }) => Document;
+    getWin: (ctx: {
+        getRootNode?: () => Node | Document | ShadowRoot;
+    }) => Window & typeof globalThis;
+    getActiveElement: (ctx: {
+        getRootNode?: () => Node | Document | ShadowRoot;
+    }) => HTMLElement;
+    getById: <T_1 = HTMLElement>(ctx: {
+        getRootNode?: () => Node | Document | ShadowRoot;
+    }, id: string) => T_1;
+} & {
     getRootId: (ctx: Ctx) => string;
     getInputId: (ctx: Ctx) => string;
     getIncButtonId: (ctx: Ctx) => string;
@@ -10,7 +23,7 @@ export declare const dom: {
     getScrubberId: (ctx: Ctx) => string;
     getCursorId: (ctx: Ctx) => string;
     getLabelId: (ctx: Ctx) => string;
-    getInputEl: (ctx: Ctx) => HTMLInputElement;
+    getInputEl: (ctx: Ctx) => HTMLElement;
     getIncButtonEl: (ctx: Ctx) => HTMLButtonElement;
     getDecButtonEl: (ctx: Ctx) => HTMLButtonElement;
     getScrubberEl: (ctx: Ctx) => HTMLElement;
@@ -24,4 +37,3 @@ export declare const dom: {
     };
     createVirtualCursor(ctx: Ctx): void;
 };
-//# sourceMappingURL=number-input.dom.d.ts.map

package/dist/number-input.machine.d.ts

@@ -1,3 +1,2 @@
 import type { MachineContext, MachineState, UserDefinedContext } from "./number-input.types";
-export declare function machine(ctx?: UserDefinedContext): import("@zag-js/core").Machine<MachineContext, MachineState, import("@zag-js/core").StateMachine.AnyEventObject>;
-//# sourceMappingURL=number-input.machine.d.ts.map
+export declare function machine(ctx: UserDefinedContext): import("@zag-js/core").Machine<MachineContext, MachineState, import("@zag-js/core").StateMachine.AnyEventObject>;

package/dist/number-input.types.d.ts

@@ -1,7 +1,5 @@
 import type { StateMachine as S } from "@zag-js/core";
-import { FormatDecimalOptions } from "@zag-js/number-utils";
-import type { Point } from "@zag-js/rect-utils";
-import type { Context, DirectionProperty } from "@zag-js/types";
+import type { CommonProperties, Context, DirectionProperty, RequiredBy } from "@zag-js/types";
 declare type ValidityState = "rangeUnderflow" | "rangeOverflow";
 declare type ElementIds = Partial<{
     root: string;
@@ -26,7 +24,7 @@ declare type IntlMessages = {
      */
     decrementLabel: string;
 };
-declare type PublicContext = DirectionProperty & FormatDecimalOptions & {
+declare type PublicContext = DirectionProperty & CommonProperties & {
     /**
      * The ids of the elements in the number input. Useful for composition.
      */
@@ -127,8 +125,16 @@ declare type PublicContext = DirectionProperty & FormatDecimalOptions & {
         value: string;
         valueAsNumber: number;
     }) => void;
+    /**
+     * The minimum number of fraction digits to use. Possible values are from 0 to 20
+     */
+    minFractionDigits?: number;
+    /**
+     * The maximum number of fraction digits to use. Possible values are from 0 to 20;
+     */
+    maxFractionDigits?: number;
 };
-export declare type UserDefinedContext = Partial<PublicContext>;
+export declare type UserDefinedContext = RequiredBy<PublicContext, "id">;
 declare type ComputedContext = Readonly<{
     /**
      * @computed
@@ -150,6 +156,11 @@ declare type ComputedContext = Readonly<{
      * Whether the value is out of the min/max range
      */
     isOutOfRange: boolean;
+    /**
+     * @computed
+     * Whether the value is empty
+     */
+    isValueEmpty: boolean;
     /**
      * @computed
      * Whether the increment button is enabled
@@ -186,7 +197,10 @@ declare type PrivateContext = Context<{
      * @internal
      * The scrubber cursor position
      */
-    scrubberCursorPoint: Point | null;
+    scrubberCursorPoint: {
+        x: number;
+        y: number;
+    } | null;
 }>;
 export declare type MachineContext = PublicContext & PrivateContext & ComputedContext;
 export declare type MachineState = {
@@ -196,4 +210,3 @@ export declare type MachineState = {
 export declare type State = S.State<MachineContext, MachineState>;
 export declare type Send = S.Send<S.AnyEventObject>;
 export {};
-//# sourceMappingURL=number-input.types.d.ts.map

package/dist/number-input.utils.d.ts

@@ -1,7 +1,7 @@
-import type { KeyboardEvent } from "react";
+import type { JSX } from "@zag-js/types";
 import type { MachineContext as Ctx } from "./number-input.types";
 export declare const utils: {
-    isValidNumericEvent: (ctx: Ctx, event: KeyboardEvent) => boolean;
+    isValidNumericEvent: (ctx: Ctx, event: JSX.KeyboardEvent) => boolean;
     isFloatingPoint: (v: string) => boolean;
     sanitize: (ctx: Ctx, value: string) => string;
     increment: (ctx: Ctx, step?: number) => string;
@@ -11,4 +11,3 @@ export declare const utils: {
     format: (ctx: Ctx, value: string | number) => string | number;
     round: (ctx: Ctx) => string;
 };
-//# sourceMappingURL=number-input.utils.d.ts.map

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@zag-js/number-input",
-  "version": "0.1.9",
+  "version": "0.1.12",
   "description": "Core logic for the number-input widget implemented as a state machine",
   "keywords": [
     "js",
@@ -29,11 +29,12 @@
     "url": "https://github.com/chakra-ui/zag/issues"
   },
   "dependencies": {
-    "@zag-js/core": "0.1.6",
-    "@zag-js/dom-utils": "0.1.4",
+    "@zag-js/core": "0.1.8",
+    "@zag-js/types": "0.2.2"
+  },
+  "devDependencies": {
+    "@zag-js/dom-utils": "0.1.7",
     "@zag-js/number-utils": "0.1.2",
-    "@zag-js/rect-utils": "0.1.2",
-    "@zag-js/types": "0.1.2",
     "@zag-js/utils": "0.1.2"
   },
   "scripts": {