Merge pull request #22 from remarkablemark/feat/react-property

feat(react-property)!: use property from React 17

Author: remarkablemark

packages/react-property/README.md

@@ -4,9 +4,9 @@
 
 [![NPM version](https://img.shields.io/npm/v/react-property.svg)](https://www.npmjs.com/package/react-property)
 
-[HTML](https://github.com/facebook/react/blob/15-stable/src/renderers/dom/shared/HTMLDOMPropertyConfig.js) and [SVG](https://github.com/facebook/react/blob/15-stable/src/renderers/dom/shared/SVGDOMPropertyConfig.js) [DOM](https://github.com/facebook/react/blob/15-stable/src/renderers/dom/shared/DOMProperty.js) property configs used by [React](https://github.com/facebook/react).
+HTML and SVG DOM properties used by [React](https://github.com/facebook/react). See [DOMProperty](https://github.com/facebook/react/blob/main/packages/react-dom/src/shared/DOMProperty.js) and [possibleStandardNames](https://github.com/facebook/react/blob/main/packages/react-dom/src/shared/possibleStandardNames.js).
 
-[Repl.it](https://repl.it/@remarkablemark/react-property)
+Try [Replit](https://repl.it/@remarkablemark/react-property) demo.
 
 ## Install
 
@@ -16,7 +16,7 @@ npm install react-property
 
 ## Usage
 
-Import main module:
+Import module:
 
 ```js
 // CommonJS
@@ -26,50 +26,28 @@ const reactProperty = require('react-property');
 import reactProperty from 'react-property';
 ```
 
-Main module exports:
+Module contains:
 
 ```js
 {
-  html: {
-    autofocus: {
-      attributeName: 'autofocus',
-      propertyName: 'autoFocus',
-      mustUseProperty: false,
-      hasBooleanValue: true,
-      hasNumericValue: false,
-      hasPositiveNumericValue: false,
-      hasOverloadedBooleanValue: false
-    },
+  BOOLEAN: 3,
+  BOOLEANISH_STRING: 2,
+  NUMERIC: 5,
+  OVERLOADED_BOOLEAN: 4,
+  POSITIVE_NUMERIC: 6,
+  RESERVED: 0,
+  STRING: 1,
+  getPropertyInfo: [Function: getPropertyInfo],
+  isCustomAttribute: [Function: bound test],
+  possibleStandardNames: {
+    accept: 'accept',
+    acceptcharset: 'acceptCharset',
+    'accept-charset': 'acceptCharset',
     // ...
-  },
-  svg: {
-    // ...
-  },
-  properties: {
-    // ...
-  },
-  isCustomAttribute: [Function: bound test]
+  }
 }
 ```
 
-You may also import what you need:
-
-```js
-const HTMLDOMPropertyConfig = require('react-property/lib/HTMLDOMPropertyConfig');
-const injection = require('react-property/lib/injection');
-```
-
-## Layout
-
-```
-.
-├── index.js
-└── lib
-    ├── HTMLDOMPropertyConfig.js
-    ├── SVGDOMPropertyConfig.js
-    └── injection.js
-```
-
 ## License
 
-MIT. See [license](https://github.com/facebook/react/blob/15-stable/LICENSE) from original project.
+MIT. See [license](https://github.com/facebook/react/blob/main/LICENSE) from original project.

packages/react-property/babel.config.json

@@ -0,0 +1,3 @@
+{
+  "presets": ["@babel/preset-flow", "@babel/preset-env"]
+}

packages/react-property/index.js

@@ -2,12 +2,9 @@
   "name": "react-property",
   "version": "1.0.2",
   "description": "HTML and SVG DOM property configs used by React.",
-  "main": "index.js",
+  "main": "lib/index.js",
   "scripts": {
-    "build": "npm run build:html && npm run build:injection && npm run build:svg",
-    "build:html": "node scripts/build-html",
-    "build:injection": "node scripts/build-injection",
-    "build:svg": "node scripts/build-svg",
+    "build": "rollup -c rollup.config.possibleStandardNames.js && scripts/build.js && rollup -c",
     "clean": "rm -rf lib",
     "lint": "eslint --ignore-path .gitignore .",
     "lint:fix": "npm run lint -- --fix",
@@ -37,11 +34,15 @@
     "/lib"
   ],
   "devDependencies": {
+    "@babel/preset-env": "^7.15.4",
+    "@babel/preset-flow": "^7.14.5",
+    "@rollup/plugin-alias": "^3.1.5",
+    "@rollup/plugin-babel": "^5.3.0",
     "eslint": "^7.32.0",
     "eslint-plugin-prettier": "^4.0.0",
     "jest": "^27.1.0",
     "prettier": "^2.3.2",
-    "react-dom": "^15"
+    "rollup": "^2.56.3"
   },
   "license": "MIT"
 }

packages/react-property/package.json

@@ -0,0 +1,32 @@
+import alias from '@rollup/plugin-alias';
+import { babel } from '@rollup/plugin-babel';
+import { resolve } from 'path';
+
+export default {
+  input: 'src/index.js',
+  output: {
+    file: 'lib/index.js',
+    format: 'cjs'
+  },
+  plugins: [
+    alias({
+      entries: [
+        {
+          find: 'react-dom',
+          replacement: resolve(__dirname, '../../react/packages/react-dom')
+        },
+        {
+          find: 'shared',
+          replacement: resolve(__dirname, '../../react/packages/shared')
+        }
+      ]
+    }),
+    babel({
+      babelHelpers: 'bundled'
+    })
+  ],
+  treeshake: {
+    // remove undefined variables like `__PROFILE__` and `__DEV__`
+    unknownGlobalSideEffects: false
+  }
+};

packages/react-property/rollup.config.js

@@ -0,0 +1,19 @@
+import { babel } from '@rollup/plugin-babel';
+import { resolve } from 'path';
+
+export default {
+  input: resolve(
+    __dirname,
+    '../../react/packages/react-dom/src/shared/possibleStandardNames'
+  ),
+  output: {
+    exports: 'auto',
+    file: 'lib/possibleStandardNames.js',
+    format: 'cjs'
+  },
+  plugins: [
+    babel({
+      babelHelpers: 'bundled'
+    })
+  ]
+};