[FormControl][base] Do not use optional fields in useFormControlConte…

…xt's return value (mui#37037)
joserodolfofreitas · Apr 27, 2023 · 498f55b · 498f55b
1 parent f4f3164
commit 498f55b
Show file tree

Hide file tree

Showing 2 changed files with 48 additions and 31 deletions.
diff --git a/docs/pages/base/api/use-form-control-context.json b/docs/pages/base/api/use-form-control-context.json
@@ -1,26 +1,27 @@
 {
   "parameters": {},
   "returnValue": {
+    "disabled": { "type": { "name": "boolean", "description": "boolean" }, "required": true },
+    "error": { "type": { "name": "boolean", "description": "boolean" }, "required": true },
     "filled": { "type": { "name": "boolean", "description": "boolean" }, "required": true },
     "focused": { "type": { "name": "boolean", "description": "boolean" }, "required": true },
     "onBlur": {
       "type": { "name": "() =&gt; void", "description": "() =&gt; void" },
       "required": true
     },
-    "onFocus": {
-      "type": { "name": "() =&gt; void", "description": "() =&gt; void" },
-      "required": true
-    },
-    "disabled": { "type": { "name": "boolean", "description": "boolean" }, "default": "false" },
-    "error": { "type": { "name": "boolean", "description": "boolean" }, "default": "false" },
     "onChange": {
       "type": {
         "name": "React.ChangeEventHandler&lt;NativeFormControlElement&gt;",
         "description": "React.ChangeEventHandler&lt;NativeFormControlElement&gt;"
-      }
+      },
+      "required": true
+    },
+    "onFocus": {
+      "type": { "name": "() =&gt; void", "description": "() =&gt; void" },
+      "required": true
     },
-    "required": { "type": { "name": "boolean", "description": "boolean" }, "default": "false" },
-    "value": { "type": { "name": "unknown", "description": "unknown" } }
+    "required": { "type": { "name": "boolean", "description": "boolean" }, "required": true },
+    "value": { "type": { "name": "unknown", "description": "unknown" }, "required": true }
   },
   "name": "useFormControlContext",
   "filename": "/packages/mui-base/src/FormControl/useFormControlContext.ts",

diff --git a/packages/mui-base/src/FormControl/FormControl.types.ts b/packages/mui-base/src/FormControl/FormControl.types.ts
@@ -86,28 +86,44 @@ export type FormControlOwnerState = Simplify<
     }
 >;
 
-type ContextFromPropsKey = 'disabled' | 'error' | 'onChange' | 'required' | 'value';
-
-export type FormControlState = Simplify<
-  Pick<FormControlProps, ContextFromPropsKey> & {
-    /**
-     * If `true`, the form element has some value.
-     */
-    filled: boolean;
-    /**
-     * If `true`, the form element is focused and not disabled.
-     */
-    focused: boolean;
-    /**
-     * Callback fired when the form element has lost focus.
-     */
-    onBlur: () => void;
-    /**
-     * Callback fired when the form element receives focus.
-     */
-    onFocus: () => void;
-  }
->;
+export type FormControlState = {
+  /**
+   * If `true`, the label, input and helper text should be displayed in a disabled state.
+   */
+  disabled: boolean;
+  /**
+   * If `true`, the label is displayed in an error state.
+   */
+  error: boolean;
+  /**
+   * If `true`, the form element has some value.
+   */
+  filled: boolean;
+  /**
+   * If `true`, the form element is focused and not disabled.
+   */
+  focused: boolean;
+  /**
+   * Callback fired when the form element has lost focus.
+   */
+  onBlur: () => void;
+  /**
+   * Callback fired when the form element's value is modified.
+   */
+  onChange: React.ChangeEventHandler<NativeFormControlElement>;
+  /**
+   * Callback fired when the form element receives focus.
+   */
+  onFocus: () => void;
+  /**
+   * If `true`, the label will indicate that the `input` is required.
+   */
+  required: boolean;
+  /**
+   * The value of the form element.
+   */
+  value: unknown;
+};
 
 export type FormControlRootSlotProps = {
   children: React.ReactNode | ((state: FormControlState) => React.ReactNode);