<div class='type'>Composable Function</div>


<a id='references'></a>


<h2 id="rememberdaterangepickerstate-yearrange-initialdisplaymode-selectabledates">rememberDateRangePickerState</h2>

<div class='sourceset sourceset-common'>Common</div>


```kotlin
@Composable
fun rememberDateRangePickerState(
    @Suppress("AutoBoxing") initialSelectedStartDateMillis: Long? = null,
    @Suppress("AutoBoxing") initialSelectedEndDateMillis: Long? = null,
    @Suppress("AutoBoxing") initialDisplayedMonthMillis: Long? = initialSelectedStartDateMillis,
    yearRange: IntRange = DatePickerDefaults.YearRange,
    initialDisplayMode: DisplayMode = DisplayMode.Picker,
    selectableDates: SelectableDates = DatePickerDefaults.AllDates,
): DateRangePickerState
```


Creates a `DateRangePickerState` for a `DateRangePicker` that is remembered across compositions.

To create a date range picker state outside composition, see the `DateRangePickerState` function.

#### Parameters

| | |
| --- | --- |
| initialSelectedStartDateMillis | timestamp in _UTC_ milliseconds from the epoch that represents an initial selection of a start date. Provide a `null` to indicate no selection. |
| initialSelectedEndDateMillis | timestamp in _UTC_ milliseconds from the epoch that represents an initial selection of an end date. Provide a `null` to indicate no selection. |
| initialDisplayedMonthMillis | timestamp in _UTC_ milliseconds from the epoch that represents an initial selection of a month to be displayed to the user. By default, in case an `initialSelectedStartDateMillis` is provided, the initial displayed month would be the month of the selected date. Otherwise, in case `null` is provided, the displayed month would be the current one. |
| yearRange | an `IntRange` that holds the year range that the date range picker will be limited to |
| initialDisplayMode | an initial `DisplayMode` that this state will hold |
| selectableDates | a `SelectableDates` that is consulted to check if a date is allowed. In case a date is not allowed to be selected, it will appear disabled in the UI. |


<hr class="docs-overload-divider">


<h2 id="rememberdaterangepickerstate-initialselectedstartdate-initialselectedenddate-initialdisplayedmonth-yearrange-initialdisplaymode-selectabledates">rememberDateRangePickerState</h2>

<div class='sourceset sourceset-jvmAndAndroid'>JvmAndAndroid</div>


```kotlin
@RequiresApi(26)
@Composable
fun rememberDateRangePickerState(
    initialSelectedStartDate: LocalDate?,
    initialSelectedEndDate: LocalDate?,
    initialDisplayedMonth: YearMonth? = initialSelectedStartDate?.let { YearMonth.from(it) },
    yearRange: IntRange = DatePickerDefaults.YearRange,
    initialDisplayMode: DisplayMode = DisplayMode.Picker,
    selectableDates: SelectableDates = DatePickerDefaults.AllDates,
): DateRangePickerState
```


Creates a `DateRangePickerState` for a `DateRangePicker` that is remembered across compositions.

Note: This composable uses `LocalDate` and `YearMonth`. For a lower-level composable that uses
UTC milliseconds, see the other `rememberDateRangePickerState` overload.

The initial values are converted to UTC milliseconds at the start of the day (midnight):
- `initialSelectedStartDate` is used to set `DateRangePickerState.selectedStartDateMillis`.
- `initialSelectedEndDate` is used to set `DateRangePickerState.selectedEndDateMillis`.
- `initialDisplayedMonth` is used to set `DateRangePickerState.displayedMonthMillis`, based on the first day of that month.

To create a date range picker state outside composition, see the `DateRangePickerState` function.

#### Parameters

| | |
| --- | --- |
| initialSelectedStartDate | a `LocalDate` that represents an initial selection of a start date. Provide a `null` to indicate no selection. |
| initialSelectedEndDate | a `LocalDate` that represents an initial selection of an end date. Provide a `null` to indicate no selection. |
| initialDisplayedMonth | an optional `YearMonth` for an initial month that will be displayed to the user. By default, in case an `initialSelectedStartDate` is provided, the initial displayed month would be the month of the selected date. You may provide a different initial month, or `null` to display the current one. |
| yearRange | an `IntRange` that holds the year range that the date range picker will be limited to |
| initialDisplayMode | an initial `DisplayMode` that this state will hold |
| selectableDates | a `SelectableDates` that is consulted to check if a date is allowed. In case a date is not allowed to be selected, it will appear disabled in the UI. |