Dasar UI Library

Number Input

A numeric input field with built-in increment and decrement stepper controls.

Basic Usage

Item Quantity

Bound Value: 1

Appearance & Sizes

Outline (Default)

Filled Appearance

Small Size

Medium Size

Large Size

Min, Max & Step Limits

Outline (Default)

Filled Appearance

Small Size

Medium Size

Large Size

Validation & States

Error State

Value exceeds available stock.

Disabled State

Out of stock.

Prefix & Action Slots

Price

Custom Action Buttons

MINUS

PLUS

API Reference

Property	Type	Default	Description
`value`	`number \| null`	null	The current numeric value.
`appearance`	`'outline' \| 'filled'`	'outline'	Visual container style.
`size`	`'xs' \| 'sm' \| 'md' \| 'lg' \| 'xl'`	'md'	Sizing scale.
`radius`	`ScaleAttributeType`	'md'	Border radius.
`step`	`number`	1	Increment/decrement value step.
`min / max`	`number`	undefined	Constraint limits.
`label`	`string`	undefined	Text label.
`hint`	`string`	undefined	Helper text.
`placeholder`	`string`	''	Placeholder string.
`full-width`	`boolean`	false	Forces full width.
`disabled`	`boolean`	false	Disables input and actions.
`error`	`boolean`	false	Error styling.
`(valueChange)`	`EventEmitter<number \| null>`	-	Emitted on change.
`(increment) / (decrement)`	`EventEmitter<number>`	-	Action button events.
`[prefix]`	`Content Slot`	-	Custom prefix content.
`[increment-slot] / [decrement-slot]`	`Content Slot`	-	Custom action button templates.