Field

Name: elia
Author: AILE.SH

Wires a label, control, and hint or error message together with generated ids and aria attributes.

Installation

bun add elia

@import "tailwindcss";
@import "@aile.sh/elia/styles/elia.css";
@source "../node_modules/@aile.sh/elia";

Usage

import { Field, Input } from "@aile.sh/elia";

export function Example() {
  return (
    <div className="flex w-full max-w-xs flex-col gap-3">
      <Field label="API key name" hint="Shown in the usage dashboard.">
        <Input placeholder="e.g. production-backend" />
      </Field>
      <Field label="Supplier code" error="That code is already in use.">
        <Input defaultValue="SUP-014" />
      </Field>
    </div>
  );
}

— elia design system · MIT · base · https://github.com/aile-sh/elia