134 lines
5.8 KiB
JSON
134 lines
5.8 KiB
JSON
|
|
{
|
||
|
|
"componentDescription": "",
|
||
|
|
"propDescriptions": {
|
||
|
|
"checked": { "description": "If <code>true</code>, the component is checked." },
|
||
|
|
"checkedIcon": { "description": "The icon to display when the component is checked." },
|
||
|
|
"className": { "description": "Class name applied to the root element." },
|
||
|
|
"color": {
|
||
|
|
"description": "The color of the component. It supports those theme colors that make sense for this component."
|
||
|
|
},
|
||
|
|
"component": {
|
||
|
|
"description": "The component used for the root node. Either a string to use a HTML element or a component."
|
||
|
|
},
|
||
|
|
"defaultChecked": {
|
||
|
|
"description": "The default checked state. Use when the component is not controlled."
|
||
|
|
},
|
||
|
|
"disabled": { "description": "If <code>true</code>, the component is disabled." },
|
||
|
|
"disableIcon": {
|
||
|
|
"description": "If <code>true</code>, the checked icon is removed and the selected variant is applied on the <code>action</code> element instead."
|
||
|
|
},
|
||
|
|
"label": { "description": "The label element at the end the radio." },
|
||
|
|
"name": { "description": "The <code>name</code> attribute of the input." },
|
||
|
|
"onChange": {
|
||
|
|
"description": "Callback fired when the state is changed.",
|
||
|
|
"typeDescriptions": {
|
||
|
|
"event": {
|
||
|
|
"name": "event",
|
||
|
|
"description": "The event source of the callback. You can pull out the new value by accessing <code>event.target.value</code> (string). You can pull out the new checked state by accessing <code>event.target.checked</code> (boolean)."
|
||
|
|
}
|
||
|
|
}
|
||
|
|
},
|
||
|
|
"overlay": {
|
||
|
|
"description": "If <code>true</code>, the root element's position is set to initial which allows the action area to fill the nearest positioned parent. This prop is useful for composing Radio with ListItem component."
|
||
|
|
},
|
||
|
|
"readOnly": { "description": "If <code>true</code>, the component is read only." },
|
||
|
|
"required": {
|
||
|
|
"description": "If <code>true</code>, the <code>input</code> element is required."
|
||
|
|
},
|
||
|
|
"size": { "description": "The size of the component." },
|
||
|
|
"slotProps": { "description": "The props used for each slot inside." },
|
||
|
|
"slots": { "description": "The components used for each slot inside." },
|
||
|
|
"sx": {
|
||
|
|
"description": "The system prop that allows defining system overrides as well as additional CSS styles."
|
||
|
|
},
|
||
|
|
"uncheckedIcon": { "description": "The icon to display when the component is not checked." },
|
||
|
|
"value": { "description": "The value of the component. The DOM API casts this to a string." },
|
||
|
|
"variant": {
|
||
|
|
"description": "The <a href=\"https://mui.com/joy-ui/main-features/global-variants/\">global variant</a> to use."
|
||
|
|
}
|
||
|
|
},
|
||
|
|
"classDescriptions": {
|
||
|
|
"checked": {
|
||
|
|
"description": "State class applied to {{nodeName}}, {{conditions}}.",
|
||
|
|
"nodeName": "the root",
|
||
|
|
"conditions": "action slots if <code>checked</code>"
|
||
|
|
},
|
||
|
|
"colorContext": {
|
||
|
|
"description": "Class name applied to {{nodeName}} when {{conditions}}.",
|
||
|
|
"nodeName": "the root element",
|
||
|
|
"conditions": "color inversion is triggered"
|
||
|
|
},
|
||
|
|
"colorDanger": {
|
||
|
|
"description": "Class name applied to {{nodeName}} if {{conditions}}.",
|
||
|
|
"nodeName": "the root element",
|
||
|
|
"conditions": "<code>color=\"danger\"</code>"
|
||
|
|
},
|
||
|
|
"colorNeutral": {
|
||
|
|
"description": "Class name applied to {{nodeName}} if {{conditions}}.",
|
||
|
|
"nodeName": "the root element",
|
||
|
|
"conditions": "<code>color=\"neutral\"</code>"
|
||
|
|
},
|
||
|
|
"colorPrimary": {
|
||
|
|
"description": "Class name applied to {{nodeName}} if {{conditions}}.",
|
||
|
|
"nodeName": "the root element",
|
||
|
|
"conditions": "<code>color=\"primary\"</code>"
|
||
|
|
},
|
||
|
|
"colorSuccess": {
|
||
|
|
"description": "Class name applied to {{nodeName}} if {{conditions}}.",
|
||
|
|
"nodeName": "the root element",
|
||
|
|
"conditions": "<code>color=\"success\"</code>"
|
||
|
|
},
|
||
|
|
"colorWarning": {
|
||
|
|
"description": "Class name applied to {{nodeName}} if {{conditions}}.",
|
||
|
|
"nodeName": "the root element",
|
||
|
|
"conditions": "<code>color=\"warning\"</code>"
|
||
|
|
},
|
||
|
|
"disabled": {
|
||
|
|
"description": "State class applied to {{nodeName}}, {{conditions}}.",
|
||
|
|
"nodeName": "the root",
|
||
|
|
"conditions": "action slots if <code>disabled</code>"
|
||
|
|
},
|
||
|
|
"focusVisible": {
|
||
|
|
"description": "Class name applied to the root element if the switch has visible focus"
|
||
|
|
},
|
||
|
|
"sizeLg": {
|
||
|
|
"description": "Class name applied to {{nodeName}} if {{conditions}}.",
|
||
|
|
"nodeName": "the root element",
|
||
|
|
"conditions": "<code>size=\"lg\"</code>"
|
||
|
|
},
|
||
|
|
"sizeMd": {
|
||
|
|
"description": "Class name applied to {{nodeName}} if {{conditions}}.",
|
||
|
|
"nodeName": "the root element",
|
||
|
|
"conditions": "<code>size=\"md\"</code>"
|
||
|
|
},
|
||
|
|
"sizeSm": {
|
||
|
|
"description": "Class name applied to {{nodeName}} if {{conditions}}.",
|
||
|
|
"nodeName": "the root element",
|
||
|
|
"conditions": "<code>size=\"sm\"</code>"
|
||
|
|
},
|
||
|
|
"variantOutlined": {
|
||
|
|
"description": "Class name applied to {{nodeName}} if {{conditions}}.",
|
||
|
|
"nodeName": "the root element",
|
||
|
|
"conditions": "<code>variant=\"outlined\"</code>"
|
||
|
|
},
|
||
|
|
"variantSoft": {
|
||
|
|
"description": "Class name applied to {{nodeName}} if {{conditions}}.",
|
||
|
|
"nodeName": "the root element",
|
||
|
|
"conditions": "<code>variant=\"soft\"</code>"
|
||
|
|
},
|
||
|
|
"variantSolid": {
|
||
|
|
"description": "Class name applied to {{nodeName}} if {{conditions}}.",
|
||
|
|
"nodeName": "the root element",
|
||
|
|
"conditions": "<code>variant=\"solid\"</code>"
|
||
|
|
}
|
||
|
|
},
|
||
|
|
"slotDescriptions": {
|
||
|
|
"action": "The component that renders the action.",
|
||
|
|
"icon": "The component that renders the icon.",
|
||
|
|
"input": "The component that renders the input.",
|
||
|
|
"label": "The component that renders the label.",
|
||
|
|
"radio": "The component that renders the radio.",
|
||
|
|
"root": "The component that renders the root."
|
||
|
|
}
|
||
|
|
}
|