{
  "componentDescription": "An alternative to `<Select native />` with a much smaller bundle size footprint.",
  "propDescriptions": {
    "children": {
      "description": "The option elements to populate the select with. Can be some <code>&lt;option&gt;</code> elements."
    },
    "classes": { "description": "Override or extend the styles applied to the component." },
    "IconComponent": { "description": "The icon that displays the arrow." },
    "input": {
      "description": "An <code>Input</code> element; does not have to be a material-ui specific <code>Input</code>."
    },
    "inputProps": {
      "description": "<a href=\"https://developer.mozilla.org/en-US/docs/Web/HTML/Reference/Elements/select#attributes\">Attributes</a> applied to the <code>select</code> element."
    },
    "onChange": {
      "description": "Callback fired when a menu item is selected.",
      "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)."
        }
      }
    },
    "sx": {
      "description": "The system prop that allows defining system overrides as well as additional CSS styles."
    },
    "value": { "description": "The <code>input</code> value. The DOM API casts this to a string." },
    "variant": { "description": "The variant to use." }
  },
  "classDescriptions": {
    "disabled": {
      "description": "State class applied to {{nodeName}}.",
      "nodeName": "the select component <code>disabled</code> class"
    },
    "error": {
      "description": "State class applied to {{nodeName}}.",
      "nodeName": "the select component <code>error</code> class"
    },
    "filled": {
      "description": "Styles applied to {{nodeName}} if {{conditions}}.",
      "nodeName": "the select component",
      "conditions": "<code>variant=\"filled\"</code>"
    },
    "icon": { "description": "Styles applied to {{nodeName}}.", "nodeName": "the icon component" },
    "iconFilled": {
      "description": "Styles applied to {{nodeName}} if {{conditions}}.",
      "nodeName": "the icon component",
      "conditions": "<code>variant=\"filled\"</code>"
    },
    "iconOpen": {
      "description": "Styles applied to {{nodeName}} if {{conditions}}.",
      "nodeName": "the icon component",
      "conditions": "the popup is open"
    },
    "iconOutlined": {
      "description": "Styles applied to {{nodeName}} if {{conditions}}.",
      "nodeName": "the icon component",
      "conditions": "<code>variant=\"outlined\"</code>"
    },
    "iconStandard": {
      "description": "Styles applied to {{nodeName}} if {{conditions}}.",
      "nodeName": "the icon component",
      "conditions": "<code>variant=\"standard\"</code>"
    },
    "multiple": {
      "description": "Styles applied to {{nodeName}} if {{conditions}}.",
      "nodeName": "the select component",
      "conditions": "<code>multiple={true}</code>"
    },
    "nativeInput": {
      "description": "Styles applied to {{nodeName}}.",
      "nodeName": "the underlying native input component"
    },
    "outlined": {
      "description": "Styles applied to {{nodeName}} if {{conditions}}.",
      "nodeName": "the select component",
      "conditions": "<code>variant=\"outlined\"</code>"
    },
    "root": { "description": "Styles applied to the root element." },
    "select": {
      "description": "Styles applied to {{nodeName}}.",
      "nodeName": "the select component <code>select</code> class"
    },
    "standard": {
      "description": "Styles applied to {{nodeName}} if {{conditions}}.",
      "nodeName": "the select component",
      "conditions": "<code>variant=\"standard\"</code>"
    }
  }
}