Button

Installation

Install @vinui/react from GitHub with pnpm, then import its stylesheet once, in your root layout or entry file:

pnpm add github:vindotski/vinui#path:packages/react

import '@vinui/react/styles.css';

Usage

Button renders a native <button> in the vinui style. Put an Icon inside for an icon button or a label with an icon:

import { PlusIcon } from '@heroicons/react/20/solid';
import { Button, Icon } from '@vinui/react';

<Button onClick={save}>Save</Button>
<Button variant="secondary" size="lg">
  <Icon icon={PlusIcon} />
  New project
</Button>
<Button variant="ghost" disabled>Archive</Button>;

• Variants are primary (default), secondary and ghost; sizes are sm, md (default) and lg.
• Native button attributes such as type, disabled and onClick work as usual.

More to come

Detailed examples, keyboard interaction and the full component API are on their way.