Preview

[declan-warn]

Please fill in this template.

• Use a meaningful title for the pull request. Include the name of the package modified.
• Test the change in your own code. (Compile and run.)
• Add or edit tests to reflect the change.
• Follow the advice from the readme.
• Avoid common mistakes.
• Run npm test <package to test>.

Select one of these and delete the others:

If changing an existing definition:

• Provide a URL to documentation or source code which provides context for the suggested changes.

  Note
  See the breakdown below.

• If this PR brings the type definitions up to date with a new version of the JS library, update the version number in the header.

---

Breakdown

There were a number of issues with the existing types. I made the following changes.

Adding | null to types

react-beautiful-dnd uses flow for typing. Its type definitions make extensive use of flow's Maybe types which translate to TypeScript as follows:

type FlowObject = {
  key: ?Value;
}

type TSObject = {
  key: Value | null | undefined;
}

These had been incorrectly translated in the past as optional properties.

children function return types

The children functions were typed as returning a ReactElement but the original flow typings use flow's React.Node type. These have been changed to use ReactNode.

getContainerForClone should return HTMLElement

The previous type for the getContainerForClone prop was a function returning a ReactElement. This is incorrect, and it should instead return an HTMLElement to use as a target for a portal.

This is mentioned in the library documentation.

DraggableStateSnapshot was missing isClone

This property is not documented anywhere but is present in the flow typing. It is also referenced in example code.

Missing props from v12

The version 12 typings were missing some props on the DragDropContext. The props were added in the v13 types, but were present in v12 as well.

From the documentation:

• liftInstruction
• nonce
• enableDefaultSensors