# Shadcn Language Menu

> Date selector with dropdown menu

- Type: example, free and open source (MIT)
- Component: [Date Selector](https://reui.io/components/date-selector.md)
- Page: https://reui.io/components/date-selector/c-date-selector-4
- Docs (Base UI): https://reui.io/docs/components/base/date-selector.md
- Docs (Radix UI): https://reui.io/docs/components/radix/date-selector.md
- MCP: `get_example("c-date-selector-4")`
- Registry item: https://reui.io/r/styles/base-nova/c-date-selector-4.json
- Uses: Button, Date Selector, Dialog, Dropdown Menu

## Best for

A language menu switching English, Spanish, French and German labels, date format and first weekday

## Agent notes

- `translations` hardcodes the Spanish, French and German strings; load them from your own i18n catalog
- `currentLanguage` starts as French and only the demo menu changes it; drive it from your app locale
- Pass `currentI18n` and the locale `dateFormat` to `formatDateValue` as well, or the trigger label falls back to English names and MM/dd/yyyy

## When not to use

- An app in one language with no locale switching: use [Dialog](https://reui.io/components/date-selector/c-date-selector-3.md) (`get_example("c-date-selector-3")`)

## Install

```bash
npx shadcn@latest add @reui/c-date-selector-4
```

## About Shadcn Date Selector

### When to use

- Report and list filters on a day, month, quarter, half year or year with is, before, after or between
- Due date fields opened from a button into a popover or dialog and committed on Apply
- Localized pickers with translated months, a regional date format and a Monday first week

### When not to use

- One day or a from and to span with no period tabs or operators: use [Calendar](https://reui.io/components/calendar.md) (`get_component("calendar")`)
- A date condition sitting beside other field conditions in one query bar: use [Filters](https://reui.io/components/filters.md) (`get_component("filters")`)
- A booking flow that pairs a day with time slots and a confirm step: use the [Schedule blocks](https://reui.io/blocks/application/schedule.md)

### Agent notes

- Period lists run from `minYear` 2015 to `maxYear` 2026 by default, so pass a later `maxYear` to offer next year; `yearRange` alone changes nothing
- `onChange` runs on mount and again whenever its identity changes, so pass a stable state setter, never an inline API call
- The text field takes typed input such as 2025, Q4 or a full date only when `inputHint` is set; without it the field is read only

Every ReUI item has a twin like this one; the index is https://reui.io/llms.txt. Agents with the ReUI MCP (https://reui.io/docs/mcp) get the same guidance from the getters named above.