NumberInput
NumberInput 组件,源码位于 components/ui/number-input.tsx。以下示例为组件库源码的构建期真实渲染。
样式变体
数字Number
纯数字输入框,无步进按钮,适合直接键入的数值字段。
金额Amount
金额态:左侧展示前置货币符号 ¥,precision=2 保留两位小数。
百分比Percent
百分比态:右侧展示后置百分号 %,min/max 锁在 0-100 区间。
状态变体
默认Default
默认态:可交互、边框为 control-default。
禁用Disabled
禁用态走 --color-disabled-*,不可交互。
错误Invalid
错误态用 aria-invalid,边框转 destructive,供表单校验失败时使用。
形态变体
数字增减Number stepper
数字态加左右步进按钮,各自 ±step 并受 min/max 夹取。
金额增减Amount stepper
金额态加步进按钮:¥ 与输入区连成一组,¥ 右侧分割线移除。
百分比增减Percent stepper
百分比态加步进按钮:输入区与 % 连成一组,% 左侧分割线移除。