All Versions
Latest Version
Avg Release Cycle
7 days
Latest Release
357 days ago

Changelog History
Page 3

  • v3.0.18

    July 18, 2020
  • v3.0.17 Changes

    July 10, 2020

    ๐Ÿ› ๏ธ Bugfixes

    ๐Ÿš€ This release resolves issue #75. Special thanks to @korsvanloon for opening this issue.

  • v3.0.16

    July 09, 2020
  • v3.0.15 Changes

    June 29, 2020

    ๐Ÿฑ ๐ŸŒŸ New Features

    ๐Ÿš€ The embla-carousel-react has now moved into the core package which will improve the maintainability of this project. For example, as soon as a new version is released react users won't have to wait for the react package to be published individually.

    ๐Ÿ“ฆ How to migrate from the React package

    ๐Ÿ“ฆ Please migrate as soon as possible. Start by uninstalling the react package and installing the core package like so:


    npm uninstall embla-carousel-react --save npm install embla-carousel --save


    yarn remove embla-carousel-react --save yarn add embla-carousel --save

    ๐Ÿ”„ Change your import

    // from this...import { useEmblaCarousel } from 'embla-carousel-react';// thisimport { useEmblaCarousel } from 'embla-carousel/react';

    ๐Ÿ‘€ To anyone not using the useEmblaCarousel hook

    ๐Ÿ‘ I'm sorry to say that the class setup is no longer supported. Please migrate to the hook as soon as possible.

    I would very much appreciate

    If you've starred the Embla Carousel React package, please take a moment to migrate your star โญ to the core package as well. I would appreciate that a lot.

    Thank you!

  • v3.0.2

    June 17, 2020
  • v3.0.1

    June 17, 2020
  • v3.0.0 Changes

    June 12, 2020

    ๐Ÿฑ Embla Carousel - The next major version is here ๐ŸŽ‰ .

    โฌ†๏ธ Embla Carousel v.3 is here, and here's all you need to know before upgrading.

    ๐Ÿฑ ๐ŸŒŸ New Features

    ๐Ÿ†• New and changed options:

    • ๐Ÿ‘ #50 - Y-axis support has been implemented { axis: 'x' | 'y' }.
    • #61 - Automatically falls back to loop: false when content isn't enough for the loop effect to work.
    • #19 - ContainScroll additions has been implemented as described here { containScroll: '' |ย 'trimSnaps' |ย 'keepSnaps' }.
    • Opt-out from selectedClass toggling by passing an empty string { selectedClass: '' }.
    • Opt-out from draggableClass by passing an empty string { draggableClass: '' }.
    • Opt-out from draggingClass toggling by passing an empty string { draggingClass: '' }.
    • Choose in view threshold for slides in view { inViewThreshold: 0.5 }. Pass a number between 0 and 1 representing percentage of each slide size that needs to be visible in the carousel viewport in order to be considered in view. Ex: 0.5 = 50% of a slide needs to be in view.

    ๐Ÿ†• New API methods:

    • slidesInView() - Get a list of slide indexes within the carousel viewport.
    • slidesNotInView() - Get a list of slide indexes not within the carousel viewport.

    ๐Ÿฑ ๐Ÿ’” Breaking Changes

    ๐Ÿ“‡ Renamed events:

    • dragStart has been renamed to pointerDown.
    • dragEnd has been renamed to pointerUp.

    ๐Ÿ—„ Deprecated API methods:

    • ๐Ÿšš scrollBy() has been removed.
    • ๐Ÿšš scrollToProgress() has been removed.

    ๐Ÿ—„ Deprecated API method parameters:

    • ๐Ÿšš target : boolean for the API method scrollProgress() has been removed.

    ๐Ÿ”„ Changed options:

    • containScroll is now a string. An empty string equals the previous behavior when it was false. The previous true value is now named 'trimSnaps'.

    ๐Ÿ”„ Changed API methods:

    • changeOptions() has been renamed to reInit().
    • ๐Ÿšš scrollSnapList() now returns an array of numbers representing the scroll progress for each snap point. Indexes and slide nodes per snap point has been removed.

    ๐Ÿ› ๏ธ Bugfixes

  • v2.9.1 Changes

    April 21, 2020

    ๐Ÿฑ ๐ŸŒŸ New features

    ๐Ÿš€ This release comes with more tools to manipulate the carousels scrollProgress.

    โž• Additions to scrollProgress

    It's now possible to get the scroll progress of either the carousels current scroll location or its target scroll location. Get the scroll progress of the carousels current scroll location:


    Get the scroll progress of the carousels target scroll location

    const target = trueembla.scrollProgress(target)

    โž• Additions to scrollBy

    It's now possible to pass a second boolean parameter if you want the carousel to snap to the closest snap position. Passing true will snap the carousel while false will scroll by the exact given amount.

    const snapToClosest = trueembla.scrollBy(0.2, snapToClosest)

    ๐Ÿ†• New feature scrollToProgress

    As discussed in issue #26 this feature allows for setting the absolute scroll progress directly as compared to scrollBy which adds to the current scroll progress. Like scrollBy, it also accepts a second boolean parameter if you want the carousel to snap to the closest snap position. Passing true will snap the carousel while false will scroll to the exact given progress.

    const snapToClosest = trueembla.scrollToProgress(0.2, snapToClosest)

    Thanks a bunch @xiel for this feature request.

    ๐Ÿฑ Enjoy ๐ŸŽ‰!

  • v2.9.0 Changes

    March 27, 2020

    ๐Ÿฑ ๐ŸŒŸ New features

    The percent alignment is a new feature. This feature was specified and requested in issue #49.

    const options = { align: 0.2 }const embla = EmblaCarousel(emblaNode, options)

    This feature allows users to specify percentage alignment by passing a number, where a fraction like 0.2 represents 20% of the viewport size. Percentage will be measured from the start edge of the viewport.

  • v2.8.1

    March 15, 2020