DatePicker

Props

Name	Type	Description
autoComplete	string	Browser autofill, off is the default value. Works as HTML autoComplete attribute
defaultValue	string \| Date \| null	Default value
format	string	dd.MM.yyyy is default
isDisabled	boolean	In case you want it to be disabled
isOpen	boolean	...
hasTodayButton	boolean	...
max	Date	Max available date
min	Date	Min available date
name	string	Component name
onBlur	(ev: BlurEvent) => void	Blur handler
onChange	(ev: ChangeEvent) => void	Change handler
onEnterPress	(ev: ChangeEvent) => void	Enter press handler
onFocus	(ev: FocusEvent) => void	Focus handler
placeholder	string	Placeholder
shouldRender	boolean	Pass `false` if you don't want the component to appear
theme	PartialGlobalDefaultTheme[ typeof COMPONENTS_NAMESPACES.dateTimeInput ]	...
value	string \| Date \| null	Selected date
_[className]	[x: string]: unknown	E.g.: `_w-48` adds a css class `w-48` to the component's outer wrapper.


() => {
  return (
    <L.DatePicker
      onChange={({ component }) => {
        log(component.value)
      }}
      _w-48
    />
  )
}

Name	Type	Description
form	string	Form name
invalidMessage	ReactNode	Text to show when the value does not match requirements
isRequired	boolean	If you don't want the field to be empty
isValid	boolean	Controlled valid state
name	string	Component name
persistence	'sessionStorage' \| 'localStorage'	Persist the value in web storage
requiredMessage	ReactNode	Text to show when the field is not filled
shouldValidateUnmounted	boolean	The field can still affect form submission even if it is not rendered
validator	Validator \| PredefinedValidator \| RegExp \| ValidatorObject[]
	interface Validator { (value: any): boolean, }	A validator is a function that takes a value and returns true or false depending on the logic it contains E.g. `(value) => value.length > 4`
	type PredefinedValidator = \| 'creditCardNumber' \| 'email' \| 'url'	See predefined validators
	interface ValidatorObject { validator: PredefinedValidator \| RegExp \| Validator, invalidMessage?: string, }	`ValidatorObject` is useful wnen you need to validate a value against several validators and show inividual messages for each. Just use an array of validator objects. E.g. [ { validator: (value) => value.length > 4, invalidMessage: 'More than 4 sympols please' }, { validator: /^\w+$/, invalidMessage: 'Only a-z, A-Z, 0-9 and _ are allowed' } ]