From f43fb001c8cc98cbabcb89df873166d1848af1f8 Mon Sep 17 00:00:00 2001 From: Chris Trevino Date: Thu, 7 Mar 2019 13:48:47 -0800 Subject: [PATCH] Update examples to link to JS and TS source code (#1252) * docs: add a typescript mode for emitting JS-based documentation * docs: add links to ts and js examples, update documentation build * docs: run prettier over tsc output doc js docs * docs: use spaces with published javascript --- packages/documentation-examples/package.json | 1 + .../src/00 Chessboard/Board.tsx | 4 ++ .../documentation-examples/tsconfig.docs.json | 11 ++++++ packages/documentation/.gitignore | 3 +- .../markdown/examples/chessboard/tutorial.md | 7 ++-- .../examples/customize/drop-effects.md | 9 +++-- .../customize/handles-and-previews.md | 9 +++-- .../examples/drag-around/custom-drag-layer.md | 11 ++---- .../markdown/examples/drag-around/naive.md | 7 ++-- .../markdown/examples/dustbin/copy-or-move.md | 7 ++-- .../markdown/examples/dustbin/iframe.md | 8 ++-- .../examples/dustbin/multiple-targets.md | 12 +++--- .../examples/dustbin/single-target.md | 7 ++-- .../markdown/examples/dustbin/stress-test.md | 10 ++--- .../markdown/examples/dustbin/using-fcs.md | 7 ++-- .../markdown/examples/nesting/drag-sources.md | 10 +++-- .../markdown/examples/nesting/drop-targets.md | 12 +++--- .../markdown/examples/other/native-files.md | 10 +++-- .../sortable/cancel-on-drop-outside.md | 11 +++--- .../markdown/examples/sortable/simple.md | 10 +++-- .../markdown/examples/sortable/stress-test.md | 9 +++-- packages/documentation/package.json | 9 +++-- .../src/hooks/useRegisteredSource.ts | 37 ------------------- 23 files changed, 110 insertions(+), 111 deletions(-) create mode 100644 packages/documentation-examples/tsconfig.docs.json delete mode 100644 packages/react-dnd/src/hooks/useRegisteredSource.ts diff --git a/packages/documentation-examples/package.json b/packages/documentation-examples/package.json index 5a4b0fcf95..bc0a0056bd 100644 --- a/packages/documentation-examples/package.json +++ b/packages/documentation-examples/package.json @@ -14,6 +14,7 @@ "clean": "rimraf lib", "build:cjs": "tsc -b tsconfig.cjs.json", "build:esm": "tsc -b tsconfig.esm.json", + "build:docs": "tsc -b tsconfig.docs.json", "build": "run-p build:*", "test": "run-s clean build", "start": "tsc -w --preserveWatchOutput" diff --git a/packages/documentation-examples/src/00 Chessboard/Board.tsx b/packages/documentation-examples/src/00 Chessboard/Board.tsx index 399cd9c826..da67e547c9 100644 --- a/packages/documentation-examples/src/00 Chessboard/Board.tsx +++ b/packages/documentation-examples/src/00 Chessboard/Board.tsx @@ -6,6 +6,10 @@ export interface BoardProps { knightPosition: [number, number] } +/** + * The chessboard copmonent + * @param props The react props + */ const Board: React.FC = ({ knightPosition: [knightX, knightY], }) => { diff --git a/packages/documentation-examples/tsconfig.docs.json b/packages/documentation-examples/tsconfig.docs.json new file mode 100644 index 0000000000..1f71a5cb06 --- /dev/null +++ b/packages/documentation-examples/tsconfig.docs.json @@ -0,0 +1,11 @@ +{ + "extends": "./tsconfig.esm.json", + "compilerOptions": { + "jsx": "preserve", + "outDir": "./lib/docs", + "baseUrl": "./", + "declaration": false, + "removeComments": false + }, + "include": ["./src/index.ts"] +} diff --git a/packages/documentation/.gitignore b/packages/documentation/.gitignore index 77b7ab89da..230162706f 100644 --- a/packages/documentation/.gitignore +++ b/packages/documentation/.gitignore @@ -1,4 +1,5 @@ .cache # Build directory -/public \ No newline at end of file +/public +/static/examples_js \ No newline at end of file diff --git a/packages/documentation/markdown/examples/chessboard/tutorial.md b/packages/documentation/markdown/examples/chessboard/tutorial.md index b16189b6e1..e4ef202b19 100644 --- a/packages/documentation/markdown/examples/chessboard/tutorial.md +++ b/packages/documentation/markdown/examples/chessboard/tutorial.md @@ -1,9 +1,10 @@ --- -path: "/examples/tutorial" -title: "Tutorial" +path: '/examples/tutorial' +title: 'Tutorial' --- -[Browse the Source](https://github.com/react-dnd/react-dnd/tree/master/packages/documentation-examples/src/00%20Chessboard/) +[JavaScript](https://github.com/react-dnd/react-dnd/tree/gh-pages/examples_js/00%20Chessboard/) +[TypeScript](https://github.com/react-dnd/react-dnd/tree/master/packages/documentation-examples/src/00%20Chessboard/) This is a sample app you'll build as you work through the [tutorial](/docs/tutorial) diff --git a/packages/documentation/markdown/examples/customize/drop-effects.md b/packages/documentation/markdown/examples/customize/drop-effects.md index 2c92b5c85b..dbfe170061 100644 --- a/packages/documentation/markdown/examples/customize/drop-effects.md +++ b/packages/documentation/markdown/examples/customize/drop-effects.md @@ -1,12 +1,13 @@ --- -path: "/examples/customize/drop-effects" -title: "Drop Effects" +path: '/examples/customize/drop-effects' +title: 'Drop Effects' --- -[Browse the Source](https://github.com/react-dnd/react-dnd/tree/master/packages/documentation-examples/src/05%20Customize/Drop%20Effects) +[JavaScript](https://github.com/react-dnd/react-dnd/tree/gh-pages/examples_js/05%20Customize/Drop%20Effects) +[TypeScript](https://github.com/react-dnd/react-dnd/tree/master/packages/documentation-examples/src/05%20Customize/Drop%20Effects) Some browsers let you specify the “drop effects” for the draggable items. In the compatible browsers, you will see a “copy” icon when you drag the first box over the drop zone. - \ No newline at end of file + diff --git a/packages/documentation/markdown/examples/customize/handles-and-previews.md b/packages/documentation/markdown/examples/customize/handles-and-previews.md index a197c29c5c..65e8bedc71 100644 --- a/packages/documentation/markdown/examples/customize/handles-and-previews.md +++ b/packages/documentation/markdown/examples/customize/handles-and-previews.md @@ -1,12 +1,13 @@ --- -path: "/examples/customize/handles-and-previews" -title: "Handles and Previews" +path: '/examples/customize/handles-and-previews' +title: 'Handles and Previews' --- -[Browse the Source](https://github.com/react-dnd/react-dnd/tree/master/packages/documentation-examples/src/05%20Customize/Handles%20and%20Previews) +[JavaScript](https://github.com/react-dnd/react-dnd/tree/gh-pages/examples_js/05%20Customize/Handles%20and%20Previews) +[TypeScript](https://github.com/react-dnd/react-dnd/tree/master/packages/documentation-examples/src/05%20Customize/Handles%20and%20Previews) React DnD lets you choose the draggable node, as well as the drag preview node in your component's `render` function. You may also use an [Image](https://developer.mozilla.org/en-US/docs/Web/API/HTMLImageElement/Image) instance that you created programmatically once it has loaded. - \ No newline at end of file + diff --git a/packages/documentation/markdown/examples/drag-around/custom-drag-layer.md b/packages/documentation/markdown/examples/drag-around/custom-drag-layer.md index 39c4052c71..1f617ad4bd 100644 --- a/packages/documentation/markdown/examples/drag-around/custom-drag-layer.md +++ b/packages/documentation/markdown/examples/drag-around/custom-drag-layer.md @@ -1,27 +1,24 @@ --- -path: "/examples/drag-around/custom-drag-layer" -title: "Custom Drag Layer" +path: '/examples/drag-around/custom-drag-layer' +title: 'Custom Drag Layer' --- -[Browse the Source](https://github.com/react-dnd/react-dnd/tree/master/packages/documentation-examples/src/02%20Drag%20Around/Custom%20Drag%20Layer) +[JavaScript](https://github.com/react-dnd/react-dnd/tree/gh-pages/examples_js/02%20Drag%20Around/Custom%20Drag%20Layer) +[TypeScript](https://github.com/react-dnd/react-dnd/tree/master/packages/documentation-examples/src/02%20Drag%20Around/Custom%20Drag%20Layer) The browser APIs provide no way to change the drag preview or its behavior once drag has started. Libraries such as jQuery UI implement the drag and drop from scratch to work around this, but react-dnd only supports browser drag and drop “backend” for now, so we have to accept its limitations. - We can, however, customize behavior a great deal if we feed the browser an empty image as drag preview. This library provides a `DragLayer` that you can use to implement a fixed layer on top of your app where you'd draw a custom drag preview component. - Note that we can draw a completely different component on our drag layer if we wish so. It's not just a screenshot. With this approach, we miss out on default “return” animation when dropping outside the container. However, we get great flexibility in customizing drag feedback and zero flicker. - - \ No newline at end of file diff --git a/packages/documentation/markdown/examples/drag-around/naive.md b/packages/documentation/markdown/examples/drag-around/naive.md index ab30f625ce..5de9f587b8 100644 --- a/packages/documentation/markdown/examples/drag-around/naive.md +++ b/packages/documentation/markdown/examples/drag-around/naive.md @@ -1,9 +1,10 @@ --- -path: "/examples/drag-around/naive" -title: "Naive" +path: '/examples/drag-around/naive' +title: 'Naive' --- -[Browse the Source](https://github.com/react-dnd/react-dnd/tree/master/packages/documentation-examples/src/02%20Drag%20Around/Naive) +[JavaScript](https://github.com/react-dnd/react-dnd/tree/gh-pages/examples_js/02%20Drag%20Around/Naive) +[TypeScript](https://github.com/react-dnd/react-dnd/tree/master/packages/documentation-examples/src/02%20Drag%20Around/Naive) This example naively relies on browser drag and drop implementation without much custom logic. diff --git a/packages/documentation/markdown/examples/dustbin/copy-or-move.md b/packages/documentation/markdown/examples/dustbin/copy-or-move.md index 73f794db07..1c463a1b35 100644 --- a/packages/documentation/markdown/examples/dustbin/copy-or-move.md +++ b/packages/documentation/markdown/examples/dustbin/copy-or-move.md @@ -1,9 +1,10 @@ --- -path: "/examples/dustbin/copy-or-move" -title: "Copy or Move" +path: '/examples/dustbin/copy-or-move' +title: 'Copy or Move' --- -[Browse the Source](https://github.com/react-dnd/react-dnd/tree/master/packages/documentation-examples/src/01%20Dustbin/Copy%20or%20Move) +[JavaScript](https://github.com/react-dnd/react-dnd/tree/gh-pages/examples_js/01%20Dustbin/Copy%20or%20Move) +[TypeScript](https://github.com/react-dnd/react-dnd/tree/master/packages/documentation-examples/src/01%20Dustbin/Copy%20or%20Move) This example demonstrates drop targets that can accept copy and move drop effects, which users can switch between by holding down or diff --git a/packages/documentation/markdown/examples/dustbin/iframe.md b/packages/documentation/markdown/examples/dustbin/iframe.md index 026f6c46eb..24b43eebfd 100644 --- a/packages/documentation/markdown/examples/dustbin/iframe.md +++ b/packages/documentation/markdown/examples/dustbin/iframe.md @@ -1,8 +1,10 @@ --- -path: "/examples/dustbin/iframe" -title: "iframe" +path: '/examples/dustbin/iframe' +title: 'iframe' --- -[Browse the Source](https://github.com/react-dnd/react-dnd/tree/master/packages/documentation-examples/src/01%20Dustbin/Single%20Target%20in%20iframe) + +[JavaScript](https://github.com/react-dnd/react-dnd/tree/gh-pages/examples_js/01%20Dustbin/Single%20Target%20in%20iframe) +[TypeScript](https://github.com/react-dnd/react-dnd/tree/master/packages/documentation-examples/src/01%20Dustbin/Single%20Target%20in%20iframe) This is the same simple example, but nested in an iframe. diff --git a/packages/documentation/markdown/examples/dustbin/multiple-targets.md b/packages/documentation/markdown/examples/dustbin/multiple-targets.md index 965641fad9..816ec7115c 100644 --- a/packages/documentation/markdown/examples/dustbin/multiple-targets.md +++ b/packages/documentation/markdown/examples/dustbin/multiple-targets.md @@ -1,15 +1,15 @@ --- -path: "/examples/dustbin/multiple-targets" -title: "Multiple Targets" +path: '/examples/dustbin/multiple-targets' +title: 'Multiple Targets' --- -[Browse the Source](https://github.com/react-dnd/react-dnd/tree/master/packages/documentation-examples/src/01%20Dustbin/Multiple%20Targets) - + +[JavaScript](https://github.com/react-dnd/react-dnd/tree/gh-pages/examples_js/01%20Dustbin/Multiple%20Targets) +[TypeScript](https://github.com/react-dnd/react-dnd/tree/master/packages/documentation-examples/src/01%20Dustbin/Multiple%20Targets) This is a slightly more interesting example. - It demonstrates how a single drop target may accept multiple types, and how those types may be derived from props. It also demonstrates the handling of native files and URLs (try dropping them onto the last two dustbins). - \ No newline at end of file + diff --git a/packages/documentation/markdown/examples/dustbin/single-target.md b/packages/documentation/markdown/examples/dustbin/single-target.md index 1f8bbcc1c8..7cb115545a 100644 --- a/packages/documentation/markdown/examples/dustbin/single-target.md +++ b/packages/documentation/markdown/examples/dustbin/single-target.md @@ -1,9 +1,10 @@ --- -path: "/examples/dustbin/single-target" -title: "Single Target" +path: '/examples/dustbin/single-target' +title: 'Single Target' --- -[Browse the Source](https://github.com/react-dnd/react-dnd/tree/master/packages/documentation-examples/src/01%20Dustbin/Single%20Target) +[JavaScript](https://github.com/react-dnd/react-dnd/tree/gh-pages/examples_js/01%20Dustbin/Single%20Target) +[TypeScript](https://github.com/react-dnd/react-dnd/tree/master/packages/documentation-examples/src/01%20Dustbin/Single%20Target) This is the simplest example of drag and drop. diff --git a/packages/documentation/markdown/examples/dustbin/stress-test.md b/packages/documentation/markdown/examples/dustbin/stress-test.md index 1a26d832b1..fc367b8150 100644 --- a/packages/documentation/markdown/examples/dustbin/stress-test.md +++ b/packages/documentation/markdown/examples/dustbin/stress-test.md @@ -1,15 +1,15 @@ --- -path: "/examples/dustbin/stress-test" -title: "Stress Test" +path: '/examples/dustbin/stress-test' +title: 'Stress Test' --- -[Browse the Source](https://github.com/react-dnd/react-dnd/tree/master/packages/documentation-examples/src/01%20Dustbin/Stress%20Test) +[JavaScript](https://github.com/react-dnd/react-dnd/tree/gh-pages/examples_js/01%20Dustbin/Stress%20Test) +[TypeScript](https://github.com/react-dnd/react-dnd/tree/master/packages/documentation-examples/src/01%20Dustbin/Stress%20Test) This example is similar to the previous one, but props of both the drag sources and the drop targets change every second. It demonstrates that React DnD keeps track of the changing props, and if a component receives the new props, React DnD recalculates the drag and drop state. It also shows how a custom `isDragging` implementation can make the drag source appear as dragged, even if the component that initiated the drag has received new props. - - \ No newline at end of file + diff --git a/packages/documentation/markdown/examples/dustbin/using-fcs.md b/packages/documentation/markdown/examples/dustbin/using-fcs.md index 223eabbcc4..7c5c57a4e2 100644 --- a/packages/documentation/markdown/examples/dustbin/using-fcs.md +++ b/packages/documentation/markdown/examples/dustbin/using-fcs.md @@ -1,9 +1,10 @@ --- -path: "/examples/dustbin/using-fcs" -title: "Using FCs" +path: '/examples/dustbin/using-fcs' +title: 'Using FCs' --- -[Browse the Source](https://github.com/react-dnd/react-dnd/tree/master/packages/documentation-examples/src/01%20Dustbin/Single%20Target%20with%20FCs) +[JavaScript](https://github.com/react-dnd/react-dnd/tree/gh-pages/examples_js/01%20Dustbin/Single%20Target%20with%20FCs) +[TypeScript](https://github.com/react-dnd/react-dnd/tree/master/packages/documentation-examples/src/01%20Dustbin/Single%20Target%20with%20FCs) This is the same simple example, but written using React Function Components. diff --git a/packages/documentation/markdown/examples/nesting/drag-sources.md b/packages/documentation/markdown/examples/nesting/drag-sources.md index ac2698b689..df515f40a8 100644 --- a/packages/documentation/markdown/examples/nesting/drag-sources.md +++ b/packages/documentation/markdown/examples/nesting/drag-sources.md @@ -1,8 +1,10 @@ --- -path: "/examples/nesting/drag-sources" -title: "Drag Sources" +path: '/examples/nesting/drag-sources' +title: 'Drag Sources' --- -[Browse the Source](https://github.com/react-dnd/react-dnd/tree/master/packages/documentation-examples/src/03%20Nesting/Drag%20Sources) + +[JavaScript](https://github.com/react-dnd/react-dnd/tree/gh-pages/examples_js/03%20Nesting/Drag%20Sources) +[TypeScript](https://github.com/react-dnd/react-dnd/tree/master/packages/documentation-examples/src/03%20Nesting/Drag%20Sources) You can nest the drag sources in one another. If a nested drag source returns `false` from `canDrag`, its parent will @@ -10,4 +12,4 @@ be asked, until a draggable source is found and activated. Only the activated drag source will have its `beginDrag()` and `endDrag()` called. - \ No newline at end of file + diff --git a/packages/documentation/markdown/examples/nesting/drop-targets.md b/packages/documentation/markdown/examples/nesting/drop-targets.md index a285d7be0c..b0240f872c 100644 --- a/packages/documentation/markdown/examples/nesting/drop-targets.md +++ b/packages/documentation/markdown/examples/nesting/drop-targets.md @@ -1,13 +1,15 @@ --- -path: "/examples/nesting/drop-targets" -title: "Drop Targets" +path: '/examples/nesting/drop-targets' +title: 'Drop Targets' --- -[Browse the Source](https://github.com/react-dnd/react-dnd/tree/master/packages/documentation-examples/src/03%20Nesting/Drop%20Targets) + +[JavaScript](https://github.com/react-dnd/react-dnd/tree/gh-pages/examples_js/03%20Nesting/Drop%20Targets) +[TypeScript](https://github.com/react-dnd/react-dnd/tree/master/packages/documentation-examples/src/03%20Nesting/Drop%20Targets) Drop targets can, too, be nested in one another. Unlike the drag sources, several drop targets may react to the same item being -dragged. +dragged. -React DnD by design offers no means of stopping propagation. Instead, the drop targets may compare `monitor.isOver()` and `monitor.isOver({ shallow: false })` to learn if just them, or their nested targets, are being hovered. They may also check `monitor.didDrop()` and `monitor.getDropResult()` to learn if a nested target has already handled the drop, and even return a different drop result. +React DnD by design offers no means of stopping propagation. Instead, the drop targets may compare `monitor.isOver()` and `monitor.isOver({ shallow: false })` to learn if just them, or their nested targets, are being hovered. They may also check `monitor.didDrop()` and `monitor.getDropResult()` to learn if a nested target has already handled the drop, and even return a different drop result. diff --git a/packages/documentation/markdown/examples/other/native-files.md b/packages/documentation/markdown/examples/other/native-files.md index 5be8772c60..eeba663a5c 100644 --- a/packages/documentation/markdown/examples/other/native-files.md +++ b/packages/documentation/markdown/examples/other/native-files.md @@ -1,9 +1,11 @@ --- -path: "/examples/other/native-files" -title: "Native Files" +path: '/examples/other/native-files' +title: 'Native Files' --- -[Browse the Source](https://github.com/react-dnd/react-dnd/tree/master/packages/documentation-examples/src/06%20Other/Native%20Files) + +[JavaScript](https://github.com/react-dnd/react-dnd/tree/gh-pages/examples_js/06%20Other/Native%20Files) +[TypeScript](https://github.com/react-dnd/react-dnd/tree/master/packages/documentation-examples/src/06%20Other/Native%20Files) Example demonstrating drag and drop of native files. - \ No newline at end of file + diff --git a/packages/documentation/markdown/examples/sortable/cancel-on-drop-outside.md b/packages/documentation/markdown/examples/sortable/cancel-on-drop-outside.md index e1dc848b7b..ad6c98d4e3 100644 --- a/packages/documentation/markdown/examples/sortable/cancel-on-drop-outside.md +++ b/packages/documentation/markdown/examples/sortable/cancel-on-drop-outside.md @@ -1,12 +1,13 @@ --- -path: "/examples/sortable/cancel-on-drop-outside" -title: "Cancel on Drop Outside" +path: '/examples/sortable/cancel-on-drop-outside' +title: 'Cancel on Drop Outside' --- -[Browse the Source](https://github.com/react-dnd/react-dnd/tree/master/packages/documentation-examples/src/04%20Sortable/Cancel%20on%20Drop%20Outside) +[JavaScript](https://github.com/react-dnd/react-dnd/tree/gh-pages/examples_js/04%20Sortable/Cancel%20on%20Drop%20Outside) +[TypeScript](https://github.com/react-dnd/react-dnd/tree/master/packages/documentation-examples/src/04%20Sortable/Cancel%20on%20Drop%20Outside) -Because you write the logic instead of using the ready-made components, -you can tweak the behavior to the one your app needs. +Because you write the logic instead of using the ready-made components, +you can tweak the behavior to the one your app needs. In this example, instead of moving the card inside the drop target's `drop()` handler, we do it inside the drag source's `endDrag()` handler. This let us check `monitor.didDrop()` and revert the drag operation if the card was dropped outside its container. diff --git a/packages/documentation/markdown/examples/sortable/simple.md b/packages/documentation/markdown/examples/sortable/simple.md index 52cab9254b..839ae0df4f 100644 --- a/packages/documentation/markdown/examples/sortable/simple.md +++ b/packages/documentation/markdown/examples/sortable/simple.md @@ -1,11 +1,13 @@ --- -path: "/examples/sortable/simple" -title: "Simple" +path: '/examples/sortable/simple' +title: 'Simple' --- -[Browse the Source](https://github.com/react-dnd/react-dnd/tree/master/packages/documentation-examples/src/04%20Sortable/Simple) + +[JavaScript](https://github.com/react-dnd/react-dnd/tree/gh-pages/examples_js/04%20Sortable/Simple) +[TypeScript](https://github.com/react-dnd/react-dnd/tree/master/packages/documentation-examples/src/04%20Sortable/Simple) It is easy to implement a sortable interface with React DnD. Just make the same component both a drag source and a drop target, and reorder the data in the `hover` handler. - \ No newline at end of file + diff --git a/packages/documentation/markdown/examples/sortable/stress-test.md b/packages/documentation/markdown/examples/sortable/stress-test.md index 1e97107564..42278ef727 100644 --- a/packages/documentation/markdown/examples/sortable/stress-test.md +++ b/packages/documentation/markdown/examples/sortable/stress-test.md @@ -1,8 +1,10 @@ --- -path: "/examples/sortable/stress-test" -title: "Stress Test" +path: '/examples/sortable/stress-test' +title: 'Stress Test' --- -[Browse the Source](https://github.com/react-dnd/react-dnd/tree/master/packages/documentation-examples/src/04%20Sortable/Stress%20Test) + +[JavaScript](https://github.com/react-dnd/react-dnd/tree/gh-pages/examples_js/04%20Sortable/Stress%20Test) +[TypeScript](https://github.com/react-dnd/react-dnd/tree/master/packages/documentation-examples/src/04%20Sortable/Stress%20Test) How many items can React DnD handle at the same time? There are a thousand items in this list. With some optimizations like updating the @@ -22,5 +24,4 @@ scrolling with a parent drop target that compares handler. In fact, you are welcome to contribute this functionality to this example! - diff --git a/packages/documentation/package.json b/packages/documentation/package.json index 57d79ee39a..88a8f8200f 100644 --- a/packages/documentation/package.json +++ b/packages/documentation/package.json @@ -43,14 +43,17 @@ }, "devDependencies": { "gh-pages": "^2.0.1", - "npm-run-all": "^4.1.5" + "npm-run-all": "^4.1.5", + "prettier": "^1.16.4" }, "scripts": { - "clean": "rimraf .cache public apidocs", + "clean": "rimraf .cache public apidocs static/examples_js", "develop": "gatsby develop", "start": "npm run develop", + "copy_example_source": "cp -r ../documentation-examples/lib/docs static/examples_js", + "format_example_source": "prettier 'static/examples_js/**/*.js*' --use-tabs=false --write", "build_static_site": "gatsby build --prefix-paths", "publish_gh_pages": "NODE_DEBUG=gh-pages gh-pages -d public -t", - "release": "run-s clean build_static_site publish_gh_pages" + "release": "run-s clean copy_example_source format_example_source build_static_site publish_gh_pages" } } diff --git a/packages/react-dnd/src/hooks/useRegisteredSource.ts b/packages/react-dnd/src/hooks/useRegisteredSource.ts deleted file mode 100644 index 8960ea2634..0000000000 --- a/packages/react-dnd/src/hooks/useRegisteredSource.ts +++ /dev/null @@ -1,37 +0,0 @@ -import { useMemo, useEffect } from 'react' -import { - DragDropManager, - SourceType, - TargetType, - DragSource, - DropTarget, - Identifier, -} from 'dnd-core' -import { DragSourceMonitor, DropTargetMonitor } from '../interfaces' -import { HandlerManager } from './util' - -export function useMonitorSubscription< - Context, - Type = SourceType | TargetType, - Handler = DragSource | DropTarget, - Monitor = DragSourceMonitor | DropTargetMonitor, - Manager = DragDropManager ->( - register: ( - type: Type, - handler: Handler, - dragDropManager: Manager, - ) => { handlerId: Identifier; unregister: () => void }, - type: Type, - handler: Handler, - manager: Manager, - monitor: Monitor & HandlerManager, -) { - const unregisterHandler = useMemo(() => { - const { handlerId, unregister } = register(type, handler, manager) - monitor.receiveHandlerId(handlerId) - return unregister - }, []) - - useEffect(() => unregisterHandler, []) -}