import type { Snippet } from 'svelte'; import type { InputProps } from '../../primitives/Input/index.js'; /** * @summary A number field with bounds, steppers and arrow-key stepping. * @description Generic numeric input with min/max/step bounds, stepper buttons, * and Arrow-key / mouse-wheel increment. Built on {@link Input}, so it inherits * labels, validation, sizes and variants. Values are plain numbers (not minor * units) — {@link CurrencyInput} is the domain-specific specialization for money. * * The field accepts a leading `-`, a single decimal separator (`.` or `,`), and * clamps to `[min, max]` on blur; the stepper and Arrow keys clamp immediately. * Set {@link precision} to fix the number of decimal places. * * @tag form * @related Input * @related CurrencyInput * @related Slider * @stability beta * * @example * ```svelte * * * ``` * * @example Decimal step with fixed precision * ```svelte * * ``` */ export interface NumberInputProps extends Omit { /** Current numeric value. `null` when the field is empty. Supports `bind:value`. */ value?: number | null; /** * Micro-interaction preset forwarded to the inner Input. Redeclared from * InputProps so the inheritance is a documented contract rather than an * accident of the Omit list. * @default 'none' */ mint?: InputProps['mint']; /** Minimum allowed value. Clamped on step / Arrow / blur. */ min?: number; /** Maximum allowed value. Clamped on step / Arrow / blur. */ max?: number; /** Increment applied by the stepper buttons, Arrow keys, and wheel. @default 1 */ step?: number; /** * Fixed number of decimal places for display and rounding. When unset, the * value is shown as typed and the step's own decimals drive rounding. * @summary Fixed number of decimal places. Unset shows the value as typed. */ precision?: number; /** Hide the up/down stepper buttons (Arrow keys + wheel still work). @default false */ hideStepper?: boolean; /** Shared `name` for a hidden input for native form submission. */ name?: string; /** Fires after the value changes (typing, stepper, Arrow, wheel, or clamp). */ onValueChange?: (value: number | null) => void; /** A custom right-side adornment. Overrides the stepper — pair with `hideStepper` or provide your own controls. */ rightIcon?: Snippet; } export { default as NumberInput } from './NumberInput.svelte';