feat: date picker form field

nank1ro · Oct 30, 2024 · 7d99e65 · 7d99e65
1 parent d981004
commit 7d99e65
Show file tree

Hide file tree

Showing 4 changed files with 593 additions and 12 deletions.
diff --git a/example/lib/pages/date_picker_form_field.dart b/example/lib/pages/date_picker_form_field.dart
@@ -54,6 +54,7 @@ class _DatePickerFormFieldPageState extends State<DatePickerFormFieldPage> {
             child: Column(
               crossAxisAlignment: CrossAxisAlignment.start,
               children: [
+                Text('Single', style: theme.textTheme.h4),
                 ShadDatePickerFormField(
                   id: 'date',
                   initialValue: initialValue,
@@ -68,6 +69,22 @@ class _DatePickerFormFieldPageState extends State<DatePickerFormFieldPage> {
                     return null;
                   },
                 ),
+                const Divider(),
+                Text('Range', style: theme.textTheme.h4),
+                ShadDateRangePickerFormField(
+                  id: 'range-date',
+                  label: const Text('Range of dates'),
+                  onChanged: print,
+                  description: const Text(
+                      'Select the range of dates you want to search between.'),
+                  validator: (v) {
+                    if (v == null) return 'A range of dates is required.';
+                    if (v.start == null) return 'The start date is required.';
+                    if (v.end == null) return 'The end date is required.';
+
+                    return null;
+                  },
+                ),
                 const SizedBox(height: 16),
                 ShadButton(
                   child: const Text('Submit'),

diff --git a/lib/shadcn_ui.dart b/lib/shadcn_ui.dart
@@ -21,6 +21,7 @@ export 'src/components/form/fields/radio.dart';
 export 'src/components/form/fields/select.dart';
 export 'src/components/form/fields/switch.dart';
 export 'src/components/form/fields/date_picker.dart';
+export 'src/components/form/fields/date_range_picker.dart';
 export 'src/components/form/form.dart';
 export 'src/components/image.dart';
 export 'src/components/input.dart';

diff --git a/lib/src/components/form/fields/date_picker.dart b/lib/src/components/form/fields/date_picker.dart
@@ -123,9 +123,6 @@ class ShadDatePickerFormField extends ShadFormBuilderField<DateTime> {
     /// {@macro ShadCalendar.selectableDayPredicate}
     SelectableDayPredicate? selectableDayPredicate,
 
-    /// {@macro ShadCalendar.onRangeChanged}
-    ValueChanged<ShadDateTimeRange?>? onRangeChanged,
-
     /// {@macro ShadCalendar.captionLayout}
     ShadCalendarCaptionLayout? captionLayout,
 
@@ -219,9 +216,6 @@ class ShadDatePickerFormField extends ShadFormBuilderField<DateTime> {
     /// {@macro ShadCalendar.selectedDayButtonTextStyle}
     TextStyle? selectedDayButtonTextStyle,
 
-    /// {@macro ShadCalendar.insideRangeDayButtonTextStyle}
-    TextStyle? insideRangeDayButtonTextStyle,
-
     /// {@macro ShadCalendar.dayButtonTextStyle}
     TextStyle? dayButtonTextStyle,
 
@@ -231,9 +225,6 @@ class ShadDatePickerFormField extends ShadFormBuilderField<DateTime> {
     /// {@macro ShadCalendar.selectedDayButtonVariant}
     ShadButtonVariant? selectedDayButtonVariant,
 
-    /// {@macro ShadCalendar.insideRangeDayButtonVariant}
-    ShadButtonVariant? insideRangeDayButtonVariant,
-
     /// {@macro ShadCalendar.todayButtonVariant}
     ShadButtonVariant? todayButtonVariant,
 
@@ -466,7 +457,6 @@ class ShadDatePickerFormField extends ShadFormBuilderField<DateTime> {
               min: min,
               max: max,
               selectableDayPredicate: selectableDayPredicate,
-              onRangeChanged: onRangeChanged,
               captionLayout: captionLayout,
               hideNavigation: hideNavigation,
               yearSelectorMinWidth: yearSelectorMinWidth,
@@ -498,11 +488,9 @@ class ShadDatePickerFormField extends ShadFormBuilderField<DateTime> {
               dayButtonPadding: dayButtonPadding,
               dayButtonDecoration: dayButtonDecoration,
               selectedDayButtonTextStyle: selectedDayButtonTextStyle,
-              insideRangeDayButtonTextStyle: insideRangeDayButtonTextStyle,
               dayButtonTextStyle: dayButtonTextStyle,
               dayButtonVariant: dayButtonVariant,
               selectedDayButtonVariant: selectedDayButtonVariant,
-              insideRangeDayButtonVariant: insideRangeDayButtonVariant,
               todayButtonVariant: todayButtonVariant,
               gridMainAxisSpacing: gridMainAxisSpacing,
               gridCrossAxisSpacing: gridCrossAxisSpacing,