Remove form.setDefaultValues, merged with setValues

Author: CodeStix

Todo.md

@@ -3,6 +3,5 @@
 -   Combine array helpers into one object? This is usefull to pass to other components
 -   Require index for array fields
 -   Add React.forwardRef to input elements
--   Rename `setDefaultValues` to `setAllValues`
 -   Let `comparePrimitiveObject` compare deep objects too
 -   Field on blur

src/form.ts

@@ -62,12 +62,12 @@ export class FormState<T extends object, State = DefaultState, Error extends str
     public validateOnMount: boolean;
 
     /**
-     * The values on this form. Use setValues() to set these.
+     * The values on this form. Use `setValues()` to set these.
      */
     public readonly values: T;
 
     /**
-     * The default values on this form. Use setDefaultValues(...) to set these.
+     * The default values on this form. Use `setValues(?,?,true)` to set these.
      */
     public readonly defaultValues: T;
 
@@ -236,17 +236,22 @@ export class FormState<T extends object, State = DefaultState, Error extends str
      * Set multiple values OR default values on this form.
      * @param values The new values to set on this form.
      * @param validate Validate? Overrides `validateOnChange`.
-     * @param isDefault Are these values the default values for this form? This function only updates values or defaultValues, not both! To set both, use `form.setDefaultValues()`.
+     * @param isDefault Leave undefined to set both `values` and `defaultValues`. Set to true to only set `defaultValues` and false to only set `values`.
      * @param notifyChild Should this form notify the child form about this change?
      * @param notifyParent Should this form notify the parent form about this change?
      */
     public setValues(
         values: Partial<T> | undefined,
         validate?: boolean,
-        isDefault: boolean = false,
+        isDefault?: boolean,
         notifyChild: boolean = true,
         notifyParent: boolean = true
     ) {
+        if (isDefault === undefined) {
+            this.setValues(values, false, true, notifyChild, notifyParent);
+            isDefault = false;
+        }
+
         let keys = Object.keys(isDefault ? this.defaultValues : this.values);
         let v: typeof values = values ?? {};
         addDistinct(keys, Object.keys(v));
@@ -287,18 +292,6 @@ export class FormState<T extends object, State = DefaultState, Error extends str
         if (validate ?? (this.validateOnChange && this.validator)) this.validate();
     }
 
-    /**
-     * Set both values and default values for this form. If you only want to set values, use setValues(...). If you only want to set default values, use `setValues(...,...,true)`.
-     * @param values The new default values to set on this form.
-     * @param validate Validate? Overrides `validateOnChange`.
-     * @param notifyChild Should this form notify the child form about this change?
-     * @param notifyParent Should this form notify the parent form about this change?
-     */
-    public setDefaultValues(values: Partial<T>, validate: boolean = true, notifyChild: boolean = true, notifyParent: boolean = true) {
-        this.setValues(values, false, true, notifyChild, notifyParent);
-        this.setValues(values, validate, false, notifyChild, notifyParent);
-    }
-
     /**
      * Force validation on this form. Required when `validateOnChange` is disabled. **This function works with both asynchronous and synchronous validators.**
      * @returns true if the form is valid.

testing/src/Fieldform.tsx

@@ -1,5 +1,5 @@
 import React from "react";
-import { useForm, Field } from "typed-react-form";
+import { useForm, Field, AnyListener } from "typed-react-form";
 
 const inputStyle: React.CSSProperties = {
     color: "gray",
@@ -11,7 +11,7 @@ function CustomInput(props: { value: string; onChange: (val: string) => void; my
     return <input style={inputStyle} value={props.value} onChange={(ev) => props.onChange(ev.target.value)} />;
 }
 
-export default function ExampleForm() {
+export function FieldForm() {
     const form = useForm({ firstName: "", lastName: "" });
 
     function submit() {
@@ -23,6 +23,15 @@ export default function ExampleForm() {
             <Field form={form} name="firstName" as={CustomInput} myCustomProp={true} />
             <Field form={form} name="lastName" as={CustomInput} />
             <button type="submit">Go</button>
+            <button
+                type="button"
+                onClick={() => {
+                    form.setValues({ firstName: "test", lastName: "test2" }, false, true);
+                }}
+            >
+                Set values
+            </button>
+            <AnyListener form={form} render={({ dirty }) => <pre>{String(dirty)}</pre>} />
         </form>
     );
 }

testing/src/OneOfObjectArrayForm.tsx

@@ -36,7 +36,7 @@ export default function OneOfObjectArrayForm() {
                 await new Promise((res) => setTimeout(res, 500));
                 form.setState({ isSubmitting: false });
                 console.log(form.values);
-                form.setDefaultValues(form.values);
+                form.setValues(form.values);
             }}
         >
             <a href="https://github.com/CodeStix/typed-react-form/blob/master/example/src/OneOfObjectArrayForm.tsx">View source code</a>

testing/src/OneOfObjectForm.tsx

@@ -31,7 +31,7 @@ export default function OneOfObjectArrayForm() {
                 await new Promise((res) => setTimeout(res, 500));
                 form.setState({ isSubmitting: false });
                 console.log(form.values);
-                form.setDefaultValues(form.values);
+                form.setValues(form.values);
             }}
         >
             <a href="https://github.com/CodeStix/typed-react-form/blob/master/example/src/OneOfObjectForm.tsx">View source code</a>