@zag-js/number-input 0.1.1 → 0.1.4

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.
package/dist/index.js CHANGED
@@ -45,17 +45,13 @@ module.exports = __toCommonJS(src_exports);
45
45
  var dataAttr = (guard) => {
46
46
  return guard ? "" : void 0;
47
47
  };
48
- function nextTick(fn) {
49
- const set = /* @__PURE__ */ new Set();
50
- function raf2(fn2) {
51
- const id = globalThis.requestAnimationFrame(fn2);
52
- set.add(() => globalThis.cancelAnimationFrame(id));
53
- }
54
- raf2(() => raf2(fn));
48
+ var ariaAttr = (guard) => {
49
+ return guard ? "true" : void 0;
50
+ };
51
+ function raf(fn) {
52
+ const id = globalThis.requestAnimationFrame(fn);
55
53
  return function cleanup() {
56
- set.forEach(function(fn2) {
57
- fn2();
58
- });
54
+ globalThis.cancelAnimationFrame(id);
59
55
  };
60
56
  }
61
57
  var noop = () => {
@@ -161,6 +157,30 @@ function observeAttributes(node, attributes, fn) {
161
157
  obs.observe(node, { attributes: true, attributeFilter: attrs });
162
158
  return () => obs.disconnect();
163
159
  }
160
+ function itemById(v, id) {
161
+ return v.find((node) => node.id === id);
162
+ }
163
+ function indexOfId(v, id) {
164
+ const item = itemById(v, id);
165
+ return item ? v.indexOf(item) : -1;
166
+ }
167
+ var getValueText = (item) => {
168
+ var _a, _b;
169
+ return (_b = (_a = item.dataset.valuetext) != null ? _a : item.textContent) != null ? _b : "";
170
+ };
171
+ var match = (valueText, query2) => valueText.toLowerCase().startsWith(query2.toLowerCase());
172
+ var wrap = (v, idx) => {
173
+ return v.map((_, index) => v[(Math.max(idx, 0) + index) % v.length]);
174
+ };
175
+ function findByText(v, text, currentId) {
176
+ const index = currentId ? indexOfId(v, currentId) : -1;
177
+ let items = currentId ? wrap(v, index) : v;
178
+ const isSingleKey = text.length === 1;
179
+ if (isSingleKey) {
180
+ items = items.filter((item) => item.id !== currentId);
181
+ }
182
+ return items.find((item) => match(getValueText(item), text));
183
+ }
164
184
  function addPointerlockChangeListener(doc, fn) {
165
185
  return addDomEvent(doc, "pointerlockchange", fn, false);
166
186
  }
@@ -201,42 +221,41 @@ function requestPointerLock(doc, handlers = {}) {
201
221
  exit();
202
222
  };
203
223
  }
224
+ function findByTypeahead(_items, options) {
225
+ const { state: state2, activeId, key, timeout = 350 } = options;
226
+ const search = state2.keysSoFar + key;
227
+ const isRepeated = search.length > 1 && Array.from(search).every((char) => char === search[0]);
228
+ const query2 = isRepeated ? search[0] : search;
229
+ let items = _items.slice();
230
+ const next = findByText(items, query2, activeId);
231
+ function cleanup() {
232
+ clearTimeout(state2.timer);
233
+ state2.timer = -1;
234
+ }
235
+ function update(value) {
236
+ state2.keysSoFar = value;
237
+ cleanup();
238
+ if (value !== "") {
239
+ state2.timer = +setTimeout(() => {
240
+ update("");
241
+ cleanup();
242
+ }, timeout);
243
+ }
244
+ }
245
+ update(search);
246
+ return next;
247
+ }
248
+ findByTypeahead.defaultOptions = {
249
+ keysSoFar: "",
250
+ timer: -1
251
+ };
204
252
 
205
253
  // ../../utilities/number/dist/index.mjs
206
- var __defProp2 = Object.defineProperty;
207
- var __defProps2 = Object.defineProperties;
208
- var __getOwnPropDescs2 = Object.getOwnPropertyDescriptors;
209
- var __getOwnPropSymbols2 = Object.getOwnPropertySymbols;
210
- var __hasOwnProp2 = Object.prototype.hasOwnProperty;
211
- var __propIsEnum2 = Object.prototype.propertyIsEnumerable;
212
254
  var __pow = Math.pow;
213
- var __defNormalProp2 = (obj, key, value) => key in obj ? __defProp2(obj, key, { enumerable: true, configurable: true, writable: true, value }) : obj[key] = value;
214
- var __spreadValues2 = (a, b) => {
215
- for (var prop in b || (b = {}))
216
- if (__hasOwnProp2.call(b, prop))
217
- __defNormalProp2(a, prop, b[prop]);
218
- if (__getOwnPropSymbols2)
219
- for (var prop of __getOwnPropSymbols2(b)) {
220
- if (__propIsEnum2.call(b, prop))
221
- __defNormalProp2(a, prop, b[prop]);
222
- }
223
- return a;
224
- };
225
- var __spreadProps2 = (a, b) => __defProps2(a, __getOwnPropDescs2(b));
226
- var nf = new Intl.NumberFormat("en-US", { style: "decimal" });
227
- function formatter(n) {
228
- return parseFloat(nf.format(n));
229
- }
230
- function wrap(num, max) {
255
+ function wrap2(num, max) {
231
256
  return (num % max + max) % max;
232
257
  }
233
- function round(v, t2) {
234
- let num = valueOf(v);
235
- const p = __pow(10, t2 != null ? t2 : 10);
236
- num = Math.round(num * p) / p;
237
- return t2 ? num.toFixed(t2) : v.toString();
238
- }
239
- function roundToPx(num) {
258
+ function roundToDevicePixel(num) {
240
259
  if (typeof window === "undefined")
241
260
  return Math.round(num);
242
261
  const dp = window.devicePixelRatio;
@@ -245,28 +264,31 @@ function roundToPx(num) {
245
264
  function clamp(v, o) {
246
265
  return Math.min(Math.max(valueOf(v), o.min), o.max);
247
266
  }
248
- function countDecimals(v) {
249
- var _a, _b;
250
- return (_b = (_a = nf.formatToParts(v).find((p) => p.type === "fraction")) == null ? void 0 : _a.value.length) != null ? _b : 0;
267
+ function countDecimals(value) {
268
+ if (!Number.isFinite(value))
269
+ return 0;
270
+ let e = 1, p = 0;
271
+ while (Math.round(value * e) / e !== value) {
272
+ e *= 10;
273
+ p += 1;
274
+ }
275
+ return p;
251
276
  }
252
- var increment = (v, s) => formatter(valueOf(v) + s);
253
- var decrement = (v, s) => formatter(valueOf(v) - s);
254
- var multiply = (v, s) => formatter(valueOf(v) * s);
277
+ var increment = (v, s) => decimalOperation(valueOf(v), "+", s);
278
+ var decrement = (v, s) => decimalOperation(valueOf(v), "-", s);
255
279
  function valueOf(v) {
256
280
  if (typeof v === "number")
257
281
  return v;
258
282
  const num = parseFloat(v.toString().replace(/[^\w.-]+/g, ""));
259
283
  return !Number.isNaN(num) ? num : 0;
260
284
  }
261
- function getMaxPrecision(o) {
262
- var _a;
263
- const stepPrecision = countDecimals(o.step);
264
- const val = valueOf(o.value);
265
- const valuePrecision = Number.isNaN(val) ? stepPrecision : Math.max(countDecimals(val), stepPrecision);
266
- return Math.max(valuePrecision, (_a = o.precision) != null ? _a : 0);
267
- }
268
- function roundToPrecision(v, o) {
269
- return round(v, getMaxPrecision(__spreadProps2(__spreadValues2({}, o), { value: v })));
285
+ function formatDecimal(v, o) {
286
+ return new Intl.NumberFormat("en-US", {
287
+ useGrouping: false,
288
+ style: "decimal",
289
+ minimumFractionDigits: o.minFractionDigits,
290
+ maximumFractionDigits: o.maxFractionDigits
291
+ }).format(valueOf(v));
270
292
  }
271
293
  function isAtMax(v, o) {
272
294
  const val = valueOf(v);
@@ -280,6 +302,18 @@ function isWithinRange(v, o) {
280
302
  const val = valueOf(v);
281
303
  return val >= o.min && val <= o.max;
282
304
  }
305
+ function decimalOperation(a, op, b) {
306
+ let result = op === "+" ? a + b : a - b;
307
+ if (a % 1 !== 0 || b % 1 !== 0) {
308
+ const multiplier = __pow(10, Math.max(countDecimals(a), countDecimals(b)));
309
+ a = Math.round(a * multiplier);
310
+ b = Math.round(b * multiplier);
311
+ result = op === "+" ? a + b : a - b;
312
+ result /= multiplier;
313
+ }
314
+ return result;
315
+ }
316
+ var nf = new Intl.NumberFormat("en-US", { style: "decimal", maximumFractionDigits: 20 });
283
317
 
284
318
  // ../../utilities/rect/dist/index.mjs
285
319
  var isArray = (v) => Array.isArray(v);
@@ -297,6 +331,19 @@ function createNormalizer(fn) {
297
331
  }
298
332
  var normalizeProp = createNormalizer((v) => v);
299
333
 
334
+ // ../../utilities/core/dist/index.mjs
335
+ var pipe2 = (...fns) => (v) => fns.reduce((a, b) => b(a), v);
336
+ var platform = (v) => isDom() && v.test(navigator.platform);
337
+ var ua = (v) => isDom() && v.test(navigator.userAgent);
338
+ var isDom = () => !!(typeof window !== "undefined");
339
+ var isMac = () => platform(/^Mac/);
340
+ var isIPhone = () => platform(/^iPhone/);
341
+ var isIPad = () => platform(/^iPad/) || isMac() && navigator.maxTouchPoints > 1;
342
+ var isIos = () => isIPhone() || isIPad();
343
+ var isSafari = () => ua(/^((?!chrome|android).)*safari/i);
344
+ var supportsPointerEvent = () => isDom() && window.onpointerdown === null;
345
+ var isModifiedEvent = (v) => v.ctrlKey || v.altKey || v.metaKey;
346
+
300
347
  // src/number-input.dom.ts
301
348
  var dom = {
302
349
  getDoc: (ctx) => {
@@ -307,6 +354,10 @@ var dom = {
307
354
  var _a;
308
355
  return (_a = dom.getDoc(ctx).defaultView) != null ? _a : window;
309
356
  },
357
+ getRootNode: (ctx) => {
358
+ var _a;
359
+ return (_a = ctx.rootNode) != null ? _a : dom.getDoc(ctx);
360
+ },
310
361
  getRootId: (ctx) => {
311
362
  var _a, _b;
312
363
  return (_b = (_a = ctx.ids) == null ? void 0 : _a.root) != null ? _b : `number-input:${ctx.uid}`;
@@ -332,14 +383,14 @@ var dom = {
332
383
  var _a, _b;
333
384
  return (_b = (_a = ctx.ids) == null ? void 0 : _a.label) != null ? _b : `number-input:${ctx.uid}:label`;
334
385
  },
335
- getInputEl: (ctx) => dom.getDoc(ctx).getElementById(dom.getInputId(ctx)),
336
- getIncButtonEl: (ctx) => dom.getDoc(ctx).getElementById(dom.getIncButtonId(ctx)),
337
- getDecButtonEl: (ctx) => dom.getDoc(ctx).getElementById(dom.getDecButtonId(ctx)),
338
- getScrubberEl: (ctx) => dom.getDoc(ctx).getElementById(dom.getScrubberId(ctx)),
386
+ getInputEl: (ctx) => dom.getRootNode(ctx).getElementById(dom.getInputId(ctx)),
387
+ getIncButtonEl: (ctx) => dom.getRootNode(ctx).getElementById(dom.getIncButtonId(ctx)),
388
+ getDecButtonEl: (ctx) => dom.getRootNode(ctx).getElementById(dom.getDecButtonId(ctx)),
389
+ getScrubberEl: (ctx) => dom.getRootNode(ctx).getElementById(dom.getScrubberId(ctx)),
339
390
  getCursorEl: (ctx) => dom.getDoc(ctx).getElementById(dom.getCursorId(ctx)),
340
391
  getMousementValue(ctx, event) {
341
- const x = roundToPx(event.movementX);
342
- const y = roundToPx(event.movementY);
392
+ const x = roundToDevicePixel(event.movementX);
393
+ const y = roundToDevicePixel(event.movementY);
343
394
  let hint = x > 0 ? "increment" : x < 0 ? "decrement" : null;
344
395
  if (ctx.isRtl && hint === "increment")
345
396
  hint = "decrement";
@@ -351,8 +402,8 @@ var dom = {
351
402
  };
352
403
  const win = dom.getWin(ctx);
353
404
  const width = win.innerWidth;
354
- const half = roundToPx(7.5);
355
- point.x = wrap(point.x + half, width) - half;
405
+ const half = roundToDevicePixel(7.5);
406
+ point.x = wrap2(point.x + half, width) - half;
356
407
  return { hint, point };
357
408
  },
358
409
  createVirtualCursor(ctx) {
@@ -388,9 +439,9 @@ var utils = {
388
439
  var _a, _b;
389
440
  if (event.key == null)
390
441
  return true;
391
- const isModifierKey = event.ctrlKey || event.altKey || event.metaKey;
392
- const isSingleCharacterKey = event.key.length === 1;
393
- if (isModifierKey || !isSingleCharacterKey)
442
+ const isModifier = isModifiedEvent(event);
443
+ const isSingleKey = event.key.length === 1;
444
+ if (isModifier || !isSingleKey)
394
445
  return true;
395
446
  return (_b = (_a = ctx.validateCharacter) == null ? void 0 : _a.call(ctx, event.key)) != null ? _b : utils.isFloatingPoint(event.key);
396
447
  },
@@ -400,18 +451,15 @@ var utils = {
400
451
  return value.split("").filter((_a = ctx.validateCharacter) != null ? _a : utils.isFloatingPoint).join("");
401
452
  },
402
453
  increment: (ctx, step) => {
403
- let value = increment(ctx.value, step != null ? step : ctx.step);
404
- value = clamp(value, ctx);
405
- return roundToPrecision(value, ctx);
454
+ const value = increment(ctx.value, step != null ? step : ctx.step);
455
+ return formatDecimal(clamp(value, ctx), ctx);
406
456
  },
407
457
  decrement: (ctx, step) => {
408
- let value = decrement(ctx.value, step != null ? step : ctx.step);
409
- value = clamp(value, ctx);
410
- return roundToPrecision(value, ctx);
458
+ const value = decrement(ctx.value, step != null ? step : ctx.step);
459
+ return formatDecimal(clamp(value, ctx), ctx);
411
460
  },
412
461
  clamp: (ctx) => {
413
- let value = clamp(ctx.value, ctx);
414
- return roundToPrecision(value, ctx);
462
+ return formatDecimal(clamp(ctx.value, ctx), ctx);
415
463
  },
416
464
  parse: (ctx, value) => {
417
465
  var _a, _b;
@@ -423,7 +471,7 @@ var utils = {
423
471
  return (_b = (_a = ctx.format) == null ? void 0 : _a.call(ctx, _val)) != null ? _b : _val;
424
472
  },
425
473
  round: (ctx) => {
426
- return roundToPrecision(ctx.value, ctx);
474
+ return formatDecimal(ctx.value, ctx);
427
475
  }
428
476
  };
429
477
 
@@ -444,7 +492,7 @@ function connect(state, send, normalize = normalizeProp) {
444
492
  send({ type: "SET_VALUE", value: value.toString() });
445
493
  },
446
494
  clearValue() {
447
- send({ type: "SET_VALUE", value: "" });
495
+ send("CLEAR_VALUE");
448
496
  },
449
497
  increment() {
450
498
  send("INCREMENT");
@@ -459,10 +507,8 @@ function connect(state, send, normalize = normalizeProp) {
459
507
  send({ type: "SET_VALUE", value: state.context.min });
460
508
  },
461
509
  focus() {
462
- nextTick(() => {
463
- var _a;
464
- (_a = dom.getInputEl(state.context)) == null ? void 0 : _a.focus();
465
- });
510
+ var _a;
511
+ (_a = dom.getInputEl(state.context)) == null ? void 0 : _a.focus();
466
512
  },
467
513
  rootProps: normalize.element({
468
514
  id: dom.getRootId(state.context),
@@ -476,6 +522,14 @@ function connect(state, send, normalize = normalizeProp) {
476
522
  id: dom.getLabelId(state.context),
477
523
  htmlFor: dom.getInputId(state.context)
478
524
  }),
525
+ groupProps: normalize.element({
526
+ "data-part": "group",
527
+ role: "group",
528
+ "aria-disabled": isDisabled,
529
+ "data-disabled": dataAttr(isDisabled),
530
+ "data-invalid": dataAttr(isInvalid),
531
+ "aria-invalid": ariaAttr(state.context.invalid)
532
+ }),
479
533
  inputProps: normalize.input({
480
534
  "data-part": "input",
481
535
  name: state.context.name,
@@ -493,7 +547,7 @@ function connect(state, send, normalize = normalizeProp) {
493
547
  autoCorrect: "off",
494
548
  spellCheck: "false",
495
549
  type: "text",
496
- "aria-roledescription": "number field",
550
+ "aria-roledescription": !isIos() ? "number field" : void 0,
497
551
  "aria-valuemin": state.context.min,
498
552
  "aria-valuemax": state.context.max,
499
553
  "aria-valuenow": isNaN(state.context.valueAsNumber) ? void 0 : state.context.valueAsNumber,
@@ -517,7 +571,7 @@ function connect(state, send, normalize = normalizeProp) {
517
571
  if (!utils.isValidNumericEvent(state.context, event)) {
518
572
  event.preventDefault();
519
573
  }
520
- const step = multiply(getEventStep(event), state.context.step);
574
+ const step = getEventStep(event) * state.context.step;
521
575
  const keyMap = {
522
576
  ArrowUp() {
523
577
  send({ type: "ARROW_UP", step });
@@ -596,8 +650,8 @@ function connect(state, send, normalize = normalizeProp) {
596
650
  const evt = getNativeEvent(event);
597
651
  event.preventDefault();
598
652
  const point = getEventPoint(evt);
599
- point.x = point.x - roundToPx(7.5);
600
- point.y = point.y - roundToPx(7.5);
653
+ point.x = point.x - roundToDevicePixel(7.5);
654
+ point.y = point.y - roundToDevicePixel(7.5);
601
655
  send({ type: "PRESS_DOWN_SCRUBBER", point });
602
656
  },
603
657
  style: {
@@ -609,15 +663,6 @@ function connect(state, send, normalize = normalizeProp) {
609
663
 
610
664
  // src/number-input.machine.ts
611
665
  var import_core = require("@zag-js/core");
612
-
613
- // ../../utilities/core/dist/index.mjs
614
- var pipe2 = (...fns) => (v) => fns.reduce((a, b) => b(a), v);
615
- var ua = (v) => isDom() && v.test(navigator.userAgent);
616
- var isDom = () => !!(typeof window !== "undefined");
617
- var isSafari = () => ua(/^((?!chrome|android).)*safari/i);
618
- var supportsPointerEvent = () => isDom() && window.onpointerdown === null;
619
-
620
- // src/number-input.machine.ts
621
666
  var { not, and } = import_core.guards;
622
667
  function machine(ctx = {}) {
623
668
  return (0, import_core.createMachine)({
@@ -636,8 +681,6 @@ function machine(ctx = {}) {
636
681
  step: 1,
637
682
  min: Number.MIN_SAFE_INTEGER,
638
683
  max: Number.MAX_SAFE_INTEGER,
639
- precision: 0,
640
- inputSelection: null,
641
684
  scrubberCursorPoint: null,
642
685
  invalid: false
643
686
  }, ctx), {
@@ -667,20 +710,26 @@ function machine(ctx = {}) {
667
710
  value: ["invokeOnChange"],
668
711
  isOutOfRange: ["invokeOnInvalid"]
669
712
  },
670
- entry: ["syncInputValue"],
671
713
  on: {
672
714
  SET_VALUE: {
673
715
  actions: ["setValue", "setHintToSet"]
674
716
  },
675
- INCREMENT: { actions: ["increment"] },
676
- DECREMENT: { actions: ["decrement"] }
717
+ CLEAR_VALUE: {
718
+ actions: ["clearValue"]
719
+ },
720
+ INCREMENT: {
721
+ actions: ["increment"]
722
+ },
723
+ DECREMENT: {
724
+ actions: ["decrement"]
725
+ }
677
726
  },
678
727
  states: {
679
728
  unknown: {
680
729
  on: {
681
730
  SETUP: {
682
731
  target: "idle",
683
- actions: "setupDocument"
732
+ actions: ["setupDocument", "syncInputValue"]
684
733
  }
685
734
  }
686
735
  },
@@ -722,7 +771,7 @@ function machine(ctx = {}) {
722
771
  actions: "setToMax"
723
772
  },
724
773
  CHANGE: {
725
- actions: ["setValue", "setSelectionRange", "setHint"]
774
+ actions: ["setValue", "setHint"]
726
775
  },
727
776
  BLUR: [
728
777
  {
@@ -736,6 +785,7 @@ function machine(ctx = {}) {
736
785
  actions: ["clampValue", "clearHint"]
737
786
  },
738
787
  {
788
+ target: "idle",
739
789
  actions: ["roundValue"]
740
790
  }
741
791
  ]
@@ -756,7 +806,7 @@ function machine(ctx = {}) {
756
806
  on: {
757
807
  PRESS_UP: {
758
808
  target: "focused",
759
- actions: ["clearHint", "restoreSelection"]
809
+ actions: "clearHint"
760
810
  }
761
811
  }
762
812
  },
@@ -778,7 +828,7 @@ function machine(ctx = {}) {
778
828
  on: {
779
829
  PRESS_UP: {
780
830
  target: "focused",
781
- actions: ["clearHint", "restoreSelection"]
831
+ actions: "clearHint"
782
832
  }
783
833
  }
784
834
  },
@@ -838,26 +888,23 @@ function machine(ctx = {}) {
838
888
  send("PRESS_UP");
839
889
  });
840
890
  },
841
- attachWheelListener(ctx2) {
842
- const cleanups = [];
843
- cleanups.push(nextTick(() => {
844
- const input = dom.getInputEl(ctx2);
845
- if (!input)
891
+ attachWheelListener(ctx2, _evt, { send }) {
892
+ const input = dom.getInputEl(ctx2);
893
+ if (!input)
894
+ return;
895
+ function onWheel(event) {
896
+ const isInputFocused = dom.getDoc(ctx2).activeElement === input;
897
+ if (!ctx2.allowMouseWheel || !isInputFocused)
846
898
  return;
847
- function onWheel(event) {
848
- const isInputFocused = dom.getDoc(ctx2).activeElement === input;
849
- if (!ctx2.allowMouseWheel || !isInputFocused)
850
- return;
851
- event.preventDefault();
852
- const dir = Math.sign(event.deltaY) * -1;
853
- if (dir === 1)
854
- ctx2.value = utils.increment(ctx2);
855
- else if (dir === -1)
856
- ctx2.value = utils.decrement(ctx2);
899
+ event.preventDefault();
900
+ const dir = Math.sign(event.deltaY) * -1;
901
+ if (dir === 1) {
902
+ send("INCREMENT");
903
+ } else if (dir === -1) {
904
+ send("DECREMENT");
857
905
  }
858
- cleanups.push(addDomEvent(input, "wheel", onWheel, { passive: false }));
859
- }));
860
- return () => cleanups.forEach((c) => c());
906
+ }
907
+ return addDomEvent(input, "wheel", onWheel, { passive: false });
861
908
  },
862
909
  activatePointerLock(ctx2) {
863
910
  if (isSafari() || !supportsPointerEvent())
@@ -872,7 +919,11 @@ function machine(ctx = {}) {
872
919
  const value = dom.getMousementValue(ctx2, event);
873
920
  if (!value.hint)
874
921
  return;
875
- send({ type: "POINTER_MOVE_SCRUBBER", hint: value.hint, point: value.point });
922
+ send({
923
+ type: "POINTER_MOVE_SCRUBBER",
924
+ hint: value.hint,
925
+ point: value.point
926
+ });
876
927
  }
877
928
  function onMouseup() {
878
929
  send("POINTER_UP_SCRUBBER");
@@ -884,13 +935,15 @@ function machine(ctx = {}) {
884
935
  setupDocument: (ctx2, evt) => {
885
936
  if (evt.doc)
886
937
  ctx2.doc = (0, import_core.ref)(evt.doc);
938
+ if (evt.root)
939
+ ctx2.rootNode = (0, import_core.ref)(evt.root);
887
940
  ctx2.uid = evt.id;
888
941
  },
889
942
  focusInput(ctx2) {
890
943
  if (!ctx2.focusInputOnChange)
891
944
  return;
892
945
  const input = dom.getInputEl(ctx2);
893
- nextTick(() => input == null ? void 0 : input.focus());
946
+ raf(() => input == null ? void 0 : input.focus());
894
947
  },
895
948
  increment(ctx2, evt) {
896
949
  ctx2.value = utils.increment(ctx2, evt.step);
@@ -902,7 +955,9 @@ function machine(ctx = {}) {
902
955
  ctx2.value = utils.clamp(ctx2);
903
956
  },
904
957
  roundValue(ctx2) {
905
- ctx2.value = utils.round(ctx2);
958
+ if (ctx2.value !== "") {
959
+ ctx2.value = utils.round(ctx2);
960
+ }
906
961
  },
907
962
  setValue(ctx2, evt) {
908
963
  var _a, _b;
@@ -927,30 +982,23 @@ function machine(ctx = {}) {
927
982
  setHintToSet(ctx2) {
928
983
  ctx2.hint = "set";
929
984
  },
930
- setSelectionRange(ctx2, evt) {
931
- ctx2.inputSelection = {
932
- start: evt.target.selectionStart,
933
- end: evt.target.selectionEnd
934
- };
935
- },
936
- restoreSelection(ctx2) {
937
- var _a, _b, _c;
938
- const input = dom.getInputEl(ctx2);
939
- if (!input || !ctx2.inputSelection)
940
- return;
941
- input.selectionStart = (_b = ctx2.inputSelection.start) != null ? _b : (_a = input.value) == null ? void 0 : _a.length;
942
- input.selectionEnd = (_c = ctx2.inputSelection.end) != null ? _c : input.selectionStart;
943
- },
944
985
  invokeOnChange(ctx2) {
945
986
  var _a;
946
- (_a = ctx2.onChange) == null ? void 0 : _a.call(ctx2, { value: ctx2.value, valueAsNumber: ctx2.valueAsNumber });
987
+ (_a = ctx2.onChange) == null ? void 0 : _a.call(ctx2, {
988
+ value: ctx2.value,
989
+ valueAsNumber: ctx2.valueAsNumber
990
+ });
947
991
  },
948
992
  invokeOnInvalid(ctx2) {
949
993
  var _a;
950
994
  if (!ctx2.isOutOfRange)
951
995
  return;
952
996
  const reason = ctx2.valueAsNumber > ctx2.max ? "rangeOverflow" : "rangeUnderflow";
953
- (_a = ctx2.onInvalid) == null ? void 0 : _a.call(ctx2, { reason, value: ctx2.formattedValue, valueAsNumber: ctx2.valueAsNumber });
997
+ (_a = ctx2.onInvalid) == null ? void 0 : _a.call(ctx2, {
998
+ reason,
999
+ value: ctx2.formattedValue,
1000
+ valueAsNumber: ctx2.valueAsNumber
1001
+ });
954
1002
  },
955
1003
  syncInputValue(ctx2) {
956
1004
  const input = dom.getInputEl(ctx2);
@@ -969,7 +1017,8 @@ function machine(ctx = {}) {
969
1017
  const cursor = dom.getCursorEl(ctx2);
970
1018
  if (!cursor || !ctx2.scrubberCursorPoint)
971
1019
  return;
972
- cursor.style.transform = `translate3d(${ctx2.scrubberCursorPoint.x}px, ${ctx2.scrubberCursorPoint.y}px, 0px)`;
1020
+ const { x, y } = ctx2.scrubberCursorPoint;
1021
+ cursor.style.transform = `translate3d(${x}px, ${y}px, 0px)`;
973
1022
  },
974
1023
  addCustomCursor(ctx2) {
975
1024
  if (isSafari() || !supportsPointerEvent())
@@ -977,11 +1026,10 @@ function machine(ctx = {}) {
977
1026
  dom.createVirtualCursor(ctx2);
978
1027
  },
979
1028
  removeCustomCursor(ctx2) {
1029
+ var _a;
980
1030
  if (isSafari() || !supportsPointerEvent())
981
1031
  return;
982
- const doc = dom.getDoc(ctx2);
983
- const el = doc.getElementById(dom.getCursorId(ctx2));
984
- el == null ? void 0 : el.remove();
1032
+ (_a = dom.getCursorEl(ctx2)) == null ? void 0 : _a.remove();
985
1033
  },
986
1034
  disableTextSelection(ctx2) {
987
1035
  const doc = dom.getDoc(ctx2);