react-test/docs/translations/api-docs/toggle-button/toggle-button.json

{
  "componentDescription": "",
  "propDescriptions": {
    "children": { "description": "The content of the component." },
    "classes": { "description": "Override or extend the styles applied to the component." },
    "color": {
      "description": "The color of the button when it is in an active state. It supports both default and custom theme colors, which can be added as shown in the <a href=\"https://mui.com/material-ui/customization/palette/#custom-colors\">palette customization guide</a>."
    },
    "disabled": { "description": "If <code>true</code>, the component is disabled." },
    "disableFocusRipple": {
      "description": "If <code>true</code>, the  keyboard focus ripple is disabled."
    },
    "disableRipple": {
      "description": "If <code>true</code>, the ripple effect is disabled.<br>⚠️ Without a ripple there is no styling for :focus-visible by default. Be sure to highlight the element by applying separate styles with the <code>.Mui-focusVisible</code> class."
    },
    "fullWidth": {
      "description": "If <code>true</code>, the button will take up the full width of its container."
    },
    "onChange": {
      "description": "Callback fired when the state changes.",
      "typeDescriptions": {
        "event": { "name": "event", "description": "The event source of the callback." },
        "value": { "name": "value", "description": "of the selected button." }
      }
    },
    "onClick": {
      "description": "Callback fired when the button is clicked.",
      "typeDescriptions": {
        "event": { "name": "event", "description": "The event source of the callback." },
        "value": { "name": "value", "description": "of the selected button." }
      }
    },
    "selected": {
      "description": "If <code>true</code>, the button is rendered in an active state."
    },
    "size": {
      "description": "The size of the component. The prop defaults to the value inherited from the parent ToggleButtonGroup component."
    },
    "sx": {
      "description": "The system prop that allows defining system overrides as well as additional CSS styles."
    },
    "value": {
      "description": "The value to associate with the button when selected in a ToggleButtonGroup."
    }
  },
  "classDescriptions": {
    "disabled": {
      "description": "State class applied to {{nodeName}} if {{conditions}}.",
      "nodeName": "the root element",
      "conditions": "<code>disabled={true}</code>"
    },
    "fullWidth": {
      "description": "Styles applied to {{nodeName}} if {{conditions}}.",
      "nodeName": "the root element",
      "conditions": "<code>fullWidth={true}</code>"
    },
    "primary": {
      "description": "State class applied to {{nodeName}} if {{conditions}}.",
      "nodeName": "the root element",
      "conditions": "<code>color=\"primary\"</code>"
    },
    "root": { "description": "Styles applied to the root element." },
    "secondary": {
      "description": "State class applied to {{nodeName}} if {{conditions}}.",
      "nodeName": "the root element",
      "conditions": "<code>color=\"secondary\"</code>"
    },
    "selected": {
      "description": "State class applied to {{nodeName}} if {{conditions}}.",
      "nodeName": "the root element",
      "conditions": "<code>selected={true}</code>"
    },
    "sizeLarge": {
      "description": "Styles applied to {{nodeName}} if {{conditions}}.",
      "nodeName": "the root element",
      "conditions": "<code>size=\"large\"</code>"
    },
    "sizeMedium": {
      "description": "Styles applied to {{nodeName}} if {{conditions}}.",
      "nodeName": "the root element",
      "conditions": "<code>size=\"medium\"</code>"
    },
    "sizeSmall": {
      "description": "Styles applied to {{nodeName}} if {{conditions}}.",
      "nodeName": "the root element",
      "conditions": "<code>size=\"small\"</code>"
    },
    "standard": {
      "description": "State class applied to {{nodeName}} if {{conditions}}.",
      "nodeName": "the root element",
      "conditions": "<code>color=\"standard\"</code>"
    }
  }
}