DatePicker API Overview

Initialization

<script>
  import { DatePicker } from "@svar-ui/svelte-core";
</script>

<!-- minimal configuration for initialization -->
<DatePicker />

tip

• Visit the Features Guide to learn more about the control's functionality.
• Explore the samples to visualize the available features.

DatePicker Properties

align	Optional. Defines how the calendar dropdown is aligned horizontally relative to the input field
buttons	Optional. Shows/hides the Today and Clear buttons in the lower part of the drop-down calendar
clear	Optional. Adds the Clear button into a date picker input
css	Optional. Changes the position of the icon in the input
disabled	Optional. Defines whether a date picker is disabled
editable	Optional. Defines whether a date picker is editable or sets a custom format for editing a date
error	Optional. Defines whether error styling is applied to a date picker
format	Optional. Sets the date format for a date picker input
id	optional. Sets an HTML id for a date picker
placeholder	Optional. Sets a text for the input's placeholder
title	Optional. Sets a tooltip text with additional info about the control
value	Optional. Sets the value of a date picker
width	Optional. Sets the width of a popup with a calendar

DatePicker Events

change	Optional. Fires when a new date is selected in a date picker