Migrate to ESM and Ink 4 (#16)

.github/workflows/test.yml

@@ -1,19 +1,20 @@
 name: test
-on: [push]
+on: [push, pull_request]
 
 jobs:
   test:
     name: Node.js ${{ matrix.node_version }}
     runs-on: ubuntu-latest
     strategy:
       matrix:
-        node_version: [10, 12]
+        node_version: [14, 16, 18]
 
     steps:
-      - uses: actions/checkout@master
+      - uses: actions/checkout@v3
       - name: Use Node.js ${{ matrix.node_version }}
-        uses: actions/setup-node@v1
+        uses: actions/setup-node@v3
         with:
           node-version: ${{ matrix.node_version }}
+      - run: npm install --global npm@latest
       - run: npm install
       - run: npm test

package.json

@@ -9,10 +9,13 @@
 		"email": "[email protected]",
 		"url": "github.com/vadimdemedes"
 	},
-	"main": "build",
-	"types": "build/index.d.ts",
+	"type": "module",
+	"exports": {
+		"types": "./build/index.d.ts",
+		"default": "./build/index.js"
+	},
 	"engines": {
-		"node": ">=10"
+		"node": ">=14.16"
 	},
 	"scripts": {
 		"test": "tsc && xo && ava",
@@ -32,52 +35,41 @@
 		"react"
 	],
 	"dependencies": {
-		"cli-spinners": "^2.3.0"
+		"cli-spinners": "^2.7.0"
 	},
 	"devDependencies": {
-		"@ava/babel": "^1.0.1",
-		"@babel/preset-react": "^7.10.1",
-		"@sindresorhus/tsconfig": "^0.7.0",
-		"@types/react": "^16.9.46",
-		"@vdemedes/prettier-config": "^1.0.0",
-		"ava": "^3.9.0",
-		"delay": "^4.1.0",
-		"eslint-config-xo-react": "^0.23.0",
-		"eslint-plugin-react": "^7.20.0",
-		"eslint-plugin-react-hooks": "^4.0.4",
-		"husky": "^4.2.5",
-		"ink": "^3.0.0-4",
-		"ink-testing-library": "^2.0.0",
+		"@sindresorhus/tsconfig": "^3.0.1",
+		"@types/react": "^18.0.0",
+		"@vdemedes/prettier-config": "^1.0.1",
+		"ava": "^5.1.1",
+		"delay": "^5.0.0",
+		"eslint-config-xo-react": "^0.27.0",
+		"eslint-plugin-react": "^7.32.2",
+		"eslint-plugin-react-hooks": "^4.6.0",
+		"ink": "^4.0.0",
+		"ink-testing-library": "^3.0.0",
 		"prettier": "^2.0.5",
-		"pretty-quick": "^2.0.1",
-		"react": "^16.8.2",
-		"typescript": "^3.9.5",
-		"xo": "^0.32.0"
+		"react": "^18.0.0",
+		"ts-node": "^10.9.1",
+		"typescript": "^4.9.5",
+		"xo": "^0.53.0"
 	},
 	"peerDependencies": {
-		"react": ">=16.8.2",
-		"ink": ">=3.0.5"
+		"ink": ">=4.0.0",
+		"react": ">=18.0.0"
 	},
 	"ava": {
-		"babel": {
-			"testOptions": {
-				"presets": [
-					"@babel/preset-react"
-				]
-			}
-		}
+		"extensions": {
+			"ts": "module",
+			"tsx": "module"
+		},
+		"nodeArguments": [
+			"--loader=ts-node/esm"
+		]
 	},
 	"xo": {
 		"extends": "xo-react",
-		"prettier": true,
-		"rules": {
-			"react/prop-types": "off"
-		}
+		"prettier": true
 	},
-	"prettier": "@vdemedes/prettier-config",
-	"husky": {
-		"hooks": {
-			"pre-commit": "pretty-quick --staged"
-		}
-	}
+	"prettier": "@vdemedes/prettier-config"
 }

source/index.tsx

@@ -1,24 +1,22 @@
-import * as React from 'react';
-import {useState, useEffect} from 'react';
-import type {FC} from 'react';
+import React, {useState, useEffect} from 'react';
 import {Text} from 'ink';
-import * as spinners from 'cli-spinners';
+import spinners from 'cli-spinners';
 import type {SpinnerName} from 'cli-spinners';
 
-interface Props {
+type Props = {
 	/**
 	 * Type of a spinner.
 	 * See [cli-spinners](https://github.com/sindresorhus/cli-spinners) for available spinners.
 	 *
 	 * @default dots
 	 */
 	type?: SpinnerName;
-}
+};
 
 /**
  * Spinner.
  */
-const Spinner: FC<Props> = ({type = 'dots'}) => {
+function Spinner({type = 'dots'}: Props) {
 	const [frame, setFrame] = useState(0);
 	const spinner = spinners[type];
 
@@ -36,6 +34,6 @@ const Spinner: FC<Props> = ({type = 'dots'}) => {
 	}, [spinner]);
 
 	return <Text>{spinner.frames[frame]}</Text>;
-};
+}
 
 export default Spinner;

test.js → test/test.tsx

@@ -1,9 +1,10 @@
+import process from 'node:process';
 import React from 'react';
 import {render} from 'ink-testing-library';
 import spinners from 'cli-spinners';
 import test from 'ava';
 import delay from 'delay';
-import Spinner from '.';
+import Spinner from '../source/index.js';
 
 test('render spinner', async t => {
 	const spinner = spinners.dots;
@@ -14,7 +15,7 @@ test('render spinner', async t => {
 
 	const uniqueFrames = [...new Set(frames)];
 
-	if (process.env.CI && uniqueFrames[uniqueFrames.length - 1] === '\n') {
+	if (process.env['CI'] && uniqueFrames[uniqueFrames.length - 1] === '\n') {
 		uniqueFrames.pop();
 	}
 

test/tsconfig.json

@@ -0,0 +1,4 @@
+{
+	"extends": "../tsconfig.json",
+	"include": ["**/*.*"]
+}

tsconfig.json

@@ -2,7 +2,12 @@
 	"extends": "@sindresorhus/tsconfig",
 	"compilerOptions": {
 		"outDir": "build",
-		"target": "es2018",
-		"lib": ["es2018"]
+		"sourceMap": true,
+		"esModuleInterop": true
+	},
+	"include": ["source"],
+	"ts-node": {
+		"transpileOnly": true,
+		"files": true
 	}
 }