@zag-js/number-input 0.10.2 → 0.10.4

package/dist/index.mjs

@@ -1,16 +1,3 @@
-import {
-  connect
-} from "./chunk-5ENKYWE3.mjs";
-import {
-  anatomy
-} from "./chunk-XHRILSH3.mjs";
-import {
-  machine
-} from "./chunk-WAGQOEOU.mjs";
-import "./chunk-QYY4CWRS.mjs";
-import "./chunk-AXXDGYUW.mjs";
-export {
-  anatomy,
-  connect,
-  machine
-};
+export { anatomy } from './number-input.anatomy.mjs';
+export { connect } from './number-input.connect.mjs';
+export { machine } from './number-input.machine.mjs';

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

@@ -1,6 +1,3 @@
-import * as _zag_js_anatomy from '@zag-js/anatomy';
-
-declare const anatomy: _zag_js_anatomy.AnatomyInstance<"root" | "label" | "input" | "control" | "incrementTrigger" | "decrementTrigger" | "scrubber">;
-declare const parts: Record<"root" | "label" | "input" | "control" | "incrementTrigger" | "decrementTrigger" | "scrubber", _zag_js_anatomy.AnatomyPart>;
-
-export { anatomy, parts };
+import { AnatomyInstance, AnatomyPart } from '@zag-js/anatomy';
+export declare const anatomy: AnatomyInstance<"root" | "label" | "input" | "control" | "incrementTrigger" | "decrementTrigger" | "scrubber">;
+export declare const parts: Record<"root" | "label" | "input" | "control" | "incrementTrigger" | "decrementTrigger" | "scrubber", AnatomyPart>;

package/dist/number-input.anatomy.js

@@ -1,31 +1,10 @@
-"use strict";
-var __defProp = Object.defineProperty;
-var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
-var __getOwnPropNames = Object.getOwnPropertyNames;
-var __hasOwnProp = Object.prototype.hasOwnProperty;
-var __export = (target, all) => {
-  for (var name in all)
-    __defProp(target, name, { get: all[name], enumerable: true });
-};
-var __copyProps = (to, from, except, desc) => {
-  if (from && typeof from === "object" || typeof from === "function") {
-    for (let key of __getOwnPropNames(from))
-      if (!__hasOwnProp.call(to, key) && key !== except)
-        __defProp(to, key, { get: () => from[key], enumerable: !(desc = __getOwnPropDesc(from, key)) || desc.enumerable });
-  }
-  return to;
-};
-var __toCommonJS = (mod) => __copyProps(__defProp({}, "__esModule", { value: true }), mod);
+'use strict';
 
-// src/number-input.anatomy.ts
-var number_input_anatomy_exports = {};
-__export(number_input_anatomy_exports, {
-  anatomy: () => anatomy,
-  parts: () => parts
-});
-module.exports = __toCommonJS(number_input_anatomy_exports);
-var import_anatomy = require("@zag-js/anatomy");
-var anatomy = (0, import_anatomy.createAnatomy)("numberInput").parts(
+Object.defineProperty(exports, Symbol.toStringTag, { value: 'Module' });
+
+const anatomy$1 = require('@zag-js/anatomy');
+
+const anatomy = anatomy$1.createAnatomy("numberInput").parts(
   "root",
   "label",
   "input",
@@ -34,9 +13,7 @@ var anatomy = (0, import_anatomy.createAnatomy)("numberInput").parts(
   "decrementTrigger",
   "scrubber"
 );
-var parts = anatomy.build();
-// Annotate the CommonJS export names for ESM import in node:
-0 && (module.exports = {
-  anatomy,
-  parts
-});
+const parts = anatomy.build();
+
+exports.anatomy = anatomy;
+exports.parts = parts;

package/dist/number-input.anatomy.mjs

@@ -1,8 +1,14 @@
-import {
-  anatomy,
-  parts
-} from "./chunk-XHRILSH3.mjs";
-export {
-  anatomy,
-  parts
-};
+import { createAnatomy } from '@zag-js/anatomy';
+
+const anatomy = createAnatomy("numberInput").parts(
+  "root",
+  "label",
+  "input",
+  "control",
+  "incrementTrigger",
+  "decrementTrigger",
+  "scrubber"
+);
+const parts = anatomy.build();
+
+export { anatomy, parts };

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

@@ -1,8 +1,6 @@
-import { PropTypes, NormalizeProps } from '@zag-js/types';
-import { State, Send } from './number-input.types.js';
-import '@zag-js/core';
-
-declare function connect<T extends PropTypes>(state: State, send: Send, normalize: NormalizeProps<T>): {
+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>): {
     /**
      * Whether the input is focused.
      */
@@ -63,5 +61,3 @@ declare function connect<T extends PropTypes>(state: State, send: Send, normaliz
     incrementTriggerProps: T["button"];
     scrubberProps: T["element"];
 };
-
-export { connect };

package/dist/number-input.connect.js

@@ -1,184 +1,14 @@
-"use strict";
-var __defProp = Object.defineProperty;
-var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
-var __getOwnPropNames = Object.getOwnPropertyNames;
-var __hasOwnProp = Object.prototype.hasOwnProperty;
-var __export = (target, all) => {
-  for (var name in all)
-    __defProp(target, name, { get: all[name], enumerable: true });
-};
-var __copyProps = (to, from, except, desc) => {
-  if (from && typeof from === "object" || typeof from === "function") {
-    for (let key of __getOwnPropNames(from))
-      if (!__hasOwnProp.call(to, key) && key !== except)
-        __defProp(to, key, { get: () => from[key], enumerable: !(desc = __getOwnPropDesc(from, key)) || desc.enumerable });
-  }
-  return to;
-};
-var __toCommonJS = (mod) => __copyProps(__defProp({}, "__esModule", { value: true }), mod);
+'use strict';
 
-// src/number-input.connect.ts
-var number_input_connect_exports = {};
-__export(number_input_connect_exports, {
-  connect: () => connect
-});
-module.exports = __toCommonJS(number_input_connect_exports);
-var import_dom_event2 = require("@zag-js/dom-event");
-var import_dom_query2 = require("@zag-js/dom-query");
-var import_number_utils3 = require("@zag-js/number-utils");
+Object.defineProperty(exports, Symbol.toStringTag, { value: 'Module' });
 
-// src/number-input.anatomy.ts
-var import_anatomy = require("@zag-js/anatomy");
-var anatomy = (0, import_anatomy.createAnatomy)("numberInput").parts(
-  "root",
-  "label",
-  "input",
-  "control",
-  "incrementTrigger",
-  "decrementTrigger",
-  "scrubber"
-);
-var parts = anatomy.build();
+const domEvent = require('@zag-js/dom-event');
+const domQuery = require('@zag-js/dom-query');
+const numberUtils = require('@zag-js/number-utils');
+const numberInput_anatomy = require('./number-input.anatomy.js');
+const numberInput_dom = require('./number-input.dom.js');
+const numberInput_utils = require('./number-input.utils.js');
 
-// src/number-input.dom.ts
-var import_dom_query = require("@zag-js/dom-query");
-var import_number_utils = require("@zag-js/number-utils");
-var dom = (0, import_dom_query.createScope)({
-  getRootId: (ctx) => ctx.ids?.root ?? `number-input:${ctx.id}`,
-  getInputId: (ctx) => ctx.ids?.input ?? `number-input:${ctx.id}:input`,
-  getIncrementTriggerId: (ctx) => ctx.ids?.incrementTrigger ?? `number-input:${ctx.id}:inc`,
-  getDecrementTriggerId: (ctx) => ctx.ids?.decrementTrigger ?? `number-input:${ctx.id}:dec`,
-  getScrubberId: (ctx) => ctx.ids?.scrubber ?? `number-input:${ctx.id}:scrubber`,
-  getCursorId: (ctx) => `number-input:${ctx.id}:cursor`,
-  getLabelId: (ctx) => ctx.ids?.label ?? `number-input:${ctx.id}:label`,
-  getInputEl: (ctx) => dom.getById(ctx, dom.getInputId(ctx)),
-  getIncrementTriggerEl: (ctx) => dom.getById(ctx, dom.getIncrementTriggerId(ctx)),
-  getDecrementTriggerEl: (ctx) => dom.getById(ctx, dom.getDecrementTriggerId(ctx)),
-  getScrubberEl: (ctx) => dom.getById(ctx, dom.getScrubberId(ctx)),
-  getCursorEl: (ctx) => dom.getDoc(ctx).getElementById(dom.getCursorId(ctx)),
-  getPressedTriggerEl: (ctx, hint = ctx.hint) => {
-    let btnEl = null;
-    if (hint === "increment") {
-      btnEl = dom.getIncrementTriggerEl(ctx);
-    }
-    if (hint === "decrement") {
-      btnEl = dom.getDecrementTriggerEl(ctx);
-    }
-    return btnEl;
-  },
-  setupVirtualCursor(ctx) {
-    if ((0, import_dom_query.isSafari)())
-      return;
-    dom.createVirtualCursor(ctx);
-    return () => {
-      dom.getCursorEl(ctx)?.remove();
-    };
-  },
-  preventTextSelection(ctx) {
-    const doc = dom.getDoc(ctx);
-    const html = doc.documentElement;
-    const body = doc.body;
-    body.style.pointerEvents = "none";
-    html.style.userSelect = "none";
-    html.style.cursor = "ew-resize";
-    return () => {
-      body.style.pointerEvents = "";
-      html.style.userSelect = "";
-      html.style.cursor = "";
-      if (!html.style.length) {
-        html.removeAttribute("style");
-      }
-      if (!body.style.length) {
-        body.removeAttribute("style");
-      }
-    };
-  },
-  getMousementValue(ctx, event) {
-    const x = (0, import_number_utils.roundToDevicePixel)(event.movementX);
-    const y = (0, import_number_utils.roundToDevicePixel)(event.movementY);
-    let hint = x > 0 ? "increment" : x < 0 ? "decrement" : null;
-    if (ctx.isRtl && hint === "increment")
-      hint = "decrement";
-    if (ctx.isRtl && hint === "decrement")
-      hint = "increment";
-    const point = {
-      x: ctx.scrubberCursorPoint.x + x,
-      y: ctx.scrubberCursorPoint.y + y
-    };
-    const win = dom.getWin(ctx);
-    const width = win.innerWidth;
-    const half = (0, import_number_utils.roundToDevicePixel)(7.5);
-    point.x = (0, import_number_utils.wrap)(point.x + half, width) - half;
-    return { hint, point };
-  },
-  createVirtualCursor(ctx) {
-    const doc = dom.getDoc(ctx);
-    const el = doc.createElement("div");
-    el.className = "scrubber--cursor";
-    el.id = dom.getCursorId(ctx);
-    Object.assign(el.style, {
-      width: "15px",
-      height: "15px",
-      position: "fixed",
-      pointerEvents: "none",
-      left: "0px",
-      top: "0px",
-      zIndex: import_dom_query.MAX_Z_INDEX,
-      transform: ctx.scrubberCursorPoint ? `translate3d(${ctx.scrubberCursorPoint.x}px, ${ctx.scrubberCursorPoint.y}px, 0px)` : void 0,
-      willChange: "transform"
-    });
-    el.innerHTML = `
-        <svg width="46" height="15" style="left: -15.5px; position: absolute; top: 0; filter: drop-shadow(rgba(0, 0, 0, 0.4) 0px 1px 1.1px);">
-          <g transform="translate(2 3)">
-            <path fill-rule="evenodd" d="M 15 4.5L 15 2L 11.5 5.5L 15 9L 15 6.5L 31 6.5L 31 9L 34.5 5.5L 31 2L 31 4.5Z" style="stroke-width: 2px; stroke: white;"></path>
-            <path fill-rule="evenodd" d="M 15 4.5L 15 2L 11.5 5.5L 15 9L 15 6.5L 31 6.5L 31 9L 34.5 5.5L 31 2L 31 4.5Z"></path>
-          </g>
-        </svg>`;
-    doc.body.appendChild(el);
-  }
-});
-
-// src/number-input.utils.ts
-var import_dom_event = require("@zag-js/dom-event");
-var import_number_utils2 = require("@zag-js/number-utils");
-var utils = {
-  isValidNumericEvent: (ctx, event) => {
-    if (event.key == null)
-      return true;
-    const isModifier = (0, import_dom_event.isModifiedEvent)(event);
-    const isSingleKey = event.key.length === 1;
-    if (isModifier || !isSingleKey)
-      return true;
-    return ctx.validateCharacter?.(event.key) ?? utils.isFloatingPoint(event.key);
-  },
-  isFloatingPoint: (v) => /^[0-9+\-.]$/.test(v),
-  sanitize: (ctx, value) => {
-    return value.split("").filter(ctx.validateCharacter ?? utils.isFloatingPoint).join("");
-  },
-  increment: (ctx, step) => {
-    const value = (0, import_number_utils2.increment)(ctx.value, step ?? ctx.step);
-    return (0, import_number_utils2.formatDecimal)((0, import_number_utils2.clamp)(value, ctx), ctx);
-  },
-  decrement: (ctx, step) => {
-    const value = (0, import_number_utils2.decrement)(ctx.value, step ?? ctx.step);
-    return (0, import_number_utils2.formatDecimal)((0, import_number_utils2.clamp)(value, ctx), ctx);
-  },
-  clamp: (ctx) => {
-    return (0, import_number_utils2.formatDecimal)((0, import_number_utils2.clamp)(ctx.value, ctx), ctx);
-  },
-  parse: (ctx, value) => {
-    return ctx.parse?.(value) ?? value;
-  },
-  format: (ctx, value) => {
-    const _val = value.toString();
-    return ctx.format?.(_val) ?? _val;
-  },
-  round: (ctx) => {
-    return (0, import_number_utils2.formatDecimal)(ctx.value, ctx);
-  }
-};
-
-// src/number-input.connect.ts
 function connect(state, send, normalize) {
   const isFocused = state.hasTag("focus");
   const isInvalid = state.context.isOutOfRange || !!state.context.invalid;
@@ -248,47 +78,47 @@ function connect(state, send, normalize) {
      * Function to focus the input.
      */
     focus() {
-      dom.getInputEl(state.context)?.focus();
+      numberInput_dom.dom.getInputEl(state.context)?.focus();
     },
     /**
      * Function to blur the input.
      */
     blur() {
-      dom.getInputEl(state.context)?.blur();
+      numberInput_dom.dom.getInputEl(state.context)?.blur();
     },
     rootProps: normalize.element({
-      id: dom.getRootId(state.context),
-      ...parts.root.attrs,
-      "data-disabled": (0, import_dom_query2.dataAttr)(isDisabled)
+      id: numberInput_dom.dom.getRootId(state.context),
+      ...numberInput_anatomy.parts.root.attrs,
+      "data-disabled": domQuery.dataAttr(isDisabled)
     }),
     labelProps: normalize.label({
-      ...parts.label.attrs,
-      "data-disabled": (0, import_dom_query2.dataAttr)(isDisabled),
-      "data-invalid": (0, import_dom_query2.dataAttr)(isInvalid),
-      id: dom.getLabelId(state.context),
-      htmlFor: dom.getInputId(state.context)
+      ...numberInput_anatomy.parts.label.attrs,
+      "data-disabled": domQuery.dataAttr(isDisabled),
+      "data-invalid": domQuery.dataAttr(isInvalid),
+      id: numberInput_dom.dom.getLabelId(state.context),
+      htmlFor: numberInput_dom.dom.getInputId(state.context)
     }),
     controlProps: normalize.element({
-      ...parts.control.attrs,
+      ...numberInput_anatomy.parts.control.attrs,
       role: "group",
       "aria-disabled": isDisabled,
-      "data-disabled": (0, import_dom_query2.dataAttr)(isDisabled),
-      "data-invalid": (0, import_dom_query2.dataAttr)(isInvalid),
-      "aria-invalid": (0, import_dom_query2.ariaAttr)(state.context.invalid)
+      "data-disabled": domQuery.dataAttr(isDisabled),
+      "data-invalid": domQuery.dataAttr(isInvalid),
+      "aria-invalid": domQuery.ariaAttr(state.context.invalid)
     }),
     inputProps: normalize.input({
-      ...parts.input.attrs,
+      ...numberInput_anatomy.parts.input.attrs,
       name: state.context.name,
       form: state.context.form,
-      id: dom.getInputId(state.context),
+      id: numberInput_dom.dom.getInputId(state.context),
       role: "spinbutton",
       defaultValue: state.context.formattedValue,
       pattern: state.context.pattern,
       inputMode: state.context.inputMode,
-      "aria-invalid": (0, import_dom_query2.ariaAttr)(isInvalid),
-      "data-invalid": (0, import_dom_query2.dataAttr)(isInvalid),
+      "aria-invalid": domQuery.ariaAttr(isInvalid),
+      "data-invalid": domQuery.dataAttr(isInvalid),
       disabled: isDisabled,
-      "data-disabled": (0, import_dom_query2.dataAttr)(isDisabled),
+      "data-disabled": domQuery.dataAttr(isDisabled),
       readOnly: !!state.context.readOnly,
       autoComplete: "off",
       autoCorrect: "off",
@@ -309,13 +139,13 @@ function connect(state, send, normalize) {
         send({ type: "CHANGE", target: event.currentTarget, hint: "set" });
       },
       onKeyDown(event) {
-        const evt = (0, import_dom_event2.getNativeEvent)(event);
+        const evt = domEvent.getNativeEvent(event);
         if (evt.isComposing)
           return;
-        if (!utils.isValidNumericEvent(state.context, event)) {
+        if (!numberInput_utils.utils.isValidNumericEvent(state.context, event)) {
           event.preventDefault();
         }
-        const step = (0, import_dom_event2.getEventStep)(event) * state.context.step;
+        const step = domEvent.getEventStep(event) * state.context.step;
         const keyMap = {
           ArrowUp() {
             send({ type: "ARROW_UP", step });
@@ -338,18 +168,18 @@ function connect(state, send, normalize) {
       }
     }),
     decrementTriggerProps: normalize.button({
-      ...parts.decrementTrigger.attrs,
-      id: dom.getDecrementTriggerId(state.context),
+      ...numberInput_anatomy.parts.decrementTrigger.attrs,
+      id: numberInput_dom.dom.getDecrementTriggerId(state.context),
       disabled: isDecrementDisabled,
-      "data-disabled": (0, import_dom_query2.dataAttr)(isDecrementDisabled),
+      "data-disabled": domQuery.dataAttr(isDecrementDisabled),
       "aria-label": translations.decrementLabel,
       type: "button",
       tabIndex: -1,
-      "aria-controls": dom.getInputId(state.context),
+      "aria-controls": numberInput_dom.dom.getInputId(state.context),
       onPointerDown(event) {
         if (isDecrementDisabled)
           return;
-        send((0, import_dom_event2.isLeftClick)(event) ? { type: "PRESS_DOWN", hint: "decrement" } : { type: "FOCUS" });
+        send(domEvent.isLeftClick(event) ? { type: "PRESS_DOWN", hint: "decrement" } : { type: "FOCUS" });
         event.preventDefault();
       },
       onPointerUp() {
@@ -362,18 +192,18 @@ function connect(state, send, normalize) {
       }
     }),
     incrementTriggerProps: normalize.button({
-      ...parts.incrementTrigger.attrs,
-      id: dom.getIncrementTriggerId(state.context),
+      ...numberInput_anatomy.parts.incrementTrigger.attrs,
+      id: numberInput_dom.dom.getIncrementTriggerId(state.context),
       disabled: isIncrementDisabled,
-      "data-disabled": (0, import_dom_query2.dataAttr)(isIncrementDisabled),
+      "data-disabled": domQuery.dataAttr(isIncrementDisabled),
       "aria-label": translations.incrementLabel,
       type: "button",
       tabIndex: -1,
-      "aria-controls": dom.getInputId(state.context),
+      "aria-controls": numberInput_dom.dom.getInputId(state.context),
       onPointerDown(event) {
         if (isIncrementDisabled)
           return;
-        send((0, import_dom_event2.isLeftClick)(event) ? { type: "PRESS_DOWN", hint: "increment" } : { type: "FOCUS" });
+        send(domEvent.isLeftClick(event) ? { type: "PRESS_DOWN", hint: "increment" } : { type: "FOCUS" });
         event.preventDefault();
       },
       onPointerUp() {
@@ -384,17 +214,17 @@ function connect(state, send, normalize) {
       }
     }),
     scrubberProps: normalize.element({
-      ...parts.scrubber.attrs,
-      "data-disabled": (0, import_dom_query2.dataAttr)(isDisabled),
-      id: dom.getScrubberId(state.context),
+      ...numberInput_anatomy.parts.scrubber.attrs,
+      "data-disabled": domQuery.dataAttr(isDisabled),
+      id: numberInput_dom.dom.getScrubberId(state.context),
       role: "presentation",
       onMouseDown(event) {
         if (isDisabled)
           return;
-        const evt = (0, import_dom_event2.getNativeEvent)(event);
-        const point = (0, import_dom_event2.getEventPoint)(evt);
-        point.x = point.x - (0, import_number_utils3.roundToDevicePixel)(7.5);
-        point.y = point.y - (0, import_number_utils3.roundToDevicePixel)(7.5);
+        const evt = domEvent.getNativeEvent(event);
+        const point = domEvent.getEventPoint(evt);
+        point.x = point.x - numberUtils.roundToDevicePixel(7.5);
+        point.y = point.y - numberUtils.roundToDevicePixel(7.5);
         send({ type: "PRESS_DOWN_SCRUBBER", point });
         event.preventDefault();
       },
@@ -404,7 +234,5 @@ function connect(state, send, normalize) {
     })
   };
 }
-// Annotate the CommonJS export names for ESM import in node:
-0 && (module.exports = {
-  connect
-});
+
+exports.connect = connect;