React 19 support: Migrate away from defaultProps

src/view/droppable/connected-droppable.js

@@ -3,7 +3,6 @@
 import { Component } from 'react';
 import { connect } from 'react-redux';
 import memoizeOne from 'memoize-one';
-import { invariant } from '../../invariant';
 import type {
   State,
   DroppableId,
@@ -19,7 +18,6 @@ import type {
 import type {
   MapProps,
   OwnProps,
-  DefaultProps,
   Selector,
   DispatchProps,
   StateSnapshot,
@@ -227,26 +225,11 @@ const mapDispatchToProps: DispatchProps = {
   updateViewportMaxScroll: updateViewportMaxScrollAction,
 };
 
-function getBody(): HTMLElement {
-  invariant(document.body, 'document.body is not ready');
-  return document.body;
-}
-
-const defaultProps = ({
-  mode: 'standard',
-  type: 'DEFAULT',
-  direction: 'vertical',
-  isDropDisabled: false,
-  isCombineEnabled: false,
-  ignoreContainerClipping: false,
-  renderClone: null,
-  getContainerForClone: getBody,
-}: DefaultProps);
-
 // Abstract class allows to specify props and defaults to component.
 // All other ways give any or do not let add default props.
 // eslint-disable-next-line
 /*::
+import { defaultProps } from './droppable';
 class DroppableType extends Component<OwnProps> {
   static defaultProps = defaultProps;
 }
@@ -275,6 +258,4 @@ const ConnectedDroppable: typeof DroppableType = connect(
   },
 )(Droppable);
 
-ConnectedDroppable.defaultProps = defaultProps;
-
 export default ConnectedDroppable;

src/view/droppable/droppable.jsx

@@ -4,7 +4,7 @@ import { useMemo, useCallback } from 'use-memo-one';
 import React, { useRef, useContext, type Node } from 'react';
 import { invariant } from '../../invariant';
 import type { DraggableId } from '../../types';
-import type { Props, Provided } from './droppable-types';
+import type { DefaultProps, Props, Provided } from './droppable-types';
 import useDroppablePublisher from '../use-droppable-publisher';
 import Placeholder from '../placeholder';
 import AppContext, { type AppContextValue } from '../context/app-context';
@@ -23,7 +23,24 @@ import AnimateInOut, {
 } from '../animate-in-out/animate-in-out';
 import { PrivateDraggable } from '../draggable/draggable-api';
 
-export default function Droppable(props: Props) {
+function getBody(): HTMLElement {
+  invariant(document.body, 'document.body is not ready');
+  return document.body;
+}
+
+export const defaultProps: DefaultProps = {
+  mode: 'standard',
+  type: 'DEFAULT',
+  direction: 'vertical',
+  isDropDisabled: false,
+  isCombineEnabled: false,
+  ignoreContainerClipping: false,
+  renderClone: null,
+  getContainerForClone: getBody,
+};
+
+export default function Droppable(passedProps: Props) {
+  const props = { ...defaultProps, ...passedProps };
   const appContext: ?AppContextValue = useContext<?AppContextValue>(AppContext);
   invariant(appContext, 'Could not find app context');
   const { contextId, isMovementAllowed } = appContext;