v2.6.8

Add warning when supplying Stateless Functional Components

To work Flip Move's magic, it needs direct access to the component's backing instances (the rendered DOM nodes in the HTML).

For most elements (native DOM elements, or those created through React.Component or React.createClass), the underlying nodes can be accessed through a ref callback prop. Sadly, however, Stateless Functional Components don't support refs. Supposedly this is because there is no "public instance" of these components; they don't have any sort of place to attach the ref.

I added a note about this to the Gotchas section of the documentation, but it's very easy to miss.

When supplying an SFC, Flip Move had no checks or guards. It would just try and do it's thing, and it would blow up once it realized that it didn't have access to the DOM nodes. The error message was very unclear, though.

This release adds a simple warning in the console, to alert developers when they try and pass an SFC as a child to <FlipMove>.

v2.6.7

Bugfix: Disabled animations

Fixes an issue where, when disableAllAnimations is set to true, changes are delayed by 1 update.

Thanks to @aligon for the work in #92

v2.6.6

Bugfix: Ensure cleanup is properly triggered

My refactoring in v2.6.1 introduced two memory-related problems:

• the childrenToAnimate array was only being cleared if the user supplied an onFinishAll hook.
• the childrenData (the object that holds refs and other data about rendered children) was never having items deleted. This meant that items removed from the DOM wouldn't be cleared by the garbage collector, because the reference never died.

Huge thanks to @haste for finding and fixing these issues in #93

v2.6.5

Bug fix: accessing missing refs

In certain rare cases, nesting FlipMoves can cause a weird issue where children are rendered without their refs.

This patch commit doesn't solve the underlying issue, but it addresses the symptom. The fix works, but it's a band-aid. I'll be seeing if I can reproduce and fix the root cause.

Thanks to @aligon for contributing in #91

v2.6.4

Tiny bugfix for running in non-server environments

v2.6.1 introduced the usage of HTMLElement, which of course is only available in environments with a DOM. This fix first checks for its existence before trying to use it.

v2.6.2

Fix issue with multiple leaves

v2.6.1 introduced a regression that would cause items to "stack" when leaving simultaneously (see #86). This is a simple fix for that bug. I've also added stories to help ensure such glaring oversights aren't missed in future refactors and fixes.

v2.6.1

Overhaul Codebase

While by strict semver standards this is a patch version (visible changes are only a couple bug fixes, outlined below), this is a pretty big change.

I went through the codebase and refactored heavily, with 3 goals in mind:

• Simplify / clarify the code as much as possible. Over the past year, as we've added new features and support for various edge-cases, the code was getting a little labyrinthian. I've tried to smooth the flow out, and have written an accompanying document to walk users through how it all comes together.
• Future-proof the codebase. Remove the dependence on string refs in favor of callback refs, and reduce ReactDOM.findDOMNode as much as possible.
• Make the code follow today's common conventions. When I wrote this library I had a bit of an eclectic code style. To make this code easier to read and contribute to, I've replaced my custom .eslint config with a barely-tweaked AirBnb config. The code style should be much closer to the community standard now.

Additionally, I built a new structure for the React Storybook stories, and added a few usecases that were missing.

Despite the improved developer insights, and a careful run-through, it is possible that this release has introduced new edge-case bugs - it's a big change, after all! I'll be keeping a close eye on things over the next few days, and any issues that arise will be fixed very quickly.

---

These changes will make it easier (and, frankly, more enjoyable) to introduce new features. And I have some pretty big ideas for what I'd like to do next :)

In addition to this housekeeping, two bugfixes found their way into the release:

• #84 - onFinishAll is now invoked with the right arguments
• #85 - maintainContainerHeight placeholder will take on the correct node type, based on the typeName supplied.

v2.6.0

Add maintainContainerHeight prop

As discussed in #80, FlipMove removes items that are leaving from the layout calculations, making its container "jump up" immediately.

While the ideal behaviour is to smoothly animate to the new height, such animations are not possible using hardware-accelerated CSS properties.

This next-best-thing prop allows the container to remain open until the animation is completed, which feels much more intentional (and much less buggy) than the container shrinking immediately.

Thanks to @rhys-vdw for contributing this feature!

v2.5.0

Prop Improvements

This minor version bump brings two quality-of-life improvements:

• The higher-order-component that handles all prop validation and management has been renamed from Converter to FlipMovePropConverter. This is to make it clear, when it raises an invariant violation, which NPM package is the culprit.
• children is no longer a required prop. Since v2 brought enter/leave animations, it is a valid usecase for the initial component to be mounted without children, and have them enter in programmatically.

v2.4.1

Bug Fix: Remove direct state mutation

Egad! It turns out I was directly modifying this.state!

I meant to clone the items and modify their clones. This is a simple change, and is mainly done to prevent future issues with React.