@conform-to/dom 0.4.0-pre.2 → 0.4.0

package/_virtual/_rollupPluginBabelHelpers.js

@@ -4,17 +4,14 @@ Object.defineProperty(exports, '__esModule', { value: true });
 
 function ownKeys(object, enumerableOnly) {
   var keys = Object.keys(object);
-
   if (Object.getOwnPropertySymbols) {
     var symbols = Object.getOwnPropertySymbols(object);
     enumerableOnly && (symbols = symbols.filter(function (sym) {
       return Object.getOwnPropertyDescriptor(object, sym).enumerable;
     })), keys.push.apply(keys, symbols);
   }
-
   return keys;
 }
-
 function _objectSpread2(target) {
   for (var i = 1; i < arguments.length; i++) {
     var source = null != arguments[i] ? arguments[i] : {};
@@ -24,10 +21,8 @@ function _objectSpread2(target) {
       Object.defineProperty(target, key, Object.getOwnPropertyDescriptor(source, key));
     });
   }
-
   return target;
 }
-
 function _defineProperty(obj, key, value) {
   if (key in obj) {
     Object.defineProperty(obj, key, {
@@ -39,7 +34,6 @@ function _defineProperty(obj, key, value) {
   } else {
     obj[key] = value;
   }
-
   return obj;
 }
 

package/index.d.ts

@@ -23,18 +23,18 @@ export declare type FieldsetConstraint<Schema extends Record<string, any>> = {
     [Key in keyof Schema]?: FieldConstraint;
 };
 export declare type Submission<Schema = unknown> = {
-    context: string;
+    type: string;
     intent?: string;
     value: FieldValue<Schema>;
     error: Array<[string, string]>;
 };
 export declare function isFieldElement(element: unknown): element is FieldElement;
+export declare function getFormElements(form: HTMLFormElement): FieldElement[];
 export declare function getPaths(name: string): Array<string | number>;
 export declare function getFormData(form: HTMLFormElement, submitter?: HTMLInputElement | HTMLButtonElement | null): FormData;
 export declare function getName(paths: Array<string | number>): string;
-export declare function shouldValidate(submission: Submission, name: string): boolean;
-export declare function hasError(error: Array<[string, string]>, names?: string[]): boolean;
-export declare function getFormError(form: HTMLFormElement, getFieldError?: (field: FieldElement) => Array<[string, string]>): Array<[string, string]>;
+export declare function shouldValidate(submission: Submission, name?: string): boolean;
+export declare function hasError(error: Array<[string, string]>, name?: string): boolean;
 export declare function setFormError(form: HTMLFormElement, submission: Submission): void;
 export declare function setValue<T>(target: any, paths: Array<string | number>, valueFn: (prev?: T) => T): void;
 export declare function requestSubmit(form: HTMLFormElement, submitter?: HTMLButtonElement | HTMLInputElement): void;

package/index.js

@@ -7,34 +7,30 @@ var _rollupPluginBabelHelpers = require('./_virtual/_rollupPluginBabelHelpers.js
 function isFieldElement(element) {
   return element instanceof Element && (element.tagName === 'INPUT' || element.tagName === 'SELECT' || element.tagName === 'TEXTAREA' || element.tagName === 'BUTTON');
 }
+function getFormElements(form) {
+  return Array.from(form.elements).filter(isFieldElement);
+}
 function getPaths(name) {
   var pattern = /(\w*)\[(\d+)\]/;
-
   if (!name) {
     return [];
   }
-
   return name.split('.').flatMap(key => {
     var matches = pattern.exec(key);
-
     if (!matches) {
       return key;
     }
-
     if (matches[1] === '') {
       return Number(matches[2]);
     }
-
     return [matches[1], Number(matches[2])];
   });
 }
 function getFormData(form, submitter) {
   var payload = new FormData(form);
-
   if (submitter !== null && submitter !== void 0 && submitter.name) {
     payload.append(submitter.name, submitter.value);
   }
-
   return payload;
 }
 function getName(paths) {
@@ -42,43 +38,26 @@ function getName(paths) {
     if (typeof path === 'number') {
       return "".concat(name, "[").concat(path, "]");
     }
-
     if (name === '' || path === '') {
       return [name, path].join('');
     }
-
     return [name, path].join('.');
   }, '');
 }
 function shouldValidate(submission, name) {
-  return submission.context === 'submit' || submission.context === 'validate' && submission.intent === name;
+  return submission.type === 'submit' || submission.type === 'validate' && (typeof name === 'undefined' || submission.intent === name);
 }
-function hasError(error, names) {
+function hasError(error, name) {
   return typeof error.find(_ref => {
     var [fieldName, message] = _ref;
-    return (typeof names === 'undefined' || names.includes(fieldName)) && message !== '';
+    return (typeof name === 'undefined' || name === fieldName) && message !== '';
   }) !== 'undefined';
 }
-function getFormError(form, getFieldError) {
-  var error = [];
-
-  for (var element of form.elements) {
-    if (isFieldElement(element) && element.willValidate) {
-      var _getFieldError;
-
-      error.push(...((_getFieldError = getFieldError === null || getFieldError === void 0 ? void 0 : getFieldError(element)) !== null && _getFieldError !== void 0 ? _getFieldError : [[element.name, element.validationMessage]]));
-    }
-  }
-
-  return error;
-}
 function setFormError(form, submission) {
   var firstErrorByName = Object.fromEntries([...submission.error].reverse());
-
   for (var element of form.elements) {
     if (isFieldElement(element)) {
       var error = firstErrorByName[element.name];
-
       if (typeof error !== 'undefined' || shouldValidate(submission, element.name)) {
         element.setCustomValidity(error !== null && error !== void 0 ? error : '');
       }
@@ -90,10 +69,8 @@ function setValue(target, paths, valueFn) {
   var lastIndex = length - 1;
   var index = -1;
   var pointer = target;
-
   while (pointer != null && ++index < length) {
     var _pointer$key;
-
     var key = paths[index];
     var next = paths[index + 1];
     var newValue = index != lastIndex ? (_pointer$key = pointer[key]) !== null && _pointer$key !== void 0 ? _pointer$key : typeof next === 'number' ? [] : {} : valueFn(pointer[key]);
@@ -121,26 +98,21 @@ function requestValidate(form, field) {
 }
 function getFormElement(element) {
   var form = element instanceof HTMLFormElement ? element : element === null || element === void 0 ? void 0 : element.form;
-
   if (!form) {
     return null;
   }
-
   return form;
 }
 function focusFirstInvalidField(form) {
   var currentFocus = document.activeElement;
-
   if (!isFieldElement(currentFocus) || currentFocus.tagName !== 'BUTTON' || currentFocus.form !== form) {
     return;
   }
-
-  for (var _field of form.elements) {
-    if (isFieldElement(_field)) {
+  for (var field of form.elements) {
+    if (isFieldElement(field)) {
       // Focus on the first non button field
-      if (!_field.validity.valid && _field.dataset.conformTouched && _field.tagName !== 'BUTTON') {
-        _field.focus();
-
+      if (!field.validity.valid && field.dataset.conformTouched && field.tagName !== 'BUTTON') {
+        field.focus();
         break;
       }
     }
@@ -148,36 +120,30 @@ function focusFirstInvalidField(form) {
 }
 function getSubmissionType(name) {
   var prefix = 'conform/';
-
   if (!name.startsWith(prefix) || name.length <= prefix.length) {
     return null;
   }
-
   return name.slice(prefix.length);
 }
 function parse(payload) {
   var hasCommand = false;
   var submission = {
-    context: 'submit',
+    type: 'submit',
     value: {},
     error: []
   };
-
   try {
     var _loop = function _loop(name, value) {
       var submissionType = getSubmissionType(name);
-
       if (submissionType) {
         if (typeof value !== 'string') {
           throw new Error('The conform command could not be used on a file input');
         }
-
         if (hasCommand) {
           throw new Error('The conform command could only be set on a button');
         }
-
         submission = _rollupPluginBabelHelpers.objectSpread2(_rollupPluginBabelHelpers.objectSpread2({}, submission), {}, {
-          context: submissionType,
+          type: submissionType,
           intent: value
         });
         hasCommand = true;
@@ -187,17 +153,14 @@ function parse(payload) {
           if (prev) {
             throw new Error('Entry with the same name is not supported');
           }
-
           return value;
         });
       }
     };
-
     for (var [name, value] of payload.entries()) {
       _loop(name, value);
     }
-
-    switch (submission.context) {
+    switch (submission.type) {
       case 'list':
         submission = handleList(submission);
         break;
@@ -205,17 +168,14 @@ function parse(payload) {
   } catch (e) {
     submission.error.push(['', e instanceof Error ? e.message : 'Invalid payload received']);
   }
-
   return submission;
 }
 function parseListCommand(data) {
   try {
     var command = JSON.parse(data);
-
     if (typeof command.type !== 'string' || !['prepend', 'append', 'replace', 'remove', 'reorder'].includes(command.type)) {
       throw new Error('Unsupported list command type');
     }
-
     return command;
   } catch (error) {
     throw new Error("Invalid list command: \"".concat(data, "\"; ").concat(error));
@@ -228,47 +188,38 @@ function updateList(list, command) {
         list.unshift(command.payload.defaultValue);
         break;
       }
-
     case 'append':
       {
         list.push(command.payload.defaultValue);
         break;
       }
-
     case 'replace':
       {
         list.splice(command.payload.index, 1, command.payload.defaultValue);
         break;
       }
-
     case 'remove':
       list.splice(command.payload.index, 1);
       break;
-
     case 'reorder':
       list.splice(command.payload.to, 0, ...list.splice(command.payload.from, 1));
       break;
-
     default:
       throw new Error('Unknown list command received');
   }
-
   return list;
 }
 function handleList(submission) {
   var _submission$intent;
-
-  if (submission.context !== 'list') {
+  if (submission.type !== 'list') {
     return submission;
   }
-
   var command = parseListCommand((_submission$intent = submission.intent) !== null && _submission$intent !== void 0 ? _submission$intent : '');
   var paths = getPaths(command.scope);
   setValue(submission.value, paths, list => {
     if (!Array.isArray(list)) {
       throw new Error('The list command can only be applied to a list');
     }
-
     return updateList(list, command);
   });
   return submission;
@@ -277,7 +228,7 @@ function handleList(submission) {
 exports.focusFirstInvalidField = focusFirstInvalidField;
 exports.getFormData = getFormData;
 exports.getFormElement = getFormElement;
-exports.getFormError = getFormError;
+exports.getFormElements = getFormElements;
 exports.getName = getName;
 exports.getPaths = getPaths;
 exports.getSubmissionType = getSubmissionType;

package/module/_virtual/_rollupPluginBabelHelpers.js

@@ -1,16 +1,13 @@
 function ownKeys(object, enumerableOnly) {
   var keys = Object.keys(object);
-
   if (Object.getOwnPropertySymbols) {
     var symbols = Object.getOwnPropertySymbols(object);
     enumerableOnly && (symbols = symbols.filter(function (sym) {
       return Object.getOwnPropertyDescriptor(object, sym).enumerable;
     })), keys.push.apply(keys, symbols);
   }
-
   return keys;
 }
-
 function _objectSpread2(target) {
   for (var i = 1; i < arguments.length; i++) {
     var source = null != arguments[i] ? arguments[i] : {};
@@ -20,10 +17,8 @@ function _objectSpread2(target) {
       Object.defineProperty(target, key, Object.getOwnPropertyDescriptor(source, key));
     });
   }
-
   return target;
 }
-
 function _defineProperty(obj, key, value) {
   if (key in obj) {
     Object.defineProperty(obj, key, {
@@ -35,7 +30,6 @@ function _defineProperty(obj, key, value) {
   } else {
     obj[key] = value;
   }
-
   return obj;
 }
 

package/module/index.js

@@ -3,34 +3,30 @@ import { objectSpread2 as _objectSpread2 } from './_virtual/_rollupPluginBabelHe
 function isFieldElement(element) {
   return element instanceof Element && (element.tagName === 'INPUT' || element.tagName === 'SELECT' || element.tagName === 'TEXTAREA' || element.tagName === 'BUTTON');
 }
+function getFormElements(form) {
+  return Array.from(form.elements).filter(isFieldElement);
+}
 function getPaths(name) {
   var pattern = /(\w*)\[(\d+)\]/;
-
   if (!name) {
     return [];
   }
-
   return name.split('.').flatMap(key => {
     var matches = pattern.exec(key);
-
     if (!matches) {
       return key;
     }
-
     if (matches[1] === '') {
       return Number(matches[2]);
     }
-
     return [matches[1], Number(matches[2])];
   });
 }
 function getFormData(form, submitter) {
   var payload = new FormData(form);
-
   if (submitter !== null && submitter !== void 0 && submitter.name) {
     payload.append(submitter.name, submitter.value);
   }
-
   return payload;
 }
 function getName(paths) {
@@ -38,43 +34,26 @@ function getName(paths) {
     if (typeof path === 'number') {
       return "".concat(name, "[").concat(path, "]");
     }
-
     if (name === '' || path === '') {
       return [name, path].join('');
     }
-
     return [name, path].join('.');
   }, '');
 }
 function shouldValidate(submission, name) {
-  return submission.context === 'submit' || submission.context === 'validate' && submission.intent === name;
+  return submission.type === 'submit' || submission.type === 'validate' && (typeof name === 'undefined' || submission.intent === name);
 }
-function hasError(error, names) {
+function hasError(error, name) {
   return typeof error.find(_ref => {
     var [fieldName, message] = _ref;
-    return (typeof names === 'undefined' || names.includes(fieldName)) && message !== '';
+    return (typeof name === 'undefined' || name === fieldName) && message !== '';
   }) !== 'undefined';
 }
-function getFormError(form, getFieldError) {
-  var error = [];
-
-  for (var element of form.elements) {
-    if (isFieldElement(element) && element.willValidate) {
-      var _getFieldError;
-
-      error.push(...((_getFieldError = getFieldError === null || getFieldError === void 0 ? void 0 : getFieldError(element)) !== null && _getFieldError !== void 0 ? _getFieldError : [[element.name, element.validationMessage]]));
-    }
-  }
-
-  return error;
-}
 function setFormError(form, submission) {
   var firstErrorByName = Object.fromEntries([...submission.error].reverse());
-
   for (var element of form.elements) {
     if (isFieldElement(element)) {
       var error = firstErrorByName[element.name];
-
       if (typeof error !== 'undefined' || shouldValidate(submission, element.name)) {
         element.setCustomValidity(error !== null && error !== void 0 ? error : '');
       }
@@ -86,10 +65,8 @@ function setValue(target, paths, valueFn) {
   var lastIndex = length - 1;
   var index = -1;
   var pointer = target;
-
   while (pointer != null && ++index < length) {
     var _pointer$key;
-
     var key = paths[index];
     var next = paths[index + 1];
     var newValue = index != lastIndex ? (_pointer$key = pointer[key]) !== null && _pointer$key !== void 0 ? _pointer$key : typeof next === 'number' ? [] : {} : valueFn(pointer[key]);
@@ -117,26 +94,21 @@ function requestValidate(form, field) {
 }
 function getFormElement(element) {
   var form = element instanceof HTMLFormElement ? element : element === null || element === void 0 ? void 0 : element.form;
-
   if (!form) {
     return null;
   }
-
   return form;
 }
 function focusFirstInvalidField(form) {
   var currentFocus = document.activeElement;
-
   if (!isFieldElement(currentFocus) || currentFocus.tagName !== 'BUTTON' || currentFocus.form !== form) {
     return;
   }
-
-  for (var _field of form.elements) {
-    if (isFieldElement(_field)) {
+  for (var field of form.elements) {
+    if (isFieldElement(field)) {
       // Focus on the first non button field
-      if (!_field.validity.valid && _field.dataset.conformTouched && _field.tagName !== 'BUTTON') {
-        _field.focus();
-
+      if (!field.validity.valid && field.dataset.conformTouched && field.tagName !== 'BUTTON') {
+        field.focus();
         break;
       }
     }
@@ -144,36 +116,30 @@ function focusFirstInvalidField(form) {
 }
 function getSubmissionType(name) {
   var prefix = 'conform/';
-
   if (!name.startsWith(prefix) || name.length <= prefix.length) {
     return null;
   }
-
   return name.slice(prefix.length);
 }
 function parse(payload) {
   var hasCommand = false;
   var submission = {
-    context: 'submit',
+    type: 'submit',
     value: {},
     error: []
   };
-
   try {
     var _loop = function _loop(name, value) {
       var submissionType = getSubmissionType(name);
-
       if (submissionType) {
         if (typeof value !== 'string') {
           throw new Error('The conform command could not be used on a file input');
         }
-
         if (hasCommand) {
           throw new Error('The conform command could only be set on a button');
         }
-
         submission = _objectSpread2(_objectSpread2({}, submission), {}, {
-          context: submissionType,
+          type: submissionType,
           intent: value
         });
         hasCommand = true;
@@ -183,17 +149,14 @@ function parse(payload) {
           if (prev) {
             throw new Error('Entry with the same name is not supported');
           }
-
           return value;
         });
       }
     };
-
     for (var [name, value] of payload.entries()) {
       _loop(name, value);
     }
-
-    switch (submission.context) {
+    switch (submission.type) {
       case 'list':
         submission = handleList(submission);
         break;
@@ -201,17 +164,14 @@ function parse(payload) {
   } catch (e) {
     submission.error.push(['', e instanceof Error ? e.message : 'Invalid payload received']);
   }
-
   return submission;
 }
 function parseListCommand(data) {
   try {
     var command = JSON.parse(data);
-
     if (typeof command.type !== 'string' || !['prepend', 'append', 'replace', 'remove', 'reorder'].includes(command.type)) {
       throw new Error('Unsupported list command type');
     }
-
     return command;
   } catch (error) {
     throw new Error("Invalid list command: \"".concat(data, "\"; ").concat(error));
@@ -224,50 +184,41 @@ function updateList(list, command) {
         list.unshift(command.payload.defaultValue);
         break;
       }
-
     case 'append':
       {
         list.push(command.payload.defaultValue);
         break;
       }
-
     case 'replace':
       {
         list.splice(command.payload.index, 1, command.payload.defaultValue);
         break;
       }
-
     case 'remove':
       list.splice(command.payload.index, 1);
       break;
-
     case 'reorder':
       list.splice(command.payload.to, 0, ...list.splice(command.payload.from, 1));
       break;
-
     default:
       throw new Error('Unknown list command received');
   }
-
   return list;
 }
 function handleList(submission) {
   var _submission$intent;
-
-  if (submission.context !== 'list') {
+  if (submission.type !== 'list') {
     return submission;
   }
-
   var command = parseListCommand((_submission$intent = submission.intent) !== null && _submission$intent !== void 0 ? _submission$intent : '');
   var paths = getPaths(command.scope);
   setValue(submission.value, paths, list => {
     if (!Array.isArray(list)) {
       throw new Error('The list command can only be applied to a list');
     }
-
     return updateList(list, command);
   });
   return submission;
 }
 
-export { focusFirstInvalidField, getFormData, getFormElement, getFormError, getName, getPaths, getSubmissionType, handleList, hasError, isFieldElement, parse, parseListCommand, requestSubmit, requestValidate, setFormError, setValue, shouldValidate, updateList };
+export { focusFirstInvalidField, getFormData, getFormElement, getFormElements, getName, getPaths, getSubmissionType, handleList, hasError, isFieldElement, parse, parseListCommand, requestSubmit, requestValidate, setFormError, setValue, shouldValidate, updateList };

package/package.json

@@ -2,7 +2,7 @@
 	"name": "@conform-to/dom",
 	"description": "A set of opinionated helpers built on top of the Constraint Validation API",
 	"license": "MIT",
-	"version": "0.4.0-pre.2",
+	"version": "0.4.0",
 	"main": "index.js",
 	"module": "module/index.js",
 	"repository": {