Added documentations for indeterminateIcon prop.

mui · Sep 30, 2024 · a553138 · a553138
1 parent f38d286
commit a553138
Show file tree

Hide file tree

Showing 4 changed files with 7 additions and 0 deletions.
diff --git a/docs/data/material/components/checkboxes/IndeterminateCheckbox.js b/docs/data/material/components/checkboxes/IndeterminateCheckbox.js
@@ -2,6 +2,7 @@ import * as React from 'react';
 import Box from '@mui/material/Box';
 import Checkbox from '@mui/material/Checkbox';
 import FormControlLabel from '@mui/material/FormControlLabel';
+import IndeterminateCheckBox from '@mui/icons-material/IndeterminateCheckBox';
 
 export default function IndeterminateCheckbox() {
   const [checked, setChecked] = React.useState([true, false]);
@@ -40,6 +41,7 @@ export default function IndeterminateCheckbox() {
             checked={checked[0] && checked[1]}
             indeterminate={checked[0] !== checked[1]}
             onChange={handleChange1}
+            indeterminateIcon={<IndeterminateCheckBox />}
           />
         }
       />

diff --git a/docs/data/material/components/checkboxes/IndeterminateCheckbox.tsx b/docs/data/material/components/checkboxes/IndeterminateCheckbox.tsx
@@ -2,6 +2,8 @@ import * as React from 'react';
 import Box from '@mui/material/Box';
 import Checkbox from '@mui/material/Checkbox';
 import FormControlLabel from '@mui/material/FormControlLabel';
+import IndeterminateCheckBox from '@mui/icons-material/IndeterminateCheckBox';
+
 
 export default function IndeterminateCheckbox() {
   const [checked, setChecked] = React.useState([true, false]);
@@ -40,6 +42,7 @@ export default function IndeterminateCheckbox() {
             checked={checked[0] && checked[1]}
             indeterminate={checked[0] !== checked[1]}
             onChange={handleChange1}
+            indeterminateIcon={<IndeterminateCheckBox />}
           />
         }
       />

diff --git a/docs/data/material/components/checkboxes/IndeterminateCheckbox.tsx.preview b/docs/data/material/components/checkboxes/IndeterminateCheckbox.tsx.preview
@@ -5,6 +5,7 @@
       checked={checked[0] && checked[1]}
       indeterminate={checked[0] !== checked[1]}
       onChange={handleChange1}
+      indeterminateIcon={<IndeterminateCheckBox />}
     />
   }
 />

diff --git a/docs/data/material/components/checkboxes/checkboxes.md b/docs/data/material/components/checkboxes/checkboxes.md
@@ -55,6 +55,7 @@ You can control the checkbox with the `checked` and `onChange` props:
 A checkbox input can only have two states in a form: checked or unchecked.
 It either submits its value or doesn't.
 Visually, there are **three** states a checkbox can be in: checked, unchecked, or indeterminate.
+To design the indeterminate icon you can use the `indeterminateIcon` prop.
 
 {{"demo": "IndeterminateCheckbox.js"}}