Slider with a primary-tinted track, current value badge on the right, and min/max labels on the rail.
Requires shadcn/ui initialized. Run npx shadcn@latest init if you haven't.
import { Input19 } from "@/components/beste/piece/input19";
<Input19
label="Monthly budget"
min={0}
max={1000}
value={420}
unit="$"
/>Label and readout above a filled track with a circular handle positioned by the current value.
Two-thumb range slider with a filled band between, a mono low-high readout, and min/max caps.
Line-item card with a label-price stack and a pill stepper that enforces min zero and a max cap.
Row with a bold label, secondary description, and a switch that slides on or off.
Compact number control with minus and plus buttons flanking a centered mono value.
Tight small-size text field for data tables and filter rails, with smaller type and tight padding.