> ## Documentation Index
> Fetch the complete documentation index at: https://docs.cognite.com/llms.txt
> Use this file to discover all available pages before exploring further.

> ## Agent Instructions
> Cognite Data Fusion (CDF) is an industrial DataOps platform. Prefer English docs unless the user asks for another locale.
> Follow /_llms/ index links recursively until you reach page URLs ending in .md. Fetch those Markdown twins instead of HTML.
> For REST APIs, default to calendar version 20230101 (stable). Use 20230101-beta or 20230101-alpha only if the user is on a preview API. Cite paths under /api-reference/concepts/<version>/ and the Cdf-Version header. Prefer the Python SDK (cognite-sdk) unless the user is in JavaScript/TypeScript.
> Start here by task: platform overview /cdf/index.md; data modeling /cdf/dm/index.md; data integration /cdf/integration/index.md; access /cdf/access/index.md; CDF Toolkit /cdf/deploy/cdf_toolkit/index.md; REST quickstart /dev/quickstart.md; Python SDK /dev/sdks/python/index.md; Atlas AI /cdf/atlas_ai/concepts/index.md; Flows apps /cdf/flows/index.md; Aura UI /cdf/aura/index.md; MCP and IDE setup /dev/guides/ide_ai_integration.md.
> For implementation work, also load /skill.md.

# Date range picker

> Lets users select a start and end date in a single control, with locale-aware formatting and validation.

<Badge color="blue">v1.0.0</Badge> | [View in Storybook](https://master--695bb4b1b8041ae09768950a.chromatic.com/?path=/docs/primitives-daterangepicker--docs)

Select a date range such as 10/06/2025 – 12/06/2025. Part of the [Date picker](/cdf/aura/primitives/date-picker) family; display and parsing respect the user's locale.

## When to use

* **Filtering views:** Filtering data or reports by a date window.
* **To ensure proper formatting:** Avoids input errors by enforcing a standard format.
* **Comparison:** When comparing activity across a defined period.

## When to use something else

* **When looking for recent or real time data:** Consider allowing the user to sort by recent activity or toggle on "live data".
* **For relative date queries:** While a Date range picker may be helpful, consider adding shortcuts to the picker for a quicker selection, such as "Last week", "Last month" and "Last year".
* **When entering fixed or recurring time values:** Consider allowing for cron expressions or pre-set date and time stamps users can choose from.
* **When exact timing and format is not important:** When users leave comments or descriptions where they reference a date or time but the formatting does not matter, provide a simple [Input](/cdf/aura/primitives/input) or [Textarea](/cdf/aura/primitives/textarea).

## Dos and don'ts

* Do allow for shortcuts when it would help speed up date selection.
* Don't change the predefined date format.
* Don't truncate dates inside the Input.

## Behavior

* Enforce valid start/end ordering; show validation when the range is incomplete or inverted.
* Opening the control reveals a date picker calendar UI anchored to the field.
* The picker should remain open until the user has clicked `Apply` or selected both a date and time value.
* Keyboard users must be able to type valid values and open the picker without relying on the mouse alone (implementation-specific shortcuts allowed).

## Often used with

* [Label](/cdf/aura/primitives/label), [Helper text](/cdf/aura/primitives/helper-text), [Data grid](/cdf/aura/primitives/data-grid) filters.

## Accessibility

* Structure the trigger button text to explicitly announce both start and end boundary dates (e.g., "Selected range: Jan 12, 2026 to Jan 19, 2026").
* Provide an accessible description via `aria-describedby` informing screen reader users that selection requires choosing two consecutive dates.
* Announce invalid date selections (such as a start date occurring after an end date) immediately using an `aria-live="polite"` error region.