@conform-to/dom 1.0.1 → 1.0.3

package/README

@@ -8,7 +8,7 @@
  ╚══════╝  ╚═════╝  ╚═╝  ╚══╝ ╚═╝        ╚═════╝  ╚═╝   ╚═╝ ╚═╝   ╚═╝
 
 
-Version 1.0.1 / License MIT / Copyright (c) 2024 Edmund Hung
+Version 1.0.3 / License MIT / Copyright (c) 2024 Edmund Hung
 
 A type-safe form validation library utilizing web fundamentals to progressively enhance HTML Forms with full support for server frameworks like Remix and Next.js.
 

package/form.d.ts

@@ -1,15 +1,15 @@
 import { getFormAction, getFormEncType, getFormMethod } from './dom';
 import { type Intent, type Submission, type SubmissionResult } from './submission';
-export type UnionKeyof<T> = T extends any ? keyof T : never;
-export type UnionKeyType<T, K extends UnionKeyof<T>> = T extends {
-    [k in K]?: any;
-} ? T[K] : undefined;
+type BaseCombine<T, K extends PropertyKey = T extends unknown ? keyof T : never> = T extends unknown ? T & Partial<Record<Exclude<K, keyof T>, never>> : never;
+export type Combine<T> = {
+    [K in keyof BaseCombine<T>]: BaseCombine<T>[K];
+};
 export type DefaultValue<Schema> = Schema extends string | number | boolean | Date | bigint | null | undefined ? Schema | string | null | undefined : Schema extends File ? null | undefined : Schema extends Array<infer Item> ? Array<DefaultValue<Item>> | null | undefined : Schema extends Record<string, any> ? {
-    [Key in UnionKeyof<Schema>]?: DefaultValue<UnionKeyType<Schema, Key>>;
+    [Key in keyof Schema]?: DefaultValue<Schema[Key]>;
 } | null | undefined : string | null | undefined;
-export type FormValue<Schema> = Schema extends string | number | boolean | Date | bigint | null | undefined ? string | undefined : Schema extends File ? File | undefined : Schema extends Array<infer Item> ? string | Array<FormValue<Item>> | undefined : Schema extends Record<string, any> ? {
-    [Key in UnionKeyof<Schema>]?: FormValue<UnionKeyType<Schema, Key>>;
-} | undefined : unknown;
+export type FormValue<Schema> = Schema extends string | number | boolean | Date | bigint | null | undefined ? string | undefined : Schema extends File ? File | undefined : Schema extends File[] ? File | Array<File> | undefined : Schema extends Array<infer Item> ? string | Array<FormValue<Item>> | undefined : Schema extends Record<string, any> ? {
+    [Key in keyof Schema]?: FormValue<Schema[Key]>;
+} | null | undefined : unknown;
 declare const error: unique symbol;
 declare const field: unique symbol;
 declare const form: unique symbol;
@@ -90,6 +90,10 @@ export type FormOptions<Schema, FormError = string[], FormValue = Schema> = {
         submitter: HTMLInputElement | HTMLButtonElement | null;
         formData: FormData;
     }) => Submission<Schema, FormError, FormValue>;
+    /**
+     * To schedule when an intent should be dispatched.
+     */
+    onSchedule?: (callback: () => void) => void;
 };
 export type SubscriptionSubject = {
     [key in 'error' | 'initialValue' | 'value' | 'key' | 'valid' | 'dirty']?: SubscriptionScope;

package/form.js

@@ -27,9 +27,7 @@ function createFormMeta(options, initialized) {
     // We can consider adding a warning if it happens
     error: (_ref = lastResult === null || lastResult === void 0 ? void 0 : lastResult.error) !== null && _ref !== void 0 ? _ref : {}
   };
-  if (lastResult !== null && lastResult !== void 0 && lastResult.intent) {
-    handleIntent(result, lastResult.intent);
-  }
+  handleIntent(result, lastResult === null || lastResult === void 0 ? void 0 : lastResult.intent, lastResult === null || lastResult === void 0 ? void 0 : lastResult.fields);
   return result;
 }
 function getDefaultKey(defaultValue, prefix) {
@@ -45,24 +43,71 @@ function getDefaultKey(defaultValue, prefix) {
     return result;
   }, {});
 }
-function handleIntent(meta, intent, initialized) {
+function setFieldsValidated(meta, fields) {
+  for (var _name of Object.keys(meta.error).concat(fields !== null && fields !== void 0 ? fields : [])) {
+    meta.validated[_name] = true;
+  }
+}
+function handleIntent(meta, intent, fields, initialized) {
+  if (!intent) {
+    setFieldsValidated(meta, fields);
+    return;
+  }
   switch (intent.type) {
+    case 'validate':
+      {
+        if (intent.payload.name) {
+          meta.validated[intent.payload.name] = true;
+        } else {
+          setFieldsValidated(meta, fields);
+        }
+        break;
+      }
     case 'update':
       {
-        if (typeof intent.payload.value !== 'undefined') {
-          var _intent$payload$name;
-          var _name = (_intent$payload$name = intent.payload.name) !== null && _intent$payload$name !== void 0 ? _intent$payload$name : '';
-          var value = submission.serialize(intent.payload.value);
-          updateValue(meta, _name, value);
+        var {
+          name: _name2,
+          validated,
+          value
+        } = intent.payload;
+        if (typeof value !== 'undefined') {
+          updateValue(meta, _name2 !== null && _name2 !== void 0 ? _name2 : '', submission.serialize(value));
+        }
+        if (typeof validated !== 'undefined') {
+          // Clean up previous validated state
+          if (_name2) {
+            submission.setState(meta.validated, _name2, () => undefined);
+          } else {
+            meta.validated = {};
+          }
+          if (validated) {
+            if (formdata.isPlainObject(value) || Array.isArray(value)) {
+              Object.assign(meta.validated, formdata.flatten(value, {
+                resolve() {
+                  return true;
+                },
+                prefix: _name2
+              }));
+            }
+            meta.validated[_name2 !== null && _name2 !== void 0 ? _name2 : ''] = true;
+          } else if (_name2) {
+            delete meta.validated[_name2];
+          }
         }
         break;
       }
     case 'reset':
       {
-        var _intent$payload$name2;
-        var _name2 = (_intent$payload$name2 = intent.payload.name) !== null && _intent$payload$name2 !== void 0 ? _intent$payload$name2 : '';
-        var _value = formdata.getValue(meta.defaultValue, _name2);
-        updateValue(meta, _name2, _value);
+        var _intent$payload$name;
+        var _name3 = (_intent$payload$name = intent.payload.name) !== null && _intent$payload$name !== void 0 ? _intent$payload$name : '';
+        var _value = formdata.getValue(meta.defaultValue, _name3);
+        updateValue(meta, _name3, _value);
+        if (_name3) {
+          submission.setState(meta.validated, _name3, () => undefined);
+          delete meta.validated[_name3];
+        } else {
+          meta.validated = {};
+        }
         break;
       }
     case 'insert':
@@ -75,9 +120,18 @@ function handleIntent(meta, intent, initialized) {
           submission.setListState(meta.key, intent, util.generateId);
           submission.setListValue(meta.initialValue, intent);
         }
+        submission.setListState(meta.validated, intent);
+        meta.validated[intent.payload.name] = true;
         break;
       }
   }
+  meta.error = Object.entries(meta.error).reduce((result, _ref3) => {
+    var [name, error] = _ref3;
+    if (meta.validated[name]) {
+      result[name] = error;
+    }
+    return result;
+  }, {});
 }
 function updateValue(meta, name, value) {
   meta.initialValue = util.clone(meta.initialValue);
@@ -96,6 +150,9 @@ function createStateProxy(fn) {
   return new Proxy(cache, {
     get(_, name, receiver) {
       var _cache$name;
+      if (typeof name !== 'string') {
+        return;
+      }
       return (_cache$name = cache[name]) !== null && _cache$name !== void 0 ? _cache$name : cache[name] = fn(name, receiver);
     }
   });
@@ -165,8 +222,8 @@ function createValidProxy(error) {
 function createDirtyProxy(defaultValue, value, shouldDirtyConsider) {
   return createStateProxy(name => JSON.stringify(defaultValue[name]) !== JSON.stringify(value[name], (key, value) => {
     if (name === '' && key === '' && value) {
-      return Object.entries(value).reduce((result, _ref3) => {
-        var [name, value] = _ref3;
+      return Object.entries(value).reduce((result, _ref4) => {
+        var [name, value] = _ref4;
         if (!shouldDirtyConsider(name)) {
           return result;
         }
@@ -185,11 +242,11 @@ function shouldNotify(prev, next, cache, scope) {
     var prefixes = (_scope$prefix = scope.prefix) !== null && _scope$prefix !== void 0 ? _scope$prefix : [];
     var names = (_scope$name = scope.name) !== null && _scope$name !== void 0 ? _scope$name : [];
     var list = prefixes.length === 0 ? names : Array.from(new Set([...Object.keys(prev), ...Object.keys(next)]));
-    var _loop = function _loop(_name3) {
-        if (prefixes.length === 0 || names.includes(_name3) || prefixes.some(prefix => formdata.isPrefix(_name3, prefix))) {
+    var _loop = function _loop(_name4) {
+        if (prefixes.length === 0 || names.includes(_name4) || prefixes.some(prefix => formdata.isPrefix(_name4, prefix))) {
           var _cache$_name;
-          (_cache$_name = cache[_name3]) !== null && _cache$_name !== void 0 ? _cache$_name : cache[_name3] = compareFn(prev[_name3], next[_name3]);
-          if (cache[_name3]) {
+          (_cache$_name = cache[_name4]) !== null && _cache$_name !== void 0 ? _cache$_name : cache[_name4] = compareFn(prev[_name4], next[_name4]);
+          if (cache[_name4]) {
             return {
               v: true
             };
@@ -197,8 +254,8 @@ function shouldNotify(prev, next, cache, scope) {
         }
       },
       _ret;
-    for (var _name3 of list) {
-      _ret = _loop(_name3);
+    for (var _name4 of list) {
+      _ret = _loop(_name4);
       if (_ret) return _ret.v;
     }
   }
@@ -263,19 +320,6 @@ function createFormContext(options) {
     var next = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : false;
     return prev !== next;
   }
-  function getStateInput(form) {
-    var element = form.elements.namedItem(submission.STATE);
-    util.invariant(element === null || dom.isFieldElement(element), "The input name \"".concat(submission.STATE, "\" is reserved by Conform. Please use another name."));
-    if (!element) {
-      var input = document.createElement('input');
-      input.type = 'hidden';
-      input.name = submission.STATE;
-      input.value = '';
-      form.append(input);
-      return input;
-    }
-    return element;
-  }
   function getSerializedState() {
     return JSON.stringify({
       validated: meta.validated
@@ -285,10 +329,6 @@ function createFormContext(options) {
     var form = event.target;
     var submitter = event.submitter;
     util.invariant(form === getFormElement(), "The submit event is dispatched by form#".concat(form.id, " instead of form#").concat(latestOptions.formId));
-    var input = getStateInput(form);
-
-    // To ensure it capturing latest state before parsing
-    input.value = getSerializedState();
     var formData = formdata.getFormData(form, submitter);
     var result = {
       formData,
@@ -367,14 +407,14 @@ function createFormContext(options) {
     updateFormMeta(createFormMeta(latestOptions, true));
   }
   function report(result) {
-    var _result$error, _result$state$validat, _result$state;
+    var _result$error, _result$state;
     var formElement = getFormElement();
     if (!result.initialValue) {
       formElement === null || formElement === void 0 || formElement.reset();
       return;
     }
-    var error = Object.entries((_result$error = result.error) !== null && _result$error !== void 0 ? _result$error : {}).reduce((result, _ref4) => {
-      var [name, newError] = _ref4;
+    var error = Object.entries((_result$error = result.error) !== null && _result$error !== void 0 ? _result$error : {}).reduce((result, _ref5) => {
+      var [name, newError] = _ref5;
       var error = newError === null ? meta.error[name] : newError;
       if (error) {
         result[name] = error;
@@ -384,16 +424,14 @@ function createFormContext(options) {
     var update = _rollupPluginBabelHelpers.objectSpread2(_rollupPluginBabelHelpers.objectSpread2({}, meta), {}, {
       submissionStatus: result.status,
       value: result.initialValue,
-      error,
-      validated: (_result$state$validat = (_result$state = result.state) === null || _result$state === void 0 ? void 0 : _result$state.validated) !== null && _result$state$validat !== void 0 ? _result$state$validat : {}
+      validated: _rollupPluginBabelHelpers.objectSpread2(_rollupPluginBabelHelpers.objectSpread2({}, meta.validated), (_result$state = result.state) === null || _result$state === void 0 ? void 0 : _result$state.validated),
+      error
     });
-    if (result.intent) {
-      handleIntent(update, result.intent, true);
-    }
+    handleIntent(update, result.intent, result.fields, true);
     updateFormMeta(update);
     if (formElement && result.status === 'error') {
       for (var element of formElement.elements) {
-        if (dom.isFieldElement(element) && error[element.name]) {
+        if (dom.isFieldElement(element) && meta.error[element.name]) {
           element.focus();
           break;
         }
@@ -447,12 +485,14 @@ function createFormContext(options) {
     };
   }
   function createFormControl(type) {
+    var _latestOptions$onSche;
+    var schedule = (_latestOptions$onSche = latestOptions.onSchedule) !== null && _latestOptions$onSche !== void 0 ? _latestOptions$onSche : callback => callback();
     var control = function control() {
       var payload = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : {};
-      return dispatch({
+      return schedule(() => dispatch({
         type,
         payload
-      });
+      }));
     };
     return Object.assign(control, {
       getButtonProps() {

package/form.mjs

@@ -1,8 +1,8 @@
 import { objectSpread2 as _objectSpread2 } from './_virtual/_rollupPluginBabelHelpers.mjs';
-import { flatten, formatPaths, getPaths, getValue, setValue, isPlainObject, normalize, getFormData, isPrefix } from './formdata.mjs';
+import { flatten, formatPaths, getPaths, getValue, isPlainObject, setValue, normalize, getFormData, isPrefix } from './formdata.mjs';
 import { getFormAction, getFormEncType, getFormMethod, isFieldElement, requestSubmit } from './dom.mjs';
 import { generateId, clone, invariant } from './util.mjs';
-import { serialize, setListState, setListValue, setState, getSubmissionContext, INTENT, serializeIntent, STATE } from './submission.mjs';
+import { serialize, setListState, setListValue, setState, getSubmissionContext, INTENT, serializeIntent } from './submission.mjs';
 
 function createFormMeta(options, initialized) {
   var _lastResult$initialVa, _options$constraint, _lastResult$state$val, _lastResult$state, _ref;
@@ -23,9 +23,7 @@ function createFormMeta(options, initialized) {
     // We can consider adding a warning if it happens
     error: (_ref = lastResult === null || lastResult === void 0 ? void 0 : lastResult.error) !== null && _ref !== void 0 ? _ref : {}
   };
-  if (lastResult !== null && lastResult !== void 0 && lastResult.intent) {
-    handleIntent(result, lastResult.intent);
-  }
+  handleIntent(result, lastResult === null || lastResult === void 0 ? void 0 : lastResult.intent, lastResult === null || lastResult === void 0 ? void 0 : lastResult.fields);
   return result;
 }
 function getDefaultKey(defaultValue, prefix) {
@@ -41,24 +39,71 @@ function getDefaultKey(defaultValue, prefix) {
     return result;
   }, {});
 }
-function handleIntent(meta, intent, initialized) {
+function setFieldsValidated(meta, fields) {
+  for (var _name of Object.keys(meta.error).concat(fields !== null && fields !== void 0 ? fields : [])) {
+    meta.validated[_name] = true;
+  }
+}
+function handleIntent(meta, intent, fields, initialized) {
+  if (!intent) {
+    setFieldsValidated(meta, fields);
+    return;
+  }
   switch (intent.type) {
+    case 'validate':
+      {
+        if (intent.payload.name) {
+          meta.validated[intent.payload.name] = true;
+        } else {
+          setFieldsValidated(meta, fields);
+        }
+        break;
+      }
     case 'update':
       {
-        if (typeof intent.payload.value !== 'undefined') {
-          var _intent$payload$name;
-          var _name = (_intent$payload$name = intent.payload.name) !== null && _intent$payload$name !== void 0 ? _intent$payload$name : '';
-          var value = serialize(intent.payload.value);
-          updateValue(meta, _name, value);
+        var {
+          name: _name2,
+          validated,
+          value
+        } = intent.payload;
+        if (typeof value !== 'undefined') {
+          updateValue(meta, _name2 !== null && _name2 !== void 0 ? _name2 : '', serialize(value));
+        }
+        if (typeof validated !== 'undefined') {
+          // Clean up previous validated state
+          if (_name2) {
+            setState(meta.validated, _name2, () => undefined);
+          } else {
+            meta.validated = {};
+          }
+          if (validated) {
+            if (isPlainObject(value) || Array.isArray(value)) {
+              Object.assign(meta.validated, flatten(value, {
+                resolve() {
+                  return true;
+                },
+                prefix: _name2
+              }));
+            }
+            meta.validated[_name2 !== null && _name2 !== void 0 ? _name2 : ''] = true;
+          } else if (_name2) {
+            delete meta.validated[_name2];
+          }
         }
         break;
       }
     case 'reset':
       {
-        var _intent$payload$name2;
-        var _name2 = (_intent$payload$name2 = intent.payload.name) !== null && _intent$payload$name2 !== void 0 ? _intent$payload$name2 : '';
-        var _value = getValue(meta.defaultValue, _name2);
-        updateValue(meta, _name2, _value);
+        var _intent$payload$name;
+        var _name3 = (_intent$payload$name = intent.payload.name) !== null && _intent$payload$name !== void 0 ? _intent$payload$name : '';
+        var _value = getValue(meta.defaultValue, _name3);
+        updateValue(meta, _name3, _value);
+        if (_name3) {
+          setState(meta.validated, _name3, () => undefined);
+          delete meta.validated[_name3];
+        } else {
+          meta.validated = {};
+        }
         break;
       }
     case 'insert':
@@ -71,9 +116,18 @@ function handleIntent(meta, intent, initialized) {
           setListState(meta.key, intent, generateId);
           setListValue(meta.initialValue, intent);
         }
+        setListState(meta.validated, intent);
+        meta.validated[intent.payload.name] = true;
         break;
       }
   }
+  meta.error = Object.entries(meta.error).reduce((result, _ref3) => {
+    var [name, error] = _ref3;
+    if (meta.validated[name]) {
+      result[name] = error;
+    }
+    return result;
+  }, {});
 }
 function updateValue(meta, name, value) {
   meta.initialValue = clone(meta.initialValue);
@@ -92,6 +146,9 @@ function createStateProxy(fn) {
   return new Proxy(cache, {
     get(_, name, receiver) {
       var _cache$name;
+      if (typeof name !== 'string') {
+        return;
+      }
       return (_cache$name = cache[name]) !== null && _cache$name !== void 0 ? _cache$name : cache[name] = fn(name, receiver);
     }
   });
@@ -161,8 +218,8 @@ function createValidProxy(error) {
 function createDirtyProxy(defaultValue, value, shouldDirtyConsider) {
   return createStateProxy(name => JSON.stringify(defaultValue[name]) !== JSON.stringify(value[name], (key, value) => {
     if (name === '' && key === '' && value) {
-      return Object.entries(value).reduce((result, _ref3) => {
-        var [name, value] = _ref3;
+      return Object.entries(value).reduce((result, _ref4) => {
+        var [name, value] = _ref4;
         if (!shouldDirtyConsider(name)) {
           return result;
         }
@@ -181,11 +238,11 @@ function shouldNotify(prev, next, cache, scope) {
     var prefixes = (_scope$prefix = scope.prefix) !== null && _scope$prefix !== void 0 ? _scope$prefix : [];
     var names = (_scope$name = scope.name) !== null && _scope$name !== void 0 ? _scope$name : [];
     var list = prefixes.length === 0 ? names : Array.from(new Set([...Object.keys(prev), ...Object.keys(next)]));
-    var _loop = function _loop(_name3) {
-        if (prefixes.length === 0 || names.includes(_name3) || prefixes.some(prefix => isPrefix(_name3, prefix))) {
+    var _loop = function _loop(_name4) {
+        if (prefixes.length === 0 || names.includes(_name4) || prefixes.some(prefix => isPrefix(_name4, prefix))) {
           var _cache$_name;
-          (_cache$_name = cache[_name3]) !== null && _cache$_name !== void 0 ? _cache$_name : cache[_name3] = compareFn(prev[_name3], next[_name3]);
-          if (cache[_name3]) {
+          (_cache$_name = cache[_name4]) !== null && _cache$_name !== void 0 ? _cache$_name : cache[_name4] = compareFn(prev[_name4], next[_name4]);
+          if (cache[_name4]) {
             return {
               v: true
             };
@@ -193,8 +250,8 @@ function shouldNotify(prev, next, cache, scope) {
         }
       },
       _ret;
-    for (var _name3 of list) {
-      _ret = _loop(_name3);
+    for (var _name4 of list) {
+      _ret = _loop(_name4);
       if (_ret) return _ret.v;
     }
   }
@@ -259,19 +316,6 @@ function createFormContext(options) {
     var next = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : false;
     return prev !== next;
   }
-  function getStateInput(form) {
-    var element = form.elements.namedItem(STATE);
-    invariant(element === null || isFieldElement(element), "The input name \"".concat(STATE, "\" is reserved by Conform. Please use another name."));
-    if (!element) {
-      var input = document.createElement('input');
-      input.type = 'hidden';
-      input.name = STATE;
-      input.value = '';
-      form.append(input);
-      return input;
-    }
-    return element;
-  }
   function getSerializedState() {
     return JSON.stringify({
       validated: meta.validated
@@ -281,10 +325,6 @@ function createFormContext(options) {
     var form = event.target;
     var submitter = event.submitter;
     invariant(form === getFormElement(), "The submit event is dispatched by form#".concat(form.id, " instead of form#").concat(latestOptions.formId));
-    var input = getStateInput(form);
-
-    // To ensure it capturing latest state before parsing
-    input.value = getSerializedState();
     var formData = getFormData(form, submitter);
     var result = {
       formData,
@@ -363,14 +403,14 @@ function createFormContext(options) {
     updateFormMeta(createFormMeta(latestOptions, true));
   }
   function report(result) {
-    var _result$error, _result$state$validat, _result$state;
+    var _result$error, _result$state;
     var formElement = getFormElement();
     if (!result.initialValue) {
       formElement === null || formElement === void 0 || formElement.reset();
       return;
     }
-    var error = Object.entries((_result$error = result.error) !== null && _result$error !== void 0 ? _result$error : {}).reduce((result, _ref4) => {
-      var [name, newError] = _ref4;
+    var error = Object.entries((_result$error = result.error) !== null && _result$error !== void 0 ? _result$error : {}).reduce((result, _ref5) => {
+      var [name, newError] = _ref5;
       var error = newError === null ? meta.error[name] : newError;
       if (error) {
         result[name] = error;
@@ -380,16 +420,14 @@ function createFormContext(options) {
     var update = _objectSpread2(_objectSpread2({}, meta), {}, {
       submissionStatus: result.status,
       value: result.initialValue,
-      error,
-      validated: (_result$state$validat = (_result$state = result.state) === null || _result$state === void 0 ? void 0 : _result$state.validated) !== null && _result$state$validat !== void 0 ? _result$state$validat : {}
+      validated: _objectSpread2(_objectSpread2({}, meta.validated), (_result$state = result.state) === null || _result$state === void 0 ? void 0 : _result$state.validated),
+      error
     });
-    if (result.intent) {
-      handleIntent(update, result.intent, true);
-    }
+    handleIntent(update, result.intent, result.fields, true);
     updateFormMeta(update);
     if (formElement && result.status === 'error') {
       for (var element of formElement.elements) {
-        if (isFieldElement(element) && error[element.name]) {
+        if (isFieldElement(element) && meta.error[element.name]) {
           element.focus();
           break;
         }
@@ -443,12 +481,14 @@ function createFormContext(options) {
     };
   }
   function createFormControl(type) {
+    var _latestOptions$onSche;
+    var schedule = (_latestOptions$onSche = latestOptions.onSchedule) !== null && _latestOptions$onSche !== void 0 ? _latestOptions$onSche : callback => callback();
     var control = function control() {
       var payload = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : {};
-      return dispatch({
+      return schedule(() => dispatch({
         type,
         payload
-      });
+      }));
     };
     return Object.assign(control, {
       getButtonProps() {

package/formdata.d.ts

@@ -45,9 +45,9 @@ export declare function isFile(obj: unknown): obj is File;
 /**
  * Normalize value by removing empty object or array, empty string and null values
  */
-export declare function normalize<Type extends Record<string, unknown>>(value: Type | null): Type | null | undefined;
-export declare function normalize<Type extends Array<unknown>>(value: Type | null): Type | null | undefined;
-export declare function normalize(value: unknown): unknown | undefined;
+export declare function normalize<Type extends Record<string, unknown>>(value: Type, acceptFile?: boolean): Type | undefined;
+export declare function normalize<Type extends Array<unknown>>(value: Type, acceptFile?: boolean): Type | undefined;
+export declare function normalize(value: unknown, acceptFile?: boolean): unknown | undefined;
 /**
  * Flatten a tree into a dictionary
  */

package/formdata.js

@@ -136,9 +136,10 @@ function isFile(obj) {
  */
 
 function normalize(value) {
+  var acceptFile = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : true;
   if (isPlainObject(value)) {
     var obj = Object.keys(value).sort().reduce((result, key) => {
-      var data = normalize(value[key]);
+      var data = normalize(value[key], acceptFile);
       if (typeof data !== 'undefined') {
         result[key] = data;
       }
@@ -153,9 +154,9 @@ function normalize(value) {
     if (value.length === 0) {
       return undefined;
     }
-    return value.map(normalize);
+    return value.map(item => normalize(item, acceptFile));
   }
-  if (typeof value === 'string' && value === '' || value === null || isFile(value)) {
+  if (typeof value === 'string' && value === '' || value === null || isFile(value) && (!acceptFile || value.size === 0)) {
     return;
   }
   return value;

package/formdata.mjs

@@ -132,9 +132,10 @@ function isFile(obj) {
  */
 
 function normalize(value) {
+  var acceptFile = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : true;
   if (isPlainObject(value)) {
     var obj = Object.keys(value).sort().reduce((result, key) => {
-      var data = normalize(value[key]);
+      var data = normalize(value[key], acceptFile);
       if (typeof data !== 'undefined') {
         result[key] = data;
       }
@@ -149,9 +150,9 @@ function normalize(value) {
     if (value.length === 0) {
       return undefined;
     }
-    return value.map(normalize);
+    return value.map(item => normalize(item, acceptFile));
   }
-  if (typeof value === 'string' && value === '' || value === null || isFile(value)) {
+  if (typeof value === 'string' && value === '' || value === null || isFile(value) && (!acceptFile || value.size === 0)) {
     return;
   }
   return value;

package/index.d.ts

@@ -1,4 +1,4 @@
-export { type UnionKeyof, type UnionKeyType, type Constraint, type ControlButtonProps, type FormId, type FieldName, type DefaultValue, type FormValue, type FormOptions, type FormState, type FormContext, type SubscriptionSubject, type SubscriptionScope, createFormContext as unstable_createFormContext, } from './form';
+export { type Combine, type Constraint, type ControlButtonProps, type FormId, type FieldName, type DefaultValue, type FormValue, type FormOptions, type FormState, type FormContext, type SubscriptionSubject, type SubscriptionScope, createFormContext as unstable_createFormContext, } from './form';
 export { type FieldElement, isFieldElement } from './dom';
 export { type Submission, type SubmissionResult, type Intent, INTENT, STATE, serializeIntent, parse, } from './submission';
 export { getPaths, formatPaths, isPrefix } from './formdata';

package/package.json

@@ -3,7 +3,7 @@
 	"description": "A set of opinionated helpers built on top of the Constraint Validation API",
 	"homepage": "https://conform.guide",
 	"license": "MIT",
-	"version": "1.0.1",
+	"version": "1.0.3",
 	"main": "index.js",
 	"module": "index.mjs",
 	"types": "index.d.ts",

package/submission.d.ts

@@ -5,10 +5,10 @@ export type SubmissionState = {
 export type SubmissionContext<Value = null, FormError = string[]> = {
     intent: Intent | null;
     payload: Record<string, unknown>;
-    fields: string[];
+    fields: Set<string>;
     value?: Value;
     error?: Record<string, FormError | null> | null;
-    state: SubmissionState;
+    state?: SubmissionState;
 };
 export type Submission<Schema, FormError = string[], FormValue = Schema> = {
     status: 'success';
@@ -25,6 +25,7 @@ export type SubmissionResult<FormError = string[]> = {
     status?: 'error' | 'success';
     intent?: Intent;
     initialValue?: Record<string, unknown> | null;
+    fields?: string[];
     error?: Record<string, FormError | null>;
     state?: SubmissionState;
 };

package/submission.js

@@ -18,15 +18,21 @@ var STATE = '__state__';
 function getSubmissionContext(body) {
   var intent = body.get(INTENT);
   var state = body.get(STATE);
-  var payload = {};
-  var fields = [];
   util.invariant((typeof intent === 'string' || intent === null) && (typeof state === 'string' || state === null), "The input name \"".concat(INTENT, "\" and \"").concat(STATE, "\" are reserved by Conform. Please use another name for your input."));
+  var context = {
+    payload: {},
+    fields: new Set(),
+    intent: getIntent(intent)
+  };
+  if (state) {
+    context.state = JSON.parse(state);
+  }
   var _loop = function _loop(next) {
     if (name === INTENT || name === STATE) {
       return 1; // continue
     }
-    fields.push(name);
-    formdata.setValue(payload, name, prev => {
+    context.fields.add(name);
+    formdata.setValue(context.payload, name, prev => {
       if (!prev) {
         return next;
       } else if (Array.isArray(prev)) {
@@ -39,30 +45,17 @@ function getSubmissionContext(body) {
   for (var [name, next] of body.entries()) {
     if (_loop(next)) continue;
   }
-  return {
-    payload,
-    intent: getIntent(intent),
-    state: state ? JSON.parse(state) : {
-      validated: {}
-    },
-    fields
-  };
+  return context;
 }
 function parse(payload, options) {
   var context = getSubmissionContext(payload);
   var intent = context.intent;
   if (intent) {
     switch (intent.type) {
-      case 'validate':
-        if (intent.payload.name) {
-          context.state.validated[intent.payload.name] = true;
-        }
-        break;
       case 'update':
         {
           var {
-            name,
-            validated
+            name
           } = intent.payload;
           var _value = serialize(intent.payload.value);
           if (typeof _value !== 'undefined') {
@@ -73,27 +66,6 @@ function parse(payload, options) {
               context.payload = _value;
             }
           }
-          if (typeof validated !== 'undefined') {
-            // Clean up previous validated state
-            if (name) {
-              setState(context.state.validated, name, () => undefined);
-            } else {
-              context.state.validated = {};
-            }
-            if (validated) {
-              if (formdata.isPlainObject(_value) || Array.isArray(_value)) {
-                Object.assign(context.state.validated, formdata.flatten(_value, {
-                  resolve() {
-                    return true;
-                  },
-                  prefix: name
-                }));
-              }
-              context.state.validated[name !== null && name !== void 0 ? name : ''] = true;
-            } else if (name) {
-              delete context.state.validated[name];
-            }
-          }
           break;
         }
       case 'reset':
@@ -103,11 +75,8 @@ function parse(payload, options) {
           } = intent.payload;
           if (_name) {
             formdata.setValue(context.payload, _name, () => undefined);
-            setState(context.state.validated, _name, () => undefined);
-            delete context.state.validated[_name];
           } else {
             context.payload = {};
-            context.state.validated = {};
           }
           break;
         }
@@ -116,25 +85,15 @@ function parse(payload, options) {
       case 'reorder':
         {
           setListValue(context.payload, intent);
-          setListState(context.state.validated, intent);
-          context.state.validated[intent.payload.name] = true;
           break;
         }
     }
   }
   var result = options.resolve(context.payload, intent);
-  var mergeResolveResult = resolved => {
-    var error = typeof resolved.error !== 'undefined' ? resolved.error : {};
-    if (!intent || intent.type === 'validate' && !intent.payload.name) {
-      for (var _name2 of [...context.fields, ...Object.keys(error !== null && error !== void 0 ? error : {})]) {
-        context.state.validated[_name2] = true;
-      }
-    }
-    return createSubmission(_rollupPluginBabelHelpers.objectSpread2(_rollupPluginBabelHelpers.objectSpread2({}, context), {}, {
-      value: resolved.value,
-      error: resolved.error
-    }));
-  };
+  var mergeResolveResult = resolved => createSubmission(_rollupPluginBabelHelpers.objectSpread2(_rollupPluginBabelHelpers.objectSpread2({}, context), {}, {
+    value: resolved.value,
+    error: resolved.error
+  }));
   if (result instanceof Promise) {
     return result.then(mergeResolveResult);
   }
@@ -161,50 +120,34 @@ function createSubmission(context) {
   };
 }
 function replySubmission(context) {
-  var _context$intent, _options$formErrors, _normalize;
+  var _context$intent, _context$intent$paylo, _options$formErrors, _normalize;
   var options = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : {};
-  switch ((_context$intent = context.intent) === null || _context$intent === void 0 ? void 0 : _context$intent.type) {
-    case 'reset':
-      {
-        var _context$intent$paylo;
-        var name = (_context$intent$paylo = context.intent.payload.name) !== null && _context$intent$paylo !== void 0 ? _context$intent$paylo : '';
-        if (name === '') {
-          return {
-            initialValue: null
-          };
-        }
-      }
-  }
-  if ('resetForm' in options && options.resetForm) {
+  if ('resetForm' in options && options.resetForm || ((_context$intent = context.intent) === null || _context$intent === void 0 ? void 0 : _context$intent.type) === 'reset' && ((_context$intent$paylo = context.intent.payload.name) !== null && _context$intent$paylo !== void 0 ? _context$intent$paylo : '') === '') {
     return {
       initialValue: null
     };
   }
   if ('hideFields' in options && options.hideFields) {
-    for (var _name3 of options.hideFields) {
-      var _value2 = formdata.getValue(context.payload, _name3);
+    for (var name of options.hideFields) {
+      var _value2 = formdata.getValue(context.payload, name);
       if (typeof _value2 !== 'undefined') {
-        formdata.setValue(context.payload, _name3, () => undefined);
+        formdata.setValue(context.payload, name, () => undefined);
       }
     }
   }
-  var submissionError = context.error ? Object.entries(context.error).reduce((result, _ref) => {
-    var [name, error] = _ref;
-    if (context.state.validated[name]) {
-      result[name] = error;
-    }
-    return result;
-  }, {}) : undefined;
   var extraError = 'formErrors' in options || 'fieldErrors' in options ? formdata.normalize(_rollupPluginBabelHelpers.objectSpread2({
     '': (_options$formErrors = options.formErrors) !== null && _options$formErrors !== void 0 ? _options$formErrors : null
   }, options.fieldErrors)) : null;
-  var error = submissionError || extraError ? _rollupPluginBabelHelpers.objectSpread2(_rollupPluginBabelHelpers.objectSpread2({}, submissionError), extraError) : undefined;
+  var error = context.error || extraError ? _rollupPluginBabelHelpers.objectSpread2(_rollupPluginBabelHelpers.objectSpread2({}, context.error), extraError) : undefined;
   return {
     status: context.intent ? undefined : error ? 'error' : 'success',
     intent: context.intent ? context.intent : undefined,
-    initialValue: (_normalize = formdata.normalize(context.payload)) !== null && _normalize !== void 0 ? _normalize : {},
+    initialValue: (_normalize = formdata.normalize(context.payload,
+    // We can't serialize the file and send it back from the server, but we can preserve it in the client
+    typeof document !== 'undefined')) !== null && _normalize !== void 0 ? _normalize : {},
     error,
-    state: context.state
+    state: context.state,
+    fields: Array.from(context.fields)
   };
 }
 function getIntent(serializedIntent) {
@@ -310,8 +253,8 @@ function setListState(state, intent, getDefaultValue) {
 function serialize(defaultValue) {
   if (formdata.isPlainObject(defaultValue)) {
     // @ts-expect-error FIXME
-    return Object.entries(defaultValue).reduce((result, _ref2) => {
-      var [key, value] = _ref2;
+    return Object.entries(defaultValue).reduce((result, _ref) => {
+      var [key, value] = _ref;
       // @ts-ignore-error FIXME
       result[key] = serialize(value);
       return result;

package/submission.mjs

@@ -1,5 +1,5 @@
 import { objectSpread2 as _objectSpread2 } from './_virtual/_rollupPluginBabelHelpers.mjs';
-import { setValue, isPlainObject, flatten, getValue, normalize, isPrefix } from './formdata.mjs';
+import { setValue, isPlainObject, getValue, normalize, flatten, isPrefix } from './formdata.mjs';
 import { invariant } from './util.mjs';
 
 /**
@@ -14,15 +14,21 @@ var STATE = '__state__';
 function getSubmissionContext(body) {
   var intent = body.get(INTENT);
   var state = body.get(STATE);
-  var payload = {};
-  var fields = [];
   invariant((typeof intent === 'string' || intent === null) && (typeof state === 'string' || state === null), "The input name \"".concat(INTENT, "\" and \"").concat(STATE, "\" are reserved by Conform. Please use another name for your input."));
+  var context = {
+    payload: {},
+    fields: new Set(),
+    intent: getIntent(intent)
+  };
+  if (state) {
+    context.state = JSON.parse(state);
+  }
   var _loop = function _loop(next) {
     if (name === INTENT || name === STATE) {
       return 1; // continue
     }
-    fields.push(name);
-    setValue(payload, name, prev => {
+    context.fields.add(name);
+    setValue(context.payload, name, prev => {
       if (!prev) {
         return next;
       } else if (Array.isArray(prev)) {
@@ -35,30 +41,17 @@ function getSubmissionContext(body) {
   for (var [name, next] of body.entries()) {
     if (_loop(next)) continue;
   }
-  return {
-    payload,
-    intent: getIntent(intent),
-    state: state ? JSON.parse(state) : {
-      validated: {}
-    },
-    fields
-  };
+  return context;
 }
 function parse(payload, options) {
   var context = getSubmissionContext(payload);
   var intent = context.intent;
   if (intent) {
     switch (intent.type) {
-      case 'validate':
-        if (intent.payload.name) {
-          context.state.validated[intent.payload.name] = true;
-        }
-        break;
       case 'update':
         {
           var {
-            name,
-            validated
+            name
           } = intent.payload;
           var _value = serialize(intent.payload.value);
           if (typeof _value !== 'undefined') {
@@ -69,27 +62,6 @@ function parse(payload, options) {
               context.payload = _value;
             }
           }
-          if (typeof validated !== 'undefined') {
-            // Clean up previous validated state
-            if (name) {
-              setState(context.state.validated, name, () => undefined);
-            } else {
-              context.state.validated = {};
-            }
-            if (validated) {
-              if (isPlainObject(_value) || Array.isArray(_value)) {
-                Object.assign(context.state.validated, flatten(_value, {
-                  resolve() {
-                    return true;
-                  },
-                  prefix: name
-                }));
-              }
-              context.state.validated[name !== null && name !== void 0 ? name : ''] = true;
-            } else if (name) {
-              delete context.state.validated[name];
-            }
-          }
           break;
         }
       case 'reset':
@@ -99,11 +71,8 @@ function parse(payload, options) {
           } = intent.payload;
           if (_name) {
             setValue(context.payload, _name, () => undefined);
-            setState(context.state.validated, _name, () => undefined);
-            delete context.state.validated[_name];
           } else {
             context.payload = {};
-            context.state.validated = {};
           }
           break;
         }
@@ -112,25 +81,15 @@ function parse(payload, options) {
       case 'reorder':
         {
           setListValue(context.payload, intent);
-          setListState(context.state.validated, intent);
-          context.state.validated[intent.payload.name] = true;
           break;
         }
     }
   }
   var result = options.resolve(context.payload, intent);
-  var mergeResolveResult = resolved => {
-    var error = typeof resolved.error !== 'undefined' ? resolved.error : {};
-    if (!intent || intent.type === 'validate' && !intent.payload.name) {
-      for (var _name2 of [...context.fields, ...Object.keys(error !== null && error !== void 0 ? error : {})]) {
-        context.state.validated[_name2] = true;
-      }
-    }
-    return createSubmission(_objectSpread2(_objectSpread2({}, context), {}, {
-      value: resolved.value,
-      error: resolved.error
-    }));
-  };
+  var mergeResolveResult = resolved => createSubmission(_objectSpread2(_objectSpread2({}, context), {}, {
+    value: resolved.value,
+    error: resolved.error
+  }));
   if (result instanceof Promise) {
     return result.then(mergeResolveResult);
   }
@@ -157,50 +116,34 @@ function createSubmission(context) {
   };
 }
 function replySubmission(context) {
-  var _context$intent, _options$formErrors, _normalize;
+  var _context$intent, _context$intent$paylo, _options$formErrors, _normalize;
   var options = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : {};
-  switch ((_context$intent = context.intent) === null || _context$intent === void 0 ? void 0 : _context$intent.type) {
-    case 'reset':
-      {
-        var _context$intent$paylo;
-        var name = (_context$intent$paylo = context.intent.payload.name) !== null && _context$intent$paylo !== void 0 ? _context$intent$paylo : '';
-        if (name === '') {
-          return {
-            initialValue: null
-          };
-        }
-      }
-  }
-  if ('resetForm' in options && options.resetForm) {
+  if ('resetForm' in options && options.resetForm || ((_context$intent = context.intent) === null || _context$intent === void 0 ? void 0 : _context$intent.type) === 'reset' && ((_context$intent$paylo = context.intent.payload.name) !== null && _context$intent$paylo !== void 0 ? _context$intent$paylo : '') === '') {
     return {
       initialValue: null
     };
   }
   if ('hideFields' in options && options.hideFields) {
-    for (var _name3 of options.hideFields) {
-      var _value2 = getValue(context.payload, _name3);
+    for (var name of options.hideFields) {
+      var _value2 = getValue(context.payload, name);
       if (typeof _value2 !== 'undefined') {
-        setValue(context.payload, _name3, () => undefined);
+        setValue(context.payload, name, () => undefined);
       }
     }
   }
-  var submissionError = context.error ? Object.entries(context.error).reduce((result, _ref) => {
-    var [name, error] = _ref;
-    if (context.state.validated[name]) {
-      result[name] = error;
-    }
-    return result;
-  }, {}) : undefined;
   var extraError = 'formErrors' in options || 'fieldErrors' in options ? normalize(_objectSpread2({
     '': (_options$formErrors = options.formErrors) !== null && _options$formErrors !== void 0 ? _options$formErrors : null
   }, options.fieldErrors)) : null;
-  var error = submissionError || extraError ? _objectSpread2(_objectSpread2({}, submissionError), extraError) : undefined;
+  var error = context.error || extraError ? _objectSpread2(_objectSpread2({}, context.error), extraError) : undefined;
   return {
     status: context.intent ? undefined : error ? 'error' : 'success',
     intent: context.intent ? context.intent : undefined,
-    initialValue: (_normalize = normalize(context.payload)) !== null && _normalize !== void 0 ? _normalize : {},
+    initialValue: (_normalize = normalize(context.payload,
+    // We can't serialize the file and send it back from the server, but we can preserve it in the client
+    typeof document !== 'undefined')) !== null && _normalize !== void 0 ? _normalize : {},
     error,
-    state: context.state
+    state: context.state,
+    fields: Array.from(context.fields)
   };
 }
 function getIntent(serializedIntent) {
@@ -306,8 +249,8 @@ function setListState(state, intent, getDefaultValue) {
 function serialize(defaultValue) {
   if (isPlainObject(defaultValue)) {
     // @ts-expect-error FIXME
-    return Object.entries(defaultValue).reduce((result, _ref2) => {
-      var [key, value] = _ref2;
+    return Object.entries(defaultValue).reduce((result, _ref) => {
+      var [key, value] = _ref;
       // @ts-ignore-error FIXME
       result[key] = serialize(value);
       return result;