YearPicker

Kurulum

Paket

@bigbang/ui

İçe aktarma

import { YearPicker } from '@bigbang/ui';

Kaynak

YearPicker.tsx

Storybook

YearPicker · Playground

YearPicker, @bigbang/ui paketindedir. Değer bir sayıdır (yıl).

import { YearPicker } from '@bigbang/ui';

<YearPicker label="Mali yıl" name="year" min={2020} max={2026} value={value} onValueChange={setValue} />;

Özellikler

labelZorunlu

Açıklama

Alanın görünen etiketi.

Tür

string

description

Açıklama

Alanın altındaki yardım metni; aria-describedby ile bağlanır.

Tür

ReactNode

error

Açıklama

Verildiğinde alan geçersiz işaretlenir ve ileti tetikleyiciyle okunur.

Tür

string

invalid

Açıklama

Alanı iletisiz geçersiz işaretler.

Tür

boolean

Varsayılan

false

required

Açıklama

Yıl seçimi zorunludur; etikete * eklenir.

Tür

boolean

Varsayılan

false

value

Açıklama

Kontrollü değer. onValueChange ile birlikte verin.

Tür

number | null

defaultValue

Açıklama

Kontrolsüz alanın başlangıç değeri.

Tür

number

onValueChange

Açıklama

Seçilen yılla çağrılır.

Tür

(value: number) => void

min

Açıklama

Seçilebilecek en erken yıl.

Tür

number

max

Açıklama

Seçilebilecek en geç yıl.

Tür

number

placeholder

Açıklama

Yıl seçilmemişken tetikleyicide görünen metin. Verilmezse ui.year-picker.placeholder ("Yıl seçin" ya da "Choose a year").

Tür

string

size

Açıklama

Tetikleyici yüksekliği: Select gibi 32, 36 ya da 40 px.

Tür

'sm' | 'md' | 'lg'

Varsayılan

'md'

readOnly

Açıklama

Değeri gösterir ama seçiciyi açmaz.

Tür

boolean

Varsayılan

false

disabled

Açıklama

Alanı devre dışı bırakır.

Tür

boolean

Varsayılan

false

name

Açıklama

Alan adı; gizli bir alan yılı YYYY olarak gönderir.

Tür

string

className

Açıklama

Kök öğeye eklenir; yalnızca yerleşim için kullanın.

Tür

string

Veri öznitelikleri

• data-component="year-picker": kök öğede.
• data-part: trigger, popup, panel, header, title, grid.
• Hücrede data-selected ve data-current.