[docs] Explain how the error prop works in the Unstyled Input (mui#…

…35171)
jesrodri · Dec 6, 2022 · 16a01e5 · 16a01e5
1 parent 6a82d3a
commit 16a01e5
Show file tree

Hide file tree

Showing 4 changed files with 9 additions and 4 deletions.
diff --git a/docs/translations/api-docs/input-unstyled/input-unstyled.json b/docs/translations/api-docs/input-unstyled/input-unstyled.json
@@ -8,7 +8,7 @@
     "defaultValue": "The default value. Use when the component is not controlled.",
     "disabled": "If <code>true</code>, the component is disabled. The prop defaults to the value (<code>false</code>) inherited from the parent FormControl component.",
     "endAdornment": "Trailing adornment for this input.",
-    "error": "If <code>true</code>, the <code>input</code> will indicate an error. The prop defaults to the value (<code>false</code>) inherited from the parent FormControl component.",
+    "error": "If <code>true</code>, the <code>input</code> will indicate an error by setting the <code>aria-invalid</code> attribute on the input and the <code>Mui-error</code> class on the root element. The prop defaults to the value (<code>false</code>) inherited from the parent FormControl component.",
     "id": "The id of the <code>input</code> element.",
     "maxRows": "Maximum number of rows to display when multiline option is set to true.",
     "minRows": "Minimum number of rows to display when multiline option is set to true.",

diff --git a/packages/mui-base/src/InputUnstyled/InputUnstyled.tsx b/packages/mui-base/src/InputUnstyled/InputUnstyled.tsx
@@ -229,7 +229,7 @@ InputUnstyled.propTypes /* remove-proptypes */ = {
    */
   endAdornment: PropTypes.node,
   /**
-   * If `true`, the `input` will indicate an error.
+   * If `true`, the `input` will indicate an error by setting the `aria-invalid` attribute on the input and the `Mui-error` class on the root element.
    * The prop defaults to the value (`false`) inherited from the parent FormControl component.
    */
   error: PropTypes.bool,

diff --git a/packages/mui-base/src/InputUnstyled/InputUnstyled.types.ts b/packages/mui-base/src/InputUnstyled/InputUnstyled.types.ts
@@ -57,7 +57,7 @@ export interface MultiLineInputUnstyledProps {
 }
 
 export type InputUnstyledOwnProps = (SingleLineInputUnstyledProps | MultiLineInputUnstyledProps) &
-  UseInputParameters & {
+  Omit<UseInputParameters, 'error'> & {
     'aria-describedby'?: string;
     'aria-label'?: string;
     'aria-labelledby'?: string;
@@ -79,6 +79,11 @@ export type InputUnstyledOwnProps = (SingleLineInputUnstyledProps | MultiLineInp
      * Trailing adornment for this input.
      */
     endAdornment?: React.ReactNode;
+    /**
+     * If `true`, the `input` will indicate an error by setting the `aria-invalid` attribute on the input and the `Mui-error` class on the root element.
+     * The prop defaults to the value (`false`) inherited from the parent FormControl component.
+     */
+    error?: boolean;
     /**
      * The id of the `input` element.
      */

diff --git a/packages/mui-base/src/InputUnstyled/useInput.types.ts b/packages/mui-base/src/InputUnstyled/useInput.types.ts
@@ -11,7 +11,7 @@ export interface UseInputParameters {
    */
   disabled?: boolean;
   /**
-   * If `true`, the `input` will indicate an error.
+   * If `true`, the `input` will indicate an error by setting the `aria-invalid` attribute.
    * The prop defaults to the value (`false`) inherited from the parent FormControl component.
    */
   error?: boolean;