Update API reference of Field and FieldArray

fabian-hiller · Sep 6, 2024 · 08a8adc · 08a8adc
1 parent 2ed97e9
commit 08a8adc
Show file tree

Hide file tree

Showing 2 changed files with 86 additions and 0 deletions.
diff --git a/website/src/routes/(layout)/[framework]/api/Field.mdx b/website/src/routes/(layout)/[framework]/api/Field.mdx
@@ -16,6 +16,8 @@ Headless form field that provides reactive properties and state.
   name={…}
   type={…}
   validate={…}
+  validateOn={…}
+  revalidateOn={…}
   transform={…}
   keepActive={…}
   keepState={…}
@@ -30,6 +32,8 @@ Headless form field that provides reactive properties and state.
 - `name` <Property type="string" />
 - `type` <Property {...properties.type} />
 - `validate` <Property {...properties[isQwik() ? 'qwik' : 'solidPreactOrReact'].validate} />
+- `validateOn` <Property {...properties[isReact() ? 'react' : 'solidQwikOrReact'].validateOn} />
+- `revalidateOn` <Property {...properties[isReact() ? 'react' : 'solidQwikOrReact'].revalidateOn} />
 - `transform` <Property {...properties[isQwik() ? 'qwik' : 'solidPreactOrReact'].transform} />
 - `keepActive` <Property {...properties.keepActive} />
 - `keepState` <Property {...properties.keepState} />
@@ -150,6 +154,28 @@ export const properties = {
       },
     },
   },
+  solidQwikOrReact: {
+    validateOn: {
+      type: [
+        { type: 'string', value: 'touched' },
+        { type: 'string', value: 'input' },
+        { type: 'string', value: 'change' },
+        { type: 'string', value: 'blur' },
+        { type: 'string', value: 'submit' },
+      ],
+      defaultValue: { type: 'string', value: 'submit' },
+    },
+    revalidateOn: {
+      type: [
+        { type: 'string', value: 'touched' },
+        { type: 'string', value: 'input' },
+        { type: 'string', value: 'change' },
+        { type: 'string', value: 'blur' },
+        { type: 'string', value: 'submit' },
+      ],
+      defaultValue: { type: 'string', value: 'input' },
+    },
+  },
   qwik: {
     validate: {
       type: {
@@ -257,5 +283,23 @@ export const properties = {
         return: { type: 'custom', name: 'ReactNode' },
       },
     },
+    validateOn: {
+      type: [
+        { type: 'string', value: 'touched' },
+        { type: 'string', value: 'change' },
+        { type: 'string', value: 'blur' },
+        { type: 'string', value: 'submit' },
+      ],
+      defaultValue: { type: 'string', value: 'submit' },
+    },
+    revalidateOn: {
+      type: [
+        { type: 'string', value: 'touched' },
+        { type: 'string', value: 'change' },
+        { type: 'string', value: 'blur' },
+        { type: 'string', value: 'submit' },
+      ],
+      defaultValue: { type: 'string', value: 'change' },
+    },
   },
 };
diff --git a/website/src/routes/(layout)/[framework]/api/FieldArray.mdx b/website/src/routes/(layout)/[framework]/api/FieldArray.mdx
@@ -21,6 +21,8 @@ Headless field array that provides reactive properties and state.
 - `of` <Property {...properties.of} />
 - `name` <Property type="string" />
 - `validate` <Property {...properties[isQwik() ? 'qwik' : 'solidPreactOrReact'].validate} />
+- `validateOn` <Property {...properties[isReact() ? 'react' : 'solidQwikOrReact'].validateOn} />
+- `revalidateOn` <Property {...properties[isReact() ? 'react' : 'solidQwikOrReact'].revalidateOn} />
 - `keepActive` <Property {...properties.keepActive} />
 - `keepState` <Property {...properties.keepState} />
 - `children` <Property {...properties[isPreact() ? 'preact' : isReact() ? 'react' : 'solidOrQwik'].children} />
@@ -90,6 +92,28 @@ export const properties = {
       },
     },
   },
+  solidQwikOrReact: {
+    validateOn: {
+      type: [
+        { type: 'string', value: 'touched' },
+        { type: 'string', value: 'input' },
+        { type: 'string', value: 'change' },
+        { type: 'string', value: 'blur' },
+        { type: 'string', value: 'submit' },
+      ],
+      defaultValue: { type: 'string', value: 'submit' },
+    },
+    revalidateOn: {
+      type: [
+        { type: 'string', value: 'touched' },
+        { type: 'string', value: 'input' },
+        { type: 'string', value: 'change' },
+        { type: 'string', value: 'blur' },
+        { type: 'string', value: 'submit' },
+      ],
+      defaultValue: { type: 'string', value: 'input' },
+    },
+  },
   qwik: {
     validate: {
       type: {
@@ -154,5 +178,23 @@ export const properties = {
         return: { type: 'custom', name: 'ReactNode' },
       },
     },
+    validateOn: {
+      type: [
+        { type: 'string', value: 'touched' },
+        { type: 'string', value: 'change' },
+        { type: 'string', value: 'blur' },
+        { type: 'string', value: 'submit' },
+      ],
+      defaultValue: { type: 'string', value: 'submit' },
+    },
+    revalidateOn: {
+      type: [
+        { type: 'string', value: 'touched' },
+        { type: 'string', value: 'change' },
+        { type: 'string', value: 'blur' },
+        { type: 'string', value: 'submit' },
+      ],
+      defaultValue: { type: 'string', value: 'change' },
+    },
   },
 };