From b531b4815710aa81925f82d40e97ad01bf532aac Mon Sep 17 00:00:00 2001
From: rabbitism <popmessiah@hotmail.com>
Date: Thu, 20 Jun 2024 18:19:10 +0800
Subject: [PATCH] feat: implement date range picker.

---
 demo/Ursa.Demo/Pages/DatePickerDemo.axaml     |   2 +-
 .../Controls/DatePicker.axaml                 |   3 +
 .../Controls/DateRangePicker.axaml            | 147 ++++++++++
 src/Ursa.Themes.Semi/Controls/_index.axaml    |   1 +
 .../Controls/DateTimePicker/CalendarView.cs   |  22 +-
 .../Controls/DateTimePicker/DatePicker.cs     |  30 +-
 .../DateTimePicker/DateRangePicker.cs         | 269 +++++++++++++++++-
 7 files changed, 454 insertions(+), 20 deletions(-)
 create mode 100644 src/Ursa.Themes.Semi/Controls/DateRangePicker.axaml

diff --git a/demo/Ursa.Demo/Pages/DatePickerDemo.axaml b/demo/Ursa.Demo/Pages/DatePickerDemo.axaml
index d7810a5..82951c5 100644
--- a/demo/Ursa.Demo/Pages/DatePickerDemo.axaml
+++ b/demo/Ursa.Demo/Pages/DatePickerDemo.axaml
@@ -9,6 +9,6 @@
         <u:CalendarView OnDateSelected="CalendarView_OnOnDateSelected" OnDatePreviewed="CalendarView_OnOnDatePreviewed"/>
         <TextBlock Text="{Binding #singlePicker.SelectedDate}" ></TextBlock>
         <u:DatePicker Name="singlePicker" Width="200"  />
-        
+        <u:DateRangePicker Width="300" DisplayFormat="yyyyMMdd" />
     </StackPanel>
 </UserControl>
diff --git a/src/Ursa.Themes.Semi/Controls/DatePicker.axaml b/src/Ursa.Themes.Semi/Controls/DatePicker.axaml
index 260bb58..6325342 100644
--- a/src/Ursa.Themes.Semi/Controls/DatePicker.axaml
+++ b/src/Ursa.Themes.Semi/Controls/DatePicker.axaml
@@ -40,6 +40,9 @@
                                 Background="Transparent"
                                 BorderBrush="Transparent"
                                 BorderThickness="0"
+                                Watermark="{TemplateBinding Watermark}"
+                                InnerLeftContent="{TemplateBinding InnerLeftContent}"
+                                InnerRightContent="{TemplateBinding InnerRightContent}"
                                 CornerRadius="{TemplateBinding CornerRadius}"
                                 Foreground="{TemplateBinding Foreground}"
                                 Theme="{DynamicResource LooklessTextBox}"
diff --git a/src/Ursa.Themes.Semi/Controls/DateRangePicker.axaml b/src/Ursa.Themes.Semi/Controls/DateRangePicker.axaml
new file mode 100644
index 0000000..0cc449b
--- /dev/null
+++ b/src/Ursa.Themes.Semi/Controls/DateRangePicker.axaml
@@ -0,0 +1,147 @@
+<ResourceDictionary
+    xmlns="https://github.com/avaloniaui"
+    xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
+    xmlns:contracts="https://irihi.tech/shared"
+    xmlns:u="https://irihi.tech/ursa">
+    <!--  Add Resources Here  -->
+    <ControlTheme x:Key="{x:Type u:DateRangePicker}" TargetType="u:DateRangePicker">
+        <Setter Property="Background" Value="{DynamicResource TextBoxDefaultBackground}" />
+        <Setter Property="Foreground" Value="{DynamicResource TextBoxForeground}" />
+        <Setter Property="BorderBrush" Value="{DynamicResource TextBoxDefaultBorderBrush}" />
+        <Setter Property="BorderThickness" Value="{DynamicResource TextBoxBorderThickness}" />
+        <Setter Property="CornerRadius" Value="{DynamicResource TextBoxDefaultCornerRadius}" />
+        <Setter Property="MinHeight" Value="32" />
+        <Setter Property="Template">
+            <ControlTemplate TargetType="u:DateRangePicker">
+                <DataValidationErrors>
+                    <Panel
+                        Name="LayoutRoot"
+                        HorizontalAlignment="Stretch"
+                        VerticalAlignment="Stretch">
+                        <Border
+                            Name="Background"
+                            HorizontalAlignment="Stretch"
+                            Background="{TemplateBinding Background}"
+                            BorderBrush="{TemplateBinding BorderBrush}"
+                            BorderThickness="{TemplateBinding BorderThickness}"
+                            CornerRadius="{TemplateBinding CornerRadius}" />
+                        <Grid ColumnDefinitions="*, Auto, * Auto">
+                            <TextBox
+                                Name="{x:Static u:DateRangePicker.PART_StartTextBox}"
+                                Grid.Column="0"
+                                MinHeight="{TemplateBinding MinHeight}"
+                                HorizontalAlignment="Stretch"
+                                VerticalAlignment="Stretch"
+                                Background="Transparent"
+                                BorderThickness="1"
+                                CornerRadius="3 0 0 3"
+                                Foreground="{TemplateBinding Foreground}"
+                                InnerLeftContent="{TemplateBinding InnerLeftContent}"
+                                IsReadOnly="{TemplateBinding IsReadonly}" />
+                            <TextBlock
+                                Grid.Column="1"
+                                VerticalAlignment="Center"
+                                Text="~" />
+                            <TextBox
+                                Name="{x:Static u:DateRangePicker.PART_EndTextBox}"
+                                Grid.Column="2"
+                                MinHeight="{TemplateBinding MinHeight}"
+                                HorizontalAlignment="Stretch"
+                                VerticalAlignment="Stretch"
+                                Background="Transparent"
+                                CornerRadius="0"
+                                Foreground="{TemplateBinding Foreground}"
+                                InnerRightContent="{TemplateBinding InnerRightContent}"
+                                IsReadOnly="{TemplateBinding IsReadonly}" />
+                            <Button
+                                Name="ClearButton"
+                                Grid.Column="3"
+                                Padding="8,0"
+                                Command="{Binding $parent[contracts:IClearControl].Clear}"
+                                Content="{DynamicResource IconButtonClearData}"
+                                Focusable="False"
+                                IsVisible="False"
+                                Theme="{DynamicResource InnerIconButton}" />
+                            <Button
+                                Name="{x:Static u:DateRangePicker.PART_Button}"
+                                Grid.Column="3"
+                                Padding="8,0"
+                                Content="{DynamicResource TimePickerIconGlyph}"
+                                Focusable="False"
+                                Theme="{DynamicResource InnerIconButton}" />
+                        </Grid>
+                        <Popup
+                            Name="{x:Static contracts:PartNames.PART_Popup}"
+                            IsLightDismissEnabled="True"
+                            IsOpen="{TemplateBinding IsDropdownOpen,
+                                                     Mode=TwoWay}"
+                            Placement="BottomEdgeAlignedLeft"
+                            PlacementTarget="Background">
+                            <Border
+                                Margin="0,4"
+                                Padding="8"
+                                HorizontalAlignment="Stretch"
+                                Background="{DynamicResource ComboBoxPopupBackground}"
+                                BorderBrush="{DynamicResource ComboBoxPopupBorderBrush}"
+                                BorderThickness="{DynamicResource ComboBoxPopupBorderThickness}"
+                                BoxShadow="{DynamicResource ComboBoxPopupBoxShadow}"
+                                ClipToBounds="True"
+                                CornerRadius="6">
+                                <Grid ColumnDefinitions="*, *">
+                                    <u:CalendarView
+                                        Name="{x:Static u:DateRangePicker.PART_StartCalendar}"
+                                        Grid.Column="0"
+                                        Margin="8"
+                                        BorderThickness="0"
+                                        CornerRadius="{Binding $parent[Border].CornerRadius}"
+                                        FirstDayOfWeek="{TemplateBinding FirstDayOfWeek}"
+                                        IsTodayHighlighted="{TemplateBinding IsTodayHighlighted}" />
+                                    <u:CalendarView
+                                        Name="{x:Static u:DateRangePicker.PART_EndCalendar}"
+                                        Grid.Column="1"
+                                        Margin="8"
+                                        BorderThickness="0"
+                                        CornerRadius="{Binding $parent[Border].CornerRadius}"
+                                        FirstDayOfWeek="{TemplateBinding FirstDayOfWeek}"
+                                        IsTodayHighlighted="{TemplateBinding IsTodayHighlighted}" />
+                                </Grid>
+                            </Border>
+                        </Popup>
+                    </Panel>
+                </DataValidationErrors>
+            </ControlTemplate>
+        </Setter>
+
+        <Style Selector="^.clearButton, ^.ClearButton">
+            <Style Selector="^:pointerover /template/ Button#ClearButton">
+                <Setter Property="IsVisible" Value="{Binding $parent[u:TimePicker].SelectedTime, Converter={x:Static ObjectConverters.IsNotNull}}" />
+            </Style>
+            <Style Selector="^:pointerover /template/ Button#PART_Button">
+                <Setter Property="IsVisible" Value="{Binding $parent[u:TimePicker].SelectedTime, Converter={x:Static ObjectConverters.IsNull}}" />
+            </Style>
+        </Style>
+
+        <!--  Disabled State  -->
+        <Style Selector="^:disabled">
+            <Style Selector="^ /template/ Border#Background">
+                <Setter Property="Background" Value="{DynamicResource CalendarDatePickerDisabledBackground}" />
+            </Style>
+
+            <Style Selector="^ /template/ Button#PART_Button">
+                <Setter Property="Foreground" Value="{DynamicResource CalendarDatePickerDisabledIconForeground}" />
+            </Style>
+            <Style Selector="^ /template/ TextBox#PART_TextBox">
+                <Setter Property="Background" Value="Transparent" />
+                <Setter Property="BorderBrush" Value="Transparent" />
+            </Style>
+        </Style>
+
+        <!--  Focused State  -->
+        <Style Selector="^ /template/ Border#Background:focus">
+            <Setter Property="BorderBrush" Value="{DynamicResource CalendarDatePickerFocusBorderBrush}" />
+        </Style>
+        <Style Selector="^ /template/ Border#Background:focus-within">
+            <Setter Property="BorderBrush" Value="{DynamicResource CalendarDatePickerFocusBorderBrush}" />
+        </Style>
+    </ControlTheme>
+</ResourceDictionary>
diff --git a/src/Ursa.Themes.Semi/Controls/_index.axaml b/src/Ursa.Themes.Semi/Controls/_index.axaml
index 232557f..1fd38a9 100644
--- a/src/Ursa.Themes.Semi/Controls/_index.axaml
+++ b/src/Ursa.Themes.Semi/Controls/_index.axaml
@@ -9,6 +9,7 @@
         <ResourceInclude Source="ControlClassesInput.axaml" />
         <ResourceInclude Source="Clock.axaml" />
         <ResourceInclude Source="DatePicker.axaml" />
+        <ResourceInclude Source="DateRangePicker.axaml" />
         <ResourceInclude Source="Dialog.axaml" />
         <ResourceInclude Source="DialogShared.axaml" />
         <ResourceInclude Source="DisableContainer.axaml" />
diff --git a/src/Ursa/Controls/DateTimePicker/CalendarView.cs b/src/Ursa/Controls/DateTimePicker/CalendarView.cs
index b3c0063..547dbec 100644
--- a/src/Ursa/Controls/DateTimePicker/CalendarView.cs
+++ b/src/Ursa/Controls/DateTimePicker/CalendarView.cs
@@ -140,7 +140,6 @@ public class CalendarView : TemplatedControl
         InitializeGridButtons();
         UpdateDayButtons();
         UpdateYearButtons();
-        UpdateHeaderButtons();
     }
 
     private void OnFastNext(object sender, RoutedEventArgs e)
@@ -150,8 +149,6 @@ public class CalendarView : TemplatedControl
             ContextCalendar.Year += 1;
             UpdateDayButtons();
         }
-
-        UpdateHeaderButtons();
     }
 
     private void OnNext(object sender, RoutedEventArgs e)
@@ -184,8 +181,6 @@ public class CalendarView : TemplatedControl
             ContextCalendar.EndYear += 100;
             UpdateYearButtons();
         }
-
-        UpdateHeaderButtons();
     }
 
     private void OnPrevious(object sender, RoutedEventArgs e)
@@ -218,8 +213,6 @@ public class CalendarView : TemplatedControl
             ContextCalendar.EndYear -= 100;
             UpdateYearButtons();
         }
-
-        UpdateHeaderButtons();
     }
 
     private void OnFastPrevious(object sender, RoutedEventArgs e)
@@ -229,8 +222,6 @@ public class CalendarView : TemplatedControl
             ContextCalendar.Year -= 1;
             UpdateDayButtons();
         }
-
-        UpdateHeaderButtons();
     }
 
     /// <summary>
@@ -248,7 +239,6 @@ public class CalendarView : TemplatedControl
             var range = DateTimeHelper.GetDecadeViewRangeByYear(ContextCalendar.Year!.Value);
             ContextCalendar.StartYear = range.start;
             ContextCalendar.EndYear = range.end;
-            UpdateHeaderButtons();
             UpdateYearButtons();
             return;
         }
@@ -259,7 +249,6 @@ public class CalendarView : TemplatedControl
             var range = DateTimeHelper.GetCenturyViewRangeByYear(ContextCalendar.StartYear!.Value);
             ContextCalendar.StartYear = range.start;
             ContextCalendar.EndYear = range.end;
-            UpdateHeaderButtons();
             UpdateYearButtons();
             return;
         }
@@ -314,7 +303,7 @@ public class CalendarView : TemplatedControl
         }
     }
 
-    private void UpdateDayButtons()
+    internal void UpdateDayButtons()
     {
         if (_monthGrid is null || Mode != CalendarViewMode.Month) return;
         var children = _monthGrid.Children;
@@ -335,6 +324,7 @@ public class CalendarView : TemplatedControl
 
         FadeOutDayButtons();
         MarkDates(_start, _end, _previewStart, _previewEnd);
+        UpdateHeaderButtons();
     }
 
     private void UpdateYearButtons()
@@ -374,6 +364,7 @@ public class CalendarView : TemplatedControl
                 child?.SetContext(CalendarViewMode.Year, new CalendarContext { Month = i });
             }
         }
+        UpdateHeaderButtons();
     }
 
     private void FadeOutDayButtons()
@@ -412,7 +403,7 @@ public class CalendarView : TemplatedControl
 
     private void OnCellDatePreviewed(object sender, CalendarDayButtonEventArgs e)
     {
-        OnDatePreviewed?.Invoke(sender, e);
+        OnDatePreviewed?.Invoke(this, e);
     }
 
     private void OnCellDateSelected(object sender, CalendarDayButtonEventArgs e)
@@ -423,10 +414,9 @@ public class CalendarView : TemplatedControl
             ContextCalendar.Year = e.Date.Year;
             ContextCalendar.Day = 1;
             UpdateDayButtons();
-            UpdateHeaderButtons();
         }
 
-        OnDateSelected?.Invoke(sender, e);
+        OnDateSelected?.Invoke(this, e);
     }
 
     /// <summary>
@@ -437,7 +427,6 @@ public class CalendarView : TemplatedControl
     private void OnHeaderMonthButtonClick(object sender, RoutedEventArgs e)
     {
         SetCurrentValue(ModeProperty, CalendarViewMode.Year);
-        UpdateHeaderButtons();
         UpdateYearButtons();
     }
 
@@ -453,7 +442,6 @@ public class CalendarView : TemplatedControl
         var range = DateTimeHelper.GetDecadeViewRangeByYear(ContextCalendar.Year!.Value);
         ContextCalendar.StartYear = range.start;
         ContextCalendar.EndYear = range.end;
-        UpdateHeaderButtons();
         UpdateYearButtons();
     }
 
diff --git a/src/Ursa/Controls/DateTimePicker/DatePicker.cs b/src/Ursa/Controls/DateTimePicker/DatePicker.cs
index 8463aa5..e1c802f 100644
--- a/src/Ursa/Controls/DateTimePicker/DatePicker.cs
+++ b/src/Ursa/Controls/DateTimePicker/DatePicker.cs
@@ -34,6 +34,15 @@ public class DatePicker: DatePickerBase, IClearControl
         set => SetValue(SelectedDateProperty, value);
     }
 
+    public static readonly StyledProperty<string?> WatermarkProperty = AvaloniaProperty.Register<DatePicker, string?>(
+        nameof(Watermark));
+
+    public string? Watermark
+    {
+        get => GetValue(WatermarkProperty);
+        set => SetValue(WatermarkProperty, value);
+    }
+
     static DatePicker()
     {
         SelectedDateProperty.Changed.AddClassHandler<DatePicker, DateTime?>((picker, args) =>
@@ -86,6 +95,7 @@ public class DatePicker: DatePickerBase, IClearControl
     private void OnDateSelected(object sender, CalendarDayButtonEventArgs e)
     {
         SetCurrentValue(SelectedDateProperty, e.Date);
+        SetCurrentValue(IsDropdownOpenProperty, false);
     }
 
     private void OnButtonClick(object sender, RoutedEventArgs e)
@@ -96,6 +106,12 @@ public class DatePicker: DatePickerBase, IClearControl
 
     private void OnTextBoxPointerPressed(object sender, PointerPressedEventArgs e)
     {
+        if (_calendar is not null)
+        {
+            var date = SelectedDate ?? DateTime.Today;
+            _calendar.ContextCalendar = new CalendarContext(date.Year, date.Month, 1);
+            _calendar.UpdateDayButtons();
+        }
         SetCurrentValue(IsDropdownOpenProperty, true);
     }
 
@@ -120,6 +136,12 @@ public class DatePicker: DatePickerBase, IClearControl
                     out var date))
             {
                 SetCurrentValue(SelectedDateProperty, date);
+                if (_calendar is not null)
+                {
+                    var d = SelectedDate ?? DateTime.Today;
+                    _calendar.ContextCalendar = new CalendarContext(date.Year, date.Month, 1);
+                    _calendar.UpdateDayButtons();
+                }
                 _calendar?.MarkDates(startDate: date, endDate: date);
             }
         }
@@ -127,7 +149,13 @@ public class DatePicker: DatePickerBase, IClearControl
 
     private void OnTextBoxGetFocus(object sender, GotFocusEventArgs e)
     {
-        SetCurrentValue(IsDropdownOpenProperty, true); 
+        if (_calendar is not null)
+        {
+            var date = SelectedDate ?? DateTime.Today;
+            _calendar.ContextCalendar = new CalendarContext(date.Year, date.Month, 1);
+            _calendar.UpdateDayButtons();
+        }
+        SetCurrentValue(IsDropdownOpenProperty, true);
     }
     
     protected override void OnKeyDown(KeyEventArgs e)
diff --git a/src/Ursa/Controls/DateTimePicker/DateRangePicker.cs b/src/Ursa/Controls/DateTimePicker/DateRangePicker.cs
index 0564cdf..1ad45d9 100644
--- a/src/Ursa/Controls/DateTimePicker/DateRangePicker.cs
+++ b/src/Ursa/Controls/DateTimePicker/DateRangePicker.cs
@@ -1,8 +1,275 @@
+using Avalonia;
+using Avalonia.Controls;
+using Avalonia.Controls.Metadata;
 using Avalonia.Controls.Primitives;
+using Avalonia.Input;
+using Avalonia.Interactivity;
+using Irihi.Avalonia.Shared.Helpers;
 
 namespace Ursa.Controls;
 
-public class DateRangePicker : TemplatedControl
+[TemplatePart(PART_Button, typeof(Button))]
+[TemplatePart(PART_Popup, typeof(Popup))]
+[TemplatePart(PART_StartCalendar, typeof(CalendarView))]
+[TemplatePart(PART_EndCalendar, typeof(CalendarView))]
+[TemplatePart(PART_StartTextBox, typeof(TextBox))]
+[TemplatePart(PART_EndTextBox, typeof(TextBox))]
+public class DateRangePicker : DatePickerBase
 {
+    public const string PART_Button = "PART_Button";
+    public const string PART_Popup = "PART_Popup";
+    public const string PART_StartCalendar = "PART_StartCalendar";
+    public const string PART_EndCalendar = "PART_EndCalendar";
+    public const string PART_StartTextBox = "PART_StartTextBox";
+    public const string PART_EndTextBox = "PART_EndTextBox";
+
+    public static readonly StyledProperty<DateTime?> SelectedStartDateProperty =
+        AvaloniaProperty.Register<DateRangePicker, DateTime?>(
+            nameof(SelectedStartDate));
+
+    public static readonly StyledProperty<DateTime?> SelectedEndDateProperty =
+        AvaloniaProperty.Register<DateRangePicker, DateTime?>(
+            nameof(SelectedEndDate));
+
+    private Button? _button;
+    private CalendarView? _endCalendar;
+    private TextBox? _endTextBox;
+    private Popup? _popup;
+    private CalendarView? _startCalendar;
+    private TextBox? _startTextBox;
+
+    static DateRangePicker()
+    {
+        SelectedStartDateProperty.Changed.AddClassHandler<DateRangePicker, DateTime?>((picker, args) =>
+            picker.OnSelectionChanged(args));
+        SelectedEndDateProperty.Changed.AddClassHandler<DateRangePicker, DateTime?>((picker, args) =>
+            picker.OnSelectionChanged(args));
+    }
+
+    public DateTime? SelectedStartDate
+    {
+        get => GetValue(SelectedStartDateProperty);
+        set => SetValue(SelectedStartDateProperty, value);
+    }
+
+    public DateTime? SelectedEndDate
+    {
+        get => GetValue(SelectedEndDateProperty);
+        set => SetValue(SelectedEndDateProperty, value);
+    }
+
+
+    private void OnSelectionChanged(AvaloniaPropertyChangedEventArgs<DateTime?> args)
+    {
+        if (args.Property == SelectedStartDateProperty)
+        {
+            if (args.NewValue.Value is null)
+            {
+                _startCalendar?.ClearSelection();
+                _startTextBox?.Clear();
+            }
+            else
+            {
+                _startCalendar?.MarkDates(args.NewValue.Value, args.NewValue.Value);
+                _startTextBox?.SetValue(TextBox.TextProperty,
+                    args.NewValue.Value.Value.ToString(DisplayFormat ?? "yyyy-MM-dd"));
+            }
+        }
+        else if (args.Property == SelectedEndDateProperty)
+        {
+            if (args.NewValue.Value is null)
+            {
+                _endCalendar?.ClearSelection();
+                _endTextBox?.Clear();
+            }
+            else
+            {
+                _endCalendar?.MarkDates(args.NewValue.Value, args.NewValue.Value);
+                _endTextBox?.SetValue(TextBox.TextProperty,
+                    args.NewValue.Value.Value.ToString(DisplayFormat ?? "yyyy-MM-dd"));
+            }
+        }
+    }
+
+    protected override void OnApplyTemplate(TemplateAppliedEventArgs e)
+    {
+        base.OnApplyTemplate(e);
+        GotFocusEvent.RemoveHandler(OnTextBoxGetFocus, _startTextBox);
+        TextBox.TextChangedEvent.RemoveHandler(OnTextChanged, _startTextBox, _endTextBox);
+        PointerPressedEvent.RemoveHandler(OnTextBoxPointerPressed, _startTextBox, _endTextBox);
+        Button.ClickEvent.RemoveHandler(OnButtonClick, _button);
+        if (_startCalendar != null)
+        {
+            _startCalendar.OnDateSelected -= OnDateSelected;
+            _startCalendar.OnDatePreviewed -= OnDatePreviewed;
+        }
+        if (_endCalendar != null)
+        {
+            _endCalendar.OnDateSelected -= OnDateSelected;
+            _endCalendar.OnDatePreviewed -= OnDatePreviewed;
+        }
+        _button = e.NameScope.Find<Button>(PART_Button);
+        _popup = e.NameScope.Find<Popup>(PART_Popup);
+        _startCalendar = e.NameScope.Find<CalendarView>(PART_StartCalendar);
+        _endCalendar = e.NameScope.Find<CalendarView>(PART_EndCalendar);
+        _startTextBox = e.NameScope.Find<TextBox>(PART_StartTextBox);
+        _endTextBox = e.NameScope.Find<TextBox>(PART_EndTextBox);
+        
+        Button.ClickEvent.AddHandler(OnButtonClick, RoutingStrategies.Tunnel, true, _button);
+        GotFocusEvent.AddHandler(OnTextBoxGetFocus, _startTextBox, _endTextBox);
+        TextBox.TextChangedEvent.AddHandler(OnTextChanged, _startTextBox, _endTextBox);
+        PointerPressedEvent.AddHandler(OnTextBoxPointerPressed, RoutingStrategies.Tunnel, false, _startTextBox, _endTextBox);
+        
+        if (_startCalendar != null)
+        {
+            _startCalendar.OnDateSelected += OnDateSelected;
+            _startCalendar.OnDatePreviewed += OnDatePreviewed;
+        }
+        if (_endCalendar != null)
+        {
+            _endCalendar.OnDateSelected += OnDateSelected;
+            _endCalendar.OnDatePreviewed += OnDatePreviewed;
+        }
+    }
+
+    private DateTime? _previewStart;
+    private DateTime? _previewEnd;
+    private bool? _start;
     
+    private void OnDatePreviewed(object sender, CalendarDayButtonEventArgs e)
+    {
+        if (_start == true)
+        {
+            _previewStart = e.Date;
+            _startCalendar?.MarkDates(SelectedStartDate, SelectedEndDate, _previewStart, _previewEnd);
+            _endCalendar?.MarkDates(SelectedStartDate, SelectedEndDate, _previewStart, _previewEnd);
+        }
+        else if(_start == false)
+        {
+            _previewEnd = e.Date;
+            _startCalendar?.MarkDates(SelectedStartDate, SelectedEndDate, _previewStart, _previewEnd);
+            _endCalendar?.MarkDates(SelectedStartDate, SelectedEndDate, _previewStart, _previewEnd);
+        }
+    }
+
+    private void OnDateSelected(object sender, CalendarDayButtonEventArgs e)
+    {
+        if (_start == true)
+        {
+            if (SelectedEndDate < e.Date)
+            {
+                // Select a start date that is out of current range, so clear selection.
+                // _startCalendar?.ClearSelection();
+                // _endCalendar?.ClearSelection();
+                SelectedStartDate = null;
+                SelectedEndDate = null;
+            }
+            SetCurrentValue(SelectedStartDateProperty, e.Date);
+            _startTextBox?.SetValue(TextBox.TextProperty, e.Date.ToString(DisplayFormat ?? "yyyy-MM-dd"));
+            _start = false;
+            _previewStart = null;
+            _previewEnd = null;
+            _startCalendar?.MarkDates(SelectedStartDate, SelectedEndDate, _previewStart, _previewEnd);
+            _endCalendar?.MarkDates(SelectedStartDate, SelectedEndDate, _previewStart, _previewEnd);
+            _endTextBox?.Focus();
+        }
+        else if(_start == false)
+        {
+            if (SelectedStartDate > e.Date)
+            {
+                // Select a start date that is out of current range, so clear selection.
+                // _startCalendar?.ClearSelection();
+                // _endCalendar?.ClearSelection();
+                SelectedStartDate = null;
+                SelectedEndDate = null;
+            }
+            SetCurrentValue(SelectedEndDateProperty, e.Date);
+            _endTextBox?.SetValue(TextBox.TextProperty, e.Date.ToString(DisplayFormat ?? "yyyy-MM-dd"));
+            _start = null;
+            _previewStart = null;
+            _previewEnd = null;
+            _startCalendar?.MarkDates(SelectedStartDate, SelectedEndDate, _previewStart, _previewEnd);
+            _endCalendar?.MarkDates(SelectedStartDate, SelectedEndDate, _previewStart, _previewEnd);
+            SetCurrentValue(IsDropdownOpenProperty, false);
+        }
+        
+    }
+
+    private void OnButtonClick(object sender, RoutedEventArgs e)
+    {
+        Focus(NavigationMethod.Pointer);
+        SetCurrentValue(IsDropdownOpenProperty, !IsDropdownOpen);
+        _start = true;
+    }
+
+    private void OnTextBoxPointerPressed(object sender, PointerPressedEventArgs e)
+    {
+        if (sender == _startTextBox)
+        {
+            _start = true;
+            if (_startCalendar is not null)
+            {
+                var date = SelectedStartDate ?? DateTime.Today;
+                _startCalendar.ContextCalendar = new CalendarContext(date.Year, date.Month, 1);
+                _startCalendar.UpdateDayButtons();
+            }
+
+            if (_endCalendar is not null)
+            {
+                var date2 = SelectedStartDate ?? SelectedEndDate ?? DateTime.Today;
+                date2 = SelectedStartDate is null ? date2 : date2.AddMonths(1);
+                _endCalendar.ContextCalendar = new CalendarContext(date2.Year, date2.Month, 1);
+                _endCalendar.UpdateDayButtons();
+            }
+        }
+        else if (sender == _endTextBox)
+        {
+            _start = false;
+            if (_startCalendar is not null)
+            {
+                var date2 = SelectedEndDate ?? DateTime.Today;
+                date2 = date2.AddMonths(-1);
+                _startCalendar.ContextCalendar = new CalendarContext(date2.Year, date2.Month, 1);
+                _startCalendar.UpdateDayButtons();
+            }
+            if (_endCalendar is not null)
+            {
+                var date = SelectedEndDate ?? DateTime.Today;
+                _endCalendar.ContextCalendar = new CalendarContext(date.Year, date.Month, 1);
+                _endCalendar.UpdateDayButtons();
+            }
+        }
+        SetCurrentValue(IsDropdownOpenProperty, true);
+    }
+
+    private void OnTextChanged(object sender, TextChangedEventArgs e)
+    {
+        //throw new NotImplementedException();
+    }
+
+    private void OnTextBoxGetFocus(object sender, GotFocusEventArgs e)
+    {
+        if (_startCalendar is not null)
+        {
+            var date = SelectedStartDate ?? DateTime.Today;
+            _startCalendar.ContextCalendar = new CalendarContext(date.Year, date.Month, 1);
+            _startCalendar.UpdateDayButtons();
+        }
+
+        if (_endCalendar is not null)
+        {
+            var date2 = SelectedStartDate ?? DateTime.Today;
+            date2 = date2.AddMonths(1);
+            _endCalendar.ContextCalendar = new CalendarContext(date2.Year, date2.Month, 1);
+            _endCalendar.UpdateDayButtons();
+        }
+        SetCurrentValue(IsDropdownOpenProperty, true);
+    }
+
+    protected override void OnLostFocus(RoutedEventArgs e)
+    {
+        //base.OnLostFocus(e);
+        //SetCurrentValue(IsDropdownOpenProperty, false);
+        //_start = null;
+    }
 }
\ No newline at end of file