Skip to content

Button

Button

Modified button component (type=button by default), it can do loading and add Addons to itself 💪

jsx
import Button from '@semcore/ui/button';
<Button />;

AbstractButtonProps

& & & {...}
NameTypeDescription
activeboolean Button activity state
disabledboolean Disabled button state
loadingboolean Loading button state
addonLeftReact.ElementType Tag for the left Addon
addonRightReact.ElementType Tag for the right Addon
hintPlacement["placement"] Placement for hint
size Button type. Defined in Button.type or ButtonLink.type
use Button usage. Defined in Button.type or ButtonLink.type
theme Button theme. Defined in Button.type or ButtonLink.type

Button.Addon

The addon is inside the button (most often it is an icon), it sets the correct margins depending on the size. It takes all properties of the Box.

jsx
import Button from '@semcore/ui/button';
<Button.Addon />;

Button.Text

Plain text, it sets the correct margins depending on the button size. If the button uses just text without addons, it will automatically turn into the Button.Text. It takes all properties of the Box.

jsx
import Button from '@semcore/ui/button';
<Button.Text />;

Modified button component (type=button by default) with display as link.

jsx
import { ButtonLink } from '@semcore/ui/button';
<Button />;

AbstractButtonProps

& & & {...}
NameTypeDescription
activeboolean Button activity state
disabledboolean Disabled button state
loadingboolean Loading button state
addonLeftReact.ElementType Tag for the left Addon
addonRightReact.ElementType Tag for the right Addon
hintPlacement["placement"] Placement for hint
size Button type. Defined in Button.type or ButtonLink.type
use Button usage. Defined in Button.type or ButtonLink.type
theme Button theme. Defined in Button.type or ButtonLink.type

Last updated:

Released under the MIT License.

Released under the MIT License.