Exposing default options

Feature request is related to

The Embla Carousel core (all versions)

Describe the solution you’d like

Hi David (@davidcetinkaya),

Love seeing all the traction Embla Carousel is getting! One thing I’ve found myself doing frequently is creating a default options object on Embla for use with different carousel instances. For example:

entry or initialization file

import Embla from 'embla-carousel';

Embla.defaults = {
  loop: true,
  draggableClass: 'cursor-grab',
  draggingClass: 'cursor-grabbing',
};

component file

const carousel = Embla(node, {
  ...Embla.defaults,
  loop: false
});

Additional context

Idea initially came from an undocumented Flickity feature. How do you feel about adding something like this? Would be happy to PR if you’d like (though haven’t looked at the codebase in a long time 😆)

[nikrowell]

@davidcetinkaya awesome! Thanks for all your continued work on improving Embla while keeping it lightweight and flexible etc 😀

Side note - your commitment to answering questions and helping others make the most out of Embla doesn’t go unnoticed. Happy to help in any way I can (I definitely need to spend more time familiarizing myself with the underlying engine!).

Cheers!

[davidjerleke]

Hi @nikrowell,

This feature has been released with v.6.2.0 🎉. Please read more about it in the docs:

• Global carousel options
• Global plugin options

Give it a try if you want.

Best, David