DatePicker
An input component to let users select a date. You can limit the allowed dates, as well as display the selected date in any format you'd like.

This component uses dayjs for internal calculations. All props work with either native Date objects or dayjs instances, but the selected date is always returned as a native JavaScript Date object.
<script>
import { DatePicker } from '@thetinkerinc/colibri';

import style from './style.js';

let selected;
</script>

<DatePicker {style} bind:selected />
Props
selected:
Date
placeholder:
start:
end:
format:
highlighted:
clearable:
disabled:
style:
Object
Slots
This component doesn't have any slots
Events
on:select
Styling
triggerBorderRadius:
triggerBorder:
Overrides:
--colibri-border
borderRadius:
border:
Overrides:
--colibri-border
calendarBackgroundColor:
topbarControlBorderRadius:
monthBorderRadius:
triggerPadding:
topbarPadding:
dateBorderRadius:
dateSelectedFontColor:
monthSpacing:
monthSelectedFontColor:
actionsBorderTop:
actionsPadding:
//style.js
export default style = {};