Number field
A bounded number with steppers, rolling digits, and an optional label scrub.
Seats
Step with the buttons, the arrow keys, or by dragging the label. Holding a stepper repeats and speeds up. A value that meets the limit strains, the button shakes once, and a note appears beside the label. Size, variant, color and rounded follow the number-field config, the same packs as the button.
5
seats
<neura::number-field
label="Seats"
:value="5"
:min="1"
:max="500"
suffix-one=" seat"
suffix-many=" seats"
scrub
/>Guest passes
A description sits under the control. Typing past the maximum tints the shell and keeps the limit note until Enter or blur springs the value back.
1
$4 each, up to 3 per workspace
<neura::number-field
label="Guest passes"
:value="1"
:min="0"
:max="3"
description="$4 each, up to 3 per workspace"
/>Prefix
A prefix stays beside the digits while they roll. Page Up and Page Down, or Shift with an arrow, jump by ten steps.
$
100
<neura::number-field
label="Amount"
prefix="$"
:value="100"
:min="0"
:max="1000"
:step="5"
/>Size
sm, md and lg set the control width to 164, 196 and 228px. Override it with
--nk-num-w.
2
8
<neura::number-field label="Small" size="sm" :value="2" :min="0" :max="20" />
<neura::number-field label="Large" size="lg" :value="8" :min="0" :max="20" />