carbon-design-system / carbon

A design system built by IBM
https://www.carbondesignsystem.com
Apache License 2.0
7.88k stars 1.82k forks source link

[Feature Request]: Request for a DatetimeRange component with time selection & other common options #17370

Open anjana-tomy opened 2 months ago

anjana-tomy commented 2 months ago

The problem

The current daterange picker supports only date selection, there is no option to filter based on time or easy chose option like current week, today, current month etc

Screenshot 2024-09-06 at 12 41 28 PM Screenshot 2024-09-06 at 1 03 42 PM

The solution

There should be an option to select between a certain time range as well. The user should be able to easily common ranges like today, past 24 hrs, yesterday, last week, last month etc

The normal illustrations image are attached

Screenshot 2024-09-06 at 1 03 42 PM Screenshot 2024-09-06 at 12 41 28 PM

Design link

Current existing carbon component https://carbondesignsystem.com/components/date-picker/usage/ https://react.carbondesignsystem.com/?path=/story/components-timepicker--default

Example to requested enhancement https://hypeserver.github.io/react-date-range/

Links to other materials

No response

Owner/main maintainer(s)

anjana.tomy@ibm.com

Second/backup maintainer(s)

No response

Product/offering

Ikigai under software defined networking

Business priority

Medium Priority = upcoming release but is not pressing

Code of Conduct

JordanWSmith15 commented 5 days ago

@sstrubberg The Sustainability Apps BU has created a version of this in our storybook. We have many scenarios where it is required; we have legacy applications that have database objects combining date and time range data into a single attribute. Validation is run as a whole rather than individually against the application's business rules. Because of this, using 4 separate Carbon inputs to manage date, time, start and end is not a good UX for error handling. We have had challenges upgrading this custom component from Carbon V10 to V11. Please consider prioritizing this enhancement in the future. Image