@planningcenter/react-beautiful-dnd 13.4.0 → 13.5.0

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@planningcenter/react-beautiful-dnd",
-  "version": "13.4.0",
+  "version": "13.5.0",
   "description": "Beautiful and accessible drag and drop for lists with React",
   "author": "Front End Systems Engineering <frontend@planningcenter.com>",
   "keywords": [
@@ -49,7 +49,7 @@
     "bundle-size:update": "yarn build:clean && yarn build:dist && yarn build:clean",
     "build": "yarn build:clean && yarn build:dist && yarn build:flow",
     "build:clean": "rimraf dist",
-    "build:dist": "rollup -c",
+    "build:dist": "NODE_OPTIONS=--openssl-legacy-provider rollup -c",
     "build:flow": "echo \"// @flow\n\nexport * from '../src';\" > dist/react-beautiful-dnd.cjs.js.flow",
     "storybook": "start-storybook -p 9002",
     "build-storybook": "build-storybook -c .storybook -o site",
@@ -65,7 +65,7 @@
     "use-memo-one": "^1.1.1"
   },
   "devDependencies": {
-    "@atlaskit/css-reset": "5.0.12",
+    "@atlaskit/css-reset": "^6.6.2",
     "@atlaskit/theme": "9.5.6",
     "@babel/core": "7.9.0",
     "@babel/plugin-proposal-class-properties": "7.8.3",
@@ -78,9 +78,9 @@
     "@emotion/babel-preset-css-prop": "10.0.27",
     "@emotion/core": "10.0.28",
     "@emotion/styled": "10.0.27",
-    "@storybook/addon-storysource": "5.3.21",
-    "@storybook/react": "5.3.21",
-    "@storybook/theming": "5.3.21",
+    "@storybook/addon-storysource": "^6.0.0",
+    "@storybook/react": "^6.0.0",
+    "@storybook/theming": "^6.0.0",
     "@testing-library/react": "10.4.9",
     "babel-core": "7.0.0-bridge.0",
     "babel-eslint": "10.1.0",
@@ -89,7 +89,7 @@
     "babel-plugin-dev-expression": "0.2.2",
     "babel-plugin-emotion": "10.0.33",
     "cross-env": "7.0.3",
-    "cypress": "4.4.0",
+    "cypress": "^4.4.0",
     "emotion-theming": "10.0.27",
     "enzyme": "3.11.0",
     "enzyme-adapter-react-16": "1.15.2",
@@ -113,7 +113,7 @@
     "jest-axe": "3.5.0",
     "jest-junit": "10.0.0",
     "jest-watch-typeahead": "0.6.1",
-    "lighthouse": "5.6.0",
+    "lighthouse": "^11.0.0",
     "markdown-it": "10.0.0",
     "prettier": "2.0.4",
     "raf-stub": "3.0.0",
@@ -124,16 +124,16 @@
     "react-window": "1.8.6",
     "require-from-string": "2.0.2",
     "rimraf": "3.0.2",
-    "rollup": "2.6.1",
+    "rollup": "3.30.0",
     "rollup-plugin-babel": "4.4.0",
     "rollup-plugin-commonjs": "10.1.0",
-    "rollup-plugin-json": "4.0.0",
+    "rollup-plugin-json": "^4.0.0",
     "rollup-plugin-node-resolve": "5.2.0",
     "rollup-plugin-replace": "2.2.0",
     "rollup-plugin-size-snapshot": "0.11.0",
     "rollup-plugin-strip": "1.2.2",
     "rollup-plugin-terser": "5.3.1",
-    "storybook-addon-performance": "0.9.0",
+    "storybook-addon-performance": "^0.16.0",
     "styled-components": "5.1.0",
     "stylelint": "13.13.1",
     "stylelint-config-prettier": "8.0.2",
@@ -142,7 +142,7 @@
     "stylelint-config-styled-components": "0.1.1",
     "stylelint-processor-styled-components": "1.10.0",
     "wait-port": "0.2.9",
-    "webpack": "4.42.1"
+    "webpack": "5.104.1"
   },
   "peerDependencies": {
     "react": "^16.8.5 || ^17.0.0 || ^18.0.0",

package/src/view/droppable/connected-droppable.js

@@ -33,6 +33,40 @@ import { updateViewportMaxScroll as updateViewportMaxScrollAction } from '../../
 import StoreContext from '../context/store-context';
 import whatIsDraggedOverFromResult from '../../state/droppable/what-is-dragged-over-from-result';
 
+function getBody(): HTMLElement {
+  invariant(document.body, 'document.body is not ready');
+  return document.body;
+}
+
+const defaultProps: DefaultProps = {
+  mode: 'standard',
+  type: 'DEFAULT',
+  direction: 'vertical',
+  isDropDisabled: false,
+  isCombineEnabled: false,
+  ignoreContainerClipping: false,
+  renderClone: null,
+  getContainerForClone: getBody,
+};
+
+const attachDefaultPropsToOwnProps = (ownProps: OwnProps) => {
+  // We need to assign default props manually because upcoming React version will stop supporting
+  // defaultProps on functional components.
+  // see: https://github.com/facebook/react/pull/25699
+  let mergedProps = { ...ownProps };
+  let defaultPropKey;
+  for (defaultPropKey in defaultProps) {
+    if (ownProps[defaultPropKey] === undefined) {
+      mergedProps = {
+        ...mergedProps,
+        [defaultPropKey]: defaultProps[defaultPropKey],
+      };
+    }
+  }
+
+  return mergedProps;
+};
+
 const isMatchingType = (type: TypeId, critical: Critical): boolean =>
   type === critical.droppable.type;
 
@@ -137,10 +171,12 @@ export const makeMapStateToProps = (): Selector => {
   const selector = (state: State, ownProps: OwnProps): MapProps => {
     // not checking if item is disabled as we need the home list to display a placeholder
 
-    const id: DroppableId = ownProps.droppableId;
-    const type: TypeId = ownProps.type;
-    const isEnabled: boolean = !ownProps.isDropDisabled;
-    const renderClone: ?DraggableChildrenFn = ownProps.renderClone;
+    const ownPropsWithDefaultProps = attachDefaultPropsToOwnProps(ownProps);
+    const id: DroppableId = ownPropsWithDefaultProps.droppableId;
+    const type: TypeId = ownPropsWithDefaultProps.type;
+    const isEnabled = !ownPropsWithDefaultProps.isDropDisabled;
+    const renderClone: ?DraggableChildrenFn =
+      ownPropsWithDefaultProps.renderClone;
 
     if (state.isDragging) {
       const critical: Critical = state.critical;
@@ -227,22 +263,6 @@ 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
@@ -260,9 +280,16 @@ const ConnectedDroppable: typeof DroppableType = connect(
   makeMapStateToProps,
   // no dispatch props for droppable
   mapDispatchToProps,
-  // mergeProps - using default
-  null,
-  // $FlowFixMe: current react-redux type does not know about context property
+  // We need to assign default props manually because upcoming React version will stop supporting
+  // defaultProps on functional components.
+  // see: https://github.com/facebook/react/pull/25699
+  (stateProps: MapProps, dispatchProps: DispatchProps, ownProps: OwnProps) => {
+    return {
+      ...attachDefaultPropsToOwnProps(ownProps),
+      ...stateProps,
+      ...dispatchProps,
+    };
+  },
   {
     // Ensuring our context does not clash with consumers
     context: StoreContext,
@@ -275,6 +302,4 @@ const ConnectedDroppable: typeof DroppableType = connect(
   },
 )(Droppable);
 
-ConnectedDroppable.defaultProps = defaultProps;
-
 export default ConnectedDroppable;

package/CHANGELOG.md

@@ -1,78 +0,0 @@
-# Changelog
-
-All notable changes to this project will be documented in this file.
-
-The format is based on [Keep a Changelog](https://keepachangelog.com/en/1.0.0/),
-and this project adheres to [Semantic Versioning](https://semver.org/spec/v2.0.0.html).
-
-## Unreleased
-
-## [13.4.0] - 2023-09-07
-
-### Changed
-
-- Use `target` to fix mobile drag-and-drop issues
-
-## [13.3.0] - 2023-07-25
-
-### Added
-
-- Add support for an element to include data-dnd-ignore-scrollable to not be considered a scrollable container.
-- Add shared publish workflow to publish to npm when a github release is created.
-
-### Changed
-
-- build/test workflow: upgrade ubuntu to use latest
-- build/test workflow: upgrade node to 16.x
-
-### Dependencies
-
-- `decode-uri-component` from 0.2.0 to 0.2.2
-- `express` from 4.17.1 to 4.18.2
-- `json5` from 1.0.1 to 1.0.2
-- `qs` from 6.5.2 to 6.5.3
-- `semver` from 5.7.1 to 5.7.2
-- `ua-parser-js` from 0.7.21 to 0.7.33
-- `word-wrap` from 1.2.3 to 1.2.4
-
-## [13.2.1]
-
-### Security
-
-Includes merged Dependabot PRs for
-
-- `terser` from 4.6.3 to 4.8.1
-- `eventsource` from 1.0.7 to 1.1.2
-- `async` from 2.6.3 to 2.6.4
-
-## [13.2.0]
-
-### Added
-
-- Added new, opt-in fluid scroller behavior. The new behavior prevents scroll from occuring when a draggable is grabbed within the auto-scroll thresholds _until_ the draggable is explicitly dragged in that threshold's direction.
-- Added ability to pass additional configuration options to fluid scroller via `DragDropContext`.
-
-## [13.1.2]
-
-### Changed
-
-- Changed package name to `@planningcenter/react-beautiful-dnd`
-- Updated author and repo information in `package.json`
-- Updated README with overview of why we forked package
-
-### Added
-
-- Added configuration files
-- Added GitHub action for building and testing code
-
-## 13.1.1 and earlier
-
-All release notes and upgrade notes for earlier versions can be found on the original
-project's [Github Releases] page.
-
-[13.4.0]: https://github.com/planningcenter/react-beautiful-dnd/compare/v13.3.0..v13.4.0
-[13.3.0]: https://github.com/planningcenter/react-beautiful-dnd/compare/v13.2.1..v13.3.0
-[13.2.1]: https://github.com/planningcenter/react-beautiful-dnd/compare/v13.2.0..v13.2.1
-[13.2.0]: https://github.com/planningcenter/react-beautiful-dnd/compare/v13.1.2..v13.2.0
-[13.1.2]: https://github.com/planningcenter/react-beautiful-dnd/compare/v13.1.1..v13.1.2
-[github releases]: https://github.com/atlassian/react-beautiful-dnd/releases