Calendar
The Calendar component provides date selection functionality with a visual calendar interface.
Import
<script>
import { Calendar } from 'svelte-fluentui';
</script>svelte
Basic Usage
<Calendar />svelte
With Default Date
<Calendar value={new Date()} />svelte
Date Range Selection
<Calendar mode="range" />svelte
Properties
| Property | Type | Default | Description |
|---|---|---|---|
value | Date | Date[] | undefined | Selected date(s) |
mode | 'single' | 'range' | 'multiple' | 'single' | Selection mode |
minDate | Date | undefined | Minimum selectable date |
maxDate | Date | undefined | Maximum selectable date |
disabled | boolean | false | Whether the calendar is disabled |
Events
| Event | Description |
|---|---|
on:change | Fired when date selection changes |