Add Clear Button for DatePicker and DateRangePicker

[pankaj-linde]

Is your feature request related to a problem?

Yes. Currently, users must manually clear the date value in DatePicker and DateRangePicker components by selecting the text and deleting it, which is not intuitive or efficient—especially on touch devices or when using only a mouse. This results in a suboptimal user experience and unnecessary interaction steps.

Describe the solution you'd like

I’d like to see a built-in clear button (e.g., an "×" icon) inside the DatePicker and DateRangePicker input field, which appears only after a date or range is selected. Clicking this button should:

1. Clear the selected date or date range.
2. Reset the input field to an empty state.
3. Trigger the appropriate change event (onChange or a dedicated onClear event, if applicable).

Add props just like currently in Input component: showClearIcon and its class clear-icon

The clear button should follow UI5 design standards and be accessible (keyboard operable and screen-reader friendly).

Describe alternatives you've considered

No response

Additional Context

No response

Organization

No response

Declaration

• [x] I’m not disclosing any internal or sensitive information.