[scheduler][primitives] Allow to expand / shrink an event duration using drag & drop in the Time Grid #18890

flaviendelangle · 2025-07-24T05:45:46Z

Closes #17692

Allow to change the start date
Allow to change the end date
Make sure the resulting event always have start date < end date and a duration of at least 15mn

Follow up

Clean multi days resizing (right now it's broken, but the rendering of multi days event is broken anyway)

…ing drag & drop in the Time Grid

mui-bot · 2025-07-24T05:47:22Z

Deploy preview: https://deploy-preview-18890--material-ui-x.netlify.app/

Bundle size report

Total Size Change: 0B^(0.00%) - Total Gzip Change: 🔺+12B^(0.00%)
Files: 122 total (0 added, 0 removed, 13 changed)

Show details for 100 more bundles (22 more not shown)

@mui/x-charts parsed: 0B^(0.00%) gzip: 0B^(0.00%)
@mui/x-charts-pro parsed: 0B^(0.00%) gzip: 0B^(0.00%)
@mui/x-charts-pro/BarChartPro parsed: 0B^(0.00%) gzip: 🔺+3B^(0.00%)
@mui/x-charts-pro/ChartContainerPro parsed: 0B^(0.00%) gzip: 0B^(0.00%)
@mui/x-charts-pro/ChartDataProviderPro parsed: 0B^(0.00%) gzip: 0B^(0.00%)
@mui/x-charts-pro/ChartsToolbarPro parsed: 0B^(0.00%) gzip: 0B^(0.00%)
@mui/x-charts-pro/ChartZoomSlider parsed: 0B^(0.00%) gzip: 0B^(0.00%)
@mui/x-charts-pro/FunnelChart parsed: 0B^(0.00%) gzip: ▼-2B^(0.00%)
@mui/x-charts-pro/Heatmap parsed: 0B^(0.00%) gzip: 🔺+1B^(0.00%)
@mui/x-charts-pro/LineChartPro parsed: 0B^(0.00%) gzip: 🔺+1B^(0.00%)
@mui/x-charts-pro/PieChartPro parsed: 0B^(0.00%) gzip: 0B^(0.00%)
@mui/x-charts-pro/RadarChartPro parsed: 0B^(0.00%) gzip: 0B^(0.00%)
@mui/x-charts-pro/ScatterChartPro parsed: 0B^(0.00%) gzip: 🔺+1B^(0.00%)
@mui/x-charts/BarChart parsed: 0B^(0.00%) gzip: 0B^(0.00%)
@mui/x-charts/ChartContainer parsed: 0B^(0.00%) gzip: 0B^(0.00%)
@mui/x-charts/ChartDataProvider parsed: 0B^(0.00%) gzip: 0B^(0.00%)
@mui/x-charts/ChartsAxis parsed: 0B^(0.00%) gzip: 0B^(0.00%)
@mui/x-charts/ChartsAxisHighlight parsed: 0B^(0.00%) gzip: 0B^(0.00%)
@mui/x-charts/ChartsClipPath parsed: 0B^(0.00%) gzip: 0B^(0.00%)
@mui/x-charts/ChartsGrid parsed: 0B^(0.00%) gzip: 0B^(0.00%)
@mui/x-charts/ChartsLabel parsed: 0B^(0.00%) gzip: 0B^(0.00%)
@mui/x-charts/ChartsLegend parsed: 0B^(0.00%) gzip: 0B^(0.00%)
@mui/x-charts/ChartsLocalizationProvider parsed: 0B^(0.00%) gzip: 0B^(0.00%)
@mui/x-charts/ChartsOverlay parsed: 0B^(0.00%) gzip: 0B^(0.00%)
@mui/x-charts/ChartsReferenceLine parsed: 0B^(0.00%) gzip: 0B^(0.00%)
@mui/x-charts/ChartsSurface parsed: 0B^(0.00%) gzip: 0B^(0.00%)
@mui/x-charts/ChartsText parsed: 0B^(0.00%) gzip: 0B^(0.00%)
@mui/x-charts/ChartsTooltip parsed: 0B^(0.00%) gzip: 0B^(0.00%)
@mui/x-charts/ChartsXAxis parsed: 0B^(0.00%) gzip: 0B^(0.00%)
@mui/x-charts/ChartsYAxis parsed: 0B^(0.00%) gzip: 0B^(0.00%)
@mui/x-charts/Gauge parsed: 0B^(0.00%) gzip: 0B^(0.00%)
@mui/x-charts/LineChart parsed: 0B^(0.00%) gzip: 0B^(0.00%)
@mui/x-charts/PieChart parsed: 0B^(0.00%) gzip: 0B^(0.00%)
@mui/x-charts/RadarChart parsed: 0B^(0.00%) gzip: 0B^(0.00%)
@mui/x-charts/ScatterChart parsed: 0B^(0.00%) gzip: 0B^(0.00%)
@mui/x-charts/SparkLineChart parsed: 0B^(0.00%) gzip: 0B^(0.00%)
@mui/x-charts/Toolbar parsed: 0B^(0.00%) gzip: 0B^(0.00%)
@mui/x-data-grid parsed: 0B^(0.00%) gzip: 0B^(0.00%)
@mui/x-data-grid-premium parsed: 0B^(0.00%) gzip: 0B^(0.00%)
@mui/x-data-grid-premium/DataGridPremium parsed: 0B^(0.00%) gzip: 0B^(0.00%)
@mui/x-data-grid-pro parsed: 0B^(0.00%) gzip: 0B^(0.00%)
@mui/x-data-grid-pro/DataGridPro parsed: 0B^(0.00%) gzip: ▼-1B^(0.00%)
@mui/x-data-grid/DataGrid parsed: 0B^(0.00%) gzip: 0B^(0.00%)
@mui/x-date-pickers parsed: 0B^(0.00%) gzip: 0B^(0.00%)
@mui/x-date-pickers-pro parsed: 0B^(0.00%) gzip: 🔺+1B^(0.00%)
@mui/x-date-pickers-pro/AdapterDateFns parsed: 0B^(0.00%) gzip: 0B^(0.00%)
@mui/x-date-pickers-pro/AdapterDateFnsJalali parsed: 0B^(0.00%) gzip: 0B^(0.00%)
@mui/x-date-pickers-pro/AdapterDayjs parsed: 0B^(0.00%) gzip: 0B^(0.00%)
@mui/x-date-pickers-pro/AdapterLuxon parsed: 0B^(0.00%) gzip: 0B^(0.00%)
@mui/x-date-pickers-pro/AdapterMoment parsed: 0B^(0.00%) gzip: 0B^(0.00%)
@mui/x-date-pickers-pro/AdapterMomentHijri parsed: 0B^(0.00%) gzip: 0B^(0.00%)
@mui/x-date-pickers-pro/AdapterMomentJalaali parsed: 0B^(0.00%) gzip: 0B^(0.00%)
@mui/x-date-pickers-pro/DateRangeCalendar parsed: 0B^(0.00%) gzip: 0B^(0.00%)
@mui/x-date-pickers-pro/DateRangePicker parsed: 0B^(0.00%) gzip: 🔺+2B^(0.00%)
@mui/x-date-pickers-pro/DateRangePickerDay parsed: 0B^(0.00%) gzip: 🔺+1B^(+0.01%)
@mui/x-date-pickers-pro/DateRangePickerDay2 parsed: 0B^(0.00%) gzip: 0B^(0.00%)
@mui/x-date-pickers-pro/DateTimeRangePicker parsed: 0B^(0.00%) gzip: 🔺+1B^(0.00%)
@mui/x-date-pickers-pro/DesktopDateRangePicker parsed: 0B^(0.00%) gzip: 🔺+2B^(0.00%)
@mui/x-date-pickers-pro/DesktopDateTimeRangePicker parsed: 0B^(0.00%) gzip: 0B^(0.00%)
@mui/x-date-pickers-pro/DesktopTimeRangePicker parsed: 0B^(0.00%) gzip: 🔺+1B^(0.00%)
@mui/x-date-pickers-pro/LocalizationProvider parsed: 0B^(0.00%) gzip: 0B^(0.00%)
@mui/x-date-pickers-pro/MobileDateRangePicker parsed: 0B^(0.00%) gzip: 🔺+1B^(0.00%)
@mui/x-date-pickers-pro/MobileDateTimeRangePicker parsed: 0B^(0.00%) gzip: 0B^(0.00%)
@mui/x-date-pickers-pro/MobileTimeRangePicker parsed: 0B^(0.00%) gzip: 0B^(0.00%)
@mui/x-date-pickers-pro/MultiInputDateRangeField parsed: 0B^(0.00%) gzip: 0B^(0.00%)
@mui/x-date-pickers-pro/MultiInputDateTimeRangeField parsed: 0B^(0.00%) gzip: 0B^(0.00%)
@mui/x-date-pickers-pro/MultiInputTimeRangeField parsed: 0B^(0.00%) gzip: 0B^(0.00%)
@mui/x-date-pickers-pro/PickersRangeCalendarHeader parsed: 0B^(0.00%) gzip: 0B^(0.00%)
@mui/x-date-pickers-pro/SingleInputDateRangeField parsed: 0B^(0.00%) gzip: 0B^(0.00%)
@mui/x-date-pickers-pro/SingleInputDateTimeRangeField parsed: 0B^(0.00%) gzip: 0B^(0.00%)
@mui/x-date-pickers-pro/SingleInputTimeRangeField parsed: 0B^(0.00%) gzip: 0B^(0.00%)
@mui/x-date-pickers-pro/StaticDateRangePicker parsed: 0B^(0.00%) gzip: 0B^(0.00%)
@mui/x-date-pickers-pro/TimeRangePicker parsed: 0B^(0.00%) gzip: 0B^(0.00%)
@mui/x-date-pickers/AdapterDateFns parsed: 0B^(0.00%) gzip: 0B^(0.00%)
@mui/x-date-pickers/AdapterDateFnsBase parsed: 0B^(0.00%) gzip: 0B^(0.00%)
@mui/x-date-pickers/AdapterDateFnsJalali parsed: 0B^(0.00%) gzip: 0B^(0.00%)
@mui/x-date-pickers/AdapterDayjs parsed: 0B^(0.00%) gzip: 0B^(0.00%)
@mui/x-date-pickers/AdapterLuxon parsed: 0B^(0.00%) gzip: 0B^(0.00%)
@mui/x-date-pickers/AdapterMoment parsed: 0B^(0.00%) gzip: 0B^(0.00%)
@mui/x-date-pickers/AdapterMomentHijri parsed: 0B^(0.00%) gzip: 0B^(0.00%)
@mui/x-date-pickers/AdapterMomentJalaali parsed: 0B^(0.00%) gzip: 0B^(0.00%)
@mui/x-date-pickers/DateCalendar parsed: 0B^(0.00%) gzip: 0B^(0.00%)
@mui/x-date-pickers/DateField parsed: 0B^(0.00%) gzip: 0B^(0.00%)
@mui/x-date-pickers/DatePicker parsed: 0B^(0.00%) gzip: 0B^(0.00%)
@mui/x-date-pickers/DateTimeField parsed: 0B^(0.00%) gzip: 0B^(0.00%)
@mui/x-date-pickers/DateTimePicker parsed: 0B^(0.00%) gzip: 0B^(0.00%)
@mui/x-date-pickers/DayCalendarSkeleton parsed: 0B^(0.00%) gzip: 0B^(0.00%)
@mui/x-date-pickers/DesktopDatePicker parsed: 0B^(0.00%) gzip: 0B^(0.00%)
@mui/x-date-pickers/DesktopDateTimePicker parsed: 0B^(0.00%) gzip: 0B^(0.00%)
@mui/x-date-pickers/DesktopTimePicker parsed: 0B^(0.00%) gzip: 0B^(0.00%)
@mui/x-date-pickers/DigitalClock parsed: 0B^(0.00%) gzip: 0B^(0.00%)
@mui/x-date-pickers/LocalizationProvider parsed: 0B^(0.00%) gzip: 0B^(0.00%)
@mui/x-date-pickers/MobileDatePicker parsed: 0B^(0.00%) gzip: 0B^(0.00%)
@mui/x-date-pickers/MobileDateTimePicker parsed: 0B^(0.00%) gzip: 0B^(0.00%)
@mui/x-date-pickers/MobileTimePicker parsed: 0B^(0.00%) gzip: 0B^(0.00%)
@mui/x-date-pickers/MonthCalendar parsed: 0B^(0.00%) gzip: 0B^(0.00%)
@mui/x-date-pickers/MultiSectionDigitalClock parsed: 0B^(0.00%) gzip: 0B^(0.00%)
@mui/x-date-pickers/PickerDay2 parsed: 0B^(0.00%) gzip: 0B^(0.00%)
@mui/x-date-pickers/PickersActionBar parsed: 0B^(0.00%) gzip: 0B^(0.00%)
@mui/x-date-pickers/PickersCalendarHeader parsed: 0B^(0.00%) gzip: 0B^(0.00%)

Details of bundle changes

Generated by 🚫 dangerJS against 494933b

noraleonte

Awesome work! And suuuuper fast ⚡ 💙
I created a follow-up issue for styling the scheduler event states. 💅

packages/x-scheduler/src/joy/event-calendar/EventCalendar.types.ts

packages/x-scheduler/src/joy/event-calendar/store.ts

…s.ts Co-authored-by: Nora <[email protected]> Signed-off-by: Flavien DELANGLE <[email protected]>

Co-authored-by: Nora <[email protected]> Signed-off-by: Flavien DELANGLE <[email protected]>

[scheduler][primitives] Allow to expand / shrink an event duration us…

bcd2002

…ing drag & drop in the Time Grid

flaviendelangle self-assigned this Jul 24, 2025

flaviendelangle added type: new feature Expand the scope of the product to solve a new problem. scope: scheduler Changes related to the scheduler. labels Jul 24, 2025

flaviendelangle added 3 commits July 24, 2025 08:30

Work

d99d6b2

First working version

ec11be0

Fix flickering

5771dde

flaviendelangle marked this pull request as ready for review July 24, 2025 07:25

noraleonte approved these changes Jul 24, 2025

View reviewed changes

packages/x-scheduler/src/joy/event-calendar/EventCalendar.types.ts Outdated Show resolved Hide resolved

packages/x-scheduler/src/joy/event-calendar/store.ts Outdated Show resolved Hide resolved

flaviendelangle and others added 2 commits July 25, 2025 09:42

Update packages/x-scheduler/src/joy/event-calendar/EventCalendar.type…

ce804e2

…s.ts Co-authored-by: Nora <[email protected]> Signed-off-by: Flavien DELANGLE <[email protected]>

Update packages/x-scheduler/src/joy/event-calendar/store.ts

494933b

Co-authored-by: Nora <[email protected]> Signed-off-by: Flavien DELANGLE <[email protected]>

flaviendelangle merged commit 07f3000 into mui:master Jul 25, 2025
22 checks passed

flaviendelangle deleted the resize-time-grid-event branch July 25, 2025 07:59

Provide feedback

Saved searches

Use saved searches to filter your results more quickly

Uh oh!

Uh oh!

[scheduler][primitives] Allow to expand / shrink an event duration using drag & drop in the Time Grid #18890

[scheduler][primitives] Allow to expand / shrink an event duration using drag & drop in the Time Grid #18890

Uh oh!

flaviendelangle commented Jul 24, 2025 •

edited

Loading

Uh oh!

mui-bot commented Jul 24, 2025 •

edited

Loading

Uh oh!

noraleonte left a comment

Uh oh!

Uh oh!

Uh oh!

Uh oh!

Uh oh!

Uh oh!

[scheduler][primitives] Allow to expand / shrink an event duration using drag & drop in the Time Grid #18890

[scheduler][primitives] Allow to expand / shrink an event duration using drag & drop in the Time Grid #18890

Uh oh!

Conversation

flaviendelangle commented Jul 24, 2025 • edited Loading Uh oh! There was an error while loading. Please reload this page.

Uh oh!

Uh oh!

mui-bot commented Jul 24, 2025 • edited Loading Uh oh! There was an error while loading. Please reload this page.

Uh oh!

Bundle size report

Uh oh!

noraleonte left a comment

Choose a reason for hiding this comment

Uh oh!

Uh oh!

Uh oh!

Uh oh!

Uh oh!

flaviendelangle commented Jul 24, 2025 •

edited

Loading

mui-bot commented Jul 24, 2025 •

edited

Loading