typescript(vx-group): re-write package in TypeScript

.gitignore

@@ -39,6 +39,8 @@ jest.config.js
 prettier.config.js
 tsconfig.eslint.json
 tsconfig.json
+tsconfig.options.json
+*.tsbuildinfo
 webpack.config.js
 
 # Lock files, libs should not have lock files

.npmignore

@@ -40,4 +40,6 @@ jest.config.js
 prettier.config.js
 tsconfig.eslint.json
 tsconfig.json
+tsconfig.options.json
+*.tsbuildinfo
 webpack.config.js

package.json

@@ -17,7 +17,7 @@
   "author": "@hshoff",
   "private": true,
   "scripts": {
-    "build": "yarn run babel",
+    "build": "yarn run babel && yarn run type:dts",
     "build-one": "nimbus babel --clean",
     "babel": "yarn run babel:cjs && yarn run babel:esm",
     "babel:cjs": "nimbus babel --clean --workspaces=\"@vx/!(demo)\"",
@@ -31,6 +31,7 @@
     "precommit": "lint-staged",
     "setup": "yarn run build",
     "test": "yarn run jest",
+    "type:dts": "nimbus typescript --build --reference-workspaces",
     "docs": "yarn run docs:gen && node ./scripts/docs/index.js",
     "docs:gen": "lerna run docs",
     "prepare-release": "git checkout master && git pull --rebase origin master && yarn run docs && lerna updated",
@@ -47,7 +48,12 @@
     "@airbnb/config-eslint": "^2.0.0",
     "@airbnb/config-jest": "^2.0.0",
     "@airbnb/config-prettier": "^2.0.0",
+    "@airbnb/config-typescript": "^2.0.0",
     "@airbnb/nimbus": "^2.0.0",
+    "@types/enzyme": "^3.10.3",
+    "@types/jest": "^24.0.18",
+    "@types/jsdom": "^12.2.4",
+    "@types/react-test-renderer": "^16.9.0",
     "coveralls": "^3.0.6",
     "enzyme": "^3.10.0",
     "enzyme-adapter-react-16": "^1.14.0",
@@ -72,13 +78,19 @@
       "babel",
       "eslint",
       "jest",
-      "prettier"
+      "prettier",
+      "typescript"
     ],
     "settings": {
       "library": true,
       "react": true,
       "next": true
     },
+    "typescript": {
+      "compilerOptions": {
+        "emitDeclarationOnly": true
+      }
+    },
     "jest": {
       "coverageReporters": [
         "json"
@@ -120,6 +132,7 @@
             "import/prefer-default-export": "off",
             "promise/param-names": "off",
             "react/sort-comp": "off",
+            "react/jsx-curly-brace-presence": "off",
             "react/jsx-filename-extension": "off",
             "react/jsx-no-literals": "off",
             "react/jsx-props-no-spreading": "off",

packages/vx-group/package.json

@@ -12,6 +12,7 @@
   "scripts": {
     "docs": "cd ./docs && ../../../node_modules/.bin/react-docgen --exclude index.js ../src  | ../../../scripts/buildDocs.sh"
   },
+  "types": "lib/index.d.ts",
   "repository": {
     "type": "git",
     "url": "git+https://github.com/hshoff/vx.git"
@@ -34,6 +35,8 @@
     "react": "^15.0.0-0 || ^16.0.0-0"
   },
   "dependencies": {
+    "@types/classnames": "^2.2.9",
+    "@types/react": "*",
     "classnames": "^2.2.5",
     "prop-types": "^15.6.2"
   },

packages/vx-group/src/Group.jsx → packages/vx-group/src/Group.tsx

@@ -1,14 +1,13 @@
 import React from 'react';
 import cx from 'classnames';
-import PropTypes from 'prop-types';
 
-Group.propTypes = {
-  top: PropTypes.number,
-  left: PropTypes.number,
-  transform: PropTypes.string,
-  className: PropTypes.string,
-  children: PropTypes.any,
-  innerRef: PropTypes.oneOfType([PropTypes.func, PropTypes.object]),
+type GroupProps = {
+  top?: number;
+  left?: number;
+  transform?: string;
+  className?: string;
+  children?: React.ReactNode;
+  innerRef?: React.Ref<SVGGElement>;
 };
 
 export default function Group({
@@ -19,7 +18,7 @@ export default function Group({
   children,
   innerRef,
   ...restProps
-}) {
+}: GroupProps & Omit<React.SVGProps<SVGGElement>, keyof GroupProps>) {
   return (
     <g
       ref={innerRef}