All Versions
12
Latest Version
Avg Release Cycle
48 days
Latest Release
1280 days ago

Changelog History
Page 1

  • v2.5.3

    October 16, 2020

  • v2.5.2

    October 16, 2020

  • v2.5.1

    July 21, 2020

  • v2.5.0 Changes

    May 01, 2020

    container

    container?: Element;

    🚚 Provide custom DOM element where moved item will be rendered.

  • v2.4.2

    March 10, 2020

  • v2.4.1

    February 25, 2020

  • v2.4.0 Changes

    December 11, 2019

    When you start putting things like inputs into your list items, you could get into troubles. React Movable is now smarter and ignores mouse/keyboard inputs when you are trying to type or click. There's a new example:

    Screen Shot 2019-12-11 at 3 35 01 PM

    ⚡️ Also, all deps are updated and React Hooks in all examples.

  • v2.3.0 Changes

    October 16, 2019

    The drop is now animated so it provides user a nice visual feedback. Previously, it just re-appeared in the final position. The length of animation is controlled by the transitionDuration prop.

    🚀 This release also fixes a bug when an item move far top didn't end up reordered.

    Before

    old

    After

    animated

  • v2.2.0 Changes

    July 02, 2019

    🚚 There is a new removableByMove top API that will allow you to remove items when being moved far left or right. PR. Example.

    removable

    This also adds targetRect as an another parameter that's being passed to you through onChange callback. This can be useful when you want to detect where exactly the item was dropped.

  • v2.1.1 Changes

    July 01, 2019

    There is a new top level API beforeDrag that allows to do some measurements of elements and implement a table with dynamic column widths.

    Items now recognize disable: true prop that prevents them to be dragged. Example.

    /\* ... \*/state = { items: [{ label: 'Item 1' }, { label: 'Item 2' }, { label: 'Item 3' }, { label: 'Item 4', disabled: true }, { label: 'Item 5', disabled: true }, { label: 'Item 6' }] }; render() { return ( \<Listvalues={this.state.items}/\* ... \*/