[
  {
    "path": ".gitignore",
    "content": "node_modules\n/dev\n/*.js\n"
  },
  {
    "path": ".npmignore",
    "content": "/*\n!dev/*.js\n!dev/package.json\n!*.js\n!README.md\n!package.json\n"
  },
  {
    "path": "README.md",
    "content": "# es-react\n\n> An ES6 module exposing the latest version of react, react-dom, react-is, and prop-types\n\nEver wanted to just import react into your project as a module **without** a build step or even script tags? Native browser support for module [imports](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Statements/import) is [pretty good](https://caniuse.com/#feat=es6-module) so this should be an option for react developers now! Alas, there has not been an ES6 module compatible build released yet.\n\nThis package allows you import `react` and `react-dom` as ES6 modules from a CDN like [`unpkg`](https://unpkg.com):\n\n```html\n<script type=\"module\">\n  import { React, ReactDOM, PropTypes } from 'https://unpkg.com/es-react';\n\n  ReactDOM.render(\n    React.createElement('h1', {}, 'Hello from es-react'),\n    document.body\n  );\n</script>\n```\n\nBy default es-react exports the **production build** of react. For the **development build** use the `/dev` subfolder:\n\n```js\nimport { React, ReactDOM } from 'https://unpkg.com/es-react/dev';\n```\n\nYou may also import any members of the React package directly:\n\n```js\nimport React, {\n  Component,\n  useState /* ... */,\n} from 'https://unpkg.com/es-react';\n```\n\nAnd every package is also being provided as a separate file:\n\n- `es-react/index.js`: Exports all of `React` and exports `{ React, ReactDOM, ReactIs, PropTypes }`\n- `es-react/react.js`: Exports all of `React` plus a default export\n- `es-react/react-dom.js`: Exports all of `ReactDOM` plus a default export (but not `react-dom/server`)\n- `es-react/react-is.js`: Exports all of `ReactIs` plus a default export\n- `es-react/prop-types.js`: Exports all of `PropTypes` plus a default export\n- `es-react/react-dom-server.js`: Exports all of `ReactDOMServerBrowser` plus a default export\n\nAll development-versions of these packages are also available under `es-react/dev/`.\n\n## Features\n\n- All the latest React features (hooks, suspense, lazy, memo etc.)\n- Use React directly from any javascript file (no build step required)\n- Compatible with [`htm`](https://github.com/developit/htm) (for JSX compilation at runtime)\n\n## Usage\n\nImport `React` and `ReactDOM` directly from any script with `type=\"module\"`. The package is intended to be available from [`unpkg`](https://unpkg.com) (without having to append `?module` to the package name).\n\n```js\nimport { React, ReactDOM } from 'https://unpkg.com/es-react@16.13.1';\n```\n\nIt is strongly advised that you specify a version when requesting the module – this speeds up the request time and helps with caching. If you don't specify a number then unpkg will redirect and serve up the latest available version.\n\n## Example\n\nCreate a new file, copy the code below into it and then open the file in a browser – or [try online](https://codepen.io/lukejacksonn/pen/EMxVWM).\n\n> If you would like the browser to reload when you update the code, then you can use a dev server like [servor](https://github.com/lukejacksonn/servor) dependency free by running `npx servor --reload --browse`.\n\n```js\n<script type=\"module\">\n  import { React, ReactDOM } from 'https://unpkg.com/es-react@16.13.1';\n\n  import htm from 'https://unpkg.com/htm?module'\n  const html = htm.bind(React.createElement)\n\n  const Counter = props => {\n    const [count, setCount] = React.useState(parseInt(props.count))\n    return html`\n      <div>\n        <h1>${count}</h1>\n        <button onClick=${e => setCount(count - 1)}>Decrement</button>\n        <button onClick=${e => setCount(count + 1)}>Increment</button>\n      </div>\n    `\n  }\n\n  ReactDOM.render(\n    html`\n      <h1>Look Ma! No script tags, no build step</h1>\n      <${Counter} count=0 />\n    `,\n    document.body\n  )\n\n</script>\n```\n\n## Implementation\n\nThe latest versions of all packages are installed via (pinned) entries in `package.json` and built and bundled using Rollup with automatic code splitting.\n\nThe exports of each package are automatically expanded and `object-assign` is stripped from the output, since all browsers that support ESM will also support `Object.assign`\n(See `scripts/expand-exports-plugin.js` and `scripts/replace-object-assign.js` for the Babel plugins that do this)\n\n## Acknowledgements\n\nBarely any of the code in this repo is written by myself. It is just a wrapper for React that is written and maintained by the team at Facebook. Thanks to my employer [Formidable](https://github.com/formidablelabs) for allowing me the time to think about and work on fun and experimental projects like this.\n"
  },
  {
    "path": "index.d.ts",
    "content": "import * as React from './react';\nimport * as ReactDOM from './react-dom';\nimport * as PropTypes from './prop-types';\n\nexport { React, ReactDOM, PropTypes };\nexport * from './react';\nexport default React;\n"
  },
  {
    "path": "index.html",
    "content": "<script type=\"module\">\n  import { React, ReactDOM } from './index.js';\n  ReactDOM.render(React.createElement('h1', {}, 'Works!'), document.body);\n</script>\n"
  },
  {
    "path": "package.json",
    "content": "{\n  \"name\": \"es-react\",\n  \"version\": \"16.13.1\",\n  \"description\": \"An ES6 module exposing the latest version of react and react-dom\",\n  \"module\": \"index.js\",\n  \"types\": \"index.d.ts\",\n  \"keywords\": [\n    \"react\",\n    \"es\",\n    \"module\",\n    \"import\",\n    \"export\"\n  ],\n  \"repository\": \"https://www.github.com/lukejacksonn/es-react\",\n  \"bugs\": {\n    \"url\": \"https://github.com/lukejacksonn/es-react/issues\"\n  },\n  \"scripts\": {\n    \"build\": \"rollup -c scripts/rollup.config.js\",\n    \"clean\": \"rimraf *.js dev\",\n    \"prepare-dev\": \"node ./scripts/write-dev-pkgjson.js\",\n    \"prepublishOnly\": \"run-s clean build prepare-dev\"\n  },\n  \"author\": \"@lukejacksonn\",\n  \"license\": \"MIT\",\n  \"devDependencies\": {\n    \"@babel/core\": \"^7.6.2\",\n    \"npm-run-all\": \"^4.1.5\",\n    \"prop-types\": \"15.7.2\",\n    \"react\": \"16.13.1\",\n    \"react-dom\": \"16.13.1\",\n    \"react-is\": \"16.13.1\",\n    \"rimraf\": \"^3.0.0\",\n    \"rollup\": \"^1.21.4\",\n    \"rollup-plugin-babel\": \"^4.3.3\",\n    \"rollup-plugin-commonjs\": \"^10.1.0\",\n    \"rollup-plugin-node-resolve\": \"^5.2.0\",\n    \"rollup-plugin-replace\": \"^2.2.0\"\n  },\n  \"dependencies\": {\n    \"@types/prop-types\": \"^15.7.3\",\n    \"@types/react\": \"^16.9.19\",\n    \"@types/react-dom\": \"^16.9.5\",\n    \"@types/react-is\": \"^16.7.1\"\n  }\n}\n"
  },
  {
    "path": "prop-types.d.ts",
    "content": "export * from 'prop-types';\n"
  },
  {
    "path": "react-dom.d.ts",
    "content": "export * from 'react-dom';\n"
  },
  {
    "path": "react-is.d.ts",
    "content": "export * from 'react-is';\n"
  },
  {
    "path": "react.d.ts",
    "content": "export {\n    Children,\n    Component,\n    Fragment,\n    Profiler,\n    PureComponent,\n    StrictMode,\n    Suspense,\n    cloneElement,\n    createContext,\n    createElement,\n    createFactory,\n    createRef,\n    forwardRef,\n    isValidElement,\n    lazy,\n    memo,\n    useCallback,\n    useContext,\n    useDebugValue,\n    useEffect,\n    useImperativeHandle,\n    useLayoutEffect,\n    useMemo,\n    useReducer,\n    useRef,\n    useState,\n    version\n} from 'react';\n"
  },
  {
    "path": "scripts/expand-exports-plugin.js",
    "content": "\nconst toIdentifierName = str => str.replace(/[^\\w]+/g, '');\n\n/** expand-exports-plugin for Babel\n * This plugin expands exports for CommonJS modules into granular\n * export-default and export-all declarations.\n *\n * It takes a \"map\" option that must be an object from\n * module names (e.g. 'react') to filenames.\n * It then replaces export-all declarations (i.e. \"export *\") with\n * granular exports that export all named keys and a default export.\n */\nconst expandExportsPlugin = ({ template, types: t }) => ({\n  visitor: {\n    ExportAllDeclaration(path, state) {\n      const { map } = state.opts;\n      const module = path.node.source.value;\n      const file = map[module];\n      // We retrieve the module name and filename from the map\n      if (typeof file === 'string') {\n        // We turn the module name to a safe identifier\n        const importId = t.identifier(toIdentifierName(module));\n        // We retrieve all exports via CommonJS in Node\n        const exportKeys = Object.keys(require(file));\n\n        // import %importId% from \"%file%;\n        const importNode = t.importDeclaration(\n          [t.importDefaultSpecifier(importId)],\n          t.stringLiteral(file)\n        );\n\n        // export default %importId%;\n        const defaultExportNode = t.exportDefaultDeclaration(importId);\n\n        // export const { %exportKeys% } = %importId%;\n        const exportsNode = t.exportNamedDeclaration(\n          t.variableDeclaration(\n            'const',\n            [t.variableDeclarator(\n              t.objectPattern(\n                exportKeys.map(name => {\n                  const identifier = t.identifier(name);\n                  return t.objectProperty(\n                    identifier,\n                    identifier,\n                    false,\n                    true\n                  );\n                })\n              ),\n              importId\n            )]\n          ),\n          []\n        );\n\n        // Replace the export-all declaration with new nodes\n        path.replaceWithMultiple([\n          importNode,\n          defaultExportNode,\n          exportsNode\n        ]);\n      }\n    }\n  }\n});\n\nexport default expandExportsPlugin;\n"
  },
  {
    "path": "scripts/replace-object-assign.js",
    "content": "const replaceAssignPlugin = ({ types: t }) => ({\n  visitor: {\n    CallExpression(path, state) {\n      const { callee, arguments: args } = path.node;\n\n      if (\n        t.isIdentifier(callee) &&\n        callee.name === 'require' &&\n        t.isStringLiteral(args[0]) &&\n        args[0].value === 'object-assign'\n      ) {\n        path.replaceWithSourceString('Object.assign');\n      }\n    }\n  }\n});\n\nexport default replaceAssignPlugin;\n"
  },
  {
    "path": "scripts/rollup.config.js",
    "content": "import commonjs from 'rollup-plugin-commonjs';\nimport nodeResolve from 'rollup-plugin-node-resolve';\nimport babel from 'rollup-plugin-babel';\nimport replace from 'rollup-plugin-replace';\n\nimport expandExportsPlugin from './expand-exports-plugin';\nimport replaceAssignPlugin from './replace-object-assign';\n\nconst exportsMap = (isProduction = false) => ({\n  react: `react/cjs/react.${isProduction ? 'production.min' : 'development'}.js`,\n  'react-is': `react-is/cjs/react-is.${isProduction ? 'production.min' : 'development'}.js`,\n  'react-dom': `react-dom/cjs/react-dom.${isProduction ? 'production.min' : 'development'}.js`,\n  'react-dom-server-browser': `react-dom/cjs/react-dom-server.browser.${isProduction ? 'production.min' : 'development'}.js`,\n  'prop-types': 'prop-types/index.js',\n});\n\nconst config = (isProduction = false) => ({\n  input: {\n    index: './src/index.js',\n    react: './src/react.js',\n    'react-is': './src/react-is.js',\n    'react-dom': './src/react-dom.js',\n    'react-dom-server-browser': './src/react-dom-server-browser.js',\n    'prop-types': './src/prop-types.js'\n  },\n  plugins: [\n    babel({\n      babelrc: false,\n      plugins: [\n        // This expands all our exports\n        [expandExportsPlugin, {\n          map: exportsMap(isProduction)\n        }],\n        // This replaces object-assign with native Object.assign\n        replaceAssignPlugin\n      ],\n    }),\n    nodeResolve({\n      mainFields: ['module', 'jsnext', 'main'],\n      browser: true,\n    }),\n    commonjs({\n      ignoreGlobal: true,\n      include: /\\/node_modules\\//,\n      namedExports: {\n        react: Object.keys(require('react')),\n        'react-is': Object.keys(require('react-is')),\n        'react-dom': Object.keys(require('react-dom')),\n        'react-dom-server-browser': Object.keys(require('react-dom/server.browser')),\n        'prop-types': Object.keys(require('prop-types')),\n      },\n    }),\n    replace({\n      'process.env.NODE_ENV': JSON.stringify(\n        isProduction ? 'production' : 'development'\n      )\n    })\n  ],\n  onwarn: () => {},\n  treeshake: {\n    moduleSideEffects: false,\n    propertyReadSideEffects: false\n  }\n});\n\nexport default [\n  {\n    ...config(true),\n    output: {\n      compact: true,\n      interop: false,\n      freeze: false,\n      dir: './',\n      entryFileNames: '[name].js',\n      chunkFileNames: '[name]-[hash].js',\n      format: 'esm'\n    }\n  },\n  {\n    ...config(false),\n    output: {\n      compact: true,\n      interop: false,\n      freeze: false,\n      dir: './dev',\n      entryFileNames: '[name].js',\n      chunkFileNames: '[name]-[hash].js',\n      format: 'esm'\n    }\n  }\n];\n"
  },
  {
    "path": "scripts/write-dev-pkgjson.js",
    "content": "#!/usr/bin/env node\n\nconst fs = require('fs');\nconst path = require('path');\n\nconst dir = path.resolve(__dirname, '../dev');\nif (!fs.existsSync(dir)) {\n  fs.mkdirSync(dir);\n}\n\nconst pathToPkgJson = path.resolve(dir, 'package.json');\nif (fs.existsSync(pathToPkgJson)) {\n  fs.unlinkSync(pathToPkgJson);\n}\n\nconst mainPkgJson = require('../package.json');\n\nconst contents = JSON.stringify(\n  {\n    name: '@es-react/dev',\n    version: mainPkgJson.version,\n    license: mainPkgJson.license,\n    private: true,\n    module: 'index.js',\n  },\n  undefined,\n  2\n);\n\nfs.writeFileSync(pathToPkgJson, contents);\n"
  },
  {
    "path": "src/index.js",
    "content": "import React from './react';\nimport ReactDOM from './react-dom';\nimport ReactDOMServerBrowser from './react-dom';\nimport PropTypes from './prop-types';\n\nexport { React, ReactDOM, ReactDOMServerBrowser, PropTypes };\nexport * from './react';\nexport default React;\n"
  },
  {
    "path": "src/prop-types.js",
    "content": "export * from 'prop-types';\n"
  },
  {
    "path": "src/react-dom-server-browser.js",
    "content": "export { default } from 'react-dom/server.browser';\n"
  },
  {
    "path": "src/react-dom.js",
    "content": "export * from 'react-dom';\n"
  },
  {
    "path": "src/react-is.js",
    "content": "export * from 'react-is';\n"
  },
  {
    "path": "src/react.js",
    "content": "export * from 'react';\n"
  }
]