@Vestride Vestride released this Mar 26, 2018 · 10 commits to master since this release

Assets 2

Fix misspelled delimiter option. Both "delimiter" (correct) and "delimeter" (incorrect) will continue to work for v5. #215

@Vestride Vestride released this Mar 2, 2018 · 17 commits to master since this release

Assets 2

Fix new item animation when there is an active filter #198

@Vestride Vestride released this Feb 20, 2018 · 20 commits to master since this release

Assets 2
  • New compare option for sort object to give you more control over sorting if you need it #197
  • Add "es" build and "module" field to the package.json

@Vestride Vestride released this Oct 31, 2017 · 38 commits to master since this release

Assets 2

Fix rounding error causing transitions not to end, making LAYOUT events not fire.

@Vestride Vestride released this Sep 23, 2017 · 50 commits to master since this release

Assets 2
  • Update type definitions for sort object and transition object.

  • Update dev dependencies:

    • eslint@4
    • rollup@0.48.0
    • rollup-babel-plugin@3
    • sinon@3
Jul 18, 2017

@Vestride Vestride released this Jul 18, 2017 · 62 commits to master since this release

Assets 2


Change global export from shuffle to Shuffle. Remove bower support. Expect ES6 environment. Make Shuffle instances Event Emitters instead of dispatching CustomEvent. Add resetItems() method.

Breaking Changes

  • Remove bower support.

  • Change window export to window.Shuffle from window.shuffle. This won't affect you if you're using a bundler like webpack or browserify.

  • Expect an ES6 environment

    • Shuffle@5 uses the following features from ES6/7: Set, Array.from, Object.assign, Array.prototype.find, and Array.prototype.includes. In order to support browsers like IE11 and Safari 8, you must include a polyfill for these features. You can use a service like polyfill.io to only load the polyfills that the current browser needs, or a polyfill script like babel-polyfill.
  • Shuffle now inherits from TinyEmitter instead of emitting CustomEvents on the main element.


    element.addEventListener(Shuffle.EventType.REMOVED, function (event) {


    shuffleInstance.on(Shuffle.EventType.REMOVED, function (data) {
  • Item positions when using useTransforms: false are no longer rounded to the nearest whole pixel. See #10 for details. Translate values are still rounded to avoid blurriness. You can disable rounding translate values by setting roundTransforms: false.

  • Call layout() when the page finishes loading. This ensures the layout will be correct even if your shuffle instance initializes before async assets like images and fonts are loaded. #147

  • Reduced maxStaggerAmount option from 250 to 150.

  • Changed easing option default from ease to cubic-bezier(0.4, 0.0, 0.2, 1) (material design's standard curve).

  • Removed jsnext:main field in package.json pointing at the src directory. It's only supposed to be used for import and export, not other ES2015+ features.


  • Added resetItems() method which can be combined with a React (or other view-based frameworks like Preact and Vue) lifecycle event when data updates.
    • It dumps the elements currently stored and reinitializes all child elements which match the itemSelector.
  • The add method now moves new items to their new location, then fades and scales them in. Previously, new items transitioned from 0,0 to their new location. #148
  • Added isCentered option which attempts to center each row's items.
  • Added index.d.ts typings.
  • You can now set HIDDEN and VISIBLE scale amounts to the same value.
  • Items now have aria-hidden="true" when they are hidden.
  • Shuffle.__Point renamed to Shuffle.Point.
  • Added Shuffle.Rect class which helps determine intersections between items.


  • Refreshed site styles.
  • Added flexbox grid demo.
  • Added React demo.
  • Added "Filters" section before "Advanced Filters".
  • Use new images from unsplash.com for demos.
  • Moved site to /docs.

@Vestride Vestride released this May 10, 2017 · 112 commits to master since this release

Assets 2

What's new

Shuffle is now bundled with Rollup, saving some bytes. See #138 for the full PR. This saves 2KB for the minified file and 12.6KB on unminified version.

A filterMode option. This affects using an array with filter. e.g. filter(['one', 'two']). With Shuffle.FilterMode.ANY, the element passes the test if any of its groups are in the array (how it behaved before). With Shuffle.FilterMode.ALL, the element only passes if all its groups are in the array. See #143 for details.

@Vestride Vestride released this Mar 21, 2017 · 124 commits to master since this release

Assets 2

Fixes #133 - the before styles for a ShuffleItem were not applied if the item didn't move.

@Vestride Vestride released this Jan 31, 2017 · 136 commits to master since this release

Assets 2

Shuffle is now built with webpack v2.2.1 with webpack handling ES6 import and export.