Merge pull request #196 from transitive-bullshit/v2-hooks

Change templates to use hooks

Author: CarterMcAlister

packages/create-react-library/template/example/src/App.js

@@ -1,14 +1,9 @@
-import React, { Component } from 'react'
+import React from 'react'
 import './App.css'
 
 import ExampleComponent from '{{name}}'
 
-class App extends Component {
-  render() {
-    return (
-      <ExampleComponent text='Create React Library Example' />
-    )
-  }
-}
+const App = () =>
+  <ExampleComponent text='Create React Library Example' />
 
 export default App

packages/create-react-library/template/package.json

@@ -25,9 +25,11 @@
   "peerDependencies": {
     "react": ">=16.8"
   },
+{{#unless typescript}}
   "dependencies": {
     "prop-types": "^15.7.2"
   },
+{{/unless}}
   "devDependencies": {
 {{#if typescript}}    "@types/jest": "^24.0.11",
     "@types/react": "^16.8.13",

packages/create-react-library/template/src/index.js

@@ -1,22 +1,14 @@
-import React, { Component } from 'react'
+import React from 'react'
 import PropTypes from 'prop-types'
 
 import styles from './styles.css'
 
-export default class ExampleComponent extends Component {
-  static propTypes = {
-    text: PropTypes.string
-  }
+const ExampleComponent = ({ text }) =>
+  <div className={styles.test}>Example Component: {text}</div>
 
-  render() {
-    const {
-      text
-    } = this.props
 
-    return (
-      <div className={styles.test}>
-        Example Component: {text}
-      </div>
-    )
-  }
+ExampleComponent.propTypes = {
+  text: PropTypes.string
 }
+
+export default ExampleComponent

packages/create-react-library/template/src/index.tsx

@@ -1,19 +1,11 @@
 import React from 'react'
-
 import styles from './styles.css'
 
-export type Props = { text: string }
+const ExampleComponent: React.FC<ExampleComponentProps> = ({text}) =>
+  <div className={styles.test}>Example Component: {text}</div>
 
-export default class ExampleComponent extends React.Component<Props> {
-  render() {
-    const {
-      text
-    } = this.props
+type ExampleComponentProps = {
+  text: string
+}
 
-    return (
-      <div className={styles.test}>
-        Example Component: {text}
-      </div>
-    )
-  }
-}
+export default ExampleComponent