From 8f6cb6c7b3c28452e93fe33ddc976785d287c4ba Mon Sep 17 00:00:00 2001 From: Chris Trevino Date: Tue, 5 Apr 2022 10:46:10 -0700 Subject: [PATCH] v16 Release (#3421) * chore: version bump * chore: update prism * fix: separate render from logical update cycle in sortable stress test --- .yarn/versions/122d1557.yml | 16 ----- packages/backend-html5/package.json | 2 +- packages/backend-test/package.json | 2 +- packages/backend-touch/package.json | 2 +- packages/dnd-core/package.json | 2 +- packages/docsite/package.json | 4 +- packages/examples/package.json | 2 +- .../src/04-sortable/stress-test/Container.tsx | 66 ++++++++++--------- packages/react-dnd/package.json | 2 +- packages/test-utils/package.json | 2 +- packages/util-asap/package.json | 2 +- packages/util-invariant/package.json | 2 +- packages/util-shallowequal/package.json | 2 +- yarn.lock | 34 +++++----- 14 files changed, 64 insertions(+), 76 deletions(-) delete mode 100644 .yarn/versions/122d1557.yml diff --git a/.yarn/versions/122d1557.yml b/.yarn/versions/122d1557.yml deleted file mode 100644 index bc179aa129..0000000000 --- a/.yarn/versions/122d1557.yml +++ /dev/null @@ -1,16 +0,0 @@ -releases: - "@react-dnd/asap": major - "@react-dnd/invariant": major - "@react-dnd/shallowequal": major - dnd-core: major - react-dnd: major - react-dnd-examples: major - react-dnd-html5-backend: major - react-dnd-test-backend: major - react-dnd-test-utils: major - react-dnd-touch-backend: major - -declined: - - react-dnd-documentation - - test-suite-cra - - test-suite-vite diff --git a/packages/backend-html5/package.json b/packages/backend-html5/package.json index 15daa5bfa2..3430bc5e3e 100644 --- a/packages/backend-html5/package.json +++ b/packages/backend-html5/package.json @@ -1,6 +1,6 @@ { "name": "react-dnd-html5-backend", - "version": "15.1.3", + "version": "16.0.0", "description": "HTML5 backend for React DnD", "type": "module", "main": "dist/index.js", diff --git a/packages/backend-test/package.json b/packages/backend-test/package.json index aa8f0f543e..97a8ccc579 100644 --- a/packages/backend-test/package.json +++ b/packages/backend-test/package.json @@ -1,6 +1,6 @@ { "name": "react-dnd-test-backend", - "version": "15.1.2", + "version": "16.0.0", "description": "A mock backend for testing React DnD apps", "type": "module", "main": "dist/index.js", diff --git a/packages/backend-touch/package.json b/packages/backend-touch/package.json index 10c33e2165..95ce8f1355 100644 --- a/packages/backend-touch/package.json +++ b/packages/backend-touch/package.json @@ -1,6 +1,6 @@ { "name": "react-dnd-touch-backend", - "version": "15.1.2", + "version": "16.0.0", "description": "Touch backend for react-dnd", "type": "module", "main": "dist/index.js", diff --git a/packages/dnd-core/package.json b/packages/dnd-core/package.json index b8587575d1..5f304dbf18 100644 --- a/packages/dnd-core/package.json +++ b/packages/dnd-core/package.json @@ -1,6 +1,6 @@ { "name": "dnd-core", - "version": "15.1.2", + "version": "16.0.0", "description": "Drag and drop sans the GUI", "license": "MIT", "type": "module", diff --git a/packages/docsite/package.json b/packages/docsite/package.json index 70c2dd1732..7b49e586b0 100644 --- a/packages/docsite/package.json +++ b/packages/docsite/package.json @@ -6,7 +6,7 @@ "license": "MIT", "dependencies": { "debug": "^4.3.4", - "gatsby": "~4.11.1", + "gatsby": "~4.11.2", "gatsby-plugin-manifest": "^4.11.1", "gatsby-plugin-react-helmet": "^5.11.0", "gatsby-plugin-sharp": "^4.11.1", @@ -20,7 +20,7 @@ "gatsby-transformer-remark": "^5.11.1", "gatsby-transformer-sharp": "^4.11.0", "lodash": "^4.17.21", - "prismjs": "^1.25.0", + "prismjs": "^1.27.0", "query-string": "^6.14.1", "react": "^18.0.0", "react-dnd": "workspace:^", diff --git a/packages/examples/package.json b/packages/examples/package.json index afa53fa8bf..4f05912a90 100644 --- a/packages/examples/package.json +++ b/packages/examples/package.json @@ -1,6 +1,6 @@ { "name": "react-dnd-examples", - "version": "15.1.3", + "version": "16.0.0", "private": true, "description": "Drag and Drop for React", "type": "module", diff --git a/packages/examples/src/04-sortable/stress-test/Container.tsx b/packages/examples/src/04-sortable/stress-test/Container.tsx index bc08cec4ec..81f5b7ca26 100644 --- a/packages/examples/src/04-sortable/stress-test/Container.tsx +++ b/packages/examples/src/04-sortable/stress-test/Container.tsx @@ -9,14 +9,19 @@ const style: CSSProperties = { width: 400, } -export interface ContainerState { - cardsById: { [key: string]: any } - cardsByIndex: any[] +interface CardItem { + id: number + text: string +} + +export interface CardState { + cardsById: Record + cardsByIndex: CardItem[] } function buildCardData() { - const cardsById: { [key: string]: any } = {} - const cardsByIndex = [] + const cardsById: Record = {} + const cardsByIndex: CardItem[] = [] for (let i = 0; i < 1000; i += 1) { const card = { id: i, text: Faker.name.findName() } @@ -33,13 +38,16 @@ function buildCardData() { /* eslint-disable-next-line @typescript-eslint/no-empty-interface */ export interface ContainerProps {} -export class Container extends Component { - private pendingUpdateFn: any +export class Container extends Component< + ContainerProps, + Record +> { private requestedFrame: number | undefined + private cardState: CardState = buildCardData() public constructor(props: ContainerProps) { super(props) - this.state = buildCardData() + this.state = STATE } public override componentWillUnmount(): void { @@ -49,7 +57,7 @@ export class Container extends Component { } public override render(): JSX.Element { - const { cardsByIndex } = this.state + const { cardsByIndex } = this.cardState return ( <> @@ -67,32 +75,14 @@ export class Container extends Component { ) } - private scheduleUpdate(updateFn: any) { - this.pendingUpdateFn = updateFn - - if (!this.requestedFrame) { - this.requestedFrame = requestAnimationFrame(this.drawFrame) - } - } - - private drawFrame = (): void => { - const nextState = update(this.state, this.pendingUpdateFn) - this.setState(nextState) - - this.pendingUpdateFn = undefined - this.requestedFrame = undefined - } - private moveCard = (id: string, afterId: string): void => { - const { cardsById, cardsByIndex } = this.state - - const card = cardsById[id] - const afterCard = cardsById[afterId] + const { cardsById, cardsByIndex } = this.cardState + const card = cardsById[id] as CardItem + const afterCard = cardsById[afterId] as CardItem const cardIndex = cardsByIndex.indexOf(card) const afterIndex = cardsByIndex.indexOf(afterCard) - - this.scheduleUpdate({ + this.cardState = update(this.cardState, { cardsByIndex: { $splice: [ [cardIndex, 1], @@ -100,5 +90,19 @@ export class Container extends Component { ], }, }) + this.scheduleUpdate() + } + + private scheduleUpdate() { + if (!this.requestedFrame) { + this.requestedFrame = requestAnimationFrame(this.drawFrame) + } + } + + private drawFrame = (): void => { + this.setState(STATE) + this.requestedFrame = undefined } } + +const STATE = {} diff --git a/packages/react-dnd/package.json b/packages/react-dnd/package.json index 011e0be2b8..f0881005c9 100644 --- a/packages/react-dnd/package.json +++ b/packages/react-dnd/package.json @@ -1,6 +1,6 @@ { "name": "react-dnd", - "version": "15.1.2", + "version": "16.0.0", "description": "Drag and Drop for React", "type": "module", "main": "dist/index.js", diff --git a/packages/test-utils/package.json b/packages/test-utils/package.json index 02436aee8c..574caefb7c 100644 --- a/packages/test-utils/package.json +++ b/packages/test-utils/package.json @@ -1,6 +1,6 @@ { "name": "react-dnd-test-utils", - "version": "15.1.2", + "version": "16.0.0", "license": "MIT", "type": "module", "main": "dist/index.js", diff --git a/packages/util-asap/package.json b/packages/util-asap/package.json index 1b85cb8ce4..af0a9e464e 100644 --- a/packages/util-asap/package.json +++ b/packages/util-asap/package.json @@ -1,6 +1,6 @@ { "name": "@react-dnd/asap", - "version": "4.0.1", + "version": "5.0.0", "description": "High-priority task queue for Node.js and browsers", "keywords": [ "event", diff --git a/packages/util-invariant/package.json b/packages/util-invariant/package.json index a0987e5a28..50eaf1e67a 100644 --- a/packages/util-invariant/package.json +++ b/packages/util-invariant/package.json @@ -1,6 +1,6 @@ { "name": "@react-dnd/invariant", - "version": "3.0.1", + "version": "4.0.0", "description": "invariantx", "keywords": [ "test", diff --git a/packages/util-shallowequal/package.json b/packages/util-shallowequal/package.json index 5406fcd33d..544f71674f 100644 --- a/packages/util-shallowequal/package.json +++ b/packages/util-shallowequal/package.json @@ -1,6 +1,6 @@ { "name": "@react-dnd/shallowequal", - "version": "3.0.1", + "version": "4.0.0", "description": "Like lodash isEqualWith but for shallow equal.", "keywords": [ "shallowequal", diff --git a/yarn.lock b/yarn.lock index 3fa62885b5..3c443da636 100644 --- a/yarn.lock +++ b/yarn.lock @@ -8222,14 +8222,14 @@ __metadata: languageName: node linkType: hard -"create-gatsby@npm:^2.11.1": - version: 2.11.1 - resolution: "create-gatsby@npm:2.11.1" +"create-gatsby@npm:^2.11.2": + version: 2.11.2 + resolution: "create-gatsby@npm:2.11.2" dependencies: "@babel/runtime": ^7.15.4 bin: create-gatsby: cli.js - checksum: 8ff3c758bb9af6dc9cb8ee5aeac716bb98f08e49f86c19cbbe1df51a437046a563573645c5285276ada93dd3a2d0dd886ec75be11430c335d6281f451880d562 + checksum: 672840735b59033ea3133b4f5b0a07ad2efb55e89103b2b6b2a887704a4a572c702ec7828b1be590b713bdb37829a4400e178e9078c9e97af29a49096cae85f0 languageName: node linkType: hard @@ -11280,9 +11280,9 @@ __metadata: languageName: node linkType: hard -"gatsby-cli@npm:^4.11.1": - version: 4.11.1 - resolution: "gatsby-cli@npm:4.11.1" +"gatsby-cli@npm:^4.11.2": + version: 4.11.2 + resolution: "gatsby-cli@npm:4.11.2" dependencies: "@babel/code-frame": ^7.14.0 "@babel/core": ^7.15.5 @@ -11300,7 +11300,7 @@ __metadata: common-tags: ^1.8.2 configstore: ^5.0.1 convert-hrtime: ^3.0.0 - create-gatsby: ^2.11.1 + create-gatsby: ^2.11.2 envinfo: ^7.8.1 execa: ^5.1.1 fs-exists-cached: ^1.0.0 @@ -11331,7 +11331,7 @@ __metadata: yurnalist: ^2.1.0 bin: gatsby: cli.js - checksum: e0e8be47e22309c187afa79bc85758e6a8692a330ddde2cdbc4a8edc018acb60a6776fc6a07d7e65087af6261f63d0671d5dd0e4cefa5dd59857b385ae6f2b6c + checksum: e892fa85ef71ed421e1a6154a95074c0e8b3b0b8167b26a1e879b73c4e289a1c1afbb9365c4c7a9bb1bbc313d5c859b5aaa04b2ba520d1f32e414f8377d9f508 languageName: node linkType: hard @@ -11777,9 +11777,9 @@ __metadata: languageName: node linkType: hard -"gatsby@npm:~4.11.1": - version: 4.11.1 - resolution: "gatsby@npm:4.11.1" +"gatsby@npm:~4.11.2": + version: 4.11.2 + resolution: "gatsby@npm:4.11.2" dependencies: "@babel/code-frame": ^7.14.0 "@babel/core": ^7.15.5 @@ -11849,7 +11849,7 @@ __metadata: find-cache-dir: ^3.3.2 fs-exists-cached: 1.0.0 fs-extra: ^10.0.0 - gatsby-cli: ^4.11.1 + gatsby-cli: ^4.11.2 gatsby-core-utils: ^3.11.1 gatsby-graphiql-explorer: ^2.11.0 gatsby-legacy-polyfills: ^2.11.0 @@ -11942,7 +11942,7 @@ __metadata: optional: true bin: gatsby: ./cli.js - checksum: 3b1ba33c8c4668ad4c7bf4c8e9663c6517f207aafbbd2a1897fa764766b64c5a1b8bcdb85c5b2eb1a701d98b083f42a2894db5bc57aef4764b5bd5e68f5eaf39 + checksum: 2d2a14e17385f19c47114425347b86d392849c078415582c9beb66aa7fa08b7223dcd649c33f732d559cbbb91aa2192af5575b696657caf4d5d557f29c457b5c languageName: node linkType: hard @@ -18791,7 +18791,7 @@ __metadata: languageName: node linkType: hard -"prismjs@npm:^1.25.0": +"prismjs@npm:^1.27.0": version: 1.27.0 resolution: "prismjs@npm:1.27.0" checksum: 85c7f4a3e999073502cc9e1882af01e3709706369ec254b60bff1149eda701f40d02512acab956012dc7e61cfd61743a3a34c1bd0737e8dbacd79141e5698bbc @@ -19205,7 +19205,7 @@ __metadata: "@types/styled-components": ^5.1.24 babel-plugin-styled-components: ^1.13.2 debug: ^4.3.4 - gatsby: ~4.11.1 + gatsby: ~4.11.2 gatsby-plugin-manifest: ^4.11.1 gatsby-plugin-react-helmet: ^5.11.0 gatsby-plugin-sharp: ^4.11.1 @@ -19221,7 +19221,7 @@ __metadata: lodash: ^4.17.21 npm-run-all: ^4.1.5 prettier: ^2.6.2 - prismjs: ^1.25.0 + prismjs: ^1.27.0 prop-types: ^15.8.1 query-string: ^6.14.1 react: ^18.0.0