[BUG][Scheduler] Resizing Behavior (making item smaller) issue on the first day in a view.

[pvBizzmine]

Hello (:

I am encountering an inconvenience with the Kendo Scheduler component in React, particularly in the resizing functionality. The scheduler allows the creation and manipulation of items akin to a calendar, with the capability to resize these elements by clicking and dragging either the top or bottom.

However, a notable issue arises specifically on the first day of the calendar view. While attempting to resize an element by dragging downwards from the bottom, it expands as expected. Conversely, when trying to resize upwards by dragging from the bottom, the element only shortens by one time block. This limitation presents an annoyance in the user experience.

It's crucial to emphasize that this behavior is isolated to the first day within the view; on subsequent days, the resizing functionality behaves correctly.

This inconsistency in resizing behavior detracts from the overall usability of the component, necessitating a solution to ensure consistent and intuitive manipulation of elements across all days within the calendar view.

We use a custom slot in the scheduler:

  const CustomSlot = (props: SchedulerSlotProps) => {
    const customConditions: { backgroundColor: string; filter: string; color: string } = {
      backgroundColor: '',
      filter: '',
      color: '',
    };
    let { backgroundColor, color, filter } = customConditions;

    //Shows contrast between two different schedules
    if (props.group.index % 2) {
      backgroundColor = '#d4e4fc';
      if (!props.isWorkHour && !props.isAllDay) {
        filter = 'brightness(90%)';
      }
    }

    //Shows today coloured in month
    if (view === 'month' && mobileView !== 'day' && checkIfDateIsToday(props.end)) {
      const today = styleIfDateIsToday(props.end);
      backgroundColor = today.backgroundColor;
      color = today.color;
    }

    return (
      <SchedulerSlot
        {...props}
        onDoubleClick={onOpenSchedulerSlot}
        onClick={isMobileView ? onOpenSchedulerSlot : undefined}
        style={{ ...props.style, backgroundColor, color, filter }}
      />
    );
  };

props example:

Package version:

• "@progress/kendo-react-scheduler": "5.16.1",
• "react": "18.2.0",

Tested on:

• Firefox 122.0.1
• Arc 1.28.0
• Safari 17.2.1
• Chrome 121.0.6167.139

[zdravkov]

Hey @pvBizzmine ,

Would you please send a sample Stackblitz or a CodeSandbox example where the issue can be replicated and observed so we could be more helpful with a possible solution?

Greetings, Plamen