New Release: Mobiscroll 5.34 & 5.34.1 & 5.34.2

Announcements
1

What’s New

With our latest release, we’re excited to introduce powerful new tools for resource management, including external drag & drop for timeline resources, flexible column sizing in the Scheduler, improved accessibility, modern timezone support, and enhanced performance for large-scale data handling.

New Tools for Smarter Resource Management

With Mobiscroll 5.33, we introduced resource drag & drop, allowing you to reorder resources directly within the timeline view. In our latest release, we’re taking it a step further with external drag & drop support.

You can now manually drag resources into and out of the timeline view — to external lists, containers, or even other timelines. This opens up a wide range of new use-cases, such as real-time team assembly and moving entire resource rows, not just events, between timelines.

Easily Set Up and Manage Teams

This new functionality is especially useful for scenarios like field service management, shift planning, or dynamic team creation. You can now build interfaces that let users assemble teams or resource groups on the fly through external drag & drop.

We’ve created an interactive example with an “Add Team” button, showing how team members can be moved from an external list into the timeline — and even between teams.

https://demo.mobiscroll.com/timeline/resource-management-with-dynamic-team-creation#https://mcusercontent.com/03c1c3fac1ec96e655be9d223/images/8c9a8a9c-6a29-94d9-962e-43684449c8d2.gif(image larger than 4 MB)

:point_right: View the example

Scheduler Gets Smarter: Variable Column Widths

The Scheduler offers a familiar calendar interface, great for managing appointments and bookings. For large-scale resource planning, our Timeline view may still be more suitable — but with every update, the Scheduler is getting better and better.

The Scheduler view now supports variable column widths, giving you more flexibility to customize your layout. You can adjust the width of individual columns to better fit your content — whether that means making certain days or resources wider to fit more events, or layering different types of data using events with varying widths.

Optimize Horizontal Space

If you’re aiming for a more compact or dense layout, you can now override the default column widths to suit your needs.

:point_right: View the demo and see how easy it is to override the default column widths.

Make Columns Content-Aware

Not just limited to overriding the default width — you can now dynamically adjust column widths based on the content they display. For example, you might scale resource columns based on the length of their headers or the number of concurrent events. This ensures your layout stays readable and useful, regardless of data volume.

:point_right: See it in action

Availability Planner & Appointment Manager

The Scheduler’s intuitive layout makes it ideal for more than just event booking. With each release, we’re making it more capable of handling layered data, such as shifts, availability, scheduled vs. actual tasks, and more.

To support this, we’ve reworked how events are rendered, how scrolling behaves, and how widths are handled — allowing different event types to coexist naturally in a single view.

One great example is our new Doctor Availability Planner, where each doctor’s shift appears as a slim indicator on the left, with appointment slots created and adjusted inside the shift window.

:point_right: Try the demo

Accessibility & WCAG 2.2 Compliance

From the start, we’ve aimed to make Mobiscroll fully accessible to everyone — including users with disabilities. That commitment continues with enhanced support for WCAG 2.2.

To help teams build compliant apps, we’ve published new documentation detailing accessibility features on a component-by-component basis.

:point_right: Explore the Accessibility Docs

Modern Timezone Support with Day.js

With Moment.js no longer recommended for new projects, we’ve added full support for Day.js, especially for timezone handling. This ensures Mobiscroll remains modern, lightweight, and compatible with current best practices.

Smoother Auto-Scroll During Drag

We’ve improved drag behavior with smart auto-scrolling. As you drag items near the edge of the view, scrolling now speeds up or slows down based on pointer position, making it easier to navigate large datasets or wide views.

https://demo.mobiscroll.com/timeline/loading-big-data-setshttps://mcusercontent.com/03c1c3fac1ec96e655be9d223/images/5e7158cd-3847-3004-c6ad-b92e2f37626c.gif(image larger than 4 MB)

Enhanced Shadow DOM Support

Working inside the Shadow DOM? We’ve improved compatibility: lifecycle events now pass correct targets, and the Draggable component can keep elements inside the Shadow DOM with the new context option — rather than appending them to the body.

Now Compatible with Angular 20

Angular just dropped its latest major version, and we’re happy to report that Mobiscroll is fully compatible with Angular 20. We’ll continue to maintain support for new Angular releases moving forward.

What’s next

We have some exciting updates in the pipeline, including advanced cell templating, virtual scroll for the Scheduler and the upcoming Mobiscroll 6, our next major release. Stay tuned!

Read the full blog post

MOBISCROLL 5.34

Agenda

NEW

  • We added the dayjsTimezone timezone plugin, so timezones can be used with the Day.js library as well.

Datepicker

NEW

  • We added the dayjsTimezone timezone plugin, so timezones can be used with the Day.js library as well.

Draggable

NEW

  • We added the context option to specify where the dragged element will be appended in the DOM.

Eventcalendar

NEW

  • We added the dayjsTimezone timezone plugin, so timezones can be used with the Day.js library as well.

FIXED

  • We fixed the external drag, which resulted in error when the calendar was inside shadow DOM.
  • When the context option is specified for the calendar, the dragged element will be appended to the context element instead of the document body in case of external drag.
  • We fixed an issue where navigating to a date did not work right after initialization or a view change.

Popup

FIXED

  • We fixed the anchored positioning to work with anchors inside shadow DOM as well.

Scheduler

NEW

  • We improved the speed of horizontal and vertical event drag scrolling, and resource drag scrolling during resource reordering.
  • We added support for variable column widths, which can be specified from CSS, for individual resources or specific week days.
  • We added the onResourceClick, onResourceDoubleClick, and onResourceRightClick lifecycle events.
  • We added the dayjsTimezone timezone plugin, so timezones can be used with the Day.js library as well.
  • We improved the view to keep the horizontal and vertical scroll position at the previous date and time values when changing the view.

FIXED

  • We fixed the external drag, which resulted in error when the calendar was inside shadow DOM.
  • When the context option is specified for the calendar, the dragged element will be appended to the context element instead of the document body in case of external drag.
  • We fixed an issue where navigating to a date did not work right after initialization or a view change.

Timeline

NEW

  • We improved the speed of horizontal and vertical event drag scrolling, and resource drag scrolling during resource reordering.
  • We added external drag and drop support for the resources in the timeline view.
  • We added the onResourceDragLeave, onResourceDragEnter lifecycle events, triggered when a resource exits or enters the timeline view.
  • We added the onResourceCreate, onResourceCreated, onResourceDelete and onResourceDeleted lifecycle events, triggered when a resource is dropped inside the timeline to create a new resource or dropped outside to be deleted.
  • We added the onResourceClick, onResourceDoubleClick, and onResourceRightClick lifecycle events.
  • We added the dayjsTimezone timezone plugin, so timezones can be used with the Day.js library as well.

FIXED

  • We fixed the external drag, which resulted in error when the calendar was inside shadow DOM.
  • When the context option is specified for the calendar, the dragged element will be appended to the context element instead of the document body in case of external drag.
  • We fixed the vertical day resolution, which did not appear correctly in Angular.
  • We fixed an issue where navigating to a date did not work right after initialization or a view change.
  • We fixed an issue where the header columns were not always in sync with the grid columns in print view.

MOBISCROLL 5.34.1

Agenda

FIXED

  • We fixed the onEventClick, onEventDoubleClick and onEventRightClick which were not firing in Angular.

Eventcalendar

FIXED

  • We fixed the onEventClick, onEventDoubleClick and onEventRightClick which were not firing from the event popover in Angular.
  • We fixed the type definition of the MbscDraggableOptions where hidden properties caused errors.
  • We gave priority to external drag data over extendDefaultEvent to make working with external events easier.

Scheduler

FIXED

  • We gave priority to external drag data over extendDefaultEvent to make working with external events easier.
  • We fixed the type definition of the MbscDraggableOptions where hidden properties caused errors.

Timeline

FIXED

  • We gave priority to external drag data over extendDefaultEvent to make working with external events easier.
  • We fixed the type definition of the MbscDraggableOptions where hidden properties caused errors.

MOBISCROLL 5.34.2

All Components

FIXED

  • Resolved multiple issues with the Day.js timezone plugin, including preserving millisecond values when creating dates, maintaining timezone information in ISO 8601 strings (instead of converting to UTC), and correctly parsing date strings that include timezone offsets.
  • Corrected a bug in the updateRecurringEvent function where the until value was incorrect when updating 'following' occurrences.

Datepicker

FIXED

  • In the Vue version, addressed an issue where hovering in or out of the input field while typing caused the input value to reset.

Scheduler

FIXED

  • External drop now correctly assigns the event resource when the target calendar has only one resource.
  • The “Today” button now properly scrolls the view to the current date and time.
  • Resolved a bug in RTL mode where column calculations during drag & drop and navigation were incorrect.
  • Addressed an error that occurred during the initial loading of the Scheduler in Firefox.

Timeline

FIXED

  • When dragging external resources, ensured that generated IDs are assigned only to newly created resources and not to the original drag data.
  • External drop now correctly sets the event resource if the destination calendar has a single resource.
  • The “Today” button now scrolls correctly to the current date and time.

For the full changelog please visit our release history.

PS. You will find an upgrade guide for moving from Mobiscroll 4 to Mobiscroll 5.