-
Notifications
You must be signed in to change notification settings - Fork 278
Labels
Description
Description of the bug
DatePicker opens in day view when using displayFormat/valueFormat for month-only usage (formatPattern deprecated)
When migrating from formatPattern to valueFormat/displayFormat, the DatePicker no longer opens in month view on first open. Even with displayFormat="yyyy-MM" and valueFormat="yyyy-MM", the popover initially shows the day grid. Previously, using formatPattern="yyyy-MM" opened the month picker directly.
Current behavior
- DatePicker opens in day view even when only month/year are intended.
- To restore the old UX, we must either:
- keep using deprecated formatPattern="yyyy-MM", or
- reach into the static area and call calendar.showMonthPicker() after open (unsupported/private).
Minimal reproduction
import { DatePicker } from "@ui5/webcomponents-react";
export default function Repro() {
return (
<DatePicker
placeholder="Select month"
displayFormat="yyyy-MM"
valueFormat="yyyy-MM"
// value="2025-09" // optional
onChange={(e) => console.log(e.detail.value)}
/>
);
}
Workaround tried
- Using deprecated formatPattern="yyyy-MM" still forces month view on first open.
Proposed solutions
- Respect displayFormat/valueFormat to infer the initial view (month view for "yyyy-MM").
- Or add an explicit, supported prop to control the initial picker view (e.g., startView="month" / openPickerView="month").
Isolated Example
https://stackblitz.com/edit/github-ax4jom7s?file=src%2FApp.tsx
Reproduction steps
- Click on the calendar icon
Expected Behaviour
- If displayFormat/valueFormat indicate month granularity (e.g., "yyyy-MM"), the DatePicker should open with the month picker selected on first open.
- Alternatively, provide a supported API (e.g., startView="month" or openPickerView="month") to control the initial calendar view without relying on deprecated props or private DOM.
Screenshots or Videos
No response
UI5 Web Components for React Version
2.14.0
UI5 Web Components Version
2.14.0
Browser
Firefox, Chrome
Operating System
Windows
Additional Context
No response
Relevant log output
Declaration
- I’m not disclosing any internal or sensitive information.
Metadata
Metadata
Assignees
Labels
Type
Projects
Status
In Progress