@conform-to/dom 1.8.1 → 1.8.2

package/README.md

@@ -7,7 +7,7 @@
  ╚══════╝  ╚═════╝  ╚═╝  ╚══╝ ╚═╝        ╚═════╝  ╚═╝   ╚═╝ ╚═╝   ╚═╝
 ```
 
-Version 1.8.1 / License MIT / Copyright (c) 2024 Edmund Hung
+Version 1.8.2 / 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/dist/dom.d.ts

@@ -63,5 +63,6 @@ export declare function updateField(element: HTMLInputElement | HTMLSelectElemen
     value?: unknown;
     defaultValue?: unknown;
 }): void;
+export declare function isDirtyInput(element: HTMLInputElement | HTMLSelectElement | HTMLTextAreaElement): boolean;
 export {};
 //# sourceMappingURL=dom.d.ts.map

package/dist/dom.js

@@ -463,6 +463,25 @@ function updateField(element, options) {
     element.defaultValue = (_defaultValue$ = defaultValue[0]) !== null && _defaultValue$ !== void 0 ? _defaultValue$ : '';
   }
 }
+function isDirtyInput(element) {
+  var _element$files$length, _element$files;
+  if (isInputElement(element)) {
+    switch (element.type) {
+      case 'checkbox':
+      case 'radio':
+        return element.checked !== element.defaultChecked;
+      case 'file':
+        return ((_element$files$length = (_element$files = element.files) === null || _element$files === void 0 ? void 0 : _element$files.length) !== null && _element$files$length !== void 0 ? _element$files$length : 0) > 0;
+      default:
+        return element.value !== element.defaultValue;
+    }
+  } else if (isSelectElement(element)) {
+    return Array.from(element.options).some(option => option.selected !== option.defaultSelected);
+  } else if (isTextAreaElement(element)) {
+    return element.value !== element.defaultValue;
+  }
+  return false;
+}
 
 exports.blur = blur;
 exports.change = change;
@@ -472,6 +491,7 @@ exports.focus = focus;
 exports.getFormAction = getFormAction;
 exports.getFormEncType = getFormEncType;
 exports.getFormMethod = getFormMethod;
+exports.isDirtyInput = isDirtyInput;
 exports.isFieldElement = isFieldElement;
 exports.isInputElement = isInputElement;
 exports.isSelectElement = isSelectElement;

package/dist/dom.mjs

@@ -459,5 +459,24 @@ function updateField(element, options) {
     element.defaultValue = (_defaultValue$ = defaultValue[0]) !== null && _defaultValue$ !== void 0 ? _defaultValue$ : '';
   }
 }
+function isDirtyInput(element) {
+  var _element$files$length, _element$files;
+  if (isInputElement(element)) {
+    switch (element.type) {
+      case 'checkbox':
+      case 'radio':
+        return element.checked !== element.defaultChecked;
+      case 'file':
+        return ((_element$files$length = (_element$files = element.files) === null || _element$files === void 0 ? void 0 : _element$files.length) !== null && _element$files$length !== void 0 ? _element$files$length : 0) > 0;
+      default:
+        return element.value !== element.defaultValue;
+    }
+  } else if (isSelectElement(element)) {
+    return Array.from(element.options).some(option => option.selected !== option.defaultSelected);
+  } else if (isTextAreaElement(element)) {
+    return element.value !== element.defaultValue;
+  }
+  return false;
+}
 
-export { blur, change, createFileList, createGlobalFormsObserver, focus, getFormAction, getFormEncType, getFormMethod, isFieldElement, isInputElement, isSelectElement, isTextAreaElement, normalizeFileValues, normalizeStringValues, requestSubmit, updateField };
+export { blur, change, createFileList, createGlobalFormsObserver, focus, getFormAction, getFormEncType, getFormMethod, isDirtyInput, isFieldElement, isInputElement, isSelectElement, isTextAreaElement, normalizeFileValues, normalizeStringValues, requestSubmit, updateField };

package/dist/form.js

@@ -582,12 +582,15 @@ function createFormContext(options) {
                 var paths = formdata.getChildPaths(parentPaths, element.name);
                 if (paths) {
                   var value = formdata.getValue(intent.payload.value, formdata.formatPaths(paths));
-                  dom.updateField(element, {
-                    value: typeof value === 'string' || Array.isArray(value) && value.every(item => typeof item === 'string') ? value : null
-                  });
+                  var inputValue = typeof value === 'string' || Array.isArray(value) && value.every(item => typeof item === 'string') ? value : undefined;
+                  if (typeof inputValue !== 'undefined' || _name5 === '' && paths.length > 1) {
+                    dom.updateField(element, {
+                      value: inputValue !== null && inputValue !== void 0 ? inputValue : null
+                    });
 
-                  // Update the element attribute to notify useControl / useInputControl hook
-                  element.dataset.conform = util.generateId();
+                    // Update the element attribute to notify useControl / useInputControl hook
+                    element.dataset.conform = util.generateId();
+                  }
                 }
               }
             }
@@ -599,10 +602,13 @@ function createFormContext(options) {
             for (var _element of formElement.elements) {
               if (dom.isFieldElement(_element) && _element.name && formdata.isPrefix(_element.name, prefix)) {
                 var _value2 = formdata.getValue(meta.defaultValue, _element.name);
-                var defaultValue = typeof _value2 === 'string' || Array.isArray(_value2) && _value2.every(item => typeof item === 'string') ? _value2 : null;
+                var defaultValue = typeof _value2 === 'string' || Array.isArray(_value2) && _value2.every(item => typeof item === 'string') ? _value2 : undefined;
+                if (typeof defaultValue === 'undefined' && !_element.dataset.conform && 'defaultValue' in _element && !dom.isDirtyInput(_element)) {
+                  continue;
+                }
                 dom.updateField(_element, {
-                  defaultValue,
-                  value: defaultValue
+                  defaultValue: defaultValue,
+                  value: defaultValue !== null && defaultValue !== void 0 ? defaultValue : null
                 });
 
                 // Update the element attribute to notify useControl / useInputControl hook

package/dist/form.mjs

@@ -1,6 +1,6 @@
 import { objectSpread2 as _objectSpread2 } from './_virtual/_rollupPluginBabelHelpers.mjs';
 import { flatten, formatName, getValue, isPlainObject, isPrefix, setValue, normalize, getFormData, getPaths, getChildPaths, formatPaths } from './formdata.mjs';
-import { getFormAction, getFormEncType, getFormMethod, isFieldElement, requestSubmit, updateField } from './dom.mjs';
+import { getFormAction, getFormEncType, getFormMethod, isFieldElement, requestSubmit, isDirtyInput, updateField } from './dom.mjs';
 import { generateId, clone, invariant } from './util.mjs';
 import { serialize, setListState, setListValue, setState, INTENT, serializeIntent, root, getSubmissionContext } from './submission.mjs';
 
@@ -578,12 +578,15 @@ function createFormContext(options) {
                 var paths = getChildPaths(parentPaths, element.name);
                 if (paths) {
                   var value = getValue(intent.payload.value, formatPaths(paths));
-                  updateField(element, {
-                    value: typeof value === 'string' || Array.isArray(value) && value.every(item => typeof item === 'string') ? value : null
-                  });
+                  var inputValue = typeof value === 'string' || Array.isArray(value) && value.every(item => typeof item === 'string') ? value : undefined;
+                  if (typeof inputValue !== 'undefined' || _name5 === '' && paths.length > 1) {
+                    updateField(element, {
+                      value: inputValue !== null && inputValue !== void 0 ? inputValue : null
+                    });
 
-                  // Update the element attribute to notify useControl / useInputControl hook
-                  element.dataset.conform = generateId();
+                    // Update the element attribute to notify useControl / useInputControl hook
+                    element.dataset.conform = generateId();
+                  }
                 }
               }
             }
@@ -595,10 +598,13 @@ function createFormContext(options) {
             for (var _element of formElement.elements) {
               if (isFieldElement(_element) && _element.name && isPrefix(_element.name, prefix)) {
                 var _value2 = getValue(meta.defaultValue, _element.name);
-                var defaultValue = typeof _value2 === 'string' || Array.isArray(_value2) && _value2.every(item => typeof item === 'string') ? _value2 : null;
+                var defaultValue = typeof _value2 === 'string' || Array.isArray(_value2) && _value2.every(item => typeof item === 'string') ? _value2 : undefined;
+                if (typeof defaultValue === 'undefined' && !_element.dataset.conform && 'defaultValue' in _element && !isDirtyInput(_element)) {
+                  continue;
+                }
                 updateField(_element, {
-                  defaultValue,
-                  value: defaultValue
+                  defaultValue: defaultValue,
+                  value: defaultValue !== null && defaultValue !== void 0 ? defaultValue : null
                 });
 
                 // Update the element attribute to notify useControl / useInputControl hook

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.8.1",
+  "version": "1.8.2",
   "main": "./dist/index.js",
   "module": "./dist/index.mjs",
   "types": "./dist/index.d.ts",