@zag-js/pin-input 0.1.15 → 0.1.17
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.d.ts +2 -2
- package/dist/index.js +4 -4
- package/dist/index.mjs +4 -4
- package/package.json +9 -9
package/dist/index.d.ts
CHANGED
|
@@ -2,7 +2,7 @@ import { RequiredBy, DirectionProperty, CommonProperties, Context, PropTypes, No
|
|
|
2
2
|
import * as _zag_js_core from '@zag-js/core';
|
|
3
3
|
import { StateMachine } from '@zag-js/core';
|
|
4
4
|
|
|
5
|
-
declare type
|
|
5
|
+
declare type IntlTranslations = {
|
|
6
6
|
inputLabel: (index: number, length: number) => string;
|
|
7
7
|
};
|
|
8
8
|
declare type ElementIds = Partial<{
|
|
@@ -84,7 +84,7 @@ declare type PublicContext = DirectionProperty & CommonProperties & {
|
|
|
84
84
|
/**
|
|
85
85
|
* Specifies the localized strings that identifies the accessibility elements and their states
|
|
86
86
|
*/
|
|
87
|
-
|
|
87
|
+
translations: IntlTranslations;
|
|
88
88
|
};
|
|
89
89
|
declare type UserDefinedContext = RequiredBy<PublicContext, "id">;
|
|
90
90
|
declare type ComputedContext = Readonly<{
|
package/dist/index.js
CHANGED
|
@@ -153,7 +153,7 @@ function connect(state, send, normalize) {
|
|
|
153
153
|
const isValueComplete = state.context.isValueComplete;
|
|
154
154
|
const isInvalid = state.context.invalid;
|
|
155
155
|
const focusedIndex = state.context.focusedIndex;
|
|
156
|
-
const
|
|
156
|
+
const translations = state.context.translations;
|
|
157
157
|
function focus() {
|
|
158
158
|
var _a;
|
|
159
159
|
(_a = dom.getFirstInputEl(state.context)) == null ? void 0 : _a.focus();
|
|
@@ -214,7 +214,7 @@ function connect(state, send, normalize) {
|
|
|
214
214
|
"data-complete": dataAttr(isValueComplete),
|
|
215
215
|
id: dom.getInputId(state.context, index.toString()),
|
|
216
216
|
"data-ownedby": dom.getRootId(state.context),
|
|
217
|
-
"aria-label":
|
|
217
|
+
"aria-label": translations.inputLabel(index, state.context.valueLength),
|
|
218
218
|
inputMode: state.context.otp || state.context.type === "numeric" ? "numeric" : "text",
|
|
219
219
|
"aria-invalid": ariaAttr(isInvalid),
|
|
220
220
|
"data-invalid": dataAttr(isInvalid),
|
|
@@ -319,9 +319,9 @@ function machine(ctx) {
|
|
|
319
319
|
otp: false,
|
|
320
320
|
type: "numeric",
|
|
321
321
|
...ctx,
|
|
322
|
-
|
|
322
|
+
translations: {
|
|
323
323
|
inputLabel: (index, length) => `pin code ${index + 1} of ${length}`,
|
|
324
|
-
...ctx.
|
|
324
|
+
...ctx.translations
|
|
325
325
|
}
|
|
326
326
|
},
|
|
327
327
|
computed: {
|
package/dist/index.mjs
CHANGED
|
@@ -126,7 +126,7 @@ function connect(state, send, normalize) {
|
|
|
126
126
|
const isValueComplete = state.context.isValueComplete;
|
|
127
127
|
const isInvalid = state.context.invalid;
|
|
128
128
|
const focusedIndex = state.context.focusedIndex;
|
|
129
|
-
const
|
|
129
|
+
const translations = state.context.translations;
|
|
130
130
|
function focus() {
|
|
131
131
|
var _a;
|
|
132
132
|
(_a = dom.getFirstInputEl(state.context)) == null ? void 0 : _a.focus();
|
|
@@ -187,7 +187,7 @@ function connect(state, send, normalize) {
|
|
|
187
187
|
"data-complete": dataAttr(isValueComplete),
|
|
188
188
|
id: dom.getInputId(state.context, index.toString()),
|
|
189
189
|
"data-ownedby": dom.getRootId(state.context),
|
|
190
|
-
"aria-label":
|
|
190
|
+
"aria-label": translations.inputLabel(index, state.context.valueLength),
|
|
191
191
|
inputMode: state.context.otp || state.context.type === "numeric" ? "numeric" : "text",
|
|
192
192
|
"aria-invalid": ariaAttr(isInvalid),
|
|
193
193
|
"data-invalid": dataAttr(isInvalid),
|
|
@@ -292,9 +292,9 @@ function machine(ctx) {
|
|
|
292
292
|
otp: false,
|
|
293
293
|
type: "numeric",
|
|
294
294
|
...ctx,
|
|
295
|
-
|
|
295
|
+
translations: {
|
|
296
296
|
inputLabel: (index, length) => `pin code ${index + 1} of ${length}`,
|
|
297
|
-
...ctx.
|
|
297
|
+
...ctx.translations
|
|
298
298
|
}
|
|
299
299
|
},
|
|
300
300
|
computed: {
|
package/package.json
CHANGED
|
@@ -1,7 +1,10 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@zag-js/pin-input",
|
|
3
|
-
"version": "0.1.
|
|
3
|
+
"version": "0.1.17",
|
|
4
4
|
"description": "Core logic for the pin-input widget implemented as a state machine",
|
|
5
|
+
"main": "dist/index.js",
|
|
6
|
+
"module": "dist/index.mjs",
|
|
7
|
+
"types": "dist/index.d.ts",
|
|
5
8
|
"keywords": [
|
|
6
9
|
"js",
|
|
7
10
|
"machine",
|
|
@@ -14,9 +17,6 @@
|
|
|
14
17
|
"author": "Segun Adebayo <sage@adebayosegun.com>",
|
|
15
18
|
"homepage": "https://github.com/chakra-ui/zag#readme",
|
|
16
19
|
"license": "MIT",
|
|
17
|
-
"main": "dist/index.js",
|
|
18
|
-
"types": "dist/index.d.ts",
|
|
19
|
-
"module": "dist/index.mjs",
|
|
20
20
|
"repository": "https://github.com/chakra-ui/zag/tree/main/packages/pin-input",
|
|
21
21
|
"sideEffects": false,
|
|
22
22
|
"files": [
|
|
@@ -29,13 +29,13 @@
|
|
|
29
29
|
"url": "https://github.com/chakra-ui/zag/issues"
|
|
30
30
|
},
|
|
31
31
|
"dependencies": {
|
|
32
|
-
"@zag-js/core": "0.1.
|
|
33
|
-
"@zag-js/types": "0.2.
|
|
32
|
+
"@zag-js/core": "0.1.12",
|
|
33
|
+
"@zag-js/types": "0.2.7"
|
|
34
34
|
},
|
|
35
35
|
"devDependencies": {
|
|
36
|
-
"@zag-js/dom-utils": "0.1.
|
|
37
|
-
"@zag-js/form-utils": "0.1.
|
|
38
|
-
"@zag-js/utils": "0.1.
|
|
36
|
+
"@zag-js/dom-utils": "0.1.13",
|
|
37
|
+
"@zag-js/form-utils": "0.1.3",
|
|
38
|
+
"@zag-js/utils": "0.1.6"
|
|
39
39
|
},
|
|
40
40
|
"scripts": {
|
|
41
41
|
"build-fast": "tsup src/index.ts --format=esm,cjs",
|