@zag-js/number-input 1.21.8 → 1.22.0

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
@@ -112,6 +112,7 @@ function connect(service, normalize) {
112
112
  const focused = state.hasTag("focus");
113
113
  const disabled = computed("isDisabled");
114
114
  const readOnly = prop("readOnly");
115
+ const scrubbing = state.matches("scrubbing");
115
116
  const empty = computed("isValueEmpty");
116
117
  const invalid = computed("isOutOfRange") || !!prop("invalid");
117
118
  const isIncrementDisabled = disabled || !computed("canIncrement") || readOnly;
@@ -151,7 +152,8 @@ function connect(service, normalize) {
151
152
  dir: prop("dir"),
152
153
  "data-disabled": domQuery.dataAttr(disabled),
153
154
  "data-focus": domQuery.dataAttr(focused),
154
- "data-invalid": domQuery.dataAttr(invalid)
155
+ "data-invalid": domQuery.dataAttr(invalid),
156
+ "data-scrubbing": domQuery.dataAttr(scrubbing)
155
157
  });
156
158
  },
157
159
  getLabelProps() {
@@ -161,6 +163,7 @@ function connect(service, normalize) {
161
163
  "data-disabled": domQuery.dataAttr(disabled),
162
164
  "data-focus": domQuery.dataAttr(focused),
163
165
  "data-invalid": domQuery.dataAttr(invalid),
166
+ "data-scrubbing": domQuery.dataAttr(scrubbing),
164
167
  id: getLabelId(scope),
165
168
  htmlFor: getInputId(scope)
166
169
  });
@@ -174,6 +177,7 @@ function connect(service, normalize) {
174
177
  "data-focus": domQuery.dataAttr(focused),
175
178
  "data-disabled": domQuery.dataAttr(disabled),
176
179
  "data-invalid": domQuery.dataAttr(invalid),
180
+ "data-scrubbing": domQuery.dataAttr(scrubbing),
177
181
  "aria-invalid": domQuery.ariaAttr(invalid)
178
182
  });
179
183
  },
@@ -183,7 +187,8 @@ function connect(service, normalize) {
183
187
  dir: prop("dir"),
184
188
  "data-disabled": domQuery.dataAttr(disabled),
185
189
  "data-invalid": domQuery.dataAttr(invalid),
186
- "data-focus": domQuery.dataAttr(focused)
190
+ "data-focus": domQuery.dataAttr(focused),
191
+ "data-scrubbing": domQuery.dataAttr(scrubbing)
187
192
  });
188
193
  },
189
194
  getInputProps() {
@@ -195,7 +200,7 @@ function connect(service, normalize) {
195
200
  id: getInputId(scope),
196
201
  role: "spinbutton",
197
202
  defaultValue: computed("formattedValue"),
198
- pattern: prop("pattern"),
203
+ pattern: prop("formatOptions") ? void 0 : prop("pattern"),
199
204
  inputMode: prop("inputMode"),
200
205
  "aria-invalid": domQuery.ariaAttr(invalid),
201
206
  "data-invalid": domQuery.dataAttr(invalid),
@@ -212,6 +217,7 @@ function connect(service, normalize) {
212
217
  "aria-valuemax": prop("max"),
213
218
  "aria-valuenow": Number.isNaN(computed("valueAsNumber")) ? void 0 : computed("valueAsNumber"),
214
219
  "aria-valuetext": computed("valueText"),
220
+ "data-scrubbing": domQuery.dataAttr(scrubbing),
215
221
  onFocus() {
216
222
  send({ type: "INPUT.FOCUS" });
217
223
  },
@@ -276,6 +282,7 @@ function connect(service, normalize) {
276
282
  type: "button",
277
283
  tabIndex: -1,
278
284
  "aria-controls": getInputId(scope),
285
+ "data-scrubbing": domQuery.dataAttr(scrubbing),
279
286
  onPointerDown(event) {
280
287
  if (isDecrementDisabled) return;
281
288
  if (!domQuery.isLeftClick(event)) return;
@@ -307,6 +314,7 @@ function connect(service, normalize) {
307
314
  type: "button",
308
315
  tabIndex: -1,
309
316
  "aria-controls": getInputId(scope),
317
+ "data-scrubbing": domQuery.dataAttr(scrubbing),
310
318
  onPointerDown(event) {
311
319
  if (isIncrementDisabled || !domQuery.isLeftClick(event)) return;
312
320
  send({ type: "TRIGGER.PRESS_DOWN", hint: "increment", pointerType: event.pointerType });
@@ -332,6 +340,7 @@ function connect(service, normalize) {
332
340
  "data-disabled": domQuery.dataAttr(disabled),
333
341
  id: getScrubberId(scope),
334
342
  role: "presentation",
343
+ "data-scrubbing": domQuery.dataAttr(scrubbing),
335
344
  onMouseDown(event) {
336
345
  if (disabled) return;
337
346
  if (!domQuery.isLeftClick(event)) return;
@@ -402,7 +411,8 @@ var createParser = (locale, options = {}) => {
402
411
  var parseValue = (value, params) => {
403
412
  const { prop, computed } = params;
404
413
  if (!prop("formatOptions")) return parseFloat(value);
405
- return computed("parser").parse(String(value));
414
+ if (value === "") return Number.NaN;
415
+ return computed("parser").parse(value);
406
416
  };
407
417
  var formatValue = (value, params) => {
408
418
  const { prop, computed } = params;
package/dist/index.mjs CHANGED
@@ -110,6 +110,7 @@ function connect(service, normalize) {
110
110
  const focused = state.hasTag("focus");
111
111
  const disabled = computed("isDisabled");
112
112
  const readOnly = prop("readOnly");
113
+ const scrubbing = state.matches("scrubbing");
113
114
  const empty = computed("isValueEmpty");
114
115
  const invalid = computed("isOutOfRange") || !!prop("invalid");
115
116
  const isIncrementDisabled = disabled || !computed("canIncrement") || readOnly;
@@ -149,7 +150,8 @@ function connect(service, normalize) {
149
150
  dir: prop("dir"),
150
151
  "data-disabled": dataAttr(disabled),
151
152
  "data-focus": dataAttr(focused),
152
- "data-invalid": dataAttr(invalid)
153
+ "data-invalid": dataAttr(invalid),
154
+ "data-scrubbing": dataAttr(scrubbing)
153
155
  });
154
156
  },
155
157
  getLabelProps() {
@@ -159,6 +161,7 @@ function connect(service, normalize) {
159
161
  "data-disabled": dataAttr(disabled),
160
162
  "data-focus": dataAttr(focused),
161
163
  "data-invalid": dataAttr(invalid),
164
+ "data-scrubbing": dataAttr(scrubbing),
162
165
  id: getLabelId(scope),
163
166
  htmlFor: getInputId(scope)
164
167
  });
@@ -172,6 +175,7 @@ function connect(service, normalize) {
172
175
  "data-focus": dataAttr(focused),
173
176
  "data-disabled": dataAttr(disabled),
174
177
  "data-invalid": dataAttr(invalid),
178
+ "data-scrubbing": dataAttr(scrubbing),
175
179
  "aria-invalid": ariaAttr(invalid)
176
180
  });
177
181
  },
@@ -181,7 +185,8 @@ function connect(service, normalize) {
181
185
  dir: prop("dir"),
182
186
  "data-disabled": dataAttr(disabled),
183
187
  "data-invalid": dataAttr(invalid),
184
- "data-focus": dataAttr(focused)
188
+ "data-focus": dataAttr(focused),
189
+ "data-scrubbing": dataAttr(scrubbing)
185
190
  });
186
191
  },
187
192
  getInputProps() {
@@ -193,7 +198,7 @@ function connect(service, normalize) {
193
198
  id: getInputId(scope),
194
199
  role: "spinbutton",
195
200
  defaultValue: computed("formattedValue"),
196
- pattern: prop("pattern"),
201
+ pattern: prop("formatOptions") ? void 0 : prop("pattern"),
197
202
  inputMode: prop("inputMode"),
198
203
  "aria-invalid": ariaAttr(invalid),
199
204
  "data-invalid": dataAttr(invalid),
@@ -210,6 +215,7 @@ function connect(service, normalize) {
210
215
  "aria-valuemax": prop("max"),
211
216
  "aria-valuenow": Number.isNaN(computed("valueAsNumber")) ? void 0 : computed("valueAsNumber"),
212
217
  "aria-valuetext": computed("valueText"),
218
+ "data-scrubbing": dataAttr(scrubbing),
213
219
  onFocus() {
214
220
  send({ type: "INPUT.FOCUS" });
215
221
  },
@@ -274,6 +280,7 @@ function connect(service, normalize) {
274
280
  type: "button",
275
281
  tabIndex: -1,
276
282
  "aria-controls": getInputId(scope),
283
+ "data-scrubbing": dataAttr(scrubbing),
277
284
  onPointerDown(event) {
278
285
  if (isDecrementDisabled) return;
279
286
  if (!isLeftClick(event)) return;
@@ -305,6 +312,7 @@ function connect(service, normalize) {
305
312
  type: "button",
306
313
  tabIndex: -1,
307
314
  "aria-controls": getInputId(scope),
315
+ "data-scrubbing": dataAttr(scrubbing),
308
316
  onPointerDown(event) {
309
317
  if (isIncrementDisabled || !isLeftClick(event)) return;
310
318
  send({ type: "TRIGGER.PRESS_DOWN", hint: "increment", pointerType: event.pointerType });
@@ -330,6 +338,7 @@ function connect(service, normalize) {
330
338
  "data-disabled": dataAttr(disabled),
331
339
  id: getScrubberId(scope),
332
340
  role: "presentation",
341
+ "data-scrubbing": dataAttr(scrubbing),
333
342
  onMouseDown(event) {
334
343
  if (disabled) return;
335
344
  if (!isLeftClick(event)) return;
@@ -400,7 +409,8 @@ var createParser = (locale, options = {}) => {
400
409
  var parseValue = (value, params) => {
401
410
  const { prop, computed } = params;
402
411
  if (!prop("formatOptions")) return parseFloat(value);
403
- return computed("parser").parse(String(value));
412
+ if (value === "") return Number.NaN;
413
+ return computed("parser").parse(value);
404
414
  };
405
415
  var formatValue = (value, params) => {
406
416
  const { prop, computed } = params;
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@zag-js/number-input",
3
- "version": "1.21.8",
3
+ "version": "1.22.0",
4
4
  "description": "Core logic for the number-input widget implemented as a state machine",
5
5
  "keywords": [
6
6
  "js",
@@ -27,11 +27,11 @@
27
27
  },
28
28
  "dependencies": {
29
29
  "@internationalized/number": "3.6.4",
30
- "@zag-js/anatomy": "1.21.8",
31
- "@zag-js/core": "1.21.8",
32
- "@zag-js/dom-query": "1.21.8",
33
- "@zag-js/types": "1.21.8",
34
- "@zag-js/utils": "1.21.8"
30
+ "@zag-js/anatomy": "1.22.0",
31
+ "@zag-js/core": "1.22.0",
32
+ "@zag-js/dom-query": "1.22.0",
33
+ "@zag-js/types": "1.22.0",
34
+ "@zag-js/utils": "1.22.0"
35
35
  },
36
36
  "devDependencies": {
37
37
  "clean-package": "2.2.0"