Skip to content

Releases: atlassian/react-beautiful-dnd

2.1.1

07 Sep 03:43
Compare
Choose a tag to compare

Fixes

  • No longer publishing .babelrc to npm #75. This will avoid a babel issue for consumers. Thanks @leandrowd for the pull request!

Improvements

  • eslint config cleanup #76

2.1.0

01 Sep 06:19
Compare
Choose a tag to compare

Improvements

  • flow types are now exposed publicly! Previously they were documented in README.md but there was no way as a consumer to rely on them. Now you are welcome to use the exported flow types to type your javascript if you want to. You will find all of the exported types in the README.md. If typed javascript is not your thing - no worries, you can continue to use things as you always have. #63 (minor version bump ✨)
  • npm version badge now listed in README.md. Thanks @romellogood!! #71

2.0.2

01 Sep 00:17
Compare
Choose a tag to compare

Fixes

  • Dragging will now play nicely with force presses mouse inputs in Safari #62. Keep in mind that if you are within an iframe - due to a bug in Safari you will need to do a little extra work. Thanks @v0lkan for raising the issue

Improvements

  • Server side rendering is now supported 🎉. Huge kudos to @romellogood who raised the issue #65 and the fix #66! We also added some tests to ensure that server side rendering works going forward #69. It is border line whether this needed to be a minor or patch release. I have taken the view that server side rendering for react applications should be a given - so this more closely falls into the fix category.
  • Improving internal flowtypes #56. We Hope to expose flow types as part of the public api soon #63

2.0.1

24 Aug 22:27
Compare
Choose a tag to compare

Fixes

  • When dragging an item that is more than double in size from its sibling - the drag now has the correct impact. You can read all the details here: #57.

2.0.0

22 Aug 23:57
Compare
Choose a tag to compare

Features

Adding support for horizontal dragging ↔ #53 👍

horizontal-reorder-small

It works with both mouse and keyboard just like vertical lists.

New keyboard shortcuts

  • Left arrow - move a Draggable that is dragging backward in a horizontal list
  • Right arrow - move a Draggable that is dragging forward in a horizontal list

Changes

hooks.onDragStart (breaking change 💥)

The type signature of onDragStart has changed

- onDragStart?: (id: DraggableId, location: DraggableLocation) => void

+ onDragStart?: (initial: DragStart) => void
+
+ // supporting types
+ type DragStart = {|
+   draggableId: DraggableId,
+   type: TypeId,
+   source: DraggableLocation,
+ |}

Why?

We wanted to add a type argument to the onDragStart function as it is a useful piece of information. You could always look it up yourself by the id - but it felt right to expose it here. Rather than adding a third argument to onDragStart we converted the argument into a object that has a very familiar shape to DropResult that is provided to onDragEnd. This reduces the friction writing onDragStart and onDragEnd handlers.

hooks.onDragEnd

A type property has been added to DropResult. This allows you to know the type of the draggable that was dropped.

onDragEnd: (result: DropResult) => void

// supporting types
type DropResult = {|
  draggableId: DraggableId,
+ type: TypeId,
  source: DraggableLocation,
  // may not have any destination (drag to nowhere)
  destination: ?DraggableLocation
|}

Improvements

  • Performance: lists that are of a different type to the dragging item do not update at all during a drag

Misc

Adding a board example #5

This example shows off some a nested composition that is supported by react-beautiful-dnd

board-small

  • Note that transitioning between lists is not supported yet - but will be soon #2

Translations

The documentation has been translated to korean by @LeeHyungGeun #51! 👏

Documentation improvements

Thanks the the following people who submitted pull requests to make the documentation even better: @brikou @kulakowka @trevordmiller.

Storybook cleanup

The stories have been rearranged to be a bit more logical to follow. Also the onDragStart and onDragEnd functions in each example now publish storybook actions so you can see the results in the storybook action pane.

1.0.3

20 Aug 10:37
Compare
Choose a tag to compare

Fixes

  • Draggable with a margin top or left will now be positioned correctly when initially lifted #45

1.0.2

15 Aug 01:10
Compare
Choose a tag to compare

Fixes

  • Cancelling a drag now animates the dropped item correctly back to its home location #30

(showing off cancelling while dragging with a mouse or keyboard)

example

  • (performance) Each Draggable and Droppable now correctly gets its own selector. Previously there was partial sharing of selectors. This change avoids more possible memoization cache busting #30

1.0.1

11 Aug 00:34
Compare
Choose a tag to compare

Improvements

  • No longer publishing some redundant stuff to npm (#20). Thanks @bengummer for picking it up and @JedWatson for the pull request