date_range_picker_sheet 0.1.0

A pretty, customizable date range picker presented as a Material bottom sheet, with an inline month calendar and quick-select chips.

date_range_picker_sheet

A pretty, customizable date range picker presented as a Material bottom sheet. Includes an inline month calendar with range highlighting, quick-select chips, and from/to fields.

• ✅ Inline month calendar with smooth range highlight
• ✅ Quick-select chips: Today, Last week, Last month
• ✅ Fully theme-able (colors, radii, labels)
• ✅ Configurable min/max selectable dates
• ✅ Custom date format (defaults to dd-MMM-yyyy)
• ✅ Localizable strings
• ✅ Pure Dart/Flutter — no native code, no platform channels

Installation

Add this to your pubspec.yaml:

dependencies:
  date_range_picker_sheet: ^0.1.0

Then run:

flutter pub get

Usage

Show as a modal bottom sheet

import 'package:date_range_picker_sheet/date_range_picker_sheet.dart';

ElevatedButton(
  onPressed: () {
    DateRangePickerSheet.show(
      context,
      initialFromStr: '01-JAN-2026',
      initialToStr: '07-JAN-2026',
      onApply: (from, to) {
        debugPrint('Picked: $from -> $to');
      },
      onReset: () {},
    );
  },
  child: const Text('Pick a date range'),
);

Embed inline in any layout

DateRangePickerSheet(
  initialFromStr: '01-JAN-2026',
  initialToStr: '07-JAN-2026',
  onConfirm: (from, to) => debugPrint('Confirmed: $from -> $to'),
  onClose: () => Navigator.of(context).pop(),
);

Customize colors and labels

DateRangePickerSheet.show(
  context,
  initialFromStr: from,
  initialToStr: to,
  theme: const DateRangePickerSheetTheme(
    primaryColor: Color(0xFFFF6F00),
    surfaceColor: Color(0xFFF7F7F8),
    borderColor: Color(0xFFE5E7EB),
  ),
  labels: const DateRangePickerSheetLabels(
    title: 'Pick dates',
    confirm: 'Apply',
    close: 'Cancel',
  ),
  onApply: (from, to) {},
);

Limit the selectable range

DateRangePickerSheet.show(
  context,
  initialFromStr: from,
  initialToStr: to,
  minDate: DateTime(2026, 1, 1),
  maxDate: DateTime.now().add(const Duration(days: 30)),
  onApply: (from, to) {},
);

Format helpers

final str = DateRangePickerSheet.formatOrderDate(DateTime.now()); // 30-APR-2026
final dt  = DateRangePickerSheet.parseOrderDate('30-APR-2026');   // DateTime(2026,4,30)

API overview

Class	Purpose
DateRangePickerSheet	The widget itself. Embed directly or present via show().
DateRangePickerSheetTheme	Visual configuration (colors, border radii).
DateRangePickerSheetLabels	Localized strings (title, buttons, week labels...).

Selection rules

• Tapping any selectable day starts a new range from that day.
• Tapping a second day extends/closes the range.
• Tapping a date earlier than the current "from" while picking the "to" will move the "from" to the earlier date instead.

Example

A complete runnable example lives in example/.

cd example
flutter run

License

This package is released under the MIT License.