{ "componentDescription": "## ARIA\n\nIf the progress bar is describing the loading progress of a particular region of a page,\nyou should use `aria-describedby` to point to the progress bar, and set the `aria-busy`\nattribute to `true` on that region until it has finished loading.", "propDescriptions": { "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." }, "determinate": { "description": "The boolean to select a variant. Use indeterminate when there is no progress value." }, "size": { "description": "The size of the component. It accepts theme values between 'sm' and 'lg'." }, "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." }, "thickness": { "description": "The thickness of the circle." }, "value": { "description": "The value of the progress indicator for the determinate variant. Value between 0 and 100." }, "variant": { "description": "The global variant to use." } }, "classDescriptions": { "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": "color=\"danger\"" }, "colorNeutral": { "description": "Class name applied to {{nodeName}} if {{conditions}}.", "nodeName": "the root element", "conditions": "color=\"neutral\"" }, "colorPrimary": { "description": "Class name applied to {{nodeName}} if {{conditions}}.", "nodeName": "the root element", "conditions": "color=\"primary\"" }, "colorSuccess": { "description": "Class name applied to {{nodeName}} if {{conditions}}.", "nodeName": "the root element", "conditions": "color=\"success\"" }, "colorWarning": { "description": "Class name applied to {{nodeName}} if {{conditions}}.", "nodeName": "the root element", "conditions": "color=\"warning\"" }, "determinate": { "description": "Class name applied to {{nodeName}} if {{conditions}}.", "nodeName": "the root element", "conditions": "determinate is true" }, "sizeLg": { "description": "Class name applied to {{nodeName}} if {{conditions}}.", "nodeName": "the root element", "conditions": "size=\"lg\"" }, "sizeMd": { "description": "Class name applied to {{nodeName}} if {{conditions}}.", "nodeName": "the root element", "conditions": "size=\"md\"" }, "sizeSm": { "description": "Class name applied to {{nodeName}} if {{conditions}}.", "nodeName": "the root element", "conditions": "size=\"sm\"" }, "variantOutlined": { "description": "Class name applied to {{nodeName}} if {{conditions}}.", "nodeName": "the root element", "conditions": "variant=\"outlined\"" }, "variantPlain": { "description": "Class name applied to {{nodeName}} if {{conditions}}.", "nodeName": "the root element", "conditions": "variant=\"plain\"" }, "variantSoft": { "description": "Class name applied to {{nodeName}} if {{conditions}}.", "nodeName": "the root element", "conditions": "variant=\"soft\"" }, "variantSolid": { "description": "Class name applied to {{nodeName}} if {{conditions}}.", "nodeName": "the root element", "conditions": "variant=\"solid\"" } }, "slotDescriptions": { "progress": "The component that renders the progress.", "root": "The component that renders the root.", "svg": "The component that renders the svg.", "track": "The component that renders the track." } }