The Blazor DatePicker component provides an intuitive interface for date selection and navigation. It offers a comprehensive set of features including multiple view modes, date range restrictions, custom rendering, and accessibility support for building robust date-picking experiences.

Two-way binding can be achieved by using bind-Value attribute, which supports string, int, Enum, DateTime, bool types. If the component value has been changed, it will affect all places where the variable is bound for the bind-value attribute.

The Format property allows you to define how the selected date is displayed in the input field. Additionally, the InputFormats property defines a list of custom formats that the DatePicker accepts when a user manually enters a date, providing flexibility for different date entry styles.

The Min and Max properties allow you to restrict the range of dates that a user can select. Any dates outside of this range will be disabled in the calendar popup, and manual entry of out-of-range dates will be invalidated.

By default, the DatePicker allows users to enter any date, but if the entered date is outside the Min and Max range, it will be automatically reset to the nearest valid date when StrictMode is enabled. This ensures the component always holds a value within the specified boundaries.

The Start property specifies the initial view when the calendar is opened (e.g., Year, Decade), while the Depth property restricts the view navigation level (e.g., to Month, Year). This allows for quick selection of years or decades without drilling down to specific days.

Enable floating labels by setting the FloatLabelType property. Floating labels move above the input field when focused or filled, providing a clean interface that saves vertical space.

The masking feature allows users to enter a date in the correct format, as specified by the Format property. This helps to ensure that the date is entered correctly and can also make it easier for users to understand how to enter the date. The EnableMask property in the DatePicker component allows you to enable or disable the masking functionality. When enabled, the input field will be displayed as masked with a specific date format pattern for entering the date.

The DatePicker control supports displaying the Islamic calendar (Hijri calendar). Islamic calendar or Hijri calendar is a lunar calendar consisting of 12 months in a year of 354 or 355 days.Users can either select a date from the Islamic calendar or manually enter a date. Additionally, you can use the ConvertToHijri and ConvertToGregorian methods to parse dates.

You can enable WeekNumber in the DatePicker by using the WeekNumber property. Configure how the first week of the year is determined by using the WeekRule property (aligned with .NET CalendarWeekRule semantics).