@zag-js/number-input 0.2.9 → 0.2.10

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
@@ -1,9 +1,9 @@
1
1
  import {
2
2
  dom
3
- } from "./chunk-GE27CSUU.mjs";
3
+ } from "./chunk-GQN3V2LU.mjs";
4
4
  import {
5
5
  utils
6
- } from "./chunk-H4EBYJOE.mjs";
6
+ } from "./chunk-6CS5P7OC.mjs";
7
7
  import {
8
8
  getWindow,
9
9
  hasProp,
@@ -14,7 +14,7 @@ import {
14
14
  isWithinRange,
15
15
  supportsPointerEvent,
16
16
  valueOf
17
- } from "./chunk-HL4LVUFM.mjs";
17
+ } from "./chunk-EPCXXTFL.mjs";
18
18
 
19
19
  // src/number-input.machine.ts
20
20
  import { choose, createMachine, guards } from "@zag-js/core";
@@ -22,11 +22,11 @@ import { choose, createMachine, guards } from "@zag-js/core";
22
22
  // ../../utilities/core/src/functions.ts
23
23
  var runIfFn = (v, ...a) => {
24
24
  const res = typeof v === "function" ? v(...a) : v;
25
- return res != null ? res : void 0;
25
+ return res ?? void 0;
26
26
  };
27
27
  var callAll = (...fns) => (...a) => {
28
28
  fns.forEach(function(fn) {
29
- fn == null ? void 0 : fn(...a);
29
+ fn?.(...a);
30
30
  });
31
31
  };
32
32
 
@@ -43,9 +43,9 @@ function compact(obj) {
43
43
  var isRef = (v) => hasProp(v, "current");
44
44
  function addDomEvent(target, eventName, handler, options) {
45
45
  const node = isRef(target) ? target.current : runIfFn(target);
46
- node == null ? void 0 : node.addEventListener(eventName, handler, options);
46
+ node?.addEventListener(eventName, handler, options);
47
47
  return () => {
48
- node == null ? void 0 : node.removeEventListener(eventName, handler, options);
48
+ node?.removeEventListener(eventName, handler, options);
49
49
  };
50
50
  }
51
51
 
@@ -91,13 +91,13 @@ function requestPointerLock(doc, handlers = {}) {
91
91
  const locked = !!doc.pointerLockElement;
92
92
  function onPointerChange() {
93
93
  if (locked)
94
- onPointerLock == null ? void 0 : onPointerLock();
94
+ onPointerLock?.();
95
95
  else
96
- onPointerUnlock == null ? void 0 : onPointerUnlock();
96
+ onPointerUnlock?.();
97
97
  }
98
98
  function onPointerError(event) {
99
99
  if (locked)
100
- onPointerUnlock == null ? void 0 : onPointerUnlock();
100
+ onPointerUnlock?.();
101
101
  console.error("PointerLock error occured:", event);
102
102
  exit();
103
103
  }
@@ -124,20 +124,18 @@ function requestPointerLock(doc, handlers = {}) {
124
124
 
125
125
  // ../../utilities/form-utils/src/input-event.ts
126
126
  function getDescriptor(el, options) {
127
- var _a;
128
127
  const { type, property = "value" } = options;
129
128
  const proto = getWindow(el)[type].prototype;
130
- return (_a = Object.getOwnPropertyDescriptor(proto, property)) != null ? _a : {};
129
+ return Object.getOwnPropertyDescriptor(proto, property) ?? {};
131
130
  }
132
131
  function dispatchInputValueEvent(el, value) {
133
- var _a;
134
132
  if (!el)
135
133
  return;
136
134
  const win = getWindow(el);
137
135
  if (!(el instanceof win.HTMLInputElement))
138
136
  return;
139
137
  const desc = getDescriptor(el, { type: "HTMLInputElement", property: "value" });
140
- (_a = desc.set) == null ? void 0 : _a.call(el, value);
138
+ desc.set?.call(el, value);
141
139
  const event = new win.Event("input", { bubbles: true });
142
140
  el.dispatchEvent(event);
143
141
  }
@@ -149,7 +147,7 @@ function machine(userContext) {
149
147
  return createMachine(
150
148
  {
151
149
  id: "number-input",
152
- initial: "unknown",
150
+ initial: "idle",
153
151
  context: {
154
152
  dir: "ltr",
155
153
  focusInputOnChange: true,
@@ -181,20 +179,15 @@ function machine(userContext) {
181
179
  isValueEmpty: (ctx2) => ctx2.value === "",
182
180
  canIncrement: (ctx2) => ctx2.allowOverflow || !ctx2.isAtMax,
183
181
  canDecrement: (ctx2) => ctx2.allowOverflow || !ctx2.isAtMin,
184
- valueText: (ctx2) => {
185
- var _a, _b;
186
- return (_b = (_a = ctx2.translations).valueText) == null ? void 0 : _b.call(_a, ctx2.value);
187
- },
188
- formattedValue: (ctx2) => {
189
- var _a, _b;
190
- return (_b = (_a = ctx2.format) == null ? void 0 : _a.call(ctx2, ctx2.value).toString()) != null ? _b : ctx2.value;
191
- }
182
+ valueText: (ctx2) => ctx2.translations.valueText?.(ctx2.value),
183
+ formattedValue: (ctx2) => ctx2.format?.(ctx2.value).toString() ?? ctx2.value
192
184
  },
193
185
  watch: {
194
186
  value: ["invokeOnChange", "dispatchChangeEvent"],
195
187
  isOutOfRange: ["invokeOnInvalid"],
196
188
  scrubberCursorPoint: ["setVirtualCursorPosition"]
197
189
  },
190
+ entry: ["syncInputValue"],
198
191
  on: {
199
192
  SET_VALUE: [
200
193
  {
@@ -216,14 +209,6 @@ function machine(userContext) {
216
209
  }
217
210
  },
218
211
  states: {
219
- unknown: {
220
- on: {
221
- SETUP: {
222
- target: "idle",
223
- actions: "syncInputValue"
224
- }
225
- }
226
- },
227
212
  idle: {
228
213
  exit: "invokeOnFocus",
229
214
  on: {
@@ -357,15 +342,9 @@ function machine(userContext) {
357
342
  spinOnPress: (ctx2) => !!ctx2.spinOnPress,
358
343
  isAtMax: (ctx2) => ctx2.isAtMax,
359
344
  isInRange: (ctx2) => !ctx2.isOutOfRange,
360
- isDecrementHint: (ctx2, evt) => {
361
- var _a;
362
- return ((_a = evt.hint) != null ? _a : ctx2.hint) === "decrement";
363
- },
345
+ isDecrementHint: (ctx2, evt) => (evt.hint ?? ctx2.hint) === "decrement",
364
346
  isEmptyValue: (ctx2) => ctx2.isValueEmpty,
365
- isIncrementHint: (ctx2, evt) => {
366
- var _a;
367
- return ((_a = evt.hint) != null ? _a : ctx2.hint) === "increment";
368
- },
347
+ isIncrementHint: (ctx2, evt) => (evt.hint ?? ctx2.hint) === "increment",
369
348
  isInvalidExponential: (ctx2) => ctx2.value.toString().startsWith("e")
370
349
  },
371
350
  activities: {
@@ -430,7 +409,7 @@ function machine(userContext) {
430
409
  if (!ctx2.focusInputOnChange)
431
410
  return;
432
411
  const input = dom.getInputEl(ctx2);
433
- raf(() => input == null ? void 0 : input.focus());
412
+ raf(() => input?.focus());
434
413
  },
435
414
  increment(ctx2, evt) {
436
415
  ctx2.value = utils.increment(ctx2, evt.step);
@@ -447,8 +426,7 @@ function machine(userContext) {
447
426
  }
448
427
  },
449
428
  setValue(ctx2, evt) {
450
- var _a, _b;
451
- const value = (_b = (_a = evt.target) == null ? void 0 : _a.value) != null ? _b : evt.value;
429
+ const value = evt.target?.value ?? evt.value;
452
430
  ctx2.value = utils.sanitize(ctx2, utils.parse(ctx2, value.toString()));
453
431
  },
454
432
  clearValue(ctx2) {
@@ -470,14 +448,12 @@ function machine(userContext) {
470
448
  ctx2.hint = "set";
471
449
  },
472
450
  invokeOnChange(ctx2) {
473
- var _a;
474
- (_a = ctx2.onChange) == null ? void 0 : _a.call(ctx2, {
451
+ ctx2.onChange?.({
475
452
  value: ctx2.value,
476
453
  valueAsNumber: ctx2.valueAsNumber
477
454
  });
478
455
  },
479
456
  invokeOnFocus(ctx2, evt) {
480
- var _a;
481
457
  let srcElement = null;
482
458
  if (evt.type === "PRESS_DOWN") {
483
459
  srcElement = dom.getPressedTriggerEl(ctx2, evt.hint);
@@ -486,25 +462,23 @@ function machine(userContext) {
486
462
  } else if (evt.type === "PRESS_DOWN_SCRUBBER") {
487
463
  srcElement = dom.getScrubberEl(ctx2);
488
464
  }
489
- (_a = ctx2.onFocus) == null ? void 0 : _a.call(ctx2, {
465
+ ctx2.onFocus?.({
490
466
  value: ctx2.value,
491
467
  valueAsNumber: ctx2.valueAsNumber,
492
468
  srcElement
493
469
  });
494
470
  },
495
471
  invokeOnBlur(ctx2) {
496
- var _a;
497
- (_a = ctx2.onBlur) == null ? void 0 : _a.call(ctx2, {
472
+ ctx2.onBlur?.({
498
473
  value: ctx2.value,
499
474
  valueAsNumber: ctx2.valueAsNumber
500
475
  });
501
476
  },
502
477
  invokeOnInvalid(ctx2) {
503
- var _a;
504
478
  if (!ctx2.isOutOfRange)
505
479
  return;
506
480
  const reason = ctx2.valueAsNumber > ctx2.max ? "rangeOverflow" : "rangeUnderflow";
507
- (_a = ctx2.onInvalid) == null ? void 0 : _a.call(ctx2, {
481
+ ctx2.onInvalid?.({
508
482
  reason,
509
483
  value: ctx2.formattedValue,
510
484
  valueAsNumber: ctx2.valueAsNumber
@@ -1,18 +1,18 @@
1
1
  import {
2
2
  parts
3
- } from "./chunk-VVR2U5A7.mjs";
3
+ } from "./chunk-XHRILSH3.mjs";
4
4
  import {
5
5
  dom
6
- } from "./chunk-GE27CSUU.mjs";
6
+ } from "./chunk-GQN3V2LU.mjs";
7
7
  import {
8
8
  utils
9
- } from "./chunk-H4EBYJOE.mjs";
9
+ } from "./chunk-6CS5P7OC.mjs";
10
10
  import {
11
11
  getNativeEvent,
12
12
  isLeftClick,
13
13
  isTouchEvent,
14
14
  roundToDevicePixel
15
- } from "./chunk-HL4LVUFM.mjs";
15
+ } from "./chunk-EPCXXTFL.mjs";
16
16
 
17
17
  // ../../utilities/dom/src/attrs.ts
18
18
  var dataAttr = (guard) => {
@@ -30,8 +30,7 @@ var fallback = {
30
30
  clientY: 0
31
31
  };
32
32
  function getEventPoint(event, type = "page") {
33
- var _a, _b;
34
- const point = isTouchEvent(event) ? (_b = (_a = event.touches[0]) != null ? _a : event.changedTouches[0]) != null ? _b : fallback : event;
33
+ const point = isTouchEvent(event) ? event.touches[0] ?? event.changedTouches[0] ?? fallback : event;
35
34
  return { x: point[`${type}X`], y: point[`${type}Y`] };
36
35
  }
37
36
 
@@ -82,12 +81,10 @@ function connect(state, send, normalize) {
82
81
  send({ type: "SET_VALUE", value: state.context.min });
83
82
  },
84
83
  focus() {
85
- var _a;
86
- (_a = dom.getInputEl(state.context)) == null ? void 0 : _a.focus();
84
+ dom.getInputEl(state.context)?.focus();
87
85
  },
88
86
  blur() {
89
- var _a;
90
- (_a = dom.getInputEl(state.context)) == null ? void 0 : _a.blur();
87
+ dom.getInputEl(state.context)?.blur();
91
88
  },
92
89
  rootProps: normalize.element({
93
90
  id: dom.getRootId(state.context),
@@ -4,44 +4,40 @@ import {
4
4
  formatDecimal,
5
5
  increment,
6
6
  isModifiedEvent
7
- } from "./chunk-HL4LVUFM.mjs";
7
+ } from "./chunk-EPCXXTFL.mjs";
8
8
 
9
9
  // src/number-input.utils.ts
10
10
  var utils = {
11
11
  isValidNumericEvent: (ctx, event) => {
12
- var _a, _b;
13
12
  if (event.key == null)
14
13
  return true;
15
14
  const isModifier = isModifiedEvent(event);
16
15
  const isSingleKey = event.key.length === 1;
17
16
  if (isModifier || !isSingleKey)
18
17
  return true;
19
- return (_b = (_a = ctx.validateCharacter) == null ? void 0 : _a.call(ctx, event.key)) != null ? _b : utils.isFloatingPoint(event.key);
18
+ return ctx.validateCharacter?.(event.key) ?? utils.isFloatingPoint(event.key);
20
19
  },
21
20
  isFloatingPoint: (v) => /^[0-9+\-.]$/.test(v),
22
21
  sanitize: (ctx, value) => {
23
- var _a;
24
- return value.split("").filter((_a = ctx.validateCharacter) != null ? _a : utils.isFloatingPoint).join("");
22
+ return value.split("").filter(ctx.validateCharacter ?? utils.isFloatingPoint).join("");
25
23
  },
26
24
  increment: (ctx, step) => {
27
- const value = increment(ctx.value, step != null ? step : ctx.step);
25
+ const value = increment(ctx.value, step ?? ctx.step);
28
26
  return formatDecimal(clamp(value, ctx), ctx);
29
27
  },
30
28
  decrement: (ctx, step) => {
31
- const value = decrement(ctx.value, step != null ? step : ctx.step);
29
+ const value = decrement(ctx.value, step ?? ctx.step);
32
30
  return formatDecimal(clamp(value, ctx), ctx);
33
31
  },
34
32
  clamp: (ctx) => {
35
33
  return formatDecimal(clamp(ctx.value, ctx), ctx);
36
34
  },
37
35
  parse: (ctx, value) => {
38
- var _a, _b;
39
- return (_b = (_a = ctx.parse) == null ? void 0 : _a.call(ctx, value)) != null ? _b : value;
36
+ return ctx.parse?.(value) ?? value;
40
37
  },
41
38
  format: (ctx, value) => {
42
- var _a, _b;
43
39
  const _val = value.toString();
44
- return (_b = (_a = ctx.format) == null ? void 0 : _a.call(ctx, _val)) != null ? _b : _val;
40
+ return ctx.format?.(_val) ?? _val;
45
41
  },
46
42
  round: (ctx) => {
47
43
  return formatDecimal(ctx.value, ctx);
@@ -1,9 +1,8 @@
1
1
  // ../../utilities/dom/src/platform.ts
2
2
  var isDom = () => typeof window !== "undefined";
3
3
  function getPlatform() {
4
- var _a;
5
4
  const agent = navigator.userAgentData;
6
- return (_a = agent == null ? void 0 : agent.platform) != null ? _a : navigator.platform;
5
+ return agent?.platform ?? navigator.platform;
7
6
  }
8
7
  var pt = (v) => isDom() && v.test(getPlatform());
9
8
  var vn = (v) => isDom() && v.test(navigator.vendor);
@@ -15,31 +14,23 @@ function isDocument(el) {
15
14
  return el.nodeType === Node.DOCUMENT_NODE;
16
15
  }
17
16
  function isWindow(value) {
18
- return (value == null ? void 0 : value.toString()) === "[object Window]";
17
+ return value?.toString() === "[object Window]";
19
18
  }
20
19
  function getDocument(el) {
21
- var _a;
22
20
  if (isWindow(el))
23
21
  return el.document;
24
22
  if (isDocument(el))
25
23
  return el;
26
- return (_a = el == null ? void 0 : el.ownerDocument) != null ? _a : document;
24
+ return el?.ownerDocument ?? document;
27
25
  }
28
26
  function getWindow(el) {
29
- var _a;
30
- return (_a = el == null ? void 0 : el.ownerDocument.defaultView) != null ? _a : window;
27
+ return el?.ownerDocument.defaultView ?? window;
31
28
  }
32
29
  function defineDomHelpers(helpers) {
33
30
  const dom = {
34
- getRootNode: (ctx) => {
35
- var _a, _b;
36
- return (_b = (_a = ctx.getRootNode) == null ? void 0 : _a.call(ctx)) != null ? _b : document;
37
- },
31
+ getRootNode: (ctx) => ctx.getRootNode?.() ?? document,
38
32
  getDoc: (ctx) => getDocument(dom.getRootNode(ctx)),
39
- getWin: (ctx) => {
40
- var _a;
41
- return (_a = dom.getDoc(ctx).defaultView) != null ? _a : window;
42
- },
33
+ getWin: (ctx) => dom.getDoc(ctx).defaultView ?? window,
43
34
  getActiveElement: (ctx) => dom.getDoc(ctx).activeElement,
44
35
  getById: (ctx, id) => dom.getRootNode(ctx).getElementById(id)
45
36
  };
@@ -56,8 +47,7 @@ var hasProp = (obj, prop) => Object.prototype.hasOwnProperty.call(obj, prop);
56
47
 
57
48
  // ../../utilities/dom/src/event.ts
58
49
  function getNativeEvent(e) {
59
- var _a;
60
- return (_a = e.nativeEvent) != null ? _a : e;
50
+ return e.nativeEvent ?? e;
61
51
  }
62
52
  var supportsPointerEvent = () => isDom() && window.onpointerdown === null;
63
53
  var isTouchEvent = (v) => isObject(v) && hasProp(v, "touches");
@@ -4,38 +4,20 @@ import {
4
4
  roundToDevicePixel,
5
5
  supportsPointerEvent,
6
6
  wrap
7
- } from "./chunk-HL4LVUFM.mjs";
7
+ } from "./chunk-EPCXXTFL.mjs";
8
8
 
9
9
  // ../../utilities/dom/src/constants.ts
10
10
  var MAX_Z_INDEX = 2147483647;
11
11
 
12
12
  // src/number-input.dom.ts
13
13
  var dom = defineDomHelpers({
14
- getRootId: (ctx) => {
15
- var _a, _b;
16
- return (_b = (_a = ctx.ids) == null ? void 0 : _a.root) != null ? _b : `number-input:${ctx.id}`;
17
- },
18
- getInputId: (ctx) => {
19
- var _a, _b;
20
- return (_b = (_a = ctx.ids) == null ? void 0 : _a.input) != null ? _b : `number-input:${ctx.id}:input`;
21
- },
22
- getIncrementTriggerId: (ctx) => {
23
- var _a, _b;
24
- return (_b = (_a = ctx.ids) == null ? void 0 : _a.incrementTrigger) != null ? _b : `number-input:${ctx.id}:inc`;
25
- },
26
- getDecrementTriggerId: (ctx) => {
27
- var _a, _b;
28
- return (_b = (_a = ctx.ids) == null ? void 0 : _a.decrementTrigger) != null ? _b : `number-input:${ctx.id}:dec`;
29
- },
30
- getScrubberId: (ctx) => {
31
- var _a, _b;
32
- return (_b = (_a = ctx.ids) == null ? void 0 : _a.scrubber) != null ? _b : `number-input:${ctx.id}:scrubber`;
33
- },
14
+ getRootId: (ctx) => ctx.ids?.root ?? `number-input:${ctx.id}`,
15
+ getInputId: (ctx) => ctx.ids?.input ?? `number-input:${ctx.id}:input`,
16
+ getIncrementTriggerId: (ctx) => ctx.ids?.incrementTrigger ?? `number-input:${ctx.id}:inc`,
17
+ getDecrementTriggerId: (ctx) => ctx.ids?.decrementTrigger ?? `number-input:${ctx.id}:dec`,
18
+ getScrubberId: (ctx) => ctx.ids?.scrubber ?? `number-input:${ctx.id}:scrubber`,
34
19
  getCursorId: (ctx) => `number-input:${ctx.id}:cursor`,
35
- getLabelId: (ctx) => {
36
- var _a, _b;
37
- return (_b = (_a = ctx.ids) == null ? void 0 : _a.label) != null ? _b : `number-input:${ctx.id}:label`;
38
- },
20
+ getLabelId: (ctx) => ctx.ids?.label ?? `number-input:${ctx.id}:label`,
39
21
  getInputEl: (ctx) => dom.getById(ctx, dom.getInputId(ctx)),
40
22
  getIncrementTriggerEl: (ctx) => dom.getById(ctx, dom.getIncrementTriggerId(ctx)),
41
23
  getDecrementTriggerEl: (ctx) => dom.getById(ctx, dom.getDecrementTriggerId(ctx)),
@@ -56,8 +38,7 @@ var dom = defineDomHelpers({
56
38
  return;
57
39
  dom.createVirtualCursor(ctx);
58
40
  return () => {
59
- var _a;
60
- (_a = dom.getCursorEl(ctx)) == null ? void 0 : _a.remove();
41
+ dom.getCursorEl(ctx)?.remove();
61
42
  };
62
43
  },
63
44
  preventTextSelection(ctx) {
File without changes