Button - Kube Design

A button means an operation (or a series of operations). Clicking a button will trigger corresponding business logic.
In Kube Design we provide 4 types of button.
Primary button: indicate the main action, one primary button at most in one section.
Default button: indicate a series of actions without priority.
Text button: used for the most secondary action.
Link button: used for external links.
There are filled button, outline button, text button and link button in kube.
There are six colors of Button.The color property can be set to default, primary, secondary, success, warning and error.
To mark a button as disabled, add the disabled property to the Button.
Block property will make the button fit to its parent width.
Shadow property will make the button have a shadow effect.
Use the size, radius prop to change the size or radius of the button. You can set the value to xs, sm, md, lg or xl.
A loading indicator can be added to a button by setting the loading property on the Button.
Button components can contain an Icon. This is done by setting the icon property or placing an Icon component within the Button.
The as attribute can change the label used by the component or the component based on it.