Button
The Button component allows the user to perform actions.
const [counter, setCounter] = useState(0);
return (
<div className={cn('flex', 'p-l', 'gap-m')}>
<Button onClick={() => setCounter(counter+1)}>Clicked {counter} times</Button>
</div>
);
Styles
The following variants can be used to distinguish between actions of different importance in the UI:
<Button theme='primary'>Primary</Button>
<Button theme='secondary'>Secondary</Button>
<Button theme='tertiary'>Tertiary</Button>
Customization
Buttons can be customized with different styles and properties. As an example, here’s a disabled button:
<Button disabled>Disabled</Button>