Input

@sushindustries/ui

A text input, and only the drawing of one - state and labels belong to the form and to Field.

4 min read
View as MarkdownEdit on GitHub

Install commands are on Home, attached from the registry - they are not written here, because a second copy is a copy that goes stale. This tab starts after the install worked.

Use it

import { Input } from "@sushindustries/ui";

export function Example() {
	return <Input type="email" placeholder="you@example.com" />;
}
tsx

What you should see

A single-line text field with a soft border and a placeholder in a fainter color. Focus it and the border and a low-opacity accent ring appear together - no browser-default outline. There is no label above it: InputInputA text input, and only the drawing of one - state and labels belong to the form and to Field.@sushindustries/ui · content draws only the control.

If nothing happens

InputInputA text input, and only the drawing of one - state and labels belong to the form and to Field.@sushindustries/ui · content forwards every native <input> attribute untouched, so value without onChange renders a field the browser refuses to let you type into - the same as any other React controlled input. If the field looks completely unstyled (square corners, no focus ring), the field-control class from @sushindustries/atoms@sushindustries/atomsThe design tokens and the atomic utilities built on them. One stylesheet, no build step, no framework.package did not load.