DatePickerV2

React API

DatePickerV2

Ref-prop välitetään komponentin input-elementille.

• animateCalendar

  Näyttää CSS-transition siirryttäessä kalenterin kuukausien välillä.

  Tyyppi: boolean

• autoSize

  Poistuva

  Asettaa nimilapun, ohjetekstin ja aputekstin koon size-propin mukaisesti. @deprecated Poistuu versiossa 16.0.0 ja ominaisuudesta tulee oletus.

  Tyyppi: boolean

  Oletusarvo: false

• calendarDefaultMonth

  Kuukausi, johon kalenteri aukeaa (Date-objekti tai tekstimuotoinen arvo YYYY-MM).

  Tyyppi: DatePickerV2Value

• children

  Komponentin sisältö

  Tyyppi: ReactNode

• className

  CSS-apuluokat ulkoasun muokkaamiseen.

  Tyyppi: string

• defaultValue

  Päivämäärävalinnan oletusarvo, kun käytetään ei-kontrolloituna komponenttina.

  Tyyppi: DatePickerV2Value

• disablePast

  Estää kuluvaa päivää aiemman valinnan.

  Tyyppi: boolean

• disabled

  Estetty kenttä

  Tyyppi: boolean

• disabledDates

  Päivämäärät, joiden valinta on estetty.

  Tyyppi: DatePickerV2DisabledDates[]

• errorText

  Kentän virheilmoitusteksti.

  Tyyppi: string

• errorTextId

  Input-kentälle välitettävä id virheviestille (käytettävissä räätölöityihin virheviesteihin).

  Tyyppi: string

• fixedCalendarHeight

  Näyttää kalenterissa aina 6 viikkoa, jotta sen korkeus ei muutu kuukautta vaihdettaessa.

  Tyyppi: boolean

  Oletusarvo: true

• fromDate

  Päivämäärä, josta alkaen valintoja voidaan tehdä (Date-objekti tai tekstimuotoinen arvo YYYY-MM-DD).

  Tyyppi: DatePickerV2Value

• helpText

  Kentän täyttöohje, joka näytetään kentän yläpuolella.

  Tyyppi: string

• helpers

  Input-kenttien yläpuolelle tulostettavat räätälöidyt toiminnot. Huom! Sisältöjä ei lueta ruudunlukijalle kohdistuksen ollessa input-kentässä.

  Tyyppi: ReactNode

• id

  Päivämäärän valintakentän (input) id

  Tyyppi: string

• infoText

  Kentän aputeksti, joka näytetään kentän alapuolella.

  Tyyppi: string

• inputTestId

  Komponentin input-kentän data-testid-attribuuttiin välitettävä arvo testausta varten.

  Tyyppi: string

• inputWidth

  Kentän leveys (asetetaan antamalla Column-palstaelementti)

  Tyyppi: (children: ReactNode) => ReactElement<any, string | JSXElementConstructor<any>>

• invalid

  Virheellisen kentän korostus

  Tyyppi: boolean

  Oletusarvo: false

• labelText

  Kentän nimilappu

  Tyyppi: ReactNode

• leftCol

  Vasen palsta

  Tyyppi: (children: ReactNode) => ReactElement<any, string | JSXElementConstructor<any>>

• localization

  Kalenterinäkymän lokalisointi

  Tyyppi: Partial<DatePickerV2Localization>

• onBlur

  Callback-funktio, jota kutsutaan kun kohdistus siirtyy pois input-kentästä. Parametreina FocusEvent ja DateValidationResult.

  Tyyppi: (event: FocusEvent<HTMLInputElement, Element>, validity?: DateValidationResult) => void

• onChange

  Callback-funktio, jota kutsutaan input-kentän arvon muuttuessa. Parametreina input-kentän arvo ja DateValidationResult.

  Tyyppi: (dateValue: string, validity?: DateValidationResult) => void

• onError

  Callback-funktio, jota kutsutaan vain virhetilanteessa. Parametreina input-kentän arvo ja DateValidationResult.

  Tyyppi: ((dateValue: string, validity?: DateValidationResult) => void) & ReactEventHandler<HTMLInputElement>

• onSelect

  Callback-funktio, jota kutsutaan kun päivämäärä valitaan kalenterista. Parametreina input-kenttään päivittyvä arvo ja DateValidationResult.

  Tyyppi: (dateValue: string, validity?: DateValidationResult) => void

• placeholder

  Input-kentän placeholder-teksti

  Tyyppi: string

  Oletusarvo: pp.kk.vvvv

• ref

  Tyyppi: ForwardedRef<HTMLInputElement>

• required

  Pakollisen kentän korostus.

  Tyyppi: boolean

  Oletusarvo: false

• requiredLabel

  "Pakollinen tieto" -teksti ruudunlukijalle.

  Tyyppi: string

• showDropdownNavigation

  Näyttää kalenterinäkymässä vuosi- ja kuukausivalinnat alasvetovalikossa (Huom! Vaatii, että fromDate ja toDate -propeille on asetettu arvot rajoittamaan valintojen määrää).

  Tyyppi: boolean

• showLeadingZeros

  Hallitsee etunollien näyttämistä input-kenttään asetetussa päivämääräarvossa (1.1.2023 vs. 01.01.2023). Oletuksena etunollia ei näytetä.

  Tyyppi: boolean

  Oletusarvo: false

• showWeekNumbers

  Näyttää viikkonumerot kalenterissa.

  Tyyppi: boolean

• size

  Mukautettu komponentin kokoluokka

  Tyyppi: "xs" | "sm" | "md"

  Oletusarvo: md

• testId

  Komponentin juurielementille data-testid-attribuuttiin välitettävä arvo testausta varten.

  Tyyppi: string

• toDate

  Päivämäärä, johon asti valintoja voidaan tehdä (Date-objekti tai tekstimuotoinen arvo YYYY-MM-DD).

  Tyyppi: DatePickerV2Value

• value

  Päivämäärävalinnan arvo tekstimuodossa, kun käytetään kontrolloituna komponenttina (pp.kk.vvvv).

  Tyyppi: string