Number Input

FREE

+/− düğmeli, min/max, adım, birim, basılı tutunca hızlanan ve klavyeyle artırılabilen sayı alanı.

Canlı düzenle

Ayarları değiştir; bileşen ve kodu anında güncellensin.

Ayarlar

En az

En çok

Adım

Birim

Boyut

Odak rengi

Devre dışı

Kod

import { NumberInput } from "@/components/ui/number-input";

<NumberInput
  defaultValue={0}
  min={0}
  max={10}
/>

Terminal

npx @bloxa/cli add number-input
# or: npx shadcn@latest add @bloxa/number-input

Stepper'a basılı tutunca hızlanarak artar. Shift + ok tuşu 10 adım atlar.

Her bileşen, oluşturduğu HTML elemanının özelliklerini de kabul eder.

Özellik	Tip	Varsayılan	Açıklama
value / defaultValue	number \| null	—	Sayı değeri.
onValueChange	(value: number \| null) => void	—	Değer değişince çağrılır.
min / max / step	number	-∞ / ∞ / 1	Sınırlar ve adım (ondalık olabilir).
unit	string	—	Sayıdan sonra gösterilen birim.
size	"sm" \| "md" \| "lg"	"md"	Yükseklik ve yazı boyutu.