diff --git a/package.json b/package.json
index c1a2610cff..5614264176 100644
--- a/package.json
+++ b/package.json
@@ -61,14 +61,15 @@
 		"@commitlint/cli": "^7.2.1",
 		"@commitlint/config-conventional": "^7.1.2",
 		"@types/jest": "^23.3.8",
-		"husky": "^1.1.2",
+		"husky": "^1.1.3",
 		"jest": "^23.6.0",
 		"jest-environment-jsdom": "^23.4.0",
 		"lerna": "^3.4.3",
-		"lint-staged": "^7.3.0",
+		"lint-staged": "^8.0.4",
 		"npm-run-all": "^4.1.3",
 		"prettier": "^1.14.3",
 		"ts-jest": "^23.10.4",
+		"typescript": "^3.1.6",
 		"tslint": "^5.11.0",
 		"tslint-config-prettier": "^1.15.0",
 		"tslint-react": "~3.6.0"
@@ -107,9 +108,10 @@
 	"workspaces": {
     "packages": ["packages/*"],
     "nohoist": [
+      
       "**/@types/*",
       "**/hoist-non-react-statics",
-      "**/redux"
+			"**/redux"
     ]
 	}
 }
diff --git a/packages/dnd-core/package.json b/packages/dnd-core/package.json
index 3c0c6a7bf5..f91edc92d1 100644
--- a/packages/dnd-core/package.json
+++ b/packages/dnd-core/package.json
@@ -25,6 +25,6 @@
 	"devDependencies": {
 		"npm-run-all": "^4.1.3",
 		"rimraf": "^2.6.2",
-		"typescript": "^3.1.3"
+		"typescript": "^3.1.6"
 	}
 }
diff --git a/packages/documentation-examples/package.json b/packages/documentation-examples/package.json
new file mode 100644
index 0000000000..aac1c3ce8b
--- /dev/null
+++ b/packages/documentation-examples/package.json
@@ -0,0 +1,45 @@
+{
+	"name": "react-dnd-documentation-examples",
+	"version": "5.0.0",
+	"private": true,
+	"description": "Drag and Drop for React",
+	"main": "lib/index.js",
+	"types": "lib/index.d.ts",
+	"repository": {
+		"type": "git",
+		"url": "https://github.com/react-dnd/react-dnd.git"
+	},
+	"license": "BSD-3-Clause",
+	"scripts": {
+		"clean": "rimraf lib",
+		"build": "tsc",
+		"test": "run-s clean build",
+		"start": "tsc -w --preserveWatchOutput"
+	},
+	"dependencies": {
+		"@types/faker": "^4.1.4",
+		"@types/styled-components": "^4.0.3",
+		"dnd-core": "^4.0.5",
+		"faker": "^4.1.0",
+		"hoist-non-react-statics": "^2.5.0",
+		"immutability-helper": "^2.8.1",
+		"invariant": "^2.1.0",
+		"lodash": "^4.17.11",
+		"react-dnd": "^5.0.0",
+		"react-dnd-html5-backend": "^5.0.1",
+		"recompose": "^0.27.1",
+		"shallowequal": "^1.1.0",
+		"styled-components": "^4.0.3"
+	},
+	"devDependencies": {
+		"@types/react": "16.3.14",
+		"@types/react-dom": "16.0.9",
+		"npm-run-all": "^4.1.3",
+		"react": "^16.6.0",
+		"rimraf": "^2.6.2",
+		"typescript": "^3.1.6"
+	},
+	"peerDependencies": {
+		"react": ">= 16.3"
+	}
+}
diff --git a/packages/documentation/src/examples/00 Chessboard/Board.tsx b/packages/documentation-examples/src/00 Chessboard/Board.tsx
similarity index 100%
rename from packages/documentation/src/examples/00 Chessboard/Board.tsx
rename to packages/documentation-examples/src/00 Chessboard/Board.tsx
diff --git a/packages/documentation/src/examples/00 Chessboard/BoardSquare.tsx b/packages/documentation-examples/src/00 Chessboard/BoardSquare.tsx
similarity index 55%
rename from packages/documentation/src/examples/00 Chessboard/BoardSquare.tsx
rename to packages/documentation-examples/src/00 Chessboard/BoardSquare.tsx
index 9e93dd8854..210643e128 100644
--- a/packages/documentation/src/examples/00 Chessboard/BoardSquare.tsx	
+++ b/packages/documentation-examples/src/00 Chessboard/BoardSquare.tsx	
@@ -9,13 +9,14 @@ import {
 import Square from './Square'
 import { canMoveKnight, moveKnight } from './Game'
 import ItemTypes from './ItemTypes'
+import Overlay from './Overlay'
 
-export interface CollectedProps {
-	isOver?: boolean
-	canDrop?: boolean
-	connectDropTarget?: ConnectDropTarget
+interface CollectedProps {
+	isOver: boolean
+	canDrop: boolean
+	connectDropTarget: ConnectDropTarget
 }
-export interface BoardSquareProps extends CollectedProps {
+export interface BoardSquareProps {
 	x: number
 	y: number
 	children: any
@@ -42,44 +43,24 @@ const collect: DropTargetCollector<CollectedProps> = (
 	}
 }
 
-class BoardSquare extends React.Component<BoardSquareProps> {
+class BoardSquare extends React.Component<BoardSquareProps & CollectedProps> {
 	public render() {
 		const { x, y, connectDropTarget, isOver, canDrop, children } = this.props
 		const black = (x + y) % 2 === 1
 
-		return (
-			connectDropTarget &&
-			connectDropTarget(
-				<div
-					style={{
-						position: 'relative',
-						width: '100%',
-						height: '100%',
-					}}
-				>
-					<Square black={black}>{children}</Square>
-					{isOver && !canDrop && this.renderOverlay('red')}
-					{!isOver && canDrop && this.renderOverlay('yellow')}
-					{isOver && canDrop && this.renderOverlay('green')}
-				</div>,
-			)
-		)
-	}
-
-	private renderOverlay(color: string) {
-		return (
+		return connectDropTarget(
 			<div
 				style={{
-					position: 'absolute',
-					top: 0,
-					left: 0,
-					height: '100%',
+					position: 'relative',
 					width: '100%',
-					zIndex: 1,
-					opacity: 0.5,
-					backgroundColor: color,
+					height: '100%',
 				}}
-			/>
+			>
+				<Square black={black}>{children}</Square>
+				{isOver && !canDrop && <Overlay color="red" />}
+				{!isOver && canDrop && <Overlay color="yellow" />}
+				{isOver && canDrop && <Overlay color="green" />}
+			</div>,
 		)
 	}
 }
diff --git a/packages/documentation/src/examples/00 Chessboard/Game.ts b/packages/documentation-examples/src/00 Chessboard/Game.ts
similarity index 100%
rename from packages/documentation/src/examples/00 Chessboard/Game.ts
rename to packages/documentation-examples/src/00 Chessboard/Game.ts
diff --git a/packages/documentation/src/examples/00 Chessboard/ItemTypes.ts b/packages/documentation-examples/src/00 Chessboard/ItemTypes.ts
similarity index 100%
rename from packages/documentation/src/examples/00 Chessboard/ItemTypes.ts
rename to packages/documentation-examples/src/00 Chessboard/ItemTypes.ts
diff --git a/packages/documentation/src/examples/00 Chessboard/Knight.tsx b/packages/documentation-examples/src/00 Chessboard/Knight.tsx
similarity index 80%
rename from packages/documentation/src/examples/00 Chessboard/Knight.tsx
rename to packages/documentation-examples/src/00 Chessboard/Knight.tsx
index 63c0676c33..74bb333ae7 100644
--- a/packages/documentation/src/examples/00 Chessboard/Knight.tsx	
+++ b/packages/documentation-examples/src/00 Chessboard/Knight.tsx	
@@ -32,8 +32,8 @@ const collect: DragSourceCollector<KnightProps> = (
 })
 
 export interface KnightProps {
-	connectDragSource?: ConnectDragSource
-	connectDragPreview?: ConnectDragPreview
+	connectDragSource: ConnectDragSource
+	connectDragPreview: ConnectDragPreview
 	isDragging?: boolean
 }
 
@@ -47,18 +47,15 @@ class Knight extends React.Component<KnightProps> {
 
 	public render() {
 		const { connectDragSource, isDragging } = this.props
-		return (
-			connectDragSource &&
-			connectDragSource(
-				<div
-					style={{
-						...knightStyle,
-						opacity: isDragging ? 0.5 : 1,
-					}}
-				>
-					♘
-				</div>,
-			)
+		return connectDragSource(
+			<div
+				style={{
+					...knightStyle,
+					opacity: isDragging ? 0.5 : 1,
+				}}
+			>
+				♘
+			</div>,
 		)
 	}
 }
diff --git a/packages/documentation-examples/src/00 Chessboard/Overlay.tsx b/packages/documentation-examples/src/00 Chessboard/Overlay.tsx
new file mode 100644
index 0000000000..4ed7e9ea89
--- /dev/null
+++ b/packages/documentation-examples/src/00 Chessboard/Overlay.tsx	
@@ -0,0 +1,24 @@
+import * as React from 'react'
+
+export interface OverlayProps {
+	color: string
+}
+
+const Overlay: React.SFC<OverlayProps> = ({ color }) => {
+	return (
+		<div
+			style={{
+				position: 'absolute',
+				top: 0,
+				left: 0,
+				height: '100%',
+				width: '100%',
+				zIndex: 1,
+				opacity: 0.5,
+				backgroundColor: color,
+			}}
+		/>
+	)
+}
+
+export default Overlay
diff --git a/packages/documentation/src/examples/00 Chessboard/Square.tsx b/packages/documentation-examples/src/00 Chessboard/Square.tsx
similarity index 100%
rename from packages/documentation/src/examples/00 Chessboard/Square.tsx
rename to packages/documentation-examples/src/00 Chessboard/Square.tsx
diff --git a/packages/documentation/src/examples/00 Chessboard/index.tsx b/packages/documentation-examples/src/00 Chessboard/index.tsx
similarity index 88%
rename from packages/documentation/src/examples/00 Chessboard/index.tsx
rename to packages/documentation-examples/src/00 Chessboard/index.tsx
index d898496d88..ff09427983 100644
--- a/packages/documentation/src/examples/00 Chessboard/index.tsx	
+++ b/packages/documentation-examples/src/00 Chessboard/index.tsx	
@@ -1,6 +1,5 @@
 // tslint:disable member-ordering
 import * as React from 'react'
-import { Link } from 'gatsby'
 import Board from './Board'
 import { observe } from './Game'
 
@@ -40,7 +39,7 @@ export default class ChessboardTutorialApp extends React.Component<
 				</p>
 				<p>
 					This is a sample app you&apos;ll build as you work through the{' '}
-					<Link to="/docs/tutorial">tutorial</Link>.
+					<a href="/docs/tutorial">tutorial</a>.
 				</p>
 				<p>
 					It illustrates creating the drag sources and the drop targets, using
@@ -57,8 +56,8 @@ export default class ChessboardTutorialApp extends React.Component<
 					<Board knightPosition={knightPosition} />
 				</div>
 				<p>
-					Make sure to check out the <Link to="docs/tutorial">tutorial</Link>{' '}
-					for step-by-step instructions on building it!
+					Make sure to check out the <a href="/docs/tutorial">tutorial</a> for
+					step-by-step instructions on building it!
 				</p>
 			</div>
 		)
diff --git a/packages/documentation/src/examples/00 Chessboard/knightImage.ts b/packages/documentation-examples/src/00 Chessboard/knightImage.ts
similarity index 100%
rename from packages/documentation/src/examples/00 Chessboard/knightImage.ts
rename to packages/documentation-examples/src/00 Chessboard/knightImage.ts
diff --git a/packages/documentation/src/examples/01 Dustbin/Copy or Move/Box.tsx b/packages/documentation-examples/src/01 Dustbin/Copy or Move/Box.tsx
similarity index 86%
rename from packages/documentation/src/examples/01 Dustbin/Copy or Move/Box.tsx
rename to packages/documentation-examples/src/01 Dustbin/Copy or Move/Box.tsx
index fb4921935a..f6451498a3 100644
--- a/packages/documentation/src/examples/01 Dustbin/Copy or Move/Box.tsx	
+++ b/packages/documentation-examples/src/01 Dustbin/Copy or Move/Box.tsx	
@@ -49,20 +49,20 @@ const boxSource = {
 
 export interface BoxProps {
 	name: string
-	isDragging?: boolean
-	connectDragSource?: ConnectDragSource
 }
 
-class Box extends React.Component<BoxProps> {
+interface BoxCollectedProps {
+	isDragging: boolean
+	connectDragSource: ConnectDragSource
+}
+
+class Box extends React.Component<BoxProps & BoxCollectedProps> {
 	public render() {
 		const { isDragging, connectDragSource } = this.props
 		const { name } = this.props
 		const opacity = isDragging ? 0.4 : 1
 
-		return (
-			connectDragSource &&
-			connectDragSource(<div style={{ ...style, opacity }}>{name}</div>)
-		)
+		return connectDragSource(<div style={{ ...style, opacity }}>{name}</div>)
 	}
 }
 
diff --git a/packages/documentation/src/examples/01 Dustbin/Copy or Move/Container.tsx b/packages/documentation-examples/src/01 Dustbin/Copy or Move/Container.tsx
similarity index 100%
rename from packages/documentation/src/examples/01 Dustbin/Copy or Move/Container.tsx
rename to packages/documentation-examples/src/01 Dustbin/Copy or Move/Container.tsx
diff --git a/packages/documentation/src/examples/01 Dustbin/Copy or Move/Dustbin.tsx b/packages/documentation-examples/src/01 Dustbin/Copy or Move/Dustbin.tsx
similarity index 72%
rename from packages/documentation/src/examples/01 Dustbin/Copy or Move/Dustbin.tsx
rename to packages/documentation-examples/src/01 Dustbin/Copy or Move/Dustbin.tsx
index 2eab4bd5d3..8e1df14118 100644
--- a/packages/documentation/src/examples/01 Dustbin/Copy or Move/Dustbin.tsx	
+++ b/packages/documentation-examples/src/01 Dustbin/Copy or Move/Dustbin.tsx	
@@ -25,13 +25,16 @@ const boxTarget = {
 }
 
 export interface DustbinProps {
-	connectDropTarget?: ConnectDropTarget
-	canDrop?: boolean
-	isOver?: boolean
 	allowedDropEffect: string
 }
 
-class Dustbin extends React.Component<DustbinProps> {
+interface DustbinCollectedProps {
+	connectDropTarget: ConnectDropTarget
+	canDrop: boolean
+	isOver: boolean
+}
+
+class Dustbin extends React.Component<DustbinProps & DustbinCollectedProps> {
 	public render() {
 		const { canDrop, isOver, allowedDropEffect, connectDropTarget } = this.props
 		const isActive = canDrop && isOver
@@ -43,16 +46,13 @@ class Dustbin extends React.Component<DustbinProps> {
 			backgroundColor = 'darkkhaki'
 		}
 
-		return (
-			connectDropTarget &&
-			connectDropTarget(
-				<div style={{ ...style, backgroundColor }}>
-					{`Works with ${allowedDropEffect} drop effect`}
-					<br />
-					<br />
-					{isActive ? 'Release to drop' : 'Drag a box here'}
-				</div>,
-			)
+		return connectDropTarget(
+			<div style={{ ...style, backgroundColor }}>
+				{`Works with ${allowedDropEffect} drop effect`}
+				<br />
+				<br />
+				{isActive ? 'Release to drop' : 'Drag a box here'}
+			</div>,
 		)
 	}
 }
diff --git a/packages/documentation/src/examples/01 Dustbin/Copy or Move/index.tsx b/packages/documentation-examples/src/01 Dustbin/Copy or Move/index.tsx
similarity index 100%
rename from packages/documentation/src/examples/01 Dustbin/Copy or Move/index.tsx
rename to packages/documentation-examples/src/01 Dustbin/Copy or Move/index.tsx
diff --git a/packages/documentation/src/examples/01 Dustbin/Multiple Targets/Box.tsx b/packages/documentation-examples/src/01 Dustbin/Multiple Targets/Box.tsx
similarity index 70%
rename from packages/documentation/src/examples/01 Dustbin/Multiple Targets/Box.tsx
rename to packages/documentation-examples/src/01 Dustbin/Multiple Targets/Box.tsx
index 7094389708..28af11f9c3 100644
--- a/packages/documentation/src/examples/01 Dustbin/Multiple Targets/Box.tsx	
+++ b/packages/documentation-examples/src/01 Dustbin/Multiple Targets/Box.tsx	
@@ -27,28 +27,28 @@ const boxSource = {
 export interface BoxProps {
 	name: string
 	type: string
-	connectDragSource?: ConnectDragSource
-	isDragging?: boolean
-	isDropped?: boolean
+	isDropped: boolean
 }
 
-class Box extends React.Component<BoxProps> {
+interface BoxCollectedProps {
+	connectDragSource: ConnectDragSource
+	isDragging: boolean
+}
+
+class Box extends React.Component<BoxProps & BoxCollectedProps> {
 	public render() {
 		const { name, isDropped, isDragging, connectDragSource } = this.props
 		const opacity = isDragging ? 0.4 : 1
 
-		return (
-			connectDragSource &&
-			connectDragSource(
-				<div style={{ ...style, opacity }}>
-					{isDropped ? <s>{name}</s> : name}
-				</div>,
-			)
+		return connectDragSource(
+			<div style={{ ...style, opacity }}>
+				{isDropped ? <s>{name}</s> : name}
+			</div>,
 		)
 	}
 }
 
-export default DragSource(
+export default DragSource<BoxProps, BoxCollectedProps>(
 	(props: BoxProps) => props.type,
 	boxSource,
 	(connect: DragSourceConnector, monitor: DragSourceMonitor) => ({
diff --git a/packages/documentation/src/examples/01 Dustbin/Multiple Targets/Container.tsx b/packages/documentation-examples/src/01 Dustbin/Multiple Targets/Container.tsx
similarity index 100%
rename from packages/documentation/src/examples/01 Dustbin/Multiple Targets/Container.tsx
rename to packages/documentation-examples/src/01 Dustbin/Multiple Targets/Container.tsx
diff --git a/packages/documentation/src/examples/01 Dustbin/Multiple Targets/Dustbin.tsx b/packages/documentation-examples/src/01 Dustbin/Multiple Targets/Dustbin.tsx
similarity index 67%
rename from packages/documentation/src/examples/01 Dustbin/Multiple Targets/Dustbin.tsx
rename to packages/documentation-examples/src/01 Dustbin/Multiple Targets/Dustbin.tsx
index dbde2e4940..c55bad45cc 100644
--- a/packages/documentation/src/examples/01 Dustbin/Multiple Targets/Dustbin.tsx	
+++ b/packages/documentation-examples/src/01 Dustbin/Multiple Targets/Dustbin.tsx	
@@ -22,14 +22,17 @@ const dustbinTarget = {
 
 export interface DustbinProps {
 	accepts: string[]
-	canDrop?: boolean
 	lastDroppedItem?: any
-	isOver?: boolean
-	connectDropTarget?: ConnectDropTarget
 	onDrop: (item: any) => void
 }
 
-class Dustbin extends React.Component<DustbinProps> {
+export interface DustbinCollectedProps {
+	canDrop: boolean
+	isOver: boolean
+	connectDropTarget: ConnectDropTarget
+}
+
+class Dustbin extends React.Component<DustbinProps & DustbinCollectedProps> {
 	public render() {
 		const {
 			accepts,
@@ -47,24 +50,21 @@ class Dustbin extends React.Component<DustbinProps> {
 			backgroundColor = 'darkkhaki'
 		}
 
-		return (
-			connectDropTarget &&
-			connectDropTarget(
-				<div style={{ ...style, backgroundColor }}>
-					{isActive
-						? 'Release to drop'
-						: `This dustbin accepts: ${accepts.join(', ')}`}
+		return connectDropTarget(
+			<div style={{ ...style, backgroundColor }}>
+				{isActive
+					? 'Release to drop'
+					: `This dustbin accepts: ${accepts.join(', ')}`}
 
-					{lastDroppedItem && (
-						<p>Last dropped: {JSON.stringify(lastDroppedItem)}</p>
-					)}
-				</div>,
-			)
+				{lastDroppedItem && (
+					<p>Last dropped: {JSON.stringify(lastDroppedItem)}</p>
+				)}
+			</div>,
 		)
 	}
 }
 
-export default DropTarget(
+export default DropTarget<DustbinProps, DustbinCollectedProps>(
 	(props: DustbinProps) => props.accepts,
 	dustbinTarget,
 	(connect, monitor) => ({
diff --git a/packages/documentation/src/examples/01 Dustbin/Multiple Targets/ItemTypes.ts b/packages/documentation-examples/src/01 Dustbin/Multiple Targets/ItemTypes.ts
similarity index 100%
rename from packages/documentation/src/examples/01 Dustbin/Multiple Targets/ItemTypes.ts
rename to packages/documentation-examples/src/01 Dustbin/Multiple Targets/ItemTypes.ts
diff --git a/packages/documentation/src/examples/01 Dustbin/Multiple Targets/index.tsx b/packages/documentation-examples/src/01 Dustbin/Multiple Targets/index.tsx
similarity index 100%
rename from packages/documentation/src/examples/01 Dustbin/Multiple Targets/index.tsx
rename to packages/documentation-examples/src/01 Dustbin/Multiple Targets/index.tsx
diff --git a/packages/documentation/src/examples/01 Dustbin/Single Target in iframe/Container.tsx b/packages/documentation-examples/src/01 Dustbin/Single Target in iframe/Container.tsx
similarity index 100%
rename from packages/documentation/src/examples/01 Dustbin/Single Target in iframe/Container.tsx
rename to packages/documentation-examples/src/01 Dustbin/Single Target in iframe/Container.tsx
diff --git a/packages/documentation/src/examples/01 Dustbin/Single Target in iframe/index.tsx b/packages/documentation-examples/src/01 Dustbin/Single Target in iframe/index.tsx
similarity index 100%
rename from packages/documentation/src/examples/01 Dustbin/Single Target in iframe/index.tsx
rename to packages/documentation-examples/src/01 Dustbin/Single Target in iframe/index.tsx
diff --git a/packages/documentation/src/examples/01 Dustbin/Single Target with FCs/Box.tsx b/packages/documentation-examples/src/01 Dustbin/Single Target with FCs/Box.tsx
similarity index 85%
rename from packages/documentation/src/examples/01 Dustbin/Single Target with FCs/Box.tsx
rename to packages/documentation-examples/src/01 Dustbin/Single Target with FCs/Box.tsx
index db71577c12..cb23be4a00 100644
--- a/packages/documentation/src/examples/01 Dustbin/Single Target with FCs/Box.tsx	
+++ b/packages/documentation-examples/src/01 Dustbin/Single Target with FCs/Box.tsx	
@@ -19,18 +19,25 @@ const style: React.CSSProperties = {
 
 export interface BoxProps {
 	name: string
+}
+
+interface BoxCollectedProps {
 	isDragging?: boolean
 	connectDragSource?: ConnectDragSource
 }
 
-const Box: React.SFC<BoxProps> = ({ isDragging, connectDragSource, name }) => {
+const Box: React.SFC<BoxProps & BoxCollectedProps> = ({
+	isDragging,
+	connectDragSource,
+	name,
+}) => {
 	const opacity = isDragging ? 0.4 : 1
 	return connectDragSource
 		? connectDragSource(<div style={{ ...style, opacity }}>{name}</div>)
 		: null
 }
 
-export default DragSource(
+export default DragSource<BoxProps, BoxCollectedProps>(
 	ItemTypes.BOX,
 	{
 		beginDrag(props: BoxProps) {
diff --git a/packages/documentation/src/examples/01 Dustbin/Single Target with FCs/Container.tsx b/packages/documentation-examples/src/01 Dustbin/Single Target with FCs/Container.tsx
similarity index 100%
rename from packages/documentation/src/examples/01 Dustbin/Single Target with FCs/Container.tsx
rename to packages/documentation-examples/src/01 Dustbin/Single Target with FCs/Container.tsx
diff --git a/packages/documentation/src/examples/01 Dustbin/Single Target with FCs/Dustbin.tsx b/packages/documentation-examples/src/01 Dustbin/Single Target with FCs/Dustbin.tsx
similarity index 89%
rename from packages/documentation/src/examples/01 Dustbin/Single Target with FCs/Dustbin.tsx
rename to packages/documentation-examples/src/01 Dustbin/Single Target with FCs/Dustbin.tsx
index 414cbf1e15..15b323a7cc 100644
--- a/packages/documentation/src/examples/01 Dustbin/Single Target with FCs/Dustbin.tsx	
+++ b/packages/documentation-examples/src/01 Dustbin/Single Target with FCs/Dustbin.tsx	
@@ -20,13 +20,13 @@ const style: React.CSSProperties = {
 	float: 'left',
 }
 
-export interface DustbinProps {
+interface DustbinCollectedProps {
 	canDrop?: boolean
 	isOver?: boolean
 	connectDropTarget?: ConnectDropTarget
 }
 
-const Dustbin: React.SFC<DustbinProps> = ({
+const Dustbin: React.SFC<DustbinCollectedProps> = ({
 	canDrop,
 	isOver,
 	connectDropTarget,
@@ -49,7 +49,7 @@ const Dustbin: React.SFC<DustbinProps> = ({
 		: null
 }
 
-export default DropTarget(
+export default DropTarget<{}, DustbinCollectedProps>(
 	ItemTypes.BOX,
 	{
 		drop() {
diff --git a/packages/documentation/src/examples/01 Dustbin/Single Target with FCs/index.tsx b/packages/documentation-examples/src/01 Dustbin/Single Target with FCs/index.tsx
similarity index 100%
rename from packages/documentation/src/examples/01 Dustbin/Single Target with FCs/index.tsx
rename to packages/documentation-examples/src/01 Dustbin/Single Target with FCs/index.tsx
diff --git a/packages/documentation/src/examples/01 Dustbin/Single Target/Box.tsx b/packages/documentation-examples/src/01 Dustbin/Single Target/Box.tsx
similarity index 80%
rename from packages/documentation/src/examples/01 Dustbin/Single Target/Box.tsx
rename to packages/documentation-examples/src/01 Dustbin/Single Target/Box.tsx
index cc27d7b203..4b8ed6e3f5 100644
--- a/packages/documentation/src/examples/01 Dustbin/Single Target/Box.tsx	
+++ b/packages/documentation-examples/src/01 Dustbin/Single Target/Box.tsx	
@@ -17,10 +17,13 @@ const style: React.CSSProperties = {
 	float: 'left',
 }
 
-export interface BoxProps {
+interface BoxProps {
 	name: string
-	isDragging?: boolean
-	connectDragSource?: ConnectDragSource
+}
+
+interface BoxCollectedProps {
+	isDragging: boolean
+	connectDragSource: ConnectDragSource
 }
 
 const boxSource = {
@@ -40,16 +43,13 @@ const boxSource = {
 	},
 }
 
-class Box extends React.Component<BoxProps> {
+class Box extends React.Component<BoxProps & BoxCollectedProps> {
 	public render() {
 		const { isDragging, connectDragSource } = this.props
 		const { name } = this.props
 		const opacity = isDragging ? 0.4 : 1
 
-		return (
-			connectDragSource &&
-			connectDragSource(<div style={{ ...style, opacity }}>{name}</div>)
-		)
+		return connectDragSource(<div style={{ ...style, opacity }}>{name}</div>)
 	}
 }
 
diff --git a/packages/documentation/src/examples/01 Dustbin/Single Target/Container.tsx b/packages/documentation-examples/src/01 Dustbin/Single Target/Container.tsx
similarity index 100%
rename from packages/documentation/src/examples/01 Dustbin/Single Target/Container.tsx
rename to packages/documentation-examples/src/01 Dustbin/Single Target/Container.tsx
diff --git a/packages/documentation/src/examples/01 Dustbin/Single Target/Dustbin.tsx b/packages/documentation-examples/src/01 Dustbin/Single Target/Dustbin.tsx
similarity index 80%
rename from packages/documentation/src/examples/01 Dustbin/Single Target/Dustbin.tsx
rename to packages/documentation-examples/src/01 Dustbin/Single Target/Dustbin.tsx
index 9b7ab96d30..325aa03d8f 100644
--- a/packages/documentation/src/examples/01 Dustbin/Single Target/Dustbin.tsx	
+++ b/packages/documentation-examples/src/01 Dustbin/Single Target/Dustbin.tsx	
@@ -27,9 +27,9 @@ const boxTarget = {
 }
 
 export interface DustbinProps {
-	canDrop?: boolean
-	isOver?: boolean
-	connectDropTarget?: ConnectDropTarget
+	canDrop: boolean
+	isOver: boolean
+	connectDropTarget: ConnectDropTarget
 }
 
 class Dustbin extends React.Component<DustbinProps> {
@@ -44,13 +44,10 @@ class Dustbin extends React.Component<DustbinProps> {
 			backgroundColor = 'darkkhaki'
 		}
 
-		return (
-			connectDropTarget &&
-			connectDropTarget(
-				<div style={{ ...style, backgroundColor }}>
-					{isActive ? 'Release to drop' : 'Drag a box here'}
-				</div>,
-			)
+		return connectDropTarget(
+			<div style={{ ...style, backgroundColor }}>
+				{isActive ? 'Release to drop' : 'Drag a box here'}
+			</div>,
 		)
 	}
 }
diff --git a/packages/documentation/src/examples/01 Dustbin/Single Target/ItemTypes.ts b/packages/documentation-examples/src/01 Dustbin/Single Target/ItemTypes.ts
similarity index 100%
rename from packages/documentation/src/examples/01 Dustbin/Single Target/ItemTypes.ts
rename to packages/documentation-examples/src/01 Dustbin/Single Target/ItemTypes.ts
diff --git a/packages/documentation/src/examples/01 Dustbin/Single Target/__tests__/Box.spec.tsx b/packages/documentation-examples/src/01 Dustbin/Single Target/__tests__/Box.spec.tsx
similarity index 100%
rename from packages/documentation/src/examples/01 Dustbin/Single Target/__tests__/Box.spec.tsx
rename to packages/documentation-examples/src/01 Dustbin/Single Target/__tests__/Box.spec.tsx
diff --git a/packages/documentation/src/examples/01 Dustbin/Single Target/__tests__/integration.spec.tsx b/packages/documentation-examples/src/01 Dustbin/Single Target/__tests__/integration.spec.tsx
similarity index 100%
rename from packages/documentation/src/examples/01 Dustbin/Single Target/__tests__/integration.spec.tsx
rename to packages/documentation-examples/src/01 Dustbin/Single Target/__tests__/integration.spec.tsx
diff --git a/packages/documentation/src/examples/01 Dustbin/Single Target/index.tsx b/packages/documentation-examples/src/01 Dustbin/Single Target/index.tsx
similarity index 100%
rename from packages/documentation/src/examples/01 Dustbin/Single Target/index.tsx
rename to packages/documentation-examples/src/01 Dustbin/Single Target/index.tsx
diff --git a/packages/documentation/src/examples/01 Dustbin/Stress Test/Box.tsx b/packages/documentation-examples/src/01 Dustbin/Stress Test/Box.tsx
similarity index 73%
rename from packages/documentation/src/examples/01 Dustbin/Stress Test/Box.tsx
rename to packages/documentation-examples/src/01 Dustbin/Stress Test/Box.tsx
index b29646c21d..006759fc3d 100644
--- a/packages/documentation/src/examples/01 Dustbin/Stress Test/Box.tsx	
+++ b/packages/documentation-examples/src/01 Dustbin/Stress Test/Box.tsx	
@@ -32,28 +32,27 @@ const boxSource = {
 export interface BoxProps {
 	name: string
 	type: string
-	isDropped?: boolean
-	isDragging?: boolean
-	connectDragSource?: ConnectDragSource
+	isDropped: boolean
 }
 
-class Box extends React.Component<BoxProps> {
+interface BoxCollectedProps {
+	isDragging: boolean
+	connectDragSource: ConnectDragSource
+}
+class Box extends React.Component<BoxProps & BoxCollectedProps> {
 	public render() {
 		const { name, isDropped, isDragging, connectDragSource } = this.props
 		const opacity = isDragging ? 0.4 : 1
 
-		return (
-			connectDragSource &&
-			connectDragSource(
-				<div style={{ ...style, opacity }}>
-					{isDropped ? <s>{name}</s> : name}
-				</div>,
-			)
+		return connectDragSource(
+			<div style={{ ...style, opacity }}>
+				{isDropped ? <s>{name}</s> : name}
+			</div>,
 		)
 	}
 }
 
-export default DragSource(
+export default DragSource<BoxProps, BoxCollectedProps>(
 	(props: BoxProps) => props.type,
 	boxSource,
 	(connect: DragSourceConnector, monitor: DragSourceMonitor) => ({
diff --git a/packages/documentation/src/examples/01 Dustbin/Stress Test/Container.tsx b/packages/documentation-examples/src/01 Dustbin/Stress Test/Container.tsx
similarity index 100%
rename from packages/documentation/src/examples/01 Dustbin/Stress Test/Container.tsx
rename to packages/documentation-examples/src/01 Dustbin/Stress Test/Container.tsx
diff --git a/packages/documentation/src/examples/01 Dustbin/Stress Test/Dustbin.tsx b/packages/documentation-examples/src/01 Dustbin/Stress Test/Dustbin.tsx
similarity index 72%
rename from packages/documentation/src/examples/01 Dustbin/Stress Test/Dustbin.tsx
rename to packages/documentation-examples/src/01 Dustbin/Stress Test/Dustbin.tsx
index e20b1017db..cde4ab12a9 100644
--- a/packages/documentation/src/examples/01 Dustbin/Stress Test/Dustbin.tsx	
+++ b/packages/documentation-examples/src/01 Dustbin/Stress Test/Dustbin.tsx	
@@ -26,15 +26,18 @@ const dustbinTarget = {
 }
 
 export interface DustbinProps {
-	connectDropTarget?: ConnectDropTarget
-	isOver?: boolean
-	canDrop?: boolean
 	lastDroppedItem?: any
 	accepts: string[]
 	onDrop: (arg: any) => void
 }
 
-class Dustbin extends React.Component<DustbinProps> {
+interface DustbinCollectedProps {
+	connectDropTarget: ConnectDropTarget
+	isOver: boolean
+	canDrop: boolean
+}
+
+class Dustbin extends React.Component<DustbinProps & DustbinCollectedProps> {
 	public render() {
 		const {
 			accepts,
@@ -52,19 +55,16 @@ class Dustbin extends React.Component<DustbinProps> {
 			backgroundColor = 'darkkhaki'
 		}
 
-		return (
-			connectDropTarget &&
-			connectDropTarget(
-				<div style={{ ...style, backgroundColor }}>
-					{isActive
-						? 'Release to drop'
-						: `This dustbin accepts: ${accepts.join(', ')}`}
+		return connectDropTarget(
+			<div style={{ ...style, backgroundColor }}>
+				{isActive
+					? 'Release to drop'
+					: `This dustbin accepts: ${accepts.join(', ')}`}
 
-					{lastDroppedItem && (
-						<p>Last dropped: {JSON.stringify(lastDroppedItem)}</p>
-					)}
-				</div>,
-			)
+				{lastDroppedItem && (
+					<p>Last dropped: {JSON.stringify(lastDroppedItem)}</p>
+				)}
+			</div>,
 		)
 	}
 }
diff --git a/packages/documentation/src/examples/01 Dustbin/Stress Test/ItemTypes.ts b/packages/documentation-examples/src/01 Dustbin/Stress Test/ItemTypes.ts
similarity index 100%
rename from packages/documentation/src/examples/01 Dustbin/Stress Test/ItemTypes.ts
rename to packages/documentation-examples/src/01 Dustbin/Stress Test/ItemTypes.ts
diff --git a/packages/documentation/src/examples/01 Dustbin/Stress Test/index.tsx b/packages/documentation-examples/src/01 Dustbin/Stress Test/index.tsx
similarity index 100%
rename from packages/documentation/src/examples/01 Dustbin/Stress Test/index.tsx
rename to packages/documentation-examples/src/01 Dustbin/Stress Test/index.tsx
diff --git a/packages/documentation/src/examples/02 Drag Around/Custom Drag Layer/Box.tsx b/packages/documentation-examples/src/02 Drag Around/Custom Drag Layer/Box.tsx
similarity index 100%
rename from packages/documentation/src/examples/02 Drag Around/Custom Drag Layer/Box.tsx
rename to packages/documentation-examples/src/02 Drag Around/Custom Drag Layer/Box.tsx
diff --git a/packages/documentation/src/examples/02 Drag Around/Custom Drag Layer/BoxDragPreview.tsx b/packages/documentation-examples/src/02 Drag Around/Custom Drag Layer/BoxDragPreview.tsx
similarity index 100%
rename from packages/documentation/src/examples/02 Drag Around/Custom Drag Layer/BoxDragPreview.tsx
rename to packages/documentation-examples/src/02 Drag Around/Custom Drag Layer/BoxDragPreview.tsx
diff --git a/packages/documentation/src/examples/02 Drag Around/Custom Drag Layer/Container.tsx b/packages/documentation-examples/src/02 Drag Around/Custom Drag Layer/Container.tsx
similarity index 76%
rename from packages/documentation/src/examples/02 Drag Around/Custom Drag Layer/Container.tsx
rename to packages/documentation-examples/src/02 Drag Around/Custom Drag Layer/Container.tsx
index 4c4a0417f7..63f6b04d39 100644
--- a/packages/documentation/src/examples/02 Drag Around/Custom Drag Layer/Container.tsx	
+++ b/packages/documentation-examples/src/02 Drag Around/Custom Drag Layer/Container.tsx	
@@ -44,35 +44,35 @@ const boxTarget = {
 
 export interface ContainerProps {
 	snapToGrid: boolean
-	connectDropTarget?: ConnectDropTarget
+}
+
+interface ContainerCollectedProps {
+	connectDropTarget: ConnectDropTarget
 }
 
 export interface ContainerState {
 	boxes: { [key: string]: { top: number; left: number; title: string } }
 }
 
-class Container extends React.PureComponent<ContainerProps, ContainerState> {
-	constructor(props: ContainerProps) {
-		super(props)
-		this.state = {
-			boxes: {
-				a: { top: 20, left: 80, title: 'Drag me around' },
-				b: { top: 180, left: 20, title: 'Drag me too' },
-			},
-		}
+class Container extends React.PureComponent<
+	ContainerProps & ContainerCollectedProps,
+	ContainerState
+> {
+	public state: ContainerState = {
+		boxes: {
+			a: { top: 20, left: 80, title: 'Drag me around' },
+			b: { top: 180, left: 20, title: 'Drag me too' },
+		},
 	}
 
 	public render() {
 		const { connectDropTarget } = this.props
 		const { boxes } = this.state
 
-		return (
-			connectDropTarget &&
-			connectDropTarget(
-				<div style={styles}>
-					{Object.keys(boxes).map(key => this.renderBox(boxes[key], key))}
-				</div>,
-			)
+		return connectDropTarget(
+			<div style={styles}>
+				{Object.keys(boxes).map(key => this.renderBox(boxes[key], key))}
+			</div>,
 		)
 	}
 
diff --git a/packages/documentation/src/examples/02 Drag Around/Custom Drag Layer/CustomDragLayer.tsx b/packages/documentation-examples/src/02 Drag Around/Custom Drag Layer/CustomDragLayer.tsx
similarity index 100%
rename from packages/documentation/src/examples/02 Drag Around/Custom Drag Layer/CustomDragLayer.tsx
rename to packages/documentation-examples/src/02 Drag Around/Custom Drag Layer/CustomDragLayer.tsx
diff --git a/packages/documentation/src/examples/02 Drag Around/Custom Drag Layer/DraggableBox.tsx b/packages/documentation-examples/src/02 Drag Around/Custom Drag Layer/DraggableBox.tsx
similarity index 87%
rename from packages/documentation/src/examples/02 Drag Around/Custom Drag Layer/DraggableBox.tsx
rename to packages/documentation-examples/src/02 Drag Around/Custom Drag Layer/DraggableBox.tsx
index 736f539774..beb7505068 100644
--- a/packages/documentation/src/examples/02 Drag Around/Custom Drag Layer/DraggableBox.tsx	
+++ b/packages/documentation-examples/src/02 Drag Around/Custom Drag Layer/DraggableBox.tsx	
@@ -27,9 +27,9 @@ function getStyles(props: DraggableBoxProps): React.CSSProperties {
 }
 
 export interface DraggableBoxProps {
-	connectDragSource?: ConnectDragSource
-	connectDragPreview?: ConnectDragPreview
-	isDragging?: boolean
+	connectDragSource: ConnectDragSource
+	connectDragPreview: ConnectDragPreview
+	isDragging: boolean
 	id: string
 	title: string
 	left: number
@@ -53,13 +53,10 @@ class DraggableBox extends React.PureComponent<DraggableBoxProps> {
 	public render() {
 		const { title, connectDragSource } = this.props
 
-		return (
-			connectDragSource &&
-			connectDragSource(
-				<div style={getStyles(this.props)}>
-					<Box title={title} />
-				</div>,
-			)
+		return connectDragSource(
+			<div style={getStyles(this.props)}>
+				<Box title={title} />
+			</div>,
 		)
 	}
 }
diff --git a/packages/documentation/src/examples/02 Drag Around/Custom Drag Layer/ItemTypes.ts b/packages/documentation-examples/src/02 Drag Around/Custom Drag Layer/ItemTypes.ts
similarity index 100%
rename from packages/documentation/src/examples/02 Drag Around/Custom Drag Layer/ItemTypes.ts
rename to packages/documentation-examples/src/02 Drag Around/Custom Drag Layer/ItemTypes.ts
diff --git a/packages/documentation/src/examples/02 Drag Around/Custom Drag Layer/index.tsx b/packages/documentation-examples/src/02 Drag Around/Custom Drag Layer/index.tsx
similarity index 100%
rename from packages/documentation/src/examples/02 Drag Around/Custom Drag Layer/index.tsx
rename to packages/documentation-examples/src/02 Drag Around/Custom Drag Layer/index.tsx
diff --git a/packages/documentation/src/examples/02 Drag Around/Custom Drag Layer/snapToGrid.ts b/packages/documentation-examples/src/02 Drag Around/Custom Drag Layer/snapToGrid.ts
similarity index 100%
rename from packages/documentation/src/examples/02 Drag Around/Custom Drag Layer/snapToGrid.ts
rename to packages/documentation-examples/src/02 Drag Around/Custom Drag Layer/snapToGrid.ts
diff --git a/packages/documentation/src/examples/02 Drag Around/Naive/Box.tsx b/packages/documentation-examples/src/02 Drag Around/Naive/Box.tsx
similarity index 57%
rename from packages/documentation/src/examples/02 Drag Around/Naive/Box.tsx
rename to packages/documentation-examples/src/02 Drag Around/Naive/Box.tsx
index e4a27563ed..7e1204cdfe 100644
--- a/packages/documentation/src/examples/02 Drag Around/Naive/Box.tsx	
+++ b/packages/documentation-examples/src/02 Drag Around/Naive/Box.tsx	
@@ -18,15 +18,18 @@ const boxSource = {
 }
 
 export interface BoxProps {
-	connectDragSource?: ConnectDragSource
+	id: any
+	left: number
+	top: number
+	hideSourceOnDrag?: boolean
+}
+
+interface BoxCollectedProps {
+	connectDragSource: ConnectDragSource
 	isDragging?: boolean
-	id?: any
-	left?: number
-	top?: number
-	hideSourceOnDrag?: any
 }
 
-class Box extends React.Component<BoxProps> {
+class Box extends React.Component<BoxProps & BoxCollectedProps> {
 	public render() {
 		const {
 			hideSourceOnDrag,
@@ -40,14 +43,17 @@ class Box extends React.Component<BoxProps> {
 			return null
 		}
 
-		return (
-			connectDragSource &&
-			connectDragSource(<div style={{ ...style, left, top }}>{children}</div>)
+		return connectDragSource(
+			<div style={{ ...style, left, top }}>{children}</div>,
 		)
 	}
 }
 
-export default DragSource(ItemTypes.BOX, boxSource, (connect, monitor) => ({
-	connectDragSource: connect.dragSource(),
-	isDragging: monitor.isDragging(),
-}))(Box)
+export default DragSource<BoxProps, BoxCollectedProps>(
+	ItemTypes.BOX,
+	boxSource,
+	(connect, monitor) => ({
+		connectDragSource: connect.dragSource(),
+		isDragging: monitor.isDragging(),
+	}),
+)(Box)
diff --git a/packages/documentation/src/examples/02 Drag Around/Naive/Container.tsx b/packages/documentation-examples/src/02 Drag Around/Naive/Container.tsx
similarity index 66%
rename from packages/documentation/src/examples/02 Drag Around/Naive/Container.tsx
rename to packages/documentation-examples/src/02 Drag Around/Naive/Container.tsx
index cc41fafc5a..b0e6b698d1 100644
--- a/packages/documentation/src/examples/02 Drag Around/Naive/Container.tsx	
+++ b/packages/documentation-examples/src/02 Drag Around/Naive/Container.tsx	
@@ -36,48 +36,48 @@ const boxTarget = {
 
 export interface ContainerProps {
 	hideSourceOnDrag: boolean
-	connectDropTarget?: ConnectDropTarget
+}
+
+interface ContainerCollectedProps {
+	connectDropTarget: ConnectDropTarget
 }
 
 export interface ContainerState {
 	boxes: { [key: string]: { top: number; left: number; title: string } }
 }
 
-class Container extends React.Component<ContainerProps, ContainerState> {
-	constructor(props: ContainerProps) {
-		super(props)
-		this.state = {
-			boxes: {
-				a: { top: 20, left: 80, title: 'Drag me around' },
-				b: { top: 180, left: 20, title: 'Drag me too' },
-			},
-		}
+class Container extends React.Component<
+	ContainerProps & ContainerCollectedProps,
+	ContainerState
+> {
+	public state: ContainerState = {
+		boxes: {
+			a: { top: 20, left: 80, title: 'Drag me around' },
+			b: { top: 180, left: 20, title: 'Drag me too' },
+		},
 	}
 
 	public render() {
 		const { hideSourceOnDrag, connectDropTarget } = this.props
 		const { boxes } = this.state
 
-		return (
-			connectDropTarget &&
-			connectDropTarget(
-				<div style={styles}>
-					{Object.keys(boxes).map(key => {
-						const { left, top, title } = boxes[key]
-						return (
-							<Box
-								key={key}
-								id={key}
-								left={left}
-								top={top}
-								hideSourceOnDrag={hideSourceOnDrag}
-							>
-								{title}
-							</Box>
-						)
-					})}
-				</div>,
-			)
+		return connectDropTarget(
+			<div style={styles}>
+				{Object.keys(boxes).map(key => {
+					const { left, top, title } = boxes[key]
+					return (
+						<Box
+							key={key}
+							id={key}
+							left={left}
+							top={top}
+							hideSourceOnDrag={hideSourceOnDrag}
+						>
+							{title}
+						</Box>
+					)
+				})}
+			</div>,
 		)
 	}
 
diff --git a/packages/documentation/src/examples/02 Drag Around/Naive/ItemTypes.ts b/packages/documentation-examples/src/02 Drag Around/Naive/ItemTypes.ts
similarity index 100%
rename from packages/documentation/src/examples/02 Drag Around/Naive/ItemTypes.ts
rename to packages/documentation-examples/src/02 Drag Around/Naive/ItemTypes.ts
diff --git a/packages/documentation/src/examples/02 Drag Around/Naive/index.tsx b/packages/documentation-examples/src/02 Drag Around/Naive/index.tsx
similarity index 100%
rename from packages/documentation/src/examples/02 Drag Around/Naive/index.tsx
rename to packages/documentation-examples/src/02 Drag Around/Naive/index.tsx
diff --git a/packages/documentation/src/examples/03 Nesting/Drag Sources/Colors.ts b/packages/documentation-examples/src/03 Nesting/Drag Sources/Colors.ts
similarity index 100%
rename from packages/documentation/src/examples/03 Nesting/Drag Sources/Colors.ts
rename to packages/documentation-examples/src/03 Nesting/Drag Sources/Colors.ts
diff --git a/packages/documentation/src/examples/03 Nesting/Drag Sources/Container.tsx b/packages/documentation-examples/src/03 Nesting/Drag Sources/Container.tsx
similarity index 100%
rename from packages/documentation/src/examples/03 Nesting/Drag Sources/Container.tsx
rename to packages/documentation-examples/src/03 Nesting/Drag Sources/Container.tsx
diff --git a/packages/documentation/src/examples/03 Nesting/Drag Sources/SourceBox.tsx b/packages/documentation-examples/src/03 Nesting/Drag Sources/SourceBox.tsx
similarity index 76%
rename from packages/documentation/src/examples/03 Nesting/Drag Sources/SourceBox.tsx
rename to packages/documentation-examples/src/03 Nesting/Drag Sources/SourceBox.tsx
index b7a8ae89f8..a0fa33ada4 100644
--- a/packages/documentation/src/examples/03 Nesting/Drag Sources/SourceBox.tsx	
+++ b/packages/documentation-examples/src/03 Nesting/Drag Sources/SourceBox.tsx	
@@ -7,6 +7,7 @@ import {
 	DragSourceConnector,
 } from 'react-dnd'
 import Colors from './Colors'
+import { SourceBox } from '../../01 Dustbin/Stress Test/Container'
 
 const style: React.CSSProperties = {
 	border: '1px dashed gray',
@@ -25,14 +26,19 @@ const ColorSource = {
 }
 
 export interface SourceBoxProps {
-	connectDragSource?: ConnectDragSource
-	isDragging?: boolean
 	color?: string
 	forbidDrag?: boolean
 	onToggleForbidDrag?: () => void
 }
 
-class SourceBoxRaw extends React.Component<SourceBoxProps> {
+interface SourceBoxCollectedProps {
+	connectDragSource: ConnectDragSource
+	isDragging: boolean
+}
+
+class SourceBoxRaw extends React.Component<
+	SourceBoxProps & SourceBoxCollectedProps
+> {
 	public render() {
 		const {
 			color,
@@ -56,26 +62,23 @@ class SourceBoxRaw extends React.Component<SourceBoxProps> {
 				break
 		}
 
-		return (
-			connectDragSource &&
-			connectDragSource(
-				<div
-					style={{
-						...style,
-						backgroundColor,
-						opacity,
-						cursor: forbidDrag ? 'default' : 'move',
-					}}
-				>
-					<input
-						type="checkbox"
-						checked={forbidDrag}
-						onChange={onToggleForbidDrag}
-					/>
-					<small>Forbid drag</small>
-					{children}
-				</div>,
-			)
+		return connectDragSource(
+			<div
+				style={{
+					...style,
+					backgroundColor,
+					opacity,
+					cursor: forbidDrag ? 'default' : 'move',
+				}}
+			>
+				<input
+					type="checkbox"
+					checked={forbidDrag}
+					onChange={onToggleForbidDrag}
+				/>
+				<small>Forbid drag</small>
+				{children}
+			</div>,
 		)
 	}
 }
diff --git a/packages/documentation/src/examples/03 Nesting/Drag Sources/TargetBox.tsx b/packages/documentation-examples/src/03 Nesting/Drag Sources/TargetBox.tsx
similarity index 72%
rename from packages/documentation/src/examples/03 Nesting/Drag Sources/TargetBox.tsx
rename to packages/documentation-examples/src/03 Nesting/Drag Sources/TargetBox.tsx
index c7a01ac5ca..c2ad2a7965 100644
--- a/packages/documentation/src/examples/03 Nesting/Drag Sources/TargetBox.tsx	
+++ b/packages/documentation-examples/src/03 Nesting/Drag Sources/TargetBox.tsx	
@@ -18,15 +18,20 @@ const ColorTarget = {
 }
 
 export interface TargetBoxProps {
-	isOver?: boolean
-	canDrop?: boolean
-	draggingColor?: string
-	lastDroppedColor?: string
-	connectDropTarget?: ConnectDropTarget
 	onDrop: (item: any) => void
+	lastDroppedColor?: string
+}
+
+interface TargetBoxCollectedProps {
+	isOver: boolean
+	canDrop: boolean
+	draggingColor: string
+	connectDropTarget: ConnectDropTarget
 }
 
-class TargetBoxRaw extends React.Component<TargetBoxProps> {
+class TargetBoxRaw extends React.Component<
+	TargetBoxProps & TargetBoxCollectedProps
+> {
 	public render() {
 		const {
 			canDrop,
@@ -49,28 +54,25 @@ class TargetBoxRaw extends React.Component<TargetBoxProps> {
 				break
 		}
 
-		return (
-			connectDropTarget &&
-			connectDropTarget(
-				<div style={{ ...style, backgroundColor, opacity }}>
-					<p>Drop here.</p>
+		return connectDropTarget(
+			<div style={{ ...style, backgroundColor, opacity }}>
+				<p>Drop here.</p>
 
-					{!canDrop &&
-						lastDroppedColor && <p>Last dropped: {lastDroppedColor}</p>}
-				</div>,
-			)
+				{!canDrop &&
+					lastDroppedColor && <p>Last dropped: {lastDroppedColor}</p>}
+			</div>,
 		)
 	}
 }
 
-const TargetBox = DropTarget(
+const TargetBox = DropTarget<TargetBoxProps, TargetBoxCollectedProps>(
 	[Colors.YELLOW, Colors.BLUE],
 	ColorTarget,
 	(connect, monitor) => ({
 		connectDropTarget: connect.dropTarget(),
 		isOver: monitor.isOver(),
 		canDrop: monitor.canDrop(),
-		draggingColor: monitor.getItemType(),
+		draggingColor: monitor.getItemType() as string,
 	}),
 )(TargetBoxRaw)
 
@@ -91,7 +93,7 @@ export default class StatefulTargetBox extends React.Component<
 			<TargetBox
 				{...this.props}
 				lastDroppedColor={this.state.lastDroppedColor as string}
-				onDrop={((color: any) => this.handleDrop(color)) as any}
+				onDrop={((color: string) => this.handleDrop(color)) as any}
 			/>
 		)
 	}
diff --git a/packages/documentation/src/examples/03 Nesting/Drag Sources/index.tsx b/packages/documentation-examples/src/03 Nesting/Drag Sources/index.tsx
similarity index 100%
rename from packages/documentation/src/examples/03 Nesting/Drag Sources/index.tsx
rename to packages/documentation-examples/src/03 Nesting/Drag Sources/index.tsx
diff --git a/packages/documentation/src/examples/03 Nesting/Drop Targets/Box.tsx b/packages/documentation-examples/src/03 Nesting/Drop Targets/Box.tsx
similarity index 81%
rename from packages/documentation/src/examples/03 Nesting/Drop Targets/Box.tsx
rename to packages/documentation-examples/src/03 Nesting/Drop Targets/Box.tsx
index c58a64c27e..ffeafb685f 100644
--- a/packages/documentation/src/examples/03 Nesting/Drop Targets/Box.tsx	
+++ b/packages/documentation-examples/src/03 Nesting/Drop Targets/Box.tsx	
@@ -17,16 +17,14 @@ const boxSource = {
 }
 
 export interface BoxProps {
-	connectDragSource?: ConnectDragSource
+	connectDragSource: ConnectDragSource
 }
 
 class Box extends React.Component<BoxProps> {
 	public render() {
 		const { connectDragSource } = this.props
 
-		return (
-			connectDragSource && connectDragSource(<div style={style}>Drag me</div>)
-		)
+		return connectDragSource(<div style={style}>Drag me</div>)
 	}
 }
 export default DragSource(ItemTypes.BOX, boxSource, connect => ({
diff --git a/packages/documentation/src/examples/03 Nesting/Drop Targets/Container.tsx b/packages/documentation-examples/src/03 Nesting/Drop Targets/Container.tsx
similarity index 100%
rename from packages/documentation/src/examples/03 Nesting/Drop Targets/Container.tsx
rename to packages/documentation-examples/src/03 Nesting/Drop Targets/Container.tsx
diff --git a/packages/documentation/src/examples/03 Nesting/Drop Targets/Dustbin.tsx b/packages/documentation-examples/src/03 Nesting/Drop Targets/Dustbin.tsx
similarity index 74%
rename from packages/documentation/src/examples/03 Nesting/Drop Targets/Dustbin.tsx
rename to packages/documentation-examples/src/03 Nesting/Drop Targets/Dustbin.tsx
index 843133eb62..15b6d22a69 100644
--- a/packages/documentation/src/examples/03 Nesting/Drop Targets/Dustbin.tsx	
+++ b/packages/documentation-examples/src/03 Nesting/Drop Targets/Dustbin.tsx	
@@ -40,10 +40,13 @@ const boxTarget = {
 }
 
 export interface DustbinProps {
-	isOver?: boolean
-	isOverCurrent?: boolean
 	greedy?: boolean
-	connectDropTarget?: ConnectDropTarget
+}
+
+interface DustbinCollectedProps {
+	isOver: boolean
+	isOverCurrent: boolean
+	connectDropTarget: ConnectDropTarget
 }
 
 export interface DustbinState {
@@ -51,13 +54,13 @@ export interface DustbinState {
 	hasDroppedOnChild: boolean
 }
 
-class Dustbin extends React.Component<DustbinProps, DustbinState> {
-	constructor(props: DustbinProps) {
-		super(props)
-		this.state = {
-			hasDropped: false,
-			hasDroppedOnChild: false,
-		}
+class Dustbin extends React.Component<
+	DustbinProps & DustbinCollectedProps,
+	DustbinState
+> {
+	public state: DustbinState = {
+		hasDropped: false,
+		hasDroppedOnChild: false,
 	}
 
 	public render() {
@@ -77,19 +80,14 @@ class Dustbin extends React.Component<DustbinProps, DustbinState> {
 			backgroundColor = 'darkgreen'
 		}
 
-		return (
-			connectDropTarget &&
-			connectDropTarget(
-				<div style={getStyle(backgroundColor)}>
-					{text}
-					<br />
-					{hasDropped && (
-						<span>dropped {hasDroppedOnChild && ' on child'}</span>
-					)}
+		return connectDropTarget(
+			<div style={getStyle(backgroundColor)}>
+				{text}
+				<br />
+				{hasDropped && <span>dropped {hasDroppedOnChild && ' on child'}</span>}
 
-					<div>{children}</div>
-				</div>,
-			)
+				<div>{children}</div>
+			</div>,
 		)
 	}
 }
diff --git a/packages/documentation/src/examples/03 Nesting/Drop Targets/ItemTypes.ts b/packages/documentation-examples/src/03 Nesting/Drop Targets/ItemTypes.ts
similarity index 100%
rename from packages/documentation/src/examples/03 Nesting/Drop Targets/ItemTypes.ts
rename to packages/documentation-examples/src/03 Nesting/Drop Targets/ItemTypes.ts
diff --git a/packages/documentation/src/examples/03 Nesting/Drop Targets/index.tsx b/packages/documentation-examples/src/03 Nesting/Drop Targets/index.tsx
similarity index 100%
rename from packages/documentation/src/examples/03 Nesting/Drop Targets/index.tsx
rename to packages/documentation-examples/src/03 Nesting/Drop Targets/index.tsx
diff --git a/packages/documentation/src/examples/04 Sortable/Cancel on Drop Outside/Card.tsx b/packages/documentation-examples/src/04 Sortable/Cancel on Drop Outside/Card.tsx
similarity index 66%
rename from packages/documentation/src/examples/04 Sortable/Cancel on Drop Outside/Card.tsx
rename to packages/documentation-examples/src/04 Sortable/Cancel on Drop Outside/Card.tsx
index 9c918b6b81..ce893c2774 100644
--- a/packages/documentation/src/examples/04 Sortable/Cancel on Drop Outside/Card.tsx	
+++ b/packages/documentation-examples/src/04 Sortable/Cancel on Drop Outside/Card.tsx	
@@ -54,14 +54,22 @@ const cardTarget = {
 export interface CardProps {
 	id: string
 	text: string
-	connectDragSource?: ConnectDragSource
-	connectDropTarget?: ConnectDropTarget
-	isDragging?: boolean
 	moveCard: (id: string, to: number) => void
 	findCard: (id: string) => { index: number }
 }
 
-class Card extends React.Component<CardProps> {
+interface CardSourceCollectedProps {
+	connectDragSource: ConnectDragSource
+	isDragging: boolean
+}
+
+interface CardTargetCollectedProps {
+	connectDropTarget?: ConnectDropTarget
+}
+
+class Card extends React.Component<
+	CardProps & CardSourceCollectedProps & CardTargetCollectedProps
+> {
 	public render() {
 		const {
 			text,
@@ -71,21 +79,25 @@ class Card extends React.Component<CardProps> {
 		} = this.props
 		const opacity = isDragging ? 0 : 1
 
-		return (
-			connectDragSource &&
-			connectDropTarget &&
-			connectDragSource(
-				connectDropTarget(<div style={{ ...style, opacity }}>{text}</div>),
-			)
+		return connectDragSource(
+			connectDropTarget!(<div style={{ ...style, opacity }}>{text}</div>),
 		)
 	}
 }
 
-export default DropTarget(ItemTypes.CARD, cardTarget, connect => ({
-	connectDropTarget: connect.dropTarget(),
-}))(
-	DragSource(ItemTypes.CARD, cardSource, (connect, monitor) => ({
-		connectDragSource: connect.dragSource(),
-		isDragging: monitor.isDragging(),
-	}))(Card),
+export default DropTarget<CardProps, CardTargetCollectedProps>(
+	ItemTypes.CARD,
+	cardTarget,
+	connect => ({
+		connectDropTarget: connect.dropTarget(),
+	}),
+)(
+	DragSource<CardProps, CardSourceCollectedProps>(
+		ItemTypes.CARD,
+		cardSource,
+		(connect, monitor) => ({
+			connectDragSource: connect.dragSource(),
+			isDragging: monitor.isDragging(),
+		}),
+	)(Card),
 )
diff --git a/packages/documentation/src/examples/04 Sortable/Cancel on Drop Outside/Container.tsx b/packages/documentation-examples/src/04 Sortable/Cancel on Drop Outside/Container.tsx
similarity index 83%
rename from packages/documentation/src/examples/04 Sortable/Cancel on Drop Outside/Container.tsx
rename to packages/documentation-examples/src/04 Sortable/Cancel on Drop Outside/Container.tsx
index 88c6ac0446..828bc079f4 100644
--- a/packages/documentation/src/examples/04 Sortable/Cancel on Drop Outside/Container.tsx	
+++ b/packages/documentation-examples/src/04 Sortable/Cancel on Drop Outside/Container.tsx	
@@ -15,7 +15,7 @@ const cardTarget = {
 }
 
 export interface ContainerProps {
-	connectDropTarget?: ConnectDropTarget
+	connectDropTarget: ConnectDropTarget
 }
 
 export interface ContainerState {
@@ -65,21 +65,18 @@ class Container extends React.Component<ContainerProps, ContainerState> {
 		const { connectDropTarget } = this.props
 		const { cards } = this.state
 
-		return (
-			connectDropTarget &&
-			connectDropTarget(
-				<div style={style}>
-					{cards.map(card => (
-						<Card
-							key={card.id}
-							id={card.id}
-							text={card.text}
-							moveCard={this.moveCard}
-							findCard={this.findCard}
-						/>
-					))}
-				</div>,
-			)
+		return connectDropTarget(
+			<div style={style}>
+				{cards.map(card => (
+					<Card
+						key={card.id}
+						id={card.id}
+						text={card.text}
+						moveCard={this.moveCard}
+						findCard={this.findCard}
+					/>
+				))}
+			</div>,
 		)
 	}
 
diff --git a/packages/documentation/src/examples/04 Sortable/Cancel on Drop Outside/ItemTypes.ts b/packages/documentation-examples/src/04 Sortable/Cancel on Drop Outside/ItemTypes.ts
similarity index 100%
rename from packages/documentation/src/examples/04 Sortable/Cancel on Drop Outside/ItemTypes.ts
rename to packages/documentation-examples/src/04 Sortable/Cancel on Drop Outside/ItemTypes.ts
diff --git a/packages/documentation/src/examples/04 Sortable/Cancel on Drop Outside/index.tsx b/packages/documentation-examples/src/04 Sortable/Cancel on Drop Outside/index.tsx
similarity index 100%
rename from packages/documentation/src/examples/04 Sortable/Cancel on Drop Outside/index.tsx
rename to packages/documentation-examples/src/04 Sortable/Cancel on Drop Outside/index.tsx
diff --git a/packages/documentation/src/examples/04 Sortable/Simple/Card.tsx b/packages/documentation-examples/src/04 Sortable/Simple/Card.tsx
similarity index 85%
rename from packages/documentation/src/examples/04 Sortable/Simple/Card.tsx
rename to packages/documentation-examples/src/04 Sortable/Simple/Card.tsx
index 688a744359..23f5ed83c4 100644
--- a/packages/documentation/src/examples/04 Sortable/Simple/Card.tsx	
+++ b/packages/documentation-examples/src/04 Sortable/Simple/Card.tsx	
@@ -86,13 +86,21 @@ export interface CardProps {
 	id: any
 	text: string
 	index: number
-	isDragging?: boolean
-	connectDragSource?: ConnectDragSource
-	connectDropTarget?: ConnectDropTarget
 	moveCard: (dragIndex: number, hoverIndex: number) => void
 }
 
-class Card extends React.Component<CardProps> {
+interface CardSourceCollectedProps {
+	isDragging: boolean
+	connectDragSource: ConnectDragSource
+}
+
+interface CardTargetCollectedProps {
+	connectDropTarget?: ConnectDropTarget
+}
+
+class Card extends React.Component<
+	CardProps & CardSourceCollectedProps & CardTargetCollectedProps
+> {
 	public render() {
 		const {
 			text,
@@ -102,24 +110,20 @@ class Card extends React.Component<CardProps> {
 		} = this.props
 		const opacity = isDragging ? 0 : 1
 
-		return (
-			connectDragSource &&
-			connectDropTarget &&
-			connectDragSource(
-				connectDropTarget(<div style={{ ...style, opacity }}>{text}</div>),
-			)
+		return connectDragSource(
+			connectDropTarget!(<div style={{ ...style, opacity }}>{text}</div>),
 		)
 	}
 }
 
-export default DropTarget(
+export default DropTarget<CardProps, CardTargetCollectedProps>(
 	ItemTypes.CARD,
 	cardTarget,
 	(connect: DropTargetConnector) => ({
 		connectDropTarget: connect.dropTarget(),
 	}),
 )(
-	DragSource(
+	DragSource<CardProps, CardSourceCollectedProps>(
 		ItemTypes.CARD,
 		cardSource,
 		(connect: DragSourceConnector, monitor: DragSourceMonitor) => ({
diff --git a/packages/documentation/src/examples/04 Sortable/Simple/Container.tsx b/packages/documentation-examples/src/04 Sortable/Simple/Container.tsx
similarity index 100%
rename from packages/documentation/src/examples/04 Sortable/Simple/Container.tsx
rename to packages/documentation-examples/src/04 Sortable/Simple/Container.tsx
diff --git a/packages/documentation/src/examples/04 Sortable/Simple/ItemTypes.ts b/packages/documentation-examples/src/04 Sortable/Simple/ItemTypes.ts
similarity index 100%
rename from packages/documentation/src/examples/04 Sortable/Simple/ItemTypes.ts
rename to packages/documentation-examples/src/04 Sortable/Simple/ItemTypes.ts
diff --git a/packages/documentation/src/examples/04 Sortable/Simple/index.tsx b/packages/documentation-examples/src/04 Sortable/Simple/index.tsx
similarity index 100%
rename from packages/documentation/src/examples/04 Sortable/Simple/index.tsx
rename to packages/documentation-examples/src/04 Sortable/Simple/index.tsx
diff --git a/packages/documentation/src/examples/04 Sortable/Stress Test/Card.tsx b/packages/documentation-examples/src/04 Sortable/Stress Test/Card.tsx
similarity index 57%
rename from packages/documentation/src/examples/04 Sortable/Stress Test/Card.tsx
rename to packages/documentation-examples/src/04 Sortable/Stress Test/Card.tsx
index 24ebf5d6df..d3c5a094f3 100644
--- a/packages/documentation/src/examples/04 Sortable/Stress Test/Card.tsx	
+++ b/packages/documentation-examples/src/04 Sortable/Stress Test/Card.tsx	
@@ -35,13 +35,21 @@ const cardTarget = {
 export interface CardProps {
 	id: any
 	text: string
-	isDragging?: boolean
-	connectDragSource?: ConnectDragSource
-	connectDropTarget?: ConnectDropTarget
 	moveCard: (draggedId: string, id: string) => void
 }
 
-class Card extends React.Component<CardProps> {
+interface CardSourceCollectedProps {
+	isDragging: boolean
+	connectDragSource: ConnectDragSource
+}
+
+interface CardTargetCollectedProps {
+	connectDropTarget?: ConnectDropTarget
+}
+
+class Card extends React.Component<
+	CardProps & CardSourceCollectedProps & CardTargetCollectedProps
+> {
 	public render() {
 		const {
 			text,
@@ -51,21 +59,25 @@ class Card extends React.Component<CardProps> {
 		} = this.props
 		const opacity = isDragging ? 0 : 1
 
-		return (
-			connectDragSource &&
-			connectDropTarget &&
-			connectDragSource(
-				connectDropTarget(<div style={{ ...style, opacity }}>{text}</div>),
-			)
+		return connectDragSource(
+			connectDropTarget!(<div style={{ ...style, opacity }}>{text}</div>),
 		)
 	}
 }
 
-export default DropTarget(ItemTypes.CARD, cardTarget, connect => ({
-	connectDropTarget: connect.dropTarget(),
-}))(
-	DragSource(ItemTypes.CARD, cardSource, (connect, monitor) => ({
-		connectDragSource: connect.dragSource(),
-		isDragging: monitor.isDragging(),
-	}))(Card),
+export default DropTarget<CardProps, CardTargetCollectedProps>(
+	ItemTypes.CARD,
+	cardTarget,
+	connect => ({
+		connectDropTarget: connect.dropTarget(),
+	}),
+)(
+	DragSource<CardProps, CardSourceCollectedProps>(
+		ItemTypes.CARD,
+		cardSource,
+		(connect, monitor) => ({
+			connectDragSource: connect.dragSource(),
+			isDragging: monitor.isDragging(),
+		}),
+	)(Card),
 )
diff --git a/packages/documentation/src/examples/04 Sortable/Stress Test/Container.tsx b/packages/documentation-examples/src/04 Sortable/Stress Test/Container.tsx
similarity index 100%
rename from packages/documentation/src/examples/04 Sortable/Stress Test/Container.tsx
rename to packages/documentation-examples/src/04 Sortable/Stress Test/Container.tsx
diff --git a/packages/documentation/src/examples/04 Sortable/Stress Test/ItemTypes.ts b/packages/documentation-examples/src/04 Sortable/Stress Test/ItemTypes.ts
similarity index 100%
rename from packages/documentation/src/examples/04 Sortable/Stress Test/ItemTypes.ts
rename to packages/documentation-examples/src/04 Sortable/Stress Test/ItemTypes.ts
diff --git a/packages/documentation/src/examples/04 Sortable/Stress Test/index.tsx b/packages/documentation-examples/src/04 Sortable/Stress Test/index.tsx
similarity index 100%
rename from packages/documentation/src/examples/04 Sortable/Stress Test/index.tsx
rename to packages/documentation-examples/src/04 Sortable/Stress Test/index.tsx
diff --git a/packages/documentation/src/examples/05 Customize/Drop Effects/Container.tsx b/packages/documentation-examples/src/05 Customize/Drop Effects/Container.tsx
similarity index 100%
rename from packages/documentation/src/examples/05 Customize/Drop Effects/Container.tsx
rename to packages/documentation-examples/src/05 Customize/Drop Effects/Container.tsx
diff --git a/packages/documentation/src/examples/05 Customize/Drop Effects/ItemTypes.ts b/packages/documentation-examples/src/05 Customize/Drop Effects/ItemTypes.ts
similarity index 100%
rename from packages/documentation/src/examples/05 Customize/Drop Effects/ItemTypes.ts
rename to packages/documentation-examples/src/05 Customize/Drop Effects/ItemTypes.ts
diff --git a/packages/documentation/src/examples/05 Customize/Drop Effects/SourceBox.tsx b/packages/documentation-examples/src/05 Customize/Drop Effects/SourceBox.tsx
similarity index 51%
rename from packages/documentation/src/examples/05 Customize/Drop Effects/SourceBox.tsx
rename to packages/documentation-examples/src/05 Customize/Drop Effects/SourceBox.tsx
index 4d820045f3..2bc201761e 100644
--- a/packages/documentation/src/examples/05 Customize/Drop Effects/SourceBox.tsx	
+++ b/packages/documentation-examples/src/05 Customize/Drop Effects/SourceBox.tsx	
@@ -18,31 +18,36 @@ const boxSource = {
 }
 
 export interface SourceBoxProps {
-	isDragging?: boolean
-	connectDragSource?: ConnectDragSource
 	showCopyIcon?: boolean
 }
 
-class SourceBox extends React.Component<SourceBoxProps> {
+interface SourceBoxCollectedProps {
+	isDragging: boolean
+	connectDragSource: ConnectDragSource
+}
+
+class SourceBox extends React.Component<
+	SourceBoxProps & SourceBoxCollectedProps
+> {
 	public render() {
 		const { isDragging, connectDragSource, showCopyIcon } = this.props
 		const opacity = isDragging ? 0.4 : 1
 		const dropEffect = showCopyIcon ? 'copy' : 'move'
 
-		return (
-			connectDragSource &&
-			connectDragSource(
-				<div style={{ ...style, opacity }}>
-					When I am over a drop zone, I have {showCopyIcon ? 'copy' : 'no'}{' '}
-					icon.
-				</div>,
-				{ dropEffect },
-			)
+		return connectDragSource(
+			<div style={{ ...style, opacity }}>
+				When I am over a drop zone, I have {showCopyIcon ? 'copy' : 'no'} icon.
+			</div>,
+			{ dropEffect },
 		)
 	}
 }
 
-export default DragSource(ItemTypes.BOX, boxSource, (connect, monitor) => ({
-	connectDragSource: connect.dragSource(),
-	isDragging: monitor.isDragging(),
-}))(SourceBox)
+export default DragSource<SourceBoxProps, SourceBoxCollectedProps>(
+	ItemTypes.BOX,
+	boxSource,
+	(connect, monitor) => ({
+		connectDragSource: connect.dragSource(),
+		isDragging: monitor.isDragging(),
+	}),
+)(SourceBox)
diff --git a/packages/documentation/src/examples/05 Customize/Drop Effects/TargetBox.tsx b/packages/documentation-examples/src/05 Customize/Drop Effects/TargetBox.tsx
similarity index 75%
rename from packages/documentation/src/examples/05 Customize/Drop Effects/TargetBox.tsx
rename to packages/documentation-examples/src/05 Customize/Drop Effects/TargetBox.tsx
index 66bf6b883e..7a4d405fdb 100644
--- a/packages/documentation/src/examples/05 Customize/Drop Effects/TargetBox.tsx	
+++ b/packages/documentation-examples/src/05 Customize/Drop Effects/TargetBox.tsx	
@@ -17,9 +17,9 @@ const boxTarget = {
 }
 
 export interface TargetBoxProps {
-	connectDropTarget?: ConnectDropTarget
-	isOver?: boolean
-	canDrop?: boolean
+	connectDropTarget: ConnectDropTarget
+	isOver: boolean
+	canDrop: boolean
 }
 
 class TargetBox extends React.Component<TargetBoxProps> {
@@ -27,13 +27,10 @@ class TargetBox extends React.Component<TargetBoxProps> {
 		const { canDrop, isOver, connectDropTarget } = this.props
 		const isActive = canDrop && isOver
 
-		return (
-			connectDropTarget &&
-			connectDropTarget(
-				<div style={style}>
-					{isActive ? 'Release to drop' : 'Drag item here'}
-				</div>,
-			)
+		return connectDropTarget(
+			<div style={style}>
+				{isActive ? 'Release to drop' : 'Drag item here'}
+			</div>,
 		)
 	}
 }
diff --git a/packages/documentation/src/examples/05 Customize/Drop Effects/index.tsx b/packages/documentation-examples/src/05 Customize/Drop Effects/index.tsx
similarity index 100%
rename from packages/documentation/src/examples/05 Customize/Drop Effects/index.tsx
rename to packages/documentation-examples/src/05 Customize/Drop Effects/index.tsx
diff --git a/packages/documentation/src/examples/05 Customize/Handles and Previews/BoxWithHandle.tsx b/packages/documentation-examples/src/05 Customize/Handles and Previews/BoxWithHandle.tsx
similarity index 75%
rename from packages/documentation/src/examples/05 Customize/Handles and Previews/BoxWithHandle.tsx
rename to packages/documentation-examples/src/05 Customize/Handles and Previews/BoxWithHandle.tsx
index 7171b39a21..6f7e9738ba 100644
--- a/packages/documentation/src/examples/05 Customize/Handles and Previews/BoxWithHandle.tsx	
+++ b/packages/documentation-examples/src/05 Customize/Handles and Previews/BoxWithHandle.tsx	
@@ -26,9 +26,9 @@ const boxSource = {
 }
 
 export interface BoxWithHandleProps {
-	connectDragSource?: ConnectDragSource
-	connectDragPreview?: ConnectDragPreview
-	isDragging?: boolean
+	connectDragSource: ConnectDragSource
+	connectDragPreview: ConnectDragPreview
+	isDragging: boolean
 }
 
 class BoxWithHandle extends React.Component<BoxWithHandleProps> {
@@ -36,15 +36,11 @@ class BoxWithHandle extends React.Component<BoxWithHandleProps> {
 		const { isDragging, connectDragSource, connectDragPreview } = this.props
 		const opacity = isDragging ? 0.4 : 1
 
-		return (
-			connectDragPreview &&
-			connectDragSource &&
-			connectDragPreview(
-				<div style={{ ...style, opacity }}>
-					{connectDragSource(<div style={handleStyle} />)}
-					Drag me by the handle
-				</div>,
-			)
+		return connectDragPreview(
+			<div style={{ ...style, opacity }}>
+				{connectDragSource(<div style={handleStyle} />)}
+				Drag me by the handle
+			</div>,
 		)
 	}
 }
diff --git a/packages/documentation/src/examples/05 Customize/Handles and Previews/BoxWithImage.tsx b/packages/documentation-examples/src/05 Customize/Handles and Previews/BoxWithImage.tsx
similarity index 81%
rename from packages/documentation/src/examples/05 Customize/Handles and Previews/BoxWithImage.tsx
rename to packages/documentation-examples/src/05 Customize/Handles and Previews/BoxWithImage.tsx
index 76b1de5ca7..572e3efc1a 100644
--- a/packages/documentation/src/examples/05 Customize/Handles and Previews/BoxWithImage.tsx	
+++ b/packages/documentation-examples/src/05 Customize/Handles and Previews/BoxWithImage.tsx	
@@ -19,9 +19,9 @@ const BoxSource = {
 }
 
 export interface BoxWithImageProps {
-	connectDragSource?: ConnectDragSource
-	connectDragPreview?: ConnectDragPreview
-	isDragging?: boolean
+	connectDragSource: ConnectDragSource
+	connectDragPreview: ConnectDragPreview
+	isDragging: boolean
 }
 
 class BoxWithImage extends React.Component<BoxWithImageProps> {
@@ -36,11 +36,8 @@ class BoxWithImage extends React.Component<BoxWithImageProps> {
 		const { isDragging, connectDragSource } = this.props
 		const opacity = isDragging ? 0.4 : 1
 
-		return (
-			connectDragSource &&
-			connectDragSource(
-				<div style={{ ...style, opacity }}>Drag me to see an image</div>,
-			)
+		return connectDragSource(
+			<div style={{ ...style, opacity }}>Drag me to see an image</div>,
 		)
 	}
 }
diff --git a/packages/documentation/src/examples/05 Customize/Handles and Previews/Container.tsx b/packages/documentation-examples/src/05 Customize/Handles and Previews/Container.tsx
similarity index 100%
rename from packages/documentation/src/examples/05 Customize/Handles and Previews/Container.tsx
rename to packages/documentation-examples/src/05 Customize/Handles and Previews/Container.tsx
diff --git a/packages/documentation/src/examples/05 Customize/Handles and Previews/ItemTypes.ts b/packages/documentation-examples/src/05 Customize/Handles and Previews/ItemTypes.ts
similarity index 100%
rename from packages/documentation/src/examples/05 Customize/Handles and Previews/ItemTypes.ts
rename to packages/documentation-examples/src/05 Customize/Handles and Previews/ItemTypes.ts
diff --git a/packages/documentation/src/examples/05 Customize/Handles and Previews/boxImage.ts b/packages/documentation-examples/src/05 Customize/Handles and Previews/boxImage.ts
similarity index 100%
rename from packages/documentation/src/examples/05 Customize/Handles and Previews/boxImage.ts
rename to packages/documentation-examples/src/05 Customize/Handles and Previews/boxImage.ts
diff --git a/packages/documentation/src/examples/05 Customize/Handles and Previews/index.tsx b/packages/documentation-examples/src/05 Customize/Handles and Previews/index.tsx
similarity index 100%
rename from packages/documentation/src/examples/05 Customize/Handles and Previews/index.tsx
rename to packages/documentation-examples/src/05 Customize/Handles and Previews/index.tsx
diff --git a/packages/documentation/src/examples/06 Other/Native Files/Container.tsx b/packages/documentation-examples/src/06 Other/Native Files/Container.tsx
similarity index 100%
rename from packages/documentation/src/examples/06 Other/Native Files/Container.tsx
rename to packages/documentation-examples/src/06 Other/Native Files/Container.tsx
diff --git a/packages/documentation/src/examples/06 Other/Native Files/FileList.tsx b/packages/documentation-examples/src/06 Other/Native Files/FileList.tsx
similarity index 100%
rename from packages/documentation/src/examples/06 Other/Native Files/FileList.tsx
rename to packages/documentation-examples/src/06 Other/Native Files/FileList.tsx
diff --git a/packages/documentation/src/examples/06 Other/Native Files/TargetBox.tsx b/packages/documentation-examples/src/06 Other/Native Files/TargetBox.tsx
similarity index 70%
rename from packages/documentation/src/examples/06 Other/Native Files/TargetBox.tsx
rename to packages/documentation-examples/src/06 Other/Native Files/TargetBox.tsx
index 7fa4a473f7..6ebdc1eac2 100644
--- a/packages/documentation/src/examples/06 Other/Native Files/TargetBox.tsx	
+++ b/packages/documentation-examples/src/06 Other/Native Files/TargetBox.tsx	
@@ -24,29 +24,31 @@ const boxTarget = {
 
 export interface TargetBoxProps {
 	accepts: string[]
-	connectDropTarget?: ConnectDropTarget
-	isOver?: boolean
-	canDrop?: boolean
 	onDrop: (props: TargetBoxProps, monitor: DropTargetMonitor) => void
 }
 
-class TargetBox extends React.Component<TargetBoxProps> {
+interface TargetBoxCollectedProps {
+	isOver: boolean
+	canDrop: boolean
+	connectDropTarget: ConnectDropTarget
+}
+
+class TargetBox extends React.Component<
+	TargetBoxProps & TargetBoxCollectedProps
+> {
 	public render() {
 		const { canDrop, isOver, connectDropTarget } = this.props
 		const isActive = canDrop && isOver
 
-		return (
-			connectDropTarget &&
-			connectDropTarget(
-				<div style={style}>
-					{isActive ? 'Release to drop' : 'Drag file here'}
-				</div>,
-			)
+		return connectDropTarget(
+			<div style={style}>
+				{isActive ? 'Release to drop' : 'Drag file here'}
+			</div>,
 		)
 	}
 }
 
-export default DropTarget(
+export default DropTarget<TargetBoxProps, TargetBoxCollectedProps>(
 	(props: TargetBoxProps) => props.accepts,
 	boxTarget,
 	(connect: DropTargetConnector, monitor: DropTargetMonitor) => ({
diff --git a/packages/documentation/src/examples/06 Other/Native Files/index.tsx b/packages/documentation-examples/src/06 Other/Native Files/index.tsx
similarity index 100%
rename from packages/documentation/src/examples/06 Other/Native Files/index.tsx
rename to packages/documentation-examples/src/06 Other/Native Files/index.tsx
diff --git a/packages/documentation-examples/src/index.ts b/packages/documentation-examples/src/index.ts
new file mode 100644
index 0000000000..cb0dbc269c
--- /dev/null
+++ b/packages/documentation-examples/src/index.ts
@@ -0,0 +1,29 @@
+export { default as chessboard } from './00 Chessboard'
+export { default as dustbinCopyOrMove } from './01 Dustbin/Copy or Move'
+export {
+	default as dustbinMultipleTargets,
+} from './01 Dustbin/Multiple Targets'
+export { default as dustbinSingleTarget } from './01 Dustbin/Single Target'
+export {
+	default as dustbinSingleTargetInIframe,
+} from './01 Dustbin/Single Target in iframe'
+export {
+	default as dustbinSingleTargeWithFCs,
+} from './01 Dustbin/Single Target with FCs'
+export { default as dustbinStressTest } from './01 Dustbin/Stress Test'
+export {
+	default as dragAroundCustomDragLayer,
+} from './02 Drag Around/Custom Drag Layer'
+export { default as dragAroundNaive } from './02 Drag Around/Naive'
+export { default as nestingDragSources } from './03 Nesting/Drag Sources'
+export { default as nestingDropTargets } from './03 Nesting/Drop Targets'
+export {
+	default as sortableCancelOnDropOutside,
+} from './04 Sortable/Cancel on Drop Outside'
+export { default as sortableSimple } from './04 Sortable/Simple'
+export { default as sortableStressTest } from './04 Sortable/Stress Test'
+export { default as customizeDropEffects } from './05 Customize/Drop Effects'
+export {
+	default as customizeHandlesAndPreviews,
+} from './05 Customize/Handles and Previews'
+export { default as otherNativeFiles } from './06 Other/Native Files'
diff --git a/packages/documentation/src/examples/shared/wrapInTestContext.tsx b/packages/documentation-examples/src/shared/wrapInTestContext.tsx
similarity index 100%
rename from packages/documentation/src/examples/shared/wrapInTestContext.tsx
rename to packages/documentation-examples/src/shared/wrapInTestContext.tsx
diff --git a/packages/documentation-examples/tsconfig.json b/packages/documentation-examples/tsconfig.json
new file mode 100644
index 0000000000..32d474a868
--- /dev/null
+++ b/packages/documentation-examples/tsconfig.json
@@ -0,0 +1,10 @@
+{
+	"extends": "../../tsconfig.base.json",
+	"compilerOptions": {
+		"declaration": true,
+		"outDir": "./lib",
+		"baseUrl": "./",
+		"experimentalDecorators": true
+	},
+	"include": ["./src/index.ts"]
+}
diff --git a/packages/documentation/gatsby-config.js b/packages/documentation/gatsby-config.js
index 4040482928..f561547429 100644
--- a/packages/documentation/gatsby-config.js
+++ b/packages/documentation/gatsby-config.js
@@ -50,17 +50,6 @@ module.exports = {
 				name: 'markdown-pages',
 			},
 		},
-
-		// Laod Images
-		{
-			resolve: `gatsby-source-filesystem`,
-			options: {
-				name: `images`,
-				path: `${__dirname}/src/images`,
-			},
-		},
-		'gatsby-transformer-sharp',
-		'gatsby-plugin-sharp',
 		{
 			resolve: `gatsby-plugin-manifest`,
 			options: {
@@ -70,11 +59,8 @@ module.exports = {
 				background_color: '#663399',
 				theme_color: '#663399',
 				display: 'minimal-ui',
-				icon: 'src/images/gatsby-icon.png', // This path is relative to the root of the site.
+				icon: 'src/favicon.png', // This path is relative to the root of the site.
 			},
 		},
-		// this (optional) plugin enables Progressive Web App + Offline functionality
-		// To learn more, visit: https://gatsby.app/offline
-		// 'gatsby-plugin-offline',
 	],
 }
diff --git a/packages/documentation/package.json b/packages/documentation/package.json
index a682180935..6b41017bf0 100644
--- a/packages/documentation/package.json
+++ b/packages/documentation/package.json
@@ -4,12 +4,10 @@
   "version": "5.0.1",
   "private": true,
   "dependencies": {
-    "@types/faker": "^4.1.4",
     "@types/react": "16.3.14",
     "@types/react-dom": "16.0.9",
     "@types/react-helmet": "^5.0.7",
     "@types/styled-components": "^4.0.3",
-    "faker": "^4.1.0",
     "gatsby": "^2.0.40",
     "gatsby-image": "^2.0.19",
     "gatsby-plugin-favicon": "^3.1.4",
@@ -22,17 +20,17 @@
     "gatsby-plugin-typography": "^2.2.1",
     "gatsby-remark-copy-linked-files": "^2.0.6",
     "gatsby-remark-embed-snippet": "^3.0.3",
-    "gatsby-remark-images": "^2.0.5",
+    "gatsby-remark-images": "^2.0.6",
     "gatsby-remark-prismjs": "^3.0.3",
     "gatsby-source-filesystem": "^2.0.7",
     "gatsby-transformer-remark": "^2.1.11",
     "gatsby-transformer-sharp": "^2.1.8",
-    "immutability-helper": "^2.8.1",
     "prismjs": "^1.15.0",
     "react": "^16.6.0",
     "react-dnd": "^5.0.0",
     "react-dnd-html5-backend": "^5.0.1",
     "react-dnd-test-backend": "^5.0.1",
+    "react-dnd-documentation-examples": "^5.0.0",
     "react-dom": "^16.6.0",
     "react-frame-component": "^4.0.2",
     "react-helmet": "^5.2.0",
diff --git a/packages/documentation/src/components/layout.tsx b/packages/documentation/src/components/layout.tsx
index b5f6abed51..f4011feab0 100644
--- a/packages/documentation/src/components/layout.tsx
+++ b/packages/documentation/src/components/layout.tsx
@@ -46,7 +46,7 @@ const Layout: React.SFC<LayoutProps> = props => {
 							<SidebarContainer>
 								<Sidebar
 									groups={sidebarItems}
-									location={location && location.pathname}
+									location={location ? location.pathname : '/'}
 								/>
 							</SidebarContainer>
 						)}
diff --git a/packages/documentation/src/images/gatsby-astronaut.png b/packages/documentation/src/images/gatsby-astronaut.png
deleted file mode 100644
index da58ece0a8..0000000000
Binary files a/packages/documentation/src/images/gatsby-astronaut.png and /dev/null differ
diff --git a/packages/documentation/src/images/gatsby-icon.png b/packages/documentation/src/images/gatsby-icon.png
deleted file mode 100644
index 908bc78a7f..0000000000
Binary files a/packages/documentation/src/images/gatsby-icon.png and /dev/null differ
diff --git a/packages/documentation/src/pages/examples/customize/drop-effects.tsx b/packages/documentation/src/pages/examples/customize/drop-effects.tsx
index ebce9a87c5..740846ebce 100644
--- a/packages/documentation/src/pages/examples/customize/drop-effects.tsx
+++ b/packages/documentation/src/pages/examples/customize/drop-effects.tsx
@@ -1,5 +1,5 @@
 import * as React from 'react'
-import Example from '../../../examples/05 Customize/Drop Effects'
+import { customizeDropEffects as Example } from 'react-dnd-documentation-examples'
 import Layout from '../../../components/layout'
 
 export default (props: any) => (
diff --git a/packages/documentation/src/pages/examples/customize/handles-and-previews.tsx b/packages/documentation/src/pages/examples/customize/handles-and-previews.tsx
index b59c1712d9..61207f94b6 100644
--- a/packages/documentation/src/pages/examples/customize/handles-and-previews.tsx
+++ b/packages/documentation/src/pages/examples/customize/handles-and-previews.tsx
@@ -1,5 +1,5 @@
 import * as React from 'react'
-import Example from '../../../examples/05 Customize/Handles and Previews'
+import { customizeHandlesAndPreviews as Example } from 'react-dnd-documentation-examples'
 import Layout from '../../../components/layout'
 
 export default (props: any) => (
diff --git a/packages/documentation/src/pages/examples/drag-around/custom-drag-layer.tsx b/packages/documentation/src/pages/examples/drag-around/custom-drag-layer.tsx
index 80c3a9051c..b0de182233 100644
--- a/packages/documentation/src/pages/examples/drag-around/custom-drag-layer.tsx
+++ b/packages/documentation/src/pages/examples/drag-around/custom-drag-layer.tsx
@@ -1,5 +1,5 @@
 import * as React from 'react'
-import Example from '../../../examples/02 Drag Around/Custom Drag Layer'
+import { dragAroundCustomDragLayer as Example } from 'react-dnd-documentation-examples'
 import Layout from '../../../components/layout'
 
 export default (props: any) => (
diff --git a/packages/documentation/src/pages/examples/drag-around/naive.tsx b/packages/documentation/src/pages/examples/drag-around/naive.tsx
index c181c1587e..9ed1a94000 100644
--- a/packages/documentation/src/pages/examples/drag-around/naive.tsx
+++ b/packages/documentation/src/pages/examples/drag-around/naive.tsx
@@ -1,5 +1,5 @@
 import * as React from 'react'
-import Example from '../../../examples/02 Drag Around/Naive'
+import { dragAroundNaive as Example } from 'react-dnd-documentation-examples'
 import Layout from '../../../components/layout'
 
 export default (props: any) => (
diff --git a/packages/documentation/src/pages/examples/dustbin/copy-or-move.tsx b/packages/documentation/src/pages/examples/dustbin/copy-or-move.tsx
index feff668c45..2bb72190c0 100644
--- a/packages/documentation/src/pages/examples/dustbin/copy-or-move.tsx
+++ b/packages/documentation/src/pages/examples/dustbin/copy-or-move.tsx
@@ -1,5 +1,5 @@
 import * as React from 'react'
-import Example from '../../../examples/01 Dustbin/Copy or Move'
+import { dustbinCopyOrMove as Example } from 'react-dnd-documentation-examples'
 import Layout from '../../../components/layout'
 
 export default (props: any) => (
diff --git a/packages/documentation/src/pages/examples/dustbin/iframe.tsx b/packages/documentation/src/pages/examples/dustbin/iframe.tsx
index fd45801350..c2e4f34029 100644
--- a/packages/documentation/src/pages/examples/dustbin/iframe.tsx
+++ b/packages/documentation/src/pages/examples/dustbin/iframe.tsx
@@ -1,5 +1,5 @@
 import * as React from 'react'
-import Example from '../../../examples/01 Dustbin/Single Target in iframe'
+import { dustbinSingleTargetInIframe as Example } from 'react-dnd-documentation-examples'
 import Layout from '../../../components/layout'
 
 export default (props: any) => (
diff --git a/packages/documentation/src/pages/examples/dustbin/multiple-targets.tsx b/packages/documentation/src/pages/examples/dustbin/multiple-targets.tsx
index b59496b2bb..ec94a27147 100644
--- a/packages/documentation/src/pages/examples/dustbin/multiple-targets.tsx
+++ b/packages/documentation/src/pages/examples/dustbin/multiple-targets.tsx
@@ -1,5 +1,5 @@
 import * as React from 'react'
-import Example from '../../../examples/01 Dustbin/Multiple Targets'
+import { dustbinMultipleTargets as Example } from 'react-dnd-documentation-examples'
 import Layout from '../../../components/layout'
 
 export default (props: any) => (
diff --git a/packages/documentation/src/pages/examples/dustbin/single-target.tsx b/packages/documentation/src/pages/examples/dustbin/single-target.tsx
index 3bbfbaf320..f2ca8438e2 100644
--- a/packages/documentation/src/pages/examples/dustbin/single-target.tsx
+++ b/packages/documentation/src/pages/examples/dustbin/single-target.tsx
@@ -1,5 +1,5 @@
 import * as React from 'react'
-import Example from '../../../examples/01 Dustbin/Single Target'
+import { dustbinSingleTarget as Example } from 'react-dnd-documentation-examples'
 import Layout from '../../../components/layout'
 
 export default (props: any) => (
diff --git a/packages/documentation/src/pages/examples/dustbin/stress-test.tsx b/packages/documentation/src/pages/examples/dustbin/stress-test.tsx
index a6de646b33..c20e907a22 100644
--- a/packages/documentation/src/pages/examples/dustbin/stress-test.tsx
+++ b/packages/documentation/src/pages/examples/dustbin/stress-test.tsx
@@ -1,5 +1,5 @@
 import * as React from 'react'
-import Example from '../../../examples/01 Dustbin/Stress Test'
+import { dustbinStressTest as Example } from 'react-dnd-documentation-examples'
 import Layout from '../../../components/layout'
 
 export default (props: any) => (
diff --git a/packages/documentation/src/pages/examples/dustbin/using-fcs.tsx b/packages/documentation/src/pages/examples/dustbin/using-fcs.tsx
index 354fb47bce..e1b7c7cfc6 100644
--- a/packages/documentation/src/pages/examples/dustbin/using-fcs.tsx
+++ b/packages/documentation/src/pages/examples/dustbin/using-fcs.tsx
@@ -1,5 +1,5 @@
 import * as React from 'react'
-import Example from '../../../examples/01 Dustbin/Single Target with FCs'
+import { dustbinSingleTargeWithFCs as Example } from 'react-dnd-documentation-examples'
 import Layout from '../../../components/layout'
 
 export default (props: any) => (
diff --git a/packages/documentation/src/pages/examples/nesting/drag-sources.tsx b/packages/documentation/src/pages/examples/nesting/drag-sources.tsx
index ee3c3505bd..b6237ba947 100644
--- a/packages/documentation/src/pages/examples/nesting/drag-sources.tsx
+++ b/packages/documentation/src/pages/examples/nesting/drag-sources.tsx
@@ -1,5 +1,5 @@
 import * as React from 'react'
-import Example from '../../../examples/03 Nesting/Drag Sources'
+import { nestingDragSources as Example } from 'react-dnd-documentation-examples'
 import Layout from '../../../components/layout'
 
 export default (props: any) => (
diff --git a/packages/documentation/src/pages/examples/nesting/drop-targets.tsx b/packages/documentation/src/pages/examples/nesting/drop-targets.tsx
index 82de43a7e9..3bf138d8c2 100644
--- a/packages/documentation/src/pages/examples/nesting/drop-targets.tsx
+++ b/packages/documentation/src/pages/examples/nesting/drop-targets.tsx
@@ -1,5 +1,5 @@
 import * as React from 'react'
-import Example from '../../../examples/03 Nesting/Drop Targets'
+import { nestingDropTargets as Example } from 'react-dnd-documentation-examples'
 import Layout from '../../../components/layout'
 
 export default (props: any) => (
diff --git a/packages/documentation/src/pages/examples/other/native-files.tsx b/packages/documentation/src/pages/examples/other/native-files.tsx
index ca7d47853d..5462895366 100644
--- a/packages/documentation/src/pages/examples/other/native-files.tsx
+++ b/packages/documentation/src/pages/examples/other/native-files.tsx
@@ -1,5 +1,5 @@
 import * as React from 'react'
-import Example from '../../../examples/06 Other/Native Files'
+import { otherNativeFiles as Example } from 'react-dnd-documentation-examples'
 import Layout from '../../../components/layout'
 
 export default (props: any) => (
diff --git a/packages/documentation/src/pages/examples/sortable/cancel-on-drop-outside.tsx b/packages/documentation/src/pages/examples/sortable/cancel-on-drop-outside.tsx
index 121c2c0d1e..228bb19052 100644
--- a/packages/documentation/src/pages/examples/sortable/cancel-on-drop-outside.tsx
+++ b/packages/documentation/src/pages/examples/sortable/cancel-on-drop-outside.tsx
@@ -1,5 +1,5 @@
 import * as React from 'react'
-import Example from '../../../examples/04 Sortable/Cancel on Drop Outside'
+import { sortableCancelOnDropOutside as Example } from 'react-dnd-documentation-examples'
 import Layout from '../../../components/layout'
 
 export default (props: any) => (
diff --git a/packages/documentation/src/pages/examples/sortable/simple.tsx b/packages/documentation/src/pages/examples/sortable/simple.tsx
index acff780640..234b41bbb5 100644
--- a/packages/documentation/src/pages/examples/sortable/simple.tsx
+++ b/packages/documentation/src/pages/examples/sortable/simple.tsx
@@ -1,5 +1,5 @@
 import * as React from 'react'
-import Example from '../../../examples/04 Sortable/Simple'
+import { sortableSimple as Example } from 'react-dnd-documentation-examples'
 import Layout from '../../../components/layout'
 
 export default (props: any) => (
diff --git a/packages/documentation/src/pages/examples/sortable/stress-test.tsx b/packages/documentation/src/pages/examples/sortable/stress-test.tsx
index ae0712f1d2..311e64acb9 100644
--- a/packages/documentation/src/pages/examples/sortable/stress-test.tsx
+++ b/packages/documentation/src/pages/examples/sortable/stress-test.tsx
@@ -1,5 +1,5 @@
 import * as React from 'react'
-import Example from '../../../examples/04 Sortable/Stress Test'
+import { sortableStressTest as Example } from 'react-dnd-documentation-examples'
 import Layout from '../../../components/layout'
 
 export default (props: any) => (
diff --git a/packages/documentation/src/pages/examples/tutorial.tsx b/packages/documentation/src/pages/examples/tutorial.tsx
index e558aa3e3d..413464ce0b 100644
--- a/packages/documentation/src/pages/examples/tutorial.tsx
+++ b/packages/documentation/src/pages/examples/tutorial.tsx
@@ -1,5 +1,5 @@
 import * as React from 'react'
-import Example from '../../examples/00 Chessboard'
+import { chessboard as Example } from 'react-dnd-documentation-examples'
 import Layout from '../../components/layout'
 
 export default (props: any) => (
diff --git a/packages/react-dnd-html5-backend/package.json b/packages/react-dnd-html5-backend/package.json
index 48f50cf346..27df42f50c 100644
--- a/packages/react-dnd-html5-backend/package.json
+++ b/packages/react-dnd-html5-backend/package.json
@@ -30,7 +30,8 @@
 		"react-dnd-test-backend": "^5.0.1",
 		"rimraf": "^2.6.2",
 		"ts-loader": "^5.2.2",
-		"typescript": "^3.1.3",
-		"webpack": "^4.23.1"
+		"typescript": "^3.1.6",
+		"webpack": "^4.23.1",
+		"webpack-cli": "^3.1.2"
 	}
 }
diff --git a/packages/react-dnd-test-backend/package.json b/packages/react-dnd-test-backend/package.json
index cda9d3ee03..fdc91b7769 100644
--- a/packages/react-dnd-test-backend/package.json
+++ b/packages/react-dnd-test-backend/package.json
@@ -21,6 +21,6 @@
 	"devDependencies": {
 		"npm-run-all": "^4.1.3",
 		"rimraf": "^2.6.2",
-		"typescript": "^3.1.3"
+		"typescript": "^3.1.6"
 	}
 }
diff --git a/packages/react-dnd/package.json b/packages/react-dnd/package.json
index 2198c4735f..ccfe02c22d 100644
--- a/packages/react-dnd/package.json
+++ b/packages/react-dnd/package.json
@@ -37,7 +37,7 @@
 		"react": "^16.6.0",
 		"rimraf": "^2.6.2",
 		"ts-loader": "^5.2.2",
-		"typescript": "^3.1.3",
+		"typescript": "^3.1.6",
 		"webpack": "^4.23.1",
 		"webpack-cli": "^3.1.2"
 	},
diff --git a/packages/react-dnd/src/DragSource.ts b/packages/react-dnd/src/DragSource.ts
index 7474733f1b..e1f4bf0d0a 100644
--- a/packages/react-dnd/src/DragSource.ts
+++ b/packages/react-dnd/src/DragSource.ts
@@ -77,10 +77,8 @@ export default function DragSource<Props, CollectedProps = {}, DragObject = {}>(
 	)
 
 	return function decorateSource<
-		TargetClass extends
-			| React.ComponentClass<Props>
-			| React.StatelessComponent<Props>
-	>(DecoratedComponent: TargetClass): TargetClass & DndComponentClass<Props> {
+		TargetClass extends React.ComponentType<Props & CollectedProps>
+	>(DecoratedComponent: TargetClass): DndComponentClass<Props> {
 		return decorateHandler<Props, TargetClass, SourceType>({
 			containerDisplayName: 'DragSource',
 			createHandler: createSource,
diff --git a/packages/react-dnd/src/DropTarget.ts b/packages/react-dnd/src/DropTarget.ts
index e620a80a59..14f89bfcf0 100644
--- a/packages/react-dnd/src/DropTarget.ts
+++ b/packages/react-dnd/src/DropTarget.ts
@@ -70,10 +70,8 @@ export default function DropTarget<Props, CollectedProps = {}>(
 	)
 
 	return function decorateTarget<
-		TargetClass extends
-			| React.ComponentClass<Props>
-			| React.StatelessComponent<Props>
-	>(DecoratedComponent: TargetClass): TargetClass & DndComponentClass<Props> {
+		TargetClass extends React.ComponentType<Props & CollectedProps>
+	>(DecoratedComponent: TargetClass): DndComponentClass<Props> {
 		return decorateHandler<Props, TargetClass, TargetType>({
 			containerDisplayName: 'DropTarget',
 			createHandler: createTarget,
diff --git a/packages/react-dnd/src/decorateHandler.tsx b/packages/react-dnd/src/decorateHandler.tsx
index 6dcfe55964..fe4d081a63 100644
--- a/packages/react-dnd/src/decorateHandler.tsx
+++ b/packages/react-dnd/src/decorateHandler.tsx
@@ -13,10 +13,8 @@ const invariant = require('invariant')
 const hoistStatics = require('hoist-non-react-statics')
 const shallowEqual = require('shallowequal')
 
-export interface DecorateHandlerArgs<Props, ItemIdType> {
-	DecoratedComponent:
-		| React.ComponentClass<Props>
-		| React.StatelessComponent<Props>
+export interface DecorateHandlerArgs<Props, TargetClass, ItemIdType> {
+	DecoratedComponent: TargetClass
 	createHandler: any
 	createMonitor: any
 	createConnector: any
@@ -27,7 +25,11 @@ export interface DecorateHandlerArgs<Props, ItemIdType> {
 	options: any
 }
 
-export default function decorateHandler<Props, TargetClass, ItemIdType>({
+export default function decorateHandler<
+	Props,
+	TargetClass extends React.ComponentType<any>,
+	ItemIdType
+>({
 	DecoratedComponent,
 	createHandler,
 	createMonitor,
@@ -37,8 +39,9 @@ export default function decorateHandler<Props, TargetClass, ItemIdType>({
 	getType,
 	collect,
 	options,
-}: DecorateHandlerArgs<Props, ItemIdType>): TargetClass &
-	DndComponentClass<Props> {
+}: DecorateHandlerArgs<Props, TargetClass, ItemIdType>): DndComponentClass<
+	Props
+> {
 	const { arePropsEqual = shallowEqual } = options
 	const Decorated: any = DecoratedComponent
 
diff --git a/yarn.lock b/yarn.lock
index b49e594d62..9bf48233a9 100644
--- a/yarn.lock
+++ b/yarn.lock
@@ -2426,11 +2426,6 @@ ansi-colors@^3.0.0:
   resolved "https://registry.yarnpkg.com/ansi-colors/-/ansi-colors-3.2.1.tgz#9638047e4213f3428a11944a7d4b31cba0a3ff95"
   integrity sha512-Xt+zb6nqgvV9SWAVp0EG3lRsHcbq5DDgqjPPz6pwgtj6RKz65zGXMNa82oJfOSBA/to6GmRP7Dr+6o+kbApTzQ==
 
-ansi-escapes@^1.0.0:
-  version "1.4.0"
-  resolved "https://registry.yarnpkg.com/ansi-escapes/-/ansi-escapes-1.4.0.tgz#d3a8a83b319aa67793662b13e761c7911422306e"
-  integrity sha1-06ioOzGapneTZisT52HHkRQiMG4=
-
 ansi-escapes@^3.0.0:
   version "3.0.0"
   resolved "https://registry.yarnpkg.com/ansi-escapes/-/ansi-escapes-3.0.0.tgz#ec3e8b4e9f8064fc02c3ac9b65f1c275bda8ef92"
@@ -4452,7 +4447,7 @@ cli-cursor@^1.0.2:
   dependencies:
     restore-cursor "^1.0.1"
 
-cli-cursor@^2.1.0:
+cli-cursor@^2.0.0, cli-cursor@^2.1.0:
   version "2.1.0"
   resolved "https://registry.yarnpkg.com/cli-cursor/-/cli-cursor-2.1.0.tgz#b35dac376479facc3e94747d41d0d0f5238ffcb5"
   integrity sha1-s12sN2R5+sw+lHR9QdDQ9SOP/LU=
@@ -5564,6 +5559,13 @@ debug@^3.2.5:
   dependencies:
     ms "^2.1.1"
 
+debug@^4.0.1:
+  version "4.1.0"
+  resolved "https://registry.yarnpkg.com/debug/-/debug-4.1.0.tgz#373687bffa678b38b1cd91f861b63850035ddc87"
+  integrity sha512-heNPJUJIqC+xB6ayLAMHaIrmN9HKa7aQO8MGqKpvCA+uJYVcvR6l5kgdrhRuwPFHU7P5/A1w0BjByPHwpfTDKg==
+  dependencies:
+    ms "^2.1.1"
+
 debuglog@^1.0.1:
   version "1.0.1"
   resolved "https://registry.yarnpkg.com/debuglog/-/debuglog-1.0.1.tgz#aa24ffb9ac3df9a2351837cfb2d279360cd78492"
@@ -6485,7 +6487,7 @@ escape-html@~1.0.3:
   resolved "https://registry.yarnpkg.com/escape-html/-/escape-html-1.0.3.tgz#0258eae4d3d0c0974de1c169188ef0051d1d1988"
   integrity sha1-Aljq5NPQwJdN4cFpGI7wBR0dGYg=
 
-escape-string-regexp@1.0.5, escape-string-regexp@^1.0.2, escape-string-regexp@^1.0.5:
+escape-string-regexp@1.0.5, escape-string-regexp@^1.0.2, escape-string-regexp@^1.0.4, escape-string-regexp@^1.0.5:
   version "1.0.5"
   resolved "https://registry.yarnpkg.com/escape-string-regexp/-/escape-string-regexp-1.0.5.tgz#1b61c0562190a8dff6ae3bb2cf0200ca130b86d4"
   integrity sha1-G2HAViGQqN/2rjuyzwIAyhMLhtQ=
@@ -7747,6 +7749,15 @@ functional-red-black-tree@^1.0.1:
   resolved "https://registry.yarnpkg.com/functional-red-black-tree/-/functional-red-black-tree-1.0.1.tgz#1b0ab3bd553b2a0d6399d29c0e3ea0b252078327"
   integrity sha1-GwqzvVU7Kg1jmdKcDj6gslIHgyc=
 
+g-status@^2.0.2:
+  version "2.0.2"
+  resolved "https://registry.yarnpkg.com/g-status/-/g-status-2.0.2.tgz#270fd32119e8fc9496f066fe5fe88e0a6bc78b97"
+  integrity sha512-kQoE9qH+T1AHKgSSD0Hkv98bobE90ILQcXAF4wvGgsr7uFqNvwmh8j+Lq3l0RVt3E3HjSbv2B9biEGcEtpHLCA==
+  dependencies:
+    arrify "^1.0.1"
+    matcher "^1.0.0"
+    simple-git "^1.85.0"
+
 gatsby-cli@^2.4.4:
   version "2.4.4"
   resolved "https://registry.yarnpkg.com/gatsby-cli/-/gatsby-cli-2.4.4.tgz#0d3833721100e03c0f37b1dd330e5f2ddd47400f"
@@ -7919,10 +7930,10 @@ gatsby-remark-embed-snippet@^3.0.3:
     parse-numeric-range "^0.0.2"
     unist-util-map "^1.0.3"
 
-gatsby-remark-images@^2.0.5:
-  version "2.0.5"
-  resolved "https://registry.yarnpkg.com/gatsby-remark-images/-/gatsby-remark-images-2.0.5.tgz#774c90cba3220cc193e15899b6e32f90bd372005"
-  integrity sha512-RbceqPk2QrugboDYjTMjofvvCduotk/6bGs93OAzb0UUf41n3ViEEuHZHC1AIr/IgsnUdtDzDPxunP0mDwQcaw==
+gatsby-remark-images@^2.0.6:
+  version "2.0.6"
+  resolved "https://registry.yarnpkg.com/gatsby-remark-images/-/gatsby-remark-images-2.0.6.tgz#7567b40be11fec8931084f27d8b3aa18ccc4d5fc"
+  integrity sha512-1gXW1Gm/qiUS6YBZU//lH8gwB6SHbu2jdZlCxIzbSl4GvQ/P1zvo1hkOmxEScmit2FC4g4UrnLco/BbWAgNj1A==
   dependencies:
     "@babel/runtime" "^7.0.0"
     cheerio "^1.0.0-rc.2"
@@ -9246,10 +9257,10 @@ humanize-url@^1.0.0:
     normalize-url "^1.0.0"
     strip-url-auth "^1.0.0"
 
-husky@^1.1.2:
-  version "1.1.2"
-  resolved "https://registry.yarnpkg.com/husky/-/husky-1.1.2.tgz#574c2bb16958db8a8120b63306efaff110525c23"
-  integrity sha512-9TdkUpBeEOjz0AnFdUN4i3w8kEbOsVs9/WSeJqWLq2OO6bcKQhVW64Zi+pVd/AMRLpN3QTINb6ZXiELczvdmqQ==
+husky@^1.1.3:
+  version "1.1.3"
+  resolved "https://registry.yarnpkg.com/husky/-/husky-1.1.3.tgz#3ccfdb4d7332896bf7cd0e618c6fb8be09d9de4b"
+  integrity sha512-6uc48B/A2Mqi65yeg37d/TPcTb0bZ1GTkMYOM0nXLOPuPaTRhXCeee80/noOrbavWd12x72Tusja7GJ5rzvV6g==
   dependencies:
     cosmiconfig "^5.0.6"
     execa "^0.9.0"
@@ -11028,22 +11039,25 @@ libnpmaccess@^3.0.0:
     npm-package-arg "^6.1.0"
     npm-registry-fetch "^3.8.0"
 
-lint-staged@^7.3.0:
-  version "7.3.0"
-  resolved "https://registry.yarnpkg.com/lint-staged/-/lint-staged-7.3.0.tgz#90ff33e5ca61ed3dbac35b6f6502dbefdc0db58d"
-  integrity sha512-AXk40M9DAiPi7f4tdJggwuKIViUplYtVj1os1MVEteW7qOkU50EOehayCfO9TsoGK24o/EsWb41yrEgfJDDjCw==
+lint-staged@^8.0.4:
+  version "8.0.4"
+  resolved "https://registry.yarnpkg.com/lint-staged/-/lint-staged-8.0.4.tgz#d3c909fcf7897152cdce2d6e42500cd9b5b41a0d"
+  integrity sha512-Rs0VxXoyFqHMrPQgKAMy+O907+m5Po71UVPhBi7BUBwU7ZZ2aoc+mZmpOX3DVPCoTcy6+hqJa9yIZfacNpJHdg==
   dependencies:
     chalk "^2.3.1"
     commander "^2.14.1"
     cosmiconfig "^5.0.2"
     debug "^3.1.0"
     dedent "^0.7.0"
-    execa "^0.9.0"
+    del "^3.0.0"
+    execa "^1.0.0"
     find-parent-dir "^0.3.0"
+    g-status "^2.0.2"
     is-glob "^4.0.0"
     is-windows "^1.0.2"
     jest-validate "^23.5.0"
-    listr "^0.14.1"
+    listr "^0.14.2"
+    listr-update-renderer "https://github.com/okonet/listr-update-renderer/tarball/upgrade-log-update"
     lodash "^4.17.5"
     log-symbols "^2.2.0"
     micromatch "^3.1.8"
@@ -11052,7 +11066,7 @@ lint-staged@^7.3.0:
     path-is-inside "^1.0.2"
     pify "^3.0.0"
     please-upgrade-node "^3.0.2"
-    staged-git-files "1.1.1"
+    staged-git-files "1.1.2"
     string-argv "^0.0.2"
     stringify-object "^3.2.2"
 
@@ -11061,10 +11075,9 @@ listr-silent-renderer@^1.1.1:
   resolved "https://registry.yarnpkg.com/listr-silent-renderer/-/listr-silent-renderer-1.1.1.tgz#924b5a3757153770bf1a8e3fbf74b8bbf3f9242e"
   integrity sha1-kktaN1cVN3C/Go4/v3S4u/P5JC4=
 
-listr-update-renderer@^0.4.0:
+listr-update-renderer@^0.4.0, "listr-update-renderer@https://github.com/okonet/listr-update-renderer/tarball/upgrade-log-update":
   version "0.4.0"
-  resolved "https://registry.yarnpkg.com/listr-update-renderer/-/listr-update-renderer-0.4.0.tgz#344d980da2ca2e8b145ba305908f32ae3f4cc8a7"
-  integrity sha1-NE2YDaLKLosUW6MFkI8yrj9MyKc=
+  resolved "https://github.com/okonet/listr-update-renderer/tarball/upgrade-log-update#06073fa93166277607a7814f4e1f83960081414c"
   dependencies:
     chalk "^1.1.3"
     cli-truncate "^0.2.1"
@@ -11072,7 +11085,7 @@ listr-update-renderer@^0.4.0:
     figures "^1.7.0"
     indent-string "^3.0.0"
     log-symbols "^1.0.2"
-    log-update "^1.0.2"
+    log-update "^2.3.0"
     strip-ansi "^3.0.1"
 
 listr-verbose-renderer@^0.4.0:
@@ -11085,7 +11098,7 @@ listr-verbose-renderer@^0.4.0:
     date-fns "^1.27.2"
     figures "^1.7.0"
 
-listr@^0.14.1:
+listr@^0.14.2:
   version "0.14.2"
   resolved "https://registry.yarnpkg.com/listr/-/listr-0.14.2.tgz#cbe44b021100a15376addfc2d79349ee430bfe14"
   integrity sha512-vmaNJ1KlGuGWShHI35X/F8r9xxS0VTHh9GejVXwSN20fG5xpq3Jh4bJbnumoT6q5EDM/8/YP1z3YMtQbFmhuXw==
@@ -11478,13 +11491,14 @@ log-symbols@^2.2.0:
   dependencies:
     chalk "^2.0.1"
 
-log-update@^1.0.2:
-  version "1.0.2"
-  resolved "https://registry.yarnpkg.com/log-update/-/log-update-1.0.2.tgz#19929f64c4093d2d2e7075a1dad8af59c296b8d1"
-  integrity sha1-GZKfZMQJPS0ucHWh2tivWcKWuNE=
+log-update@^2.3.0:
+  version "2.3.0"
+  resolved "https://registry.yarnpkg.com/log-update/-/log-update-2.3.0.tgz#88328fd7d1ce7938b29283746f0b1bc126b24708"
+  integrity sha1-iDKP19HOeTiykoN0bwsbwSayRwg=
   dependencies:
-    ansi-escapes "^1.0.0"
-    cli-cursor "^1.0.2"
+    ansi-escapes "^3.0.0"
+    cli-cursor "^2.0.0"
+    wrap-ansi "^3.0.1"
 
 logalot@^2.0.0:
   version "2.1.0"
@@ -11675,6 +11689,13 @@ markdown-table@^1.1.0:
   resolved "https://registry.yarnpkg.com/markdown-table/-/markdown-table-1.1.2.tgz#c78db948fa879903a41bce522e3b96f801c63786"
   integrity sha512-NcWuJFHDA8V3wkDgR/j4+gZx+YQwstPgfQDV8ndUeWWzta3dnDTBxpVzqS9lkmJAuV5YX35lmyojl6HO5JXAgw==
 
+matcher@^1.0.0:
+  version "1.1.1"
+  resolved "https://registry.yarnpkg.com/matcher/-/matcher-1.1.1.tgz#51d8301e138f840982b338b116bb0c09af62c1c2"
+  integrity sha512-+BmqxWIubKTRKNWx/ahnCkk3mG8m7OturVlqq6HiojGJTd5hVYbgZm6WzcYPCoB+KBT4Vd6R7WSRG2OADNaCjg==
+  dependencies:
+    escape-string-regexp "^1.0.4"
+
 md5-file@^3.1.1:
   version "3.2.3"
   resolved "https://registry.yarnpkg.com/md5-file/-/md5-file-3.2.3.tgz#f9bceb941eca2214a4c0727f5e700314e770f06f"
@@ -15595,6 +15616,13 @@ simple-get@^3.0.3:
     once "^1.3.1"
     simple-concat "^1.0.0"
 
+simple-git@^1.85.0:
+  version "1.107.0"
+  resolved "https://registry.yarnpkg.com/simple-git/-/simple-git-1.107.0.tgz#12cffaf261c14d6f450f7fdb86c21ccee968b383"
+  integrity sha512-t4OK1JRlp4ayKRfcW6owrWcRVLyHRUlhGd0uN6ZZTqfDq8a5XpcUdOKiGRNobHEuMtNqzp0vcJNvhYWwh5PsQA==
+  dependencies:
+    debug "^4.0.1"
+
 simple-swizzle@^0.2.2:
   version "0.2.2"
   resolved "https://registry.yarnpkg.com/simple-swizzle/-/simple-swizzle-0.2.2.tgz#a4da6b635ffcccca33f70d17cb92592de95e557a"
@@ -16039,10 +16067,10 @@ stackframe@^1.0.4:
   resolved "https://registry.yarnpkg.com/stackframe/-/stackframe-1.0.4.tgz#357b24a992f9427cba6b545d96a14ed2cbca187b"
   integrity sha512-to7oADIniaYwS3MhtCa/sQhrxidCCQiF/qp4/m5iN3ipf0Y7Xlri0f6eG29r08aL7JYl8n32AF3Q5GYBZ7K8vw==
 
-staged-git-files@1.1.1:
-  version "1.1.1"
-  resolved "https://registry.yarnpkg.com/staged-git-files/-/staged-git-files-1.1.1.tgz#37c2218ef0d6d26178b1310719309a16a59f8f7b"
-  integrity sha512-H89UNKr1rQJvI1c/PIR3kiAMBV23yvR7LItZiV74HWZwzt7f3YHuujJ9nJZlt58WlFox7XQsOahexwk7nTe69A==
+staged-git-files@1.1.2:
+  version "1.1.2"
+  resolved "https://registry.yarnpkg.com/staged-git-files/-/staged-git-files-1.1.2.tgz#4326d33886dc9ecfa29a6193bf511ba90a46454b"
+  integrity sha512-0Eyrk6uXW6tg9PYkhi/V/J4zHp33aNyi2hOCmhFLqLTIhbgqWn5jlSzI+IU0VqrZq6+DbHcabQl/WP6P3BG0QA==
 
 stat-mode@^0.2.0:
   version "0.2.2"
@@ -17057,10 +17085,10 @@ typedarray@^0.0.6:
   resolved "https://registry.yarnpkg.com/typedarray/-/typedarray-0.0.6.tgz#867ac74e3864187b1d3d47d996a78ec5c8830777"
   integrity sha1-hnrHTjhkGHsdPUfZlqeOxciDB3c=
 
-typescript@^3.1.3:
-  version "3.1.3"
-  resolved "https://registry.yarnpkg.com/typescript/-/typescript-3.1.3.tgz#01b70247a6d3c2467f70c45795ef5ea18ce191d5"
-  integrity sha512-+81MUSyX+BaSo+u2RbozuQk/UWx6hfG0a5gHu4ANEM4sU96XbuIyAB+rWBW1u70c6a5QuZfuYICn3s2UjuHUpA==
+typescript@^3.1.6:
+  version "3.1.6"
+  resolved "https://registry.yarnpkg.com/typescript/-/typescript-3.1.6.tgz#b6543a83cfc8c2befb3f4c8fba6896f5b0c9be68"
+  integrity sha512-tDMYfVtvpb96msS1lDX9MEdHrW4yOuZ4Kdc4Him9oU796XldPYF/t2+uKoX0BBa0hXXwDlqYQbXY5Rzjzc5hBA==
 
 typography-normalize@^0.14.0:
   version "0.14.0"
@@ -18199,6 +18227,14 @@ wrap-ansi@^2.0.0:
     string-width "^1.0.1"
     strip-ansi "^3.0.1"
 
+wrap-ansi@^3.0.1:
+  version "3.0.1"
+  resolved "https://registry.yarnpkg.com/wrap-ansi/-/wrap-ansi-3.0.1.tgz#288a04d87eda5c286e060dfe8f135ce8d007f8ba"
+  integrity sha1-KIoE2H7aXChuBg3+jxNc6NAH+Lo=
+  dependencies:
+    string-width "^2.1.1"
+    strip-ansi "^4.0.0"
+
 wrap-fn@^0.1.0:
   version "0.1.5"
   resolved "https://registry.yarnpkg.com/wrap-fn/-/wrap-fn-0.1.5.tgz#f21b6e41016ff4a7e31720dbc63a09016bdf9845"