Forms & Inputs@sisyphos-ui/number-inputView on npm View as Markdown

Preview

example.tsxtsx

Quantity

Playground

Flip props to see how the component responds. The snippet below updates as you change options.

Quantity

Install the individual package:

$ pnpm add @sisyphos-ui/number-input @sisyphos-ui/core

Or use the umbrella package that bundles everything:

$ pnpm add @sisyphos-ui/ui

Import the component styles and the component itself:

snippet.tsxtsx

import "@sisyphos-ui/number-input/styles.css";
import { NumberInput } from "@sisyphos-ui/number-input";

`prefix` + `precision` format money-shaped values.

example.tsxtsx

Monthly budget

Put units after the value with `suffix`.

example.tsxtsx

Weight

Track validation yourself and toggle `error` on the control.

example.tsxtsx

Seats

At least 1 seat is required.

Props table is being written. See the package README for the complete API surface.

The full API including refs, ARIA attributes, and HTML passthroughs lives in the package README.