@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 +14 -4
- package/dist/index.mjs +14 -4
- package/package.json +6 -6
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
|
-
|
|
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
|
-
|
|
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.
|
|
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.
|
|
31
|
-
"@zag-js/core": "1.
|
|
32
|
-
"@zag-js/dom-query": "1.
|
|
33
|
-
"@zag-js/types": "1.
|
|
34
|
-
"@zag-js/utils": "1.
|
|
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"
|