Support React 17

Fixes #466

package.json

@@ -48,9 +48,9 @@
 		"is-ci": "^2.0.0",
 		"lodash": "^4.17.20",
 		"patch-console": "^1.0.0",
-		"react-devtools-core": "^4.6.0",
-		"react-reconciler": "^0.24.0",
-		"scheduler": "^0.18.0",
+		"react-devtools-core": "^4.19.1",
+		"react-reconciler": "^0.26.2",
+		"scheduler": "^0.20.2",
 		"signal-exit": "^3.0.2",
 		"slice-ansi": "^3.0.0",
 		"stack-utils": "^2.0.2",
@@ -66,9 +66,9 @@
 		"@types/is-ci": "^2.0.0",
 		"@types/lodash": "^4.14.161",
 		"@types/node": "*",
-		"@types/react": "^16.9.41",
-		"@types/react-reconciler": "^0.18.0",
-		"@types/scheduler": "^0.16.1",
+		"@types/react": "^17.0.27",
+		"@types/react-reconciler": "^0.26.4",
+		"@types/scheduler": "^0.16.2",
 		"@types/signal-exit": "^3.0.0",
 		"@types/sinon": "^9.0.4",
 		"@types/slice-ansi": "^4.0.0",
@@ -91,7 +91,7 @@
 		"node-pty": "^0.9.0",
 		"p-queue": "^6.2.1",
 		"prettier": "^2.0.4",
-		"react": "^16.9.0",
+		"react": "^17.0.2",
 		"sinon": "^8.1.1",
 		"strip-ansi": "^6.0.0",
 		"ts-node": "7.0.0",

src/ink.tsx

@@ -74,7 +74,13 @@ export default class Ink {
 		// so that it's rerendered every time, not just new static parts, like in non-debug mode
 		this.fullStaticOutput = '';
 
-		this.container = reconciler.createContainer(this.rootNode, false, false);
+		this.container = reconciler.createContainer(
+			this.rootNode,
+			// Legacy mode
+			0,
+			false,
+			null
+		);
 
 		// Unmount when process exits
 		this.unsubscribeExit = signalExit(this.unmount, {alwaysLast: false});

src/reconciler.ts

@@ -13,7 +13,6 @@ import {
 	setTextNodeValue,
 	createNode,
 	setAttribute,
-	DOMNode,
 	DOMNodeAttribute,
 	TextNode,
 	ElementNames,
@@ -48,7 +47,8 @@ export default createReconciler<
 	Props,
 	DOMElement,
 	DOMElement,
-	DOMNode,
+	TextNode,
+	DOMElement,
 	unknown,
 	unknown,
 	HostContext,
@@ -64,7 +64,10 @@ export default createReconciler<
 	getRootHostContext: () => ({
 		isInsideText: false
 	}),
-	prepareForCommit: () => {},
+	prepareForCommit: () => null,
+	preparePortalMount: () => null,
+	clearContainer: () => false,
+	shouldDeprioritizeSubtree: () => false,
 	resetAfterCommit: rootNode => {
 		// Since renders are throttled at the instance level and <Static> component children
 		// are rendered only once and then get deleted, we need an escape hatch to
@@ -131,17 +134,17 @@ export default createReconciler<
 		return createTextNode(text);
 	},
 	resetTextContent: () => {},
-	hideTextInstance: (node: TextNode): void => {
+	hideTextInstance: node => {
 		setTextNodeValue(node, '');
 	},
-	unhideTextInstance: (node: TextNode, text: string): void => {
+	unhideTextInstance: (node, text) => {
 		setTextNodeValue(node, text);
 	},
 	getPublicInstance: instance => instance,
-	hideInstance: (node: DOMElement): void => {
+	hideInstance: node => {
 		node.yogaNode?.setDisplay(Yoga.DISPLAY_NONE);
 	},
-	unhideInstance: (node: DOMElement): void => {
+	unhideInstance: node => {
 		node.yogaNode?.setDisplay(Yoga.DISPLAY_FLEX);
 	},
 	appendInitialChild: appendChildNode,
@@ -236,7 +239,7 @@ export default createReconciler<
 		}
 	},
 	commitTextUpdate: (node, _oldText, newText) => {
-		setTextNodeValue(node as TextNode, newText);
+		setTextNodeValue(node, newText);
 	},
 	removeChild: (node, removeNode) => {
 		removeChildNode(node, removeNode);