logo-icon
Datepicker

Beta Component

This component is still a work in progress and is subject to change. Use with caution as breaking changes may occur.
DatePicker
calendar_month

calendar_month

error

Your doing it wrong


svelte
<script lang="ts">
	import { DatePicker } from 'stwui';

	const date2Max = new Date(2022, 7, 30);
	const date2Min = new Date(2022, 7, 3);
</script>

<DatePicker name="date-1" />
<br />
<DatePicker name="date-2" label="Date" max={date2Max} min={date2Min} />
<br />
<DatePicker name="date-3" label="Date" min={date2Min} error="Your doing it wrong" />

DatePicker Props

trailing MaterialIcon | undefined calendar_month
name string
label string | undefined
srOnly boolean false
error string | undefined
placeholder string | undefined
value Date | null null
min Date | undefined
max Date | undefined
format string (dayjs format) MMMM D, YYYY
locale Locale {}
visible boolean false
closeOnSelect boolean true
handleSelect (d: Dayjs) => void) | undefined