ButtonProps API Reference
Prop reference
| Title | Type | Default | Description |
|---|---|---|---|
| variant | 'primary' | 'secondary' | 'outlined' | 'flat' | 'danger' | 'text' | primary | Variant of the button, can be 'primary', 'secondary', 'outlined', 'flat', 'danger', or 'text' |
| size | 'small' | 'medium' | 'large' | medium | Size of the button, can be 'small', 'medium', or 'large' |
| icon | ReactElement | โ | Icon to display in the button, will be cloned with size prop |
| iconPlacement | 'start' | 'end' | start | Placement of the icon. |
| type | 'button' | 'submit' | button | Type of the button, default is 'button', can be 'submit' for forms |
| disabled | boolean | โ | Disables the button visually and functionally |
| fullWidth | boolean | โ | Whether the button should take the full width of its container |
| onClick | OnClickFunction<HTMLButtonElement> | โ | Click handler for the button, will be called with the click event |
| noWrap | boolean | โ | Whether to nowrap the text inside the button |
| shimmer | boolean | โ | Add the shimmer effect to the button |
| isWorking | boolean | โ | Set the button to its "loading" state |
| shortcutKey | string | โ | Shortcut key to trigger the button click |
| className | string | โ | Additional classNames for the button, will override default styles |
| style | CSSProperties | โ | Additional styles for the button |
* Props marked with an asterisk are required.
CSS target reference
| Export | CSS Class Target | Description |
|---|---|---|
| ButtonTargetClassRoot | .NPUI-Button-root | Root of the button |
| ButtonTargetClassSpinnerContainer | .NPUI-Button-spinnerContainer | Spinner span for isWorking |
| ButtonTargetClassSpinnerIcon | .NPUI-Button-spinnerIcon | Spinner element for isWorking |