@wordpress/element - npm Package Compare versions

Comparing version 3.2.0 to 4.0.0

build-module/react-platform.native.js

@@ -15,11 +15,25 @@ /**
 
-import { cloneElement } from './react';
+import { Component, cloneElement } from './react';
 
-const render = (element, id) => AppRegistry.registerComponent(id, () => propsFromParent => {
-  const parentProps = omit(propsFromParent || {}, ['rootTag']);
-  doAction('native.pre-render', parentProps);
-  const filteredProps = applyFilters('native.block_editor_props', parentProps);
-  doAction('native.render', filteredProps);
-  return cloneElement(element, filteredProps);
-});
+const render = (element, id) => {
+  class App extends Component {
+    constructor() {
+      super(...arguments);
+      const parentProps = omit(this.props || {}, ['rootTag']);
+      doAction('native.pre-render', parentProps);
+      this.filteredProps = applyFilters('native.block_editor_props', parentProps);
+    }
+
+    componentDidMount() {
+      doAction('native.render', this.filteredProps);
+    }
+
+    render() {
+      return cloneElement(element, this.filteredProps);
+    }
+
+  }
+
+  AppRegistry.registerComponent(id, () => App);
+};
 /**
@@ -26,0 +40,0 @@ * Render a given element on Native.

build/react-platform.native.js

@@ -27,9 +27,23 @@ "use strict";
  */
-const render = (element, id) => _reactNative.AppRegistry.registerComponent(id, () => propsFromParent => {
-  const parentProps = (0, _lodash.omit)(propsFromParent || {}, ['rootTag']);
-  (0, _hooks.doAction)('native.pre-render', parentProps);
-  const filteredProps = (0, _hooks.applyFilters)('native.block_editor_props', parentProps);
-  (0, _hooks.doAction)('native.render', filteredProps);
-  return (0, _react.cloneElement)(element, filteredProps);
-});
+const render = (element, id) => {
+  class App extends _react.Component {
+    constructor() {
+      super(...arguments);
+      const parentProps = (0, _lodash.omit)(this.props || {}, ['rootTag']);
+      (0, _hooks.doAction)('native.pre-render', parentProps);
+      this.filteredProps = (0, _hooks.applyFilters)('native.block_editor_props', parentProps);
+    }
+
+    componentDidMount() {
+      (0, _hooks.doAction)('native.render', this.filteredProps);
+    }
+
+    render() {
+      return (0, _react.cloneElement)(element, this.filteredProps);
+    }
+
+  }
+
+  _reactNative.AppRegistry.registerComponent(id, () => App);
+};
 /**
@@ -36,0 +50,0 @@ * Render a given element on Native.

CHANGELOG.md

@@ -5,2 +5,8 @@ <!-- Learn how to maintain this file at https://github.com/WordPress/gutenberg/tree/HEAD/packages#maintaining-changelogs. -->
 
+## 4.0.0 (2021-07-29)
+
+### Breaking Change
+
+-   Upgraded React components to work with v17.0 ([#29118](https://github.com/WordPress/gutenberg/pull/29118)). There are no new features in React v17.0 as explained in the [blog post](https://reactjs.org/blog/2020/10/20/react-v17.html).
+
 ## 3.2.0 (2021-07-21)
@@ -7,0 +13,0 @@

package.json

 {
 	"name": "@wordpress/element",
-	"version": "3.2.0",
+	"version": "4.0.0",
 	"description": "Element React module for WordPress.",
@@ -34,3 +34,3 @@ "author": "The WordPress Contributors",
 		"@types/react-dom": "^16.9.0",
-		"@wordpress/escape-html": "^2.2.0",
+		"@wordpress/escape-html": "^2.2.1",
 		"lodash": "^4.17.21",
@@ -43,3 +43,3 @@ "react": "^17.0.1",
 	},
-	"gitHead": "743b70f86f1e75fd66a583bf659f2b2fe5daf1cc"
+	"gitHead": "4e106dd6283fd742aeb521ebc0ae29f35d4274b4"
 }

README.md

@@ -281,4 +281,6 @@ # Element
 const placeholderLabel = Platform.select( {
-  native: __( 'Add media' ),
-  web: __( 'Drag images, upload new ones or select files from your library.' ),
+	native: __( 'Add media' ),
+	web: __(
+		'Drag images, upload new ones or select files from your library.'
+	),
 } );
@@ -416,5 +418,4 @@ ```
 
-
 <!-- END TOKEN(Autogenerated API docs) -->
 
 <br/><br/><p align="center"><img src="https://s.w.org/style/images/codeispoetry.png?1" alt="Code is Poetry." /></p>

src/react-platform.native.js

@@ -15,20 +15,31 @@ /**
  */
-import { cloneElement } from './react';
+import { Component, cloneElement } from './react';
 
-const render = ( element, id ) =>
-	AppRegistry.registerComponent( id, () => ( propsFromParent ) => {
-		const parentProps = omit( propsFromParent || {}, [ 'rootTag' ] );
+const render = ( element, id ) => {
+	class App extends Component {
+		constructor() {
+			super( ...arguments );
 
-		doAction( 'native.pre-render', parentProps );
+			const parentProps = omit( this.props || {}, [ 'rootTag' ] );
 
-		const filteredProps = applyFilters(
-			'native.block_editor_props',
-			parentProps
-		);
+			doAction( 'native.pre-render', parentProps );
 
-		doAction( 'native.render', filteredProps );
+			this.filteredProps = applyFilters(
+				'native.block_editor_props',
+				parentProps
+			);
+		}
 
-		return cloneElement( element, filteredProps );
-	} );
+		componentDidMount() {
+			doAction( 'native.render', this.filteredProps );
+		}
 
+		render() {
+			return cloneElement( element, this.filteredProps );
+		}
+	}
+
+	AppRegistry.registerComponent( id, () => App );
+};
+
 /**
@@ -35,0 +46,0 @@ * Render a given element on Native.

New alerts

License Policy Violation

License

This package is not allowed per your license policy. Review the package's license to ensure compliance.

Found 1 instance in 1 package

Fixed alerts

License Policy Violation

License

This package is not allowed per your license policy. Review the package's license to ensure compliance.

Found 1 instance in 1 package

Improved metrics

Total package byte prevSize

389361

increased by0.4%

Lines of code

4925

increased by0.59%

Number of lines in readme file

420

increased by0.24%

Dependency changes

• Updated@wordpress/escape-html@^2.2.1