Components

Textarea

A multi-line text input that can grow with its content.

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

A multi-line text input built on Headless UI's Textarea:

import { Field, Label, Textarea } from '@vinui/react';

<Field>
  <Label>Comment</Label>
  <Textarea name="comment" autoResize />
</Field>;
  • Three rows tall by default, resizable vertically; pass resizable={false} to turn that off.
  • autoResize grows it with its content (CSS field-sizing; browsers without support keep a fixed height).
  • invalid gives a red border and sets aria-invalid.

More to come

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