@samline/forms 2.3.2 → 2.3.4

package/dist/index.cjs

@@ -557,6 +557,7 @@ var createGetState = (state2, helpers) => () => {
 
 // src/core/dom.ts
 var isFormFieldElement = (value) => value instanceof HTMLInputElement || value instanceof HTMLSelectElement || value instanceof HTMLTextAreaElement;
+var isArraySyntax = (field) => typeof field.name === "string" && field.name.endsWith("[]");
 var resolveFormElement = (target) => {
   if (!target) return null;
   if (target instanceof HTMLFormElement) return target;
@@ -593,6 +594,30 @@ var readFieldValue = (fields) => {
   if (fields.length === 0) return void 0;
   const first = fields[0];
   if (!first) return void 0;
+  if (isArraySyntax(first) && fields.length > 1) {
+    if (first instanceof HTMLSelectElement || first instanceof HTMLTextAreaElement) {
+      return fields.map((f) => f.value);
+    }
+    if (first instanceof HTMLInputElement) {
+      if (first.type === "radio") {
+        const checked = fields.find(
+          (f) => f instanceof HTMLInputElement && f.checked
+        );
+        return checked?.value ?? "";
+      }
+      if (first.type === "checkbox") {
+        return fields.filter(
+          (f) => f instanceof HTMLInputElement && f.checked
+        ).map((f) => f.value);
+      }
+      if (first.type === "file") {
+        return fields.flatMap(
+          (f) => f instanceof HTMLInputElement && f.files ? Array.from(f.files) : []
+        );
+      }
+    }
+    return fields.map((f) => f.value);
+  }
   if (first instanceof HTMLSelectElement || first instanceof HTMLTextAreaElement) {
     return first.value;
   }
@@ -618,7 +643,10 @@ var readFieldValue = (fields) => {
 var writeFieldValue = (fields, value) => {
   const normalizedArray = Array.isArray(value) ? value.map((item) => String(item)) : null;
   const normalizedValue = value === void 0 || value === null ? "" : String(value);
-  for (const field of fields) {
+  const distributeArray = fields.length > 0 && fields[0] !== void 0 && isArraySyntax(fields[0]) && normalizedArray !== null;
+  for (let index = 0; index < fields.length; index++) {
+    const field = fields[index];
+    if (!field) continue;
     if (field instanceof HTMLInputElement) {
       if (field.type === "checkbox") {
         field.checked = normalizedArray ? normalizedArray.includes(field.value) : normalizedValue === field.value;
@@ -632,9 +660,17 @@ var writeFieldValue = (fields, value) => {
         if (Array.isArray(value) && value.length === 0) field.value = "";
         continue;
       }
+      if (distributeArray && normalizedArray) {
+        field.value = normalizedArray[index] ?? "";
+        continue;
+      }
       field.value = normalizedValue;
       continue;
     }
+    if (distributeArray && normalizedArray) {
+      field.value = normalizedArray[index] ?? "";
+      continue;
+    }
     field.value = normalizedValue;
   }
 };
@@ -934,11 +970,13 @@ var createFormController = (target, options = {}) => {
   const getMergedErrors = () => mergeErrors(state2.validationErrors, state2.manualErrors);
   const syncVisualState = (names) => {
     if (!state2.element) return;
-    const targetNames = names ?? getTrackedFieldNames();
+    const sourceNames = names ?? getTrackedFieldNames();
     const errors = getMergedErrors();
-    for (const name of targetNames) {
-      const fields = getFieldsByName(name);
-      const hasError = Boolean(errors[name]?.length);
+    for (const name of sourceNames) {
+      const displayName = resolveDisplayNameForName(state2, name);
+      const canonical = resolveCanonicalForName(state2, name) ?? name;
+      const fields = getFieldsByName(displayName);
+      const hasError = Boolean(errors[canonical]?.length);
       for (const field of fields) {
         applyBooleanAttribute(field, attributes.filled, isFieldFilled(field));
         applyBooleanAttribute(field, attributes.error, hasError);