		{
		"name": "react-keyed-flatten-children",
		"version": "1.1.0",
		"version": "1.2.0",
		"description": "Flattens React children and fragments to an array with predictable and stable keys",
		@@ -26,3 +26,2 @@ "main": "index.js",
		"files": [
		"index.ts",
		"index.js",
		@@ -29,0 +28,0 @@ "index.d.ts"

README.md

		@@ -26,5 +26,11 @@ # react-keyed-flatten-children
		- [Children.toArray does not return a flat array of all children](https://github.com/facebook/react/issues/6889), skipping Fragments by design.
		- Existing solutions exist, but they do not key the children, so you throw away valuable baked-in performance optimisations provided through stable keys.
		- Existing solutions exist, but they do not key the children they return, so you throw away valuable baked-in performance opportunities provided through stable keys.
		- You're probably doing something a little wild anyway, so you want the concept of "children" to as predictable as possible for you, and for the consumers of your library or component, [to avoid issues like this down the line](https://github.com/ReactTraining/react-router/issues/5785#issuecomment-351067856).

		[View the codesandbox here](https://codesandbox.io/s/react-keyed-flatten-children-example-yghsp) to get hands-on with how and when to utilise this module.

		### for using this in your app

		I've written a more straightforward, userland-focussed explanation in my article ["Fixing Children.toArray's thorny edges"](https://tommckenzie.dev/posts/react-keyed-flatten-children.html).

		### for library authors
		@@ -31,0 +37,0 @@

index.ts

react-keyed-flatten-children - npm Package Compare versions

New alerts