OverlayScrollbars Version 2.10.0

Features

• The option scrollbars.clickScroll now supports the value 'instant'. The ClickScrollPlugin is not required for it to work. #645

Improvements

• Rewrite clickScroll animation for better performance and to support in and out easing for a smoother animation.

Changelogs:

You can read further details in the corresponding changelogs.

• overlayscrollbars
• overlayscrollbars-react
• overlayscrollbars-vue
• overlayscrollbars-ngx
• overlayscrollbars-svelte
• overlayscrollbars-solid

OverlayScrollbars Version 2.9.0

Features

• Add the possibility to define a nonce value for websites with a CSP. #646

Improvements

• Reduced bundle size due to removed compatiblity code.
• clickScroll will not cancel on fast clicks / taps. #650
• Add easing to the clickScroll animation.
• The scrollbar-handle offset and size calculations are now entirely in CSS and will not force reflows.
• Use custom css properties for setting the scrollbar-handle offset and size.

Bug Fixes

• Only take the initial scroll coordinates from the viewport element if it has a scrollable overflow. (Otherwise take the initial scroll coordinates from the target element) #652

Changelogs:

You can read further details in the corresponding changelogs.

• overlayscrollbars
• overlayscrollbars-react
• overlayscrollbars-vue
• overlayscrollbars-ngx
• overlayscrollbars-svelte
• overlayscrollbars-solid

OverlayScrollbars Version 2.8.0

Breaking Changes

• Although not a major release, I've decided to remove the rtlScrollBehavior field from the Environment object. The reason for it is a switch of how the library now detects scroll coordinates for non default flow directions. The replacement for this field is the scrollCoordinates field of the State object for each instance.

Features

• Support non default flow directions (block and inline) not only direction: rtl. #625
• A new field scrollCoordinates in the State object. It indicates the min. and max. scroll coordinates for the viewport. (useful for non default flow direction scrolling)
• A new field scrollCoordinatesChanged in the updateHints object. It indicates whether the scroll coordinates changed in an update.

Improvements

• Fix a Firefox only behavior where releasing a scrollbar handle over an anchor would trigger the anchor and navigate to it.
• Change zoom detection: instead of the window.resize event, the window.matchMedia event is used.
• Greatly improve how dragging and releasing the scrollbar handle behaves for scroll-snapped viewports.

Bug Fixes

• Fix a bug here pointer capture was released too early for wacom pen devices. #630

Changelogs:

You can read further details in the corresponding changelogs.

• overlayscrollbars
• overlayscrollbars-react
• overlayscrollbars-vue
• overlayscrollbars-ngx
• overlayscrollbars-svelte
• overlayscrollbars-solid

OverlayScrollbars Version 2.7.0

Improvements

• Improvements for running in deno and bun.
• Initialization as the body element is now detected as such when the tag name of the target element is "body". Previously this detection was done with target === target.ownerDocument.body which would not work when creating a new body element in memory.
• If a non generated elements.viewport element is provided during initialization its scroll position will be taken as the initial scroll position instead of the scroll position of the target element.
• When interacting with the scrollbars itself the scrollbars.autoHideDelay will now apply when the scrollbars would be auto hidden when the interaction ends.

Changelogs:

You can read further details in the corresponding changelogs.

• overlayscrollbars
• overlayscrollbars-react
• overlayscrollbars-vue
• overlayscrollbars-ngx
• overlayscrollbars-svelte
• overlayscrollbars-solid

OverlayScrollbars Version 2.6.0

Improvements

• Add focusin and focusout to the focus and blur event management when wrapping and unwrapping elements. #605
• The scrollbars.visibility option was unintuitive to use for adjusting visibility per axis. Its now only applied if the scrollbars scroll axis is able to have a scrollable overflow. #611

Changelogs:

You can read further details in the corresponding changelogs.

• overlayscrollbars
• overlayscrollbars-react
• overlayscrollbars-vue
• overlayscrollbars-ngx
• overlayscrollbars-svelte
• overlayscrollbars-solid

OverlayScrollbars Version 2.5.0

Breaking Changes

• Although not a major release, I've decided to drop IE11 support in this version. This change should be beneficial to the majority of users.
  • The size of the js bundle decreased by ~6%.
  • The size of the css bundle decreased by ~18%.
  • The fields flexboxGlue and cssCustomProperties are removed from the Environment. (returning object from OverlayScrollbars.env())

Improvements

• Streamlining of scroll related calculations, including RTL direction.
• Focus and Blur event management when wrapping and unwrapping elements during initialization and destroy. #605

Changelogs:

You can read further details in the corresponding changelogs.

• overlayscrollbars
• overlayscrollbars-react
• overlayscrollbars-vue
• overlayscrollbars-ngx
• overlayscrollbars-svelte
• overlayscrollbars-solid

OverlayScrollbars Version 2.4.0

Features

• Finalize and document the plugin system which makes it possible to create "static" and / or "instance" plugins.
• The static OverlayScrollbars.plugin function returns a "static" plugins instance(s) for the registered plugins.
• A new instance.plugin function which returns a "instance" plugins instance.
• window resize events will now update instances only if it is needed and only what is needed.

Improvements

• Small internal rewrite to improve stability, performance and bundle size.
• Improvements the documentation and README.

Changelogs:

You can read further details in the corresponding changelogs.

• overlayscrollbars
• overlayscrollbars-react
• overlayscrollbars-vue
• overlayscrollbars-ngx
• overlayscrollbars-svelte
• overlayscrollbars-solid

OverlayScrollbars Version 2.3.0

Features

• Make use of the new ScrollTimeline API in supported browsers.
• Add the option scrollbars.autoHideSuspend to make it possible to suspend the autoHide functionality until the first scroll interaction was performed. The default value for this option is false for backwards compatibility reasons but is recommended to be true for better accessibility.
• Add a CSS selector to bridge deferred initializations visually.

Bug Fixes

• Fix a bug where a change wasn't detected properly when the target element was hidden initially. #546
• Fixed a bug where the scroll offset was reset to 0 sometimes after initialization when the target was the body element.

Improvements

• Expanded all examples and created a new Examples page with all available examples for all frameworks. #544

Changelogs:

You can read further details in the corresponding changelogs.

• overlayscrollbars
• overlayscrollbars-react
• overlayscrollbars-vue
• overlayscrollbars-ngx
• overlayscrollbars-svelte
• overlayscrollbars-solid

OverlayScrollbars Version 2.2.0

Improvements

• Force the scroll-behavior css property to be auto when the user interacts with a scrollbar to prevent smooth scrolling to apply where it shouldn't. #515
• The viewort, padding and content elements don't use the class attribute anymore for their styling. Instead each of them uses its own data-overlayscrollbars-* attribute. This has been done so that 3rd party libraries aren't conflicting with classnames from overlayscrollbars or vice versa. Selectors like .os-viewport, .os-padding or .os-content won't work anymore. #526 #530

Changelogs:

You can read further details in the corresponding changelogs.

• overlayscrollbars
• overlayscrollbars-react
• overlayscrollbars-vue
• overlayscrollbars-ngx
• overlayscrollbars-svelte
• overlayscrollbars-solid

OverlayScrollbars Version 2.1.0

Bug Fixes

• Fix a bug where initial RTL direction wasn't detected properly.

Features

• Introduce CSS Custom Properties to improve theming and styling of scrollbars. (#478)

Improvements

• Improve pointer event handling on scrollbar handle and track.
• Improve the README documentation with a styling section.

Changelogs:

You can read further details in the corresponding changelogs.

• overlayscrollbars
• overlayscrollbars-react
• overlayscrollbars-vue
• overlayscrollbars-ngx
• overlayscrollbars-svelte
• overlayscrollbars-solid