@salesforce/design-system-react/components/component-docs.json

Salesforce Lightning Design System for React

{
    "accordion": {
        "description": "An accordion allows a user to toggle the display of sections of content.\nThe accordion component wraps accordion panels that can be selected and expanded. It accepts children to define the content displayed within.",
        "methods": [],
        "props": {
            "className": {
                "type": {
                    "name": "union",
                    "value": [
                        {
                            "name": "array"
                        },
                        {
                            "name": "object"
                        },
                        {
                            "name": "string"
                        }
                    ]
                },
                "required": false,
                "description": "CSS class names to be added to the accordion component. _Tested with snapshot testing._"
            },
            "id": {
                "type": {
                    "name": "union",
                    "value": [
                        {
                            "name": "number"
                        },
                        {
                            "name": "string"
                        }
                    ]
                },
                "required": false,
                "description": "HTML id for accordion component. _Tested with snapshot testing._"
            },
            "children": {
                "type": {
                    "name": "node"
                },
                "required": true,
                "description": "The panel content for the Accordion component. Accordion panels should be added as <AccordionPanel />. Event handler for the accordion panels should be added to `<AccordionPanel />`. Optional `panelContentActions` component may be passed as prop. _Tested with Mocha framework and snapshot testing._\n\nExample:\n```\n<SLDSAccordion>\n  <SLDSAccordionpanel />\n  <SLDSAccordionpanel />\n  <SLDSAccordionpanel />\n</SLDSAccordion>\n```"
            }
        },
        "route": "accordions",
        "display-name": "Accordions",
        "SLDS-component-path": "/components/accordions",
        "dependencies": [
            {
                "panel": {
                    "description": "The panel content for the Accordion component.",
                    "methods": [],
                    "props": {
                        "children": {
                            "type": {
                                "name": "node"
                            },
                            "required": false,
                            "description": "The panel content for the Accordion component. Accordion panels should be added as <AccordionPanel />. Event handler for the accordion panels should be added to `<AccordionPanel />`. Optional `panelContentActions` component may be passed as prop. _Tested with Mocha framework and snapshot testing._"
                        },
                        "expanded": {
                            "type": {
                                "name": "bool"
                            },
                            "required": true,
                            "description": "Indicates whether item is expanded or not, which should be handled by `onTogglePanel`. _Tested with Mocha framework and snapshot testing._"
                        },
                        "id": {
                            "type": {
                                "name": "union",
                                "value": [
                                    {
                                        "name": "number"
                                    },
                                    {
                                        "name": "string"
                                    }
                                ]
                            },
                            "required": true,
                            "description": "Id of the item belonging to this panel. _Tested with snapshot testing._"
                        },
                        "panelContentActions": {
                            "type": {
                                "name": "node"
                            },
                            "required": false,
                            "description": "Component that can be passed as prop to `<Panel />`. As an example, a menu dropdown could be used here to handle additional actions for each accordion panel. _Tested with Mocha framework._"
                        },
                        "onTogglePanel": {
                            "type": {
                                "name": "func"
                            },
                            "required": true,
                            "description": "Callback that will run whenever a panel is toggled. Function should handle state to toggle `expanded` prop. _Tested with Mocha framework._"
                        },
                        "summary": {
                            "type": {
                                "name": "union",
                                "value": [
                                    {
                                        "name": "string"
                                    },
                                    {
                                        "name": "node"
                                    }
                                ]
                            },
                            "required": true,
                            "description": "Summary in the span element in the header of this panel. The summary is truncated and so the title element should contain the full text so that it is accessible on hover. _Tested with snapshot testing._"
                        },
                        "title": {
                            "type": {
                                "name": "string"
                            },
                            "required": false,
                            "description": "HTML title attribute. _Tested with snapshot testing._"
                        }
                    },
                    "name": "panel",
                    "source": "/components/accordion/panel.jsx"
                }
            }
        ]
    },
    "alert": {
        "description": "Alert banners communicate a state that affects the entire system, not just a feature or page. It persists over a session and appears without the user initiating the action. View [banner guidelines](https://www.lightningdesignsystem.com/guidelines/messaging/components/banners/).",
        "methods": [
            {
                "name": "saveButtonRef",
                "docblock": null,
                "modifiers": [],
                "params": [
                    {
                        "name": "component",
                        "type": null
                    }
                ],
                "returns": null
            }
        ],
        "props": {
            "assistiveText": {
                "type": {
                    "name": "shape",
                    "value": {
                        "closeButton": {
                            "name": "union",
                            "value": [
                                {
                                    "name": "string"
                                },
                                {
                                    "name": "node"
                                }
                            ],
                            "required": false
                        }
                    }
                },
                "required": false,
                "description": "**Assistive text for accessibility**\nThis object is merged with the default props object on every render.\n* `closeButton`: This is a visually hidden label for the close button.\n_Tested with snapshot testing._",
                "defaultValue": {
                    "value": "{\n    closeButton: 'Close',\n}",
                    "computed": false
                }
            },
            "className": {
                "type": {
                    "name": "union",
                    "value": [
                        {
                            "name": "array"
                        },
                        {
                            "name": "object"
                        },
                        {
                            "name": "string"
                        }
                    ]
                },
                "required": false,
                "description": "CSS classes to be added to tag with `.slds-notify_alert`. Uses `classNames` [API](https://github.com/JedWatson/classnames).\n_Tested with snapshot testing._"
            },
            "dismissible": {
                "type": {
                    "name": "bool"
                },
                "required": false,
                "description": "Allows user to click a close button. Banners should be dismissible only if they communicate future impact to the system,\n_Tested with snapshot testing._"
            },
            "icon": {
                "type": {
                    "name": "node"
                },
                "required": false,
                "description": "Icon of type `~/components/icon`. This icon will be cloned and additional props appended. The default icons are:\n* info variant: `utility:info`\n* error variant: `utility:error`\n* offline variant: `utility:offline`\n* warning variant: `utility:warning`\n\n_Tested with snapshot testing._"
            },
            "labels": {
                "type": {
                    "name": "shape",
                    "value": {
                        "heading": {
                            "name": "union",
                            "value": [
                                {
                                    "name": "string"
                                },
                                {
                                    "name": "node"
                                }
                            ],
                            "required": false
                        },
                        "headingLink": {
                            "name": "union",
                            "value": [
                                {
                                    "name": "string"
                                },
                                {
                                    "name": "node"
                                }
                            ],
                            "required": false
                        }
                    }
                },
                "required": false,
                "description": "**Text labels for internationalization**\nThis object is merged with the default props object on every render.\n* `heading`: text within heading tag\n* `headingLink`: Text of link that triggers `onClickHeadingLink`. Inline links should pass a keyed array of React components into `labels.heading`.\n\n_Tested with snapshot testing._",
                "defaultValue": {
                    "value": "{}",
                    "computed": false
                }
            },
            "onClickHeadingLink": {
                "type": {
                    "name": "func"
                },
                "required": false,
                "description": "Triggered by link. _Tested with Mocha testing._"
            },
            "onRequestClose": {
                "type": {
                    "name": "func"
                },
                "required": false,
                "description": "Triggered by close button. This is a controlled component. _Tested with Mocha testing._"
            },
            "variant": {
                "type": {
                    "name": "enum",
                    "value": [
                        {
                            "value": "'error'",
                            "computed": false
                        },
                        {
                            "value": "'info'",
                            "computed": false
                        },
                        {
                            "value": "'offline'",
                            "computed": false
                        },
                        {
                            "value": "'warning'",
                            "computed": false
                        }
                    ]
                },
                "required": true,
                "description": "The type of alert. _Tested with snapshot testing._",
                "defaultValue": {
                    "value": "'info'",
                    "computed": false
                }
            }
        },
        "route": "alerts",
        "display-name": "Alerts",
        "SLDS-component-path": "/components/alerts",
        "dependencies": [
            {
                "container": {
                    "description": "A fixed container for alert banners.",
                    "methods": [],
                    "props": {
                        "className": {
                            "type": {
                                "name": "union",
                                "value": [
                                    {
                                        "name": "array"
                                    },
                                    {
                                        "name": "object"
                                    },
                                    {
                                        "name": "string"
                                    }
                                ]
                            },
                            "required": false,
                            "description": "CSS classes to be added to tag with `.slds-notify_alert`. Uses `classNames` [API](https://github.com/JedWatson/classnames)."
                        },
                        "children": {
                            "type": {
                                "name": "node"
                            },
                            "required": false,
                            "description": "Alert components"
                        }
                    },
                    "name": "container",
                    "source": "/components/alert/container.jsx"
                }
            }
        ]
    },
    "app-launcher": {
        "description": "The App Launcher allows the user to quickly access all the apps and functionality with their organization.\nThe App Launcher should generally only be used as a sub-component of the [Global Navigation Bar](/components/global-navigation-bar)\n\nAlso note: App Launcher is not included in the standard component export. To import it, you must reference it directly via its path.\nExample:\n```\nimport AppLauncher from 'design-system-react/components/app-launcher';\nimport AppLauncherTile from 'design-system-react/components/app-launcher/tile';\nimport AppLauncherSection from 'design-system-react/components/app-launcher/section';\n```\n\nUSAGE EXAMPLE:\n```\n<AppLauncher>\n\t<AppLauncherSection>\n\t\t<AppLauncherTile />\n\t\t<AppLauncherTile />\n\t\t<AppLauncherTile />\n\t</AppLauncherSection>\n\t<AppLauncherSection>\n\t\t<AppLauncherTile />\n\t\t<AppLauncherTile />\n\t</AppLauncherSection>\n</AppLauncher>\n```\n\nBy default, `Modal`, a child component of App Launcher, will add `aria-hidden=true` to the `body` tag, but this disables some assistive technologies. To prevent this you can add the following to your application with `#mount` being the root node of your application that you would like to hide from assistive technologies when the `Modal` is open.\n```\nimport settings from 'design-system-react/components/settings';\nsettings.setAppElement('#mount');\n```",
        "methods": [
            {
                "name": "openAppLauncher",
                "docblock": null,
                "modifiers": [],
                "params": [
                    {
                        "name": "event",
                        "type": null
                    }
                ],
                "returns": null
            },
            {
                "name": "closeAppLauncher",
                "docblock": null,
                "modifiers": [],
                "params": [
                    {
                        "name": "event",
                        "type": null
                    }
                ],
                "returns": null
            },
            {
                "name": "renderSearch",
                "docblock": null,
                "modifiers": [],
                "params": [],
                "returns": null
            }
        ],
        "props": {
            "assistiveText": {
                "type": {
                    "name": "shape",
                    "value": {
                        "trigger": {
                            "name": "string",
                            "required": false
                        }
                    }
                },
                "required": false,
                "description": "**Assistive text for accessibility.**\nThis object is merged with the default props object on every render.\n* `trigger`: This is a visually hidden label for the app launcher icon.",
                "defaultValue": {
                    "value": "{\n    trigger: 'Open App Launcher',\n}",
                    "computed": false
                }
            },
            "children": {
                "type": {
                    "name": "node"
                },
                "required": true,
                "description": "One or more `<AppLauncherSection />`s each containing one or more `<AppLauncherTile />`s"
            },
            "isOpen": {
                "type": {
                    "name": "bool"
                },
                "required": false,
                "description": "Control the open/close state of the App Launcher"
            },
            "modalClassName": {
                "type": {
                    "name": "union",
                    "value": [
                        {
                            "name": "array"
                        },
                        {
                            "name": "object"
                        },
                        {
                            "name": "string"
                        }
                    ]
                },
                "required": false,
                "description": "CSS classes to be added to App Launcher Modal."
            },
            "modalHeaderButton": {
                "type": {
                    "name": "node"
                },
                "required": false,
                "description": "Button that exists in the upper right hand corner of the App Launcher modal"
            },
            "noTruncate": {
                "type": {
                    "name": "bool"
                },
                "required": false,
                "description": "Allows longer application names without truncating them."
            },
            "onClose": {
                "type": {
                    "name": "func"
                },
                "required": false,
                "description": "Callback when the App Launcher Modal is closed"
            },
            "search": {
                "type": {
                    "name": "node"
                },
                "required": false,
                "description": "Search bar for the Modal's header. Will typically be an instance of `design-system-react/input/search`"
            },
            "title": {
                "type": {
                    "name": "string"
                },
                "required": false,
                "description": "Set the App Launcher's title text (for localization)",
                "defaultValue": {
                    "value": "'App Launcher'",
                    "computed": false
                }
            },
            "triggerName": {
                "type": {
                    "name": "node"
                },
                "required": false,
                "description": "This is typically the name of the cloud or application"
            },
            "triggerOnClick": {
                "type": {
                    "name": "func"
                },
                "required": false,
                "description": "Callback when the App Launcher icon is clicked"
            }
        },
        "route": "app-launcher",
        "display-name": "App Launcher",
        "SLDS-component-path": "/components/app-launcher/#flavor-default",
        "dependencies": [
            {
                "section": {
                    "description": "App Launcher Sections allow users to categorize App Tiles as well as toggle their display",
                    "methods": [
                        {
                            "name": "toggleOpen",
                            "docblock": null,
                            "modifiers": [],
                            "params": [
                                {
                                    "name": "event",
                                    "type": null
                                }
                            ],
                            "returns": null
                        }
                    ],
                    "props": {
                        "assistiveText": {
                            "type": {
                                "name": "shape",
                                "value": {
                                    "collapseSection": {
                                        "name": "string",
                                        "required": false
                                    }
                                }
                            },
                            "required": false,
                            "description": "**Assistive text for accessibility.**\nThis object is merged with the default props object on every render.\n* `collapseSection`: The assistive text for the section collapse icons.",
                            "defaultValue": {
                                "value": "{\n    collapseSection: 'Toggle visibility of section',\n}",
                                "computed": false
                            }
                        },
                        "title": {
                            "type": {
                                "name": "string"
                            },
                            "required": true,
                            "description": "The title for this section of apps"
                        },
                        "toggleable": {
                            "type": {
                                "name": "bool"
                            },
                            "required": false,
                            "description": "Allows the user to show/hide the section"
                        },
                        "children": {
                            "type": {
                                "name": "node"
                            },
                            "required": true,
                            "description": "An array of applications to display"
                        },
                        "isOpen": {
                            "type": {
                                "name": "bool"
                            },
                            "required": false,
                            "description": "Controls the open/closed state of the section"
                        },
                        "onToggleClick": {
                            "type": {
                                "name": "func"
                            },
                            "required": false,
                            "description": "Callback for when section is toggled. Passes \"isOpen\" bool. Forces `toggleable` to true"
                        }
                    },
                    "name": "section",
                    "source": "/components/app-launcher/section.jsx"
                }
            },
            {
                "tile": {
                    "description": "App Launcher Tiles provide information and links to a user's apps",
                    "methods": [],
                    "props": {
                        "title": {
                            "type": {
                                "name": "string"
                            },
                            "required": true,
                            "description": "App name for the tile's title."
                        },
                        "size": {
                            "type": {
                                "name": "enum",
                                "value": [
                                    {
                                        "value": "'default'",
                                        "computed": false
                                    },
                                    {
                                        "value": "'small'",
                                        "computed": false
                                    }
                                ]
                            },
                            "required": false,
                            "description": "Size of the rendered tile.",
                            "defaultValue": {
                                "value": "'default'",
                                "computed": false
                            }
                        },
                        "description": {
                            "type": {
                                "name": "string"
                            },
                            "required": false,
                            "description": "The description of the app. Not visible on small tiles."
                        },
                        "descriptionHeading": {
                            "type": {
                                "name": "string"
                            },
                            "required": false,
                            "description": "Heading for app description"
                        },
                        "href": {
                            "type": {
                                "name": "string"
                            },
                            "required": false,
                            "description": "The `href` attribute of the tile. Please pass in bookmarkable URLs from your routing library. If the `onClick` callback is specified this URL will be prevented from changing the browser's location.",
                            "defaultValue": {
                                "value": "'javascript:void(0);'",
                                "computed": false
                            }
                        },
                        "isOpenTooltip": {
                            "type": {
                                "name": "bool"
                            },
                            "required": false,
                            "description": "Open the More Tooltip"
                        },
                        "moreLabel": {
                            "type": {
                                "name": "string"
                            },
                            "required": false,
                            "description": "The localized text for the \"More information\" tooltip.",
                            "defaultValue": {
                                "value": "' More'",
                                "computed": false
                            }
                        },
                        "className": {
                            "type": {
                                "name": "union",
                                "value": [
                                    {
                                        "name": "array"
                                    },
                                    {
                                        "name": "object"
                                    },
                                    {
                                        "name": "string"
                                    }
                                ]
                            },
                            "required": false,
                            "description": "Class names to be added to the tile."
                        },
                        "onClick": {
                            "type": {
                                "name": "func"
                            },
                            "required": false,
                            "description": "Function that will be executed when clicking on a tile"
                        },
                        "iconNode": {
                            "type": {
                                "name": "node"
                            },
                            "required": false,
                            "description": "Icon node for app tile. Takes priority over `iconText`"
                        },
                        "iconText": {
                            "type": {
                                "name": "string"
                            },
                            "required": false,
                            "description": "Text to be used as an icon. Only renders if iconNode is undefined"
                        },
                        "search": {
                            "type": {
                                "name": "string"
                            },
                            "required": false,
                            "description": "Text used to highlight content in app tiles"
                        }
                    },
                    "name": "tile",
                    "source": "/components/app-launcher/tile.jsx"
                }
            }
        ]
    },
    "avatar": {
        "description": "The avatar component represents an object or entity. An image is the preferred format for an avatar.\n If the `imgSrc` prop is undefined, and if a `label` or `initials` prop is available, the fallback avatar will render with initials. If initals are passed in directly in the `initials` prop, this will render in the fallback avatar. If `initals` prop is unavailable but a `label` prop is available, the fallback avatar will render with built initials of the user name or entity name.\n\n Intials built from the `label` prop will apply the following logic: If the label name contains two words, like first and last name, the first letter of each will be capitalized and returned. For labels that only have a single word name, the first two letters of that word, using one capital and one lower case letter, will be returned. For labels that contain three or more words, the first character of the first and last words will be capitalized and returned.\n\n If `initials` or `label` are not available, the fallback avatar will render a standard icon. If `variant='user'`, a user icon will\n render. If `variant='entity'`, an account icon will render.",
        "methods": [
            {
                "name": "buildInitials",
                "docblock": null,
                "modifiers": [],
                "params": [],
                "returns": null
            },
            {
                "name": "handleImageError",
                "docblock": null,
                "modifiers": [],
                "params": [],
                "returns": null
            },
            {
                "name": "renderBaseAvatar",
                "docblock": null,
                "modifiers": [],
                "params": [],
                "returns": null
            },
            {
                "name": "renderIconAvatar",
                "docblock": null,
                "modifiers": [],
                "params": [],
                "returns": null
            },
            {
                "name": "renderInitialsAvatar",
                "docblock": null,
                "modifiers": [],
                "params": [],
                "returns": null
            }
        ],
        "props": {
            "assistiveText": {
                "type": {
                    "name": "shape",
                    "value": {
                        "icon": {
                            "name": "string",
                            "required": false
                        }
                    }
                },
                "required": false,
                "description": "**Assistive text for accessibility.**\nThis object is merged with the default props object on every render.\n* `icon`: Assistive text for accessibility that labels the icon.",
                "defaultValue": {
                    "value": "{\n    icon: 'User or Account Icon',\n}",
                    "computed": false
                }
            },
            "className": {
                "type": {
                    "name": "string"
                },
                "required": false,
                "description": "Class names to be applied to Avatar component."
            },
            "imgAlt": {
                "type": {
                    "name": "string"
                },
                "required": false,
                "description": "Alt attribute to be applied to image (base case) element.",
                "defaultValue": {
                    "value": "''",
                    "computed": false
                }
            },
            "imgSrc": {
                "type": {
                    "name": "string"
                },
                "required": false,
                "description": "Source attribute to be applied to image (base case) element."
            },
            "initials": {
                "type": {
                    "name": "string"
                },
                "required": false,
                "description": "Initials attribute to optionally pass in initials directly in case of \"initials\" fallback case."
            },
            "label": {
                "type": {
                    "name": "string"
                },
                "required": false,
                "description": "Label attibute to display inside \"initials\" fallback case. Will be passed as title prop in `abbr` element to provide more specificity."
            },
            "variant": {
                "type": {
                    "name": "enum",
                    "value": [
                        {
                            "value": "'entity'",
                            "computed": false
                        },
                        {
                            "value": "'user'",
                            "computed": false
                        }
                    ]
                },
                "required": true,
                "description": "Avatar variants to apply relevant styling (circle: user, square: entity) and icon rendering if applicable.",
                "defaultValue": {
                    "value": "'user'",
                    "computed": false
                }
            },
            "size": {
                "type": {
                    "name": "enum",
                    "value": [
                        {
                            "value": "'x-small'",
                            "computed": false
                        },
                        {
                            "value": "'small'",
                            "computed": false
                        },
                        {
                            "value": "'medium'",
                            "computed": false
                        },
                        {
                            "value": "'large'",
                            "computed": false
                        }
                    ]
                },
                "required": true,
                "description": "Size of the icon in \"icon\" fallback case.",
                "defaultValue": {
                    "value": "'medium'",
                    "computed": false
                }
            },
            "title": {
                "type": {
                    "name": "string"
                },
                "required": false,
                "description": "Title attribute for the avatar container.",
                "defaultValue": {
                    "value": "'user avatar'",
                    "computed": false
                }
            }
        },
        "route": "avatars",
        "display-name": "Avatars",
        "SLDS-component-path": "/components/avatars",
        "dependencies": []
    },
    "breadcrumb": {
        "description": "Use breadcrumbs to note the path of a record and help the user to navigate back to the parent.Breadcrumb based on SLDS 2.1.0-dev",
        "methods": [],
        "props": {
            "assistiveText": {
                "type": {
                    "name": "shape",
                    "value": {
                        "label": {
                            "name": "string",
                            "required": false
                        }
                    }
                },
                "required": false,
                "description": "**Assistive text for accessibility.**\nThis object is merged with the default props object on every render.\n* `label`: The assistive text for the breadcrumb trail.",
                "defaultValue": {
                    "value": "{\n    label: 'Breadcrumbs',\n}",
                    "computed": false
                }
            },
            "trail": {
                "type": {
                    "name": "array"
                },
                "required": false,
                "description": "An array of react elements presumably anchor elements."
            }
        },
        "route": "breadcrumbs",
        "display-name": "Breadcrumbs",
        "SLDS-component-path": "/components/breadcrumbs",
        "dependencies": []
    },
    "button": {
        "description": "The Button component is the Lightning Design System Button component. The Button should be used for label buttons, icon buttons, or buttons that have both labels and icons.\nEither a <code>label</code> or <code>assistiveText.icon</code> is required; see the Prop Details table below.\nFor buttons that maintain selected/unselected states, use the <a href=\"#/button-stateful\">ButtonStateful</a> component.",
        "methods": [
            {
                "name": "getClassName",
                "docblock": null,
                "modifiers": [],
                "params": [],
                "returns": null
            },
            {
                "name": "handleClick",
                "docblock": null,
                "modifiers": [],
                "params": [
                    {
                        "name": "event",
                        "type": null
                    }
                ],
                "returns": null
            },
            {
                "name": "renderIcon",
                "docblock": null,
                "modifiers": [],
                "params": [
                    {
                        "name": "name",
                        "type": null
                    }
                ],
                "returns": null
            },
            {
                "name": "renderLabel",
                "docblock": null,
                "modifiers": [],
                "params": [],
                "returns": null
            },
            {
                "name": "renderButton",
                "docblock": null,
                "modifiers": [],
                "params": [],
                "returns": null
            },
            {
                "name": "renderTooltip",
                "docblock": null,
                "modifiers": [],
                "params": [],
                "returns": null
            }
        ],
        "props": {
            "aria-describedby": {
                "type": {
                    "name": "string"
                },
                "required": false,
                "description": "Used if the Button triggers a tooltip. The value should match the `id` of the element with `role=\"tooltip\"`."
            },
            "aria-controls": {
                "type": {
                    "name": "string"
                },
                "required": false,
                "description": "Establishes a relationship between an interactive parent element and a child element to indicate which child element a parent element affects. Frequently used in cases where buttons or tabs are associated with exposing expandable regions."
            },
            "aria-expanded": {
                "type": {
                    "name": "union",
                    "value": [
                        {
                            "name": "bool"
                        },
                        {
                            "name": "string"
                        }
                    ]
                },
                "required": false,
                "description": "Used if the Button triggers a menu or popup. Bool indicates if the menu or popup is open or closed."
            },
            "aria-haspopup": {
                "type": {
                    "name": "union",
                    "value": [
                        {
                            "name": "bool"
                        },
                        {
                            "name": "string"
                        }
                    ]
                },
                "required": false,
                "description": "True if Button triggers a menu or popup to open/close."
            },
            "assistiveText": {
                "type": {
                    "name": "shape",
                    "value": {
                        "icon": {
                            "name": "string",
                            "required": false
                        }
                    }
                },
                "required": false,
                "description": "**Assistive text for accessibility.**\nThis object is merged with the default props object on every render.\n* `icon`: Text that is visually hidden but read aloud by screenreaders to tell the user what the icon means. If the button has an icon and a visible label, you can omit the <code>assistiveText.icon</code> prop and use the <code>label</code> prop.",
                "defaultValue": {
                    "value": "{ icon: '' }",
                    "computed": false
                }
            },
            "buttonRef": {
                "type": {
                    "name": "func"
                },
                "required": false,
                "description": "Callback that passes in the DOM reference of the `<button>` DOM node within this component. Primary use is to allow `focus` to be called. You should still test if the node exists, since rendering is asynchronous. `buttonRef={(component) => { if(component) console.log(component); }}`"
            },
            "className": {
                "type": {
                    "name": "union",
                    "value": [
                        {
                            "name": "array"
                        },
                        {
                            "name": "object"
                        },
                        {
                            "name": "string"
                        }
                    ]
                },
                "required": false,
                "description": "CSS classes to be added to button."
            },
            "disabled": {
                "type": {
                    "name": "bool"
                },
                "required": false,
                "description": "Disables the button and adds disabled styling.",
                "defaultValue": {
                    "value": "false",
                    "computed": false
                }
            },
            "hint": {
                "type": {
                    "name": "bool"
                },
                "required": false,
                "description": "Associates an icon button with another element on the page by changes the color of the SVG. Please reference <a href=\"http://www.lightningdesignsystem.com/components/buttons/#hint\">Lightning Design System Buttons > Hint</a>.",
                "defaultValue": {
                    "value": "false",
                    "computed": false
                }
            },
            "iconCategory": {
                "type": {
                    "name": "custom",
                    "raw": "requiredIf(\n    PropTypes.oneOf(['action', 'custom', 'doctype', 'standard', 'utility']),\n    (props) => !!props.iconName\n)"
                },
                "required": false,
                "description": "Name of the icon category. Visit <a href=\"http://www.lightningdesignsystem.com/resources/icons\">Lightning Design System Icons</a> to reference icon categories."
            },
            "iconClassName": {
                "type": {
                    "name": "union",
                    "value": [
                        {
                            "name": "array"
                        },
                        {
                            "name": "object"
                        },
                        {
                            "name": "string"
                        }
                    ]
                },
                "required": false,
                "description": "CSS classes to be added to icon."
            },
            "iconName": {
                "type": {
                    "name": "string"
                },
                "required": false,
                "description": "Name of the icon. Visit <a href=\"http://www.lightningdesignsystem.com/resources/icons\">Lightning Design System Icons</a> to reference icon names."
            },
            "iconPath": {
                "type": {
                    "name": "string"
                },
                "required": false,
                "description": "Path to the icon. This will override any global icon settings."
            },
            "iconPosition": {
                "type": {
                    "name": "enum",
                    "value": [
                        {
                            "value": "'left'",
                            "computed": false
                        },
                        {
                            "value": "'right'",
                            "computed": false
                        }
                    ]
                },
                "required": false,
                "description": "If omitted, icon position is centered."
            },
            "iconSize": {
                "type": {
                    "name": "enum",
                    "value": [
                        {
                            "value": "'x-small'",
                            "computed": false
                        },
                        {
                            "value": "'small'",
                            "computed": false
                        },
                        {
                            "value": "'medium'",
                            "computed": false
                        },
                        {
                            "value": "'large'",
                            "computed": false
                        }
                    ]
                },
                "required": false,
                "description": "Determines the size of the icon.",
                "defaultValue": {
                    "value": "'medium'",
                    "computed": false
                }
            },
            "iconVariant": {
                "type": {
                    "name": "enum",
                    "value": [
                        {
                            "value": "'bare'",
                            "computed": false
                        },
                        {
                            "value": "'container'",
                            "computed": false
                        },
                        {
                            "value": "'border'",
                            "computed": false
                        },
                        {
                            "value": "'border-filled'",
                            "computed": false
                        },
                        {
                            "value": "'more'",
                            "computed": false
                        },
                        {
                            "value": "'global-header'",
                            "computed": false
                        }
                    ]
                },
                "required": false,
                "description": "For icon variants, please reference <a href=\"http://www.lightningdesignsystem.com/components/buttons/#icon\">Lightning Design System Icons</a>."
            },
            "id": {
                "type": {
                    "name": "string"
                },
                "required": false,
                "description": "Id string applied to button node."
            },
            "inverse": {
                "type": {
                    "name": "bool"
                },
                "required": false,
                "description": "If true, button/icon is white. Meant for buttons or utility icons on dark backgrounds."
            },
            "label": {
                "type": {
                    "name": "union",
                    "value": [
                        {