@zag-js/pin-input 1.41.1 → 1.41.2

package/dist/pin-input.connect.js

@@ -132,7 +132,7 @@ function connect(service, normalize) {
         tabIndex: index === tabbableIndex ? 0 : -1,
         "data-disabled": (0, import_dom_query.dataAttr)(disabled),
         "data-complete": (0, import_dom_query.dataAttr)(complete),
-        "data-filled": (0, import_dom_query.dataAttr)(context.get("value")[index] !== ""),
+        "data-filled": (0, import_dom_query.dataAttr)(computed("_value")[index] !== ""),
         id: dom.getInputId(scope, index.toString()),
         "data-index": index,
         "data-ownedby": dom.getRootId(scope),
@@ -142,7 +142,7 @@ function connect(service, normalize) {
         "data-invalid": (0, import_dom_query.dataAttr)(invalid),
         enterKeyHint: index === valueLength - 1 ? "done" : "next",
         type: prop("mask") ? "password" : inputType,
-        defaultValue: context.get("value")[index] || "",
+        defaultValue: computed("_value")[index] || "",
         readOnly,
         autoCapitalize: "none",
         autoComplete: prop("otp") ? "one-time-code" : "off",

package/dist/pin-input.connect.mjs

@@ -108,7 +108,7 @@ function connect(service, normalize) {
         tabIndex: index === tabbableIndex ? 0 : -1,
         "data-disabled": dataAttr(disabled),
         "data-complete": dataAttr(complete),
-        "data-filled": dataAttr(context.get("value")[index] !== ""),
+        "data-filled": dataAttr(computed("_value")[index] !== ""),
         id: dom.getInputId(scope, index.toString()),
         "data-index": index,
         "data-ownedby": dom.getRootId(scope),
@@ -118,7 +118,7 @@ function connect(service, normalize) {
         "data-invalid": dataAttr(invalid),
         enterKeyHint: index === valueLength - 1 ? "done" : "next",
         type: prop("mask") ? "password" : inputType,
-        defaultValue: context.get("value")[index] || "",
+        defaultValue: computed("_value")[index] || "",
         readOnly,
         autoCapitalize: "none",
         autoComplete: prop("otp") ? "one-time-code" : "off",

package/dist/pin-input.machine.js

@@ -58,8 +58,8 @@ var machine = createMachine({
   context({ prop, bindable }) {
     return {
       value: bindable(() => ({
-        value: prop("value"),
-        defaultValue: prop("defaultValue"),
+        value: prop("value") ? fill(prop("value"), prop("count")) : void 0,
+        defaultValue: fill(prop("defaultValue") ?? [], prop("count")),
         isEqual: import_utils.isEqual,
         onChange(value) {
           prop("onValueChange")?.({ value, valueAsString: value.join("") });
@@ -178,7 +178,7 @@ var machine = createMachine({
   implementations: {
     guards: {
       autoFocus: ({ prop }) => !!prop("autoFocus"),
-      hasValue: ({ context }) => context.get("value")[context.get("focusedIndex")] !== "",
+      hasValue: ({ context, computed }) => computed("_value")[context.get("focusedIndex")] !== "",
       isValueComplete: ({ computed }) => computed("isValueComplete"),
       hasIndex: ({ event }) => event.index !== void 0
     },
@@ -340,7 +340,8 @@ function getNextValue(current, next) {
   return nextValue ?? "";
 }
 function fill(value, count) {
-  return Array.from({ length: count }).fill("").map((v, i) => value[i] || v);
+  const length = count || value.length;
+  return Array.from({ length }).fill("").map((v, i) => value[i] || v);
 }
 // Annotate the CommonJS export names for ESM import in node:
 0 && (module.exports = {

package/dist/pin-input.machine.mjs

@@ -24,8 +24,8 @@ var machine = createMachine({
   context({ prop, bindable }) {
     return {
       value: bindable(() => ({
-        value: prop("value"),
-        defaultValue: prop("defaultValue"),
+        value: prop("value") ? fill(prop("value"), prop("count")) : void 0,
+        defaultValue: fill(prop("defaultValue") ?? [], prop("count")),
         isEqual,
         onChange(value) {
           prop("onValueChange")?.({ value, valueAsString: value.join("") });
@@ -144,7 +144,7 @@ var machine = createMachine({
   implementations: {
     guards: {
       autoFocus: ({ prop }) => !!prop("autoFocus"),
-      hasValue: ({ context }) => context.get("value")[context.get("focusedIndex")] !== "",
+      hasValue: ({ context, computed }) => computed("_value")[context.get("focusedIndex")] !== "",
       isValueComplete: ({ computed }) => computed("isValueComplete"),
       hasIndex: ({ event }) => event.index !== void 0
     },
@@ -306,7 +306,8 @@ function getNextValue(current, next) {
   return nextValue ?? "";
 }
 function fill(value, count) {
-  return Array.from({ length: count }).fill("").map((v, i) => value[i] || v);
+  const length = count || value.length;
+  return Array.from({ length }).fill("").map((v, i) => value[i] || v);
 }
 export {
   machine

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@zag-js/pin-input",
-  "version": "1.41.1",
+  "version": "1.41.2",
   "description": "Core logic for the pin-input widget implemented as a state machine",
   "keywords": [
     "js",
@@ -26,11 +26,11 @@
     "url": "https://github.com/chakra-ui/zag/issues"
   },
   "dependencies": {
-    "@zag-js/anatomy": "1.41.1",
-    "@zag-js/dom-query": "1.41.1",
-    "@zag-js/utils": "1.41.1",
-    "@zag-js/core": "1.41.1",
-    "@zag-js/types": "1.41.1"
+    "@zag-js/anatomy": "1.41.2",
+    "@zag-js/dom-query": "1.41.2",
+    "@zag-js/utils": "1.41.2",
+    "@zag-js/core": "1.41.2",
+    "@zag-js/types": "1.41.2"
   },
   "devDependencies": {
     "clean-package": "2.2.0"