refactor(wrapper): use PropsWithChildren

example/package-lock.json

@@ -27,7 +27,7 @@
     },
     "..": {
       "name": "react-flow-renderer",
-      "version": "10.0.7",
+      "version": "10.0.9-next.0",
       "license": "MIT",
       "dependencies": {
         "@babel/runtime": "^7.17.8",
@@ -47,7 +47,6 @@
         "@rollup/plugin-commonjs": "^21.0.2",
         "@rollup/plugin-node-resolve": "^13.1.3",
         "@rollup/plugin-replace": "^4.0.0",
-        "@svgr/rollup": "^6.2.1",
         "@types/d3": "^7.1.0",
         "@types/react": "^17.0.40",
         "@types/resize-observer-browser": "^0.1.7",
@@ -61,17 +60,19 @@
         "react": "^17.0.2",
         "react-dom": "^17.0.2",
         "release-it": "^14.12.5",
+        "rimraf": "^3.0.2",
         "rollup": "^2.70.1",
         "rollup-plugin-livereload": "^2.0.5",
         "rollup-plugin-postcss": "^4.0.2",
         "rollup-plugin-serve": "^1.1.0",
+        "rollup-plugin-terser": "^7.0.2",
         "rollup-plugin-typescript2": "^0.31.2",
         "rollup-plugin-visualizer": "^5.6.0",
         "start-server-and-test": "^1.14.0",
         "typescript": "^4.6.2"
       },
       "engines": {
-        "node": ">=12"
+        "node": ">=14"
       },
       "peerDependencies": {
         "react": "16 || 17",
@@ -1335,20 +1336,6 @@
         "@babel/core": "^7.0.0-0"
       }
     },
-    "../node_modules/@babel/plugin-transform-react-constant-elements": {
-      "version": "7.14.5",
-      "dev": true,
-      "license": "MIT",
-      "dependencies": {
-        "@babel/helper-plugin-utils": "^7.14.5"
-      },
-      "engines": {
-        "node": ">=6.9.0"
-      },
-      "peerDependencies": {
-        "@babel/core": "^7.0.0-0"
-      }
-    },
     "../node_modules/@babel/plugin-transform-react-display-name": {
       "version": "7.16.7",
       "dev": true,
@@ -2103,259 +2090,6 @@
         "url": "https://github.com/sindresorhus/is?sponsor=1"
       }
     },
-    "../node_modules/@svgr/babel-plugin-add-jsx-attribute": {
-      "version": "6.0.0",
-      "dev": true,
-      "license": "MIT",
-      "engines": {
-        "node": ">=10"
-      },
-      "funding": {
-        "type": "github",
-        "url": "https://github.com/sponsors/gregberge"
-      },
-      "peerDependencies": {
-        "@babel/core": "^7.0.0-0"
-      }
-    },
-    "../node_modules/@svgr/babel-plugin-remove-jsx-attribute": {
-      "version": "6.0.0",
-      "dev": true,
-      "license": "MIT",
-      "engines": {
-        "node": ">=10"
-      },
-      "funding": {
-        "type": "github",
-        "url": "https://github.com/sponsors/gregberge"
-      },
-      "peerDependencies": {
-        "@babel/core": "^7.0.0-0"
-      }
-    },
-    "../node_modules/@svgr/babel-plugin-remove-jsx-empty-expression": {
-      "version": "6.0.0",
-      "dev": true,
-      "license": "MIT",
-      "engines": {
-        "node": ">=10"
-      },
-      "funding": {
-        "type": "github",
-        "url": "https://github.com/sponsors/gregberge"
-      },
-      "peerDependencies": {
-        "@babel/core": "^7.0.0-0"
-      }
-    },
-    "../node_modules/@svgr/babel-plugin-replace-jsx-attribute-value": {
-      "version": "6.0.0",
-      "dev": true,
-      "license": "MIT",
-      "engines": {
-        "node": ">=10"
-      },
-      "funding": {
-        "type": "github",
-        "url": "https://github.com/sponsors/gregberge"
-      },
-      "peerDependencies": {
-        "@babel/core": "^7.0.0-0"
-      }
-    },
-    "../node_modules/@svgr/babel-plugin-svg-dynamic-title": {
-      "version": "6.0.0",
-      "dev": true,
-      "license": "MIT",
-      "engines": {
-        "node": ">=10"
-      },
-      "funding": {
-        "type": "github",
-        "url": "https://github.com/sponsors/gregberge"
-      },
-      "peerDependencies": {
-        "@babel/core": "^7.0.0-0"
-      }
-    },
-    "../node_modules/@svgr/babel-plugin-svg-em-dimensions": {
-      "version": "6.0.0",
-      "dev": true,
-      "license": "MIT",
-      "engines": {
-        "node": ">=10"
-      },
-      "funding": {
-        "type": "github",
-        "url": "https://github.com/sponsors/gregberge"
-      },
-      "peerDependencies": {
-        "@babel/core": "^7.0.0-0"
-      }
-    },
-    "../node_modules/@svgr/babel-plugin-transform-react-native-svg": {
-      "version": "6.0.0",
-      "dev": true,
-      "license": "MIT",
-      "engines": {
-        "node": ">=10"
-      },
-      "funding": {
-        "type": "github",
-        "url": "https://github.com/sponsors/gregberge"
-      },
-      "peerDependencies": {
-        "@babel/core": "^7.0.0-0"
-      }
-    },
-    "../node_modules/@svgr/babel-plugin-transform-svg-component": {
-      "version": "6.2.0",
-      "dev": true,
-      "license": "MIT",
-      "engines": {
-        "node": ">=12"
-      },
-      "funding": {
-        "type": "github",
-        "url": "https://github.com/sponsors/gregberge"
-      },
-      "peerDependencies": {
-        "@babel/core": "^7.0.0-0"
-      }
-    },
-    "../node_modules/@svgr/babel-preset": {
-      "version": "6.2.0",
-      "dev": true,
-      "license": "MIT",
-      "dependencies": {
-        "@svgr/babel-plugin-add-jsx-attribute": "^6.0.0",
-        "@svgr/babel-plugin-remove-jsx-attribute": "^6.0.0",
-        "@svgr/babel-plugin-remove-jsx-empty-expression": "^6.0.0",
-        "@svgr/babel-plugin-replace-jsx-attribute-value": "^6.0.0",
-        "@svgr/babel-plugin-svg-dynamic-title": "^6.0.0",
-        "@svgr/babel-plugin-svg-em-dimensions": "^6.0.0",
-        "@svgr/babel-plugin-transform-react-native-svg": "^6.0.0",
-        "@svgr/babel-plugin-transform-svg-component": "^6.2.0"
-      },
-      "engines": {
-        "node": ">=10"
-      },
-      "funding": {
-        "type": "github",
-        "url": "https://github.com/sponsors/gregberge"
-      },
-      "peerDependencies": {
-        "@babel/core": "^7.0.0-0"
-      }
-    },
-    "../node_modules/@svgr/core": {
-      "version": "6.2.1",
-      "dev": true,
-      "license": "MIT",
-      "dependencies": {
-        "@svgr/plugin-jsx": "^6.2.1",
-        "camelcase": "^6.2.0",
-        "cosmiconfig": "^7.0.1"
-      },
-      "engines": {
-        "node": ">=10"
-      },
-      "funding": {
-        "type": "github",
-        "url": "https://github.com/sponsors/gregberge"
-      }
-    },
-    "../node_modules/@svgr/hast-util-to-babel-ast": {
-      "version": "6.2.1",
-      "dev": true,
-      "license": "MIT",
-      "dependencies": {
-        "@babel/types": "^7.15.6",
-        "entities": "^3.0.1"
-      },
-      "engines": {
-        "node": ">=10"
-      },
-      "funding": {
-        "type": "github",
-        "url": "https://github.com/sponsors/gregberge"
-      }
-    },
-    "../node_modules/@svgr/hast-util-to-babel-ast/node_modules/entities": {
-      "version": "3.0.1",
-      "dev": true,
-      "license": "BSD-2-Clause",
-      "engines": {
-        "node": ">=0.12"
-      },
-      "funding": {
-        "url": "https://github.com/fb55/entities?sponsor=1"
-      }
-    },
-    "../node_modules/@svgr/plugin-jsx": {
-      "version": "6.2.1",
-      "dev": true,
-      "license": "MIT",
-      "dependencies": {
-        "@babel/core": "^7.15.5",
-        "@svgr/babel-preset": "^6.2.0",
-        "@svgr/hast-util-to-babel-ast": "^6.2.1",
-        "svg-parser": "^2.0.2"
-      },
-      "engines": {
-        "node": ">=10"
-      },
-      "funding": {
-        "type": "github",
-        "url": "https://github.com/sponsors/gregberge"
-      },
-      "peerDependencies": {
-        "@svgr/core": "^6.0.0"
-      }
-    },
-    "../node_modules/@svgr/plugin-svgo": {
-      "version": "6.2.0",
-      "dev": true,
-      "license": "MIT",
-      "dependencies": {
-        "cosmiconfig": "^7.0.1",
-        "deepmerge": "^4.2.2",
-        "svgo": "^2.5.0"
-      },
-      "engines": {
-        "node": ">=10"
-      },
-      "funding": {
-        "type": "github",
-        "url": "https://github.com/sponsors/gregberge"
-      },
-      "peerDependencies": {
-        "@svgr/core": "^6.0.0"
-      }
-    },
-    "../node_modules/@svgr/rollup": {
-      "version": "6.2.1",
-      "dev": true,
-      "license": "MIT",
-      "dependencies": {
-        "@babel/core": "^7.15.5",
-        "@babel/plugin-transform-react-constant-elements": "^7.14.5",
-        "@babel/preset-env": "^7.15.6",
-        "@babel/preset-react": "^7.14.5",
-        "@babel/preset-typescript": "^7.16.0",
-        "@svgr/core": "^6.2.1",
-        "@svgr/plugin-jsx": "^6.2.1",
-        "@svgr/plugin-svgo": "^6.2.0",
-        "rollup-pluginutils": "^2.8.2"
-      },
-      "engines": {
-        "node": ">=10"
-      },
-      "funding": {
-        "type": "github",
-        "url": "https://github.com/sponsors/gregberge"
-      }
-    },
     "../node_modules/@szmarczak/http-timer": {
       "version": "4.0.6",
       "dev": true,
@@ -4651,7 +4385,9 @@
       }
     },
     "../node_modules/follow-redirects": {
-      "version": "1.14.2",
+      "version": "1.14.9",
+      "resolved": "https://registry.npmjs.org/follow-redirects/-/follow-redirects-1.14.9.tgz",
+      "integrity": "sha512-MQDfihBQYMcyy5dhRDJUHcw7lb2Pv/TuE6xP1vyraLukNDHKbDxDNaOE3NbCAdKQApno+GPRyo1YAp89yCjK4w==",
       "dev": true,
       "funding": [
         {
@@ -4659,7 +4395,6 @@
           "url": "https://github.com/sponsors/RubenVerborgh"
         }
       ],
-      "license": "MIT",
       "engines": {
         "node": ">=4.0"
       },
@@ -6081,9 +5816,10 @@
       }
     },
     "../node_modules/minimist": {
-      "version": "1.2.5",
+      "version": "1.2.6",
-      "dev": true,
+      "resolved": "https://registry.npmjs.org/minimist/-/minimist-1.2.6.tgz",
-      "license": "MIT"
+      "integrity": "sha512-Jsjnk4bw3YJqYzbdyBiNsPWHPfO++UGG749Cxs6peCu5Xg4nrena6OVxOYxrQTqww0Jmwt+Ref8rggumkTLz9Q==",
+      "dev": true
     },
     "../node_modules/ms": {
       "version": "2.1.2",
@@ -8853,11 +8589,6 @@
         "node": ">=4"
       }
     },
-    "../node_modules/svg-parser": {
-      "version": "2.0.4",
-      "dev": true,
-      "license": "MIT"
-    },
     "../node_modules/svgo": {
       "version": "2.8.0",
       "dev": true,
@@ -20251,8 +19982,9 @@
       }
     },
     "node_modules/minimist": {
-      "version": "1.2.5",
+      "version": "1.2.6",
-      "license": "MIT"
+      "resolved": "https://registry.npmjs.org/minimist/-/minimist-1.2.6.tgz",
+      "integrity": "sha512-Jsjnk4bw3YJqYzbdyBiNsPWHPfO++UGG749Cxs6peCu5Xg4nrena6OVxOYxrQTqww0Jmwt+Ref8rggumkTLz9Q=="
     },
     "node_modules/mkdirp": {
       "version": "0.5.5",
@@ -20324,9 +20056,9 @@
       }
     },
     "node_modules/node-forge": {
-      "version": "1.2.1",
+      "version": "1.3.1",
-      "resolved": "https://registry.npmjs.org/node-forge/-/node-forge-1.2.1.tgz",
+      "resolved": "https://registry.npmjs.org/node-forge/-/node-forge-1.3.1.tgz",
-      "integrity": "sha512-Fcvtbb+zBcZXbTTVwqGA5W+MKBj56UjVRevvchv5XrcyXbmNdesfZL37nlcWOfpgHhgmxApw3tQbTr4CqNmX4w==",
+      "integrity": "sha512-dPEtOeMvF9VMcYV/1Wb8CPoVAXtp6MKMlcbAt4ddqmGqUJ6fQZFXkNZNkNlfevtNkGtaSoXf/vNNNSvgrdXwtA==",
       "engines": {
         "node": ">= 6.13.0"
       }
@@ -32880,7 +32612,9 @@
       }
     },
     "minimist": {
-      "version": "1.2.5"
+      "version": "1.2.6",
+      "resolved": "https://registry.npmjs.org/minimist/-/minimist-1.2.6.tgz",
+      "integrity": "sha512-Jsjnk4bw3YJqYzbdyBiNsPWHPfO++UGG749Cxs6peCu5Xg4nrena6OVxOYxrQTqww0Jmwt+Ref8rggumkTLz9Q=="
     },
     "mkdirp": {
       "version": "0.5.5",
@@ -32935,9 +32669,9 @@
       }
     },
     "node-forge": {
-      "version": "1.2.1",
+      "version": "1.3.1",
-      "resolved": "https://registry.npmjs.org/node-forge/-/node-forge-1.2.1.tgz",
+      "resolved": "https://registry.npmjs.org/node-forge/-/node-forge-1.3.1.tgz",
-      "integrity": "sha512-Fcvtbb+zBcZXbTTVwqGA5W+MKBj56UjVRevvchv5XrcyXbmNdesfZL37nlcWOfpgHhgmxApw3tQbTr4CqNmX4w=="
+      "integrity": "sha512-dPEtOeMvF9VMcYV/1Wb8CPoVAXtp6MKMlcbAt4ddqmGqUJ6fQZFXkNZNkNlfevtNkGtaSoXf/vNNNSvgrdXwtA=="
     },
     "node-int64": {
       "version": "0.4.0",
@@ -34335,7 +34069,6 @@
         "@rollup/plugin-commonjs": "^21.0.2",
         "@rollup/plugin-node-resolve": "^13.1.3",
         "@rollup/plugin-replace": "^4.0.0",
-        "@svgr/rollup": "^6.2.1",
         "@types/d3": "^7.1.0",
         "@types/react": "^17.0.40",
         "@types/resize-observer-browser": "^0.1.7",
@@ -34353,10 +34086,12 @@
         "react-dom": "^17.0.2",
         "react-draggable": "^4.4.4",
         "release-it": "^14.12.5",
+        "rimraf": "^3.0.2",
         "rollup": "^2.70.1",
         "rollup-plugin-livereload": "^2.0.5",
         "rollup-plugin-postcss": "^4.0.2",
         "rollup-plugin-serve": "^1.1.0",
+        "rollup-plugin-terser": "^7.0.2",
         "rollup-plugin-typescript2": "^0.31.2",
         "rollup-plugin-visualizer": "^5.6.0",
         "start-server-and-test": "^1.14.0",
@@ -35094,13 +34829,6 @@
             "@babel/helper-plugin-utils": "^7.16.7"
           }
         },
-        "@babel/plugin-transform-react-constant-elements": {
-          "version": "7.14.5",
-          "dev": true,
-          "requires": {
-            "@babel/helper-plugin-utils": "^7.14.5"
-          }
-        },
         "@babel/plugin-transform-react-display-name": {
           "version": "7.16.7",
           "dev": true,
@@ -35622,117 +35350,6 @@
           "version": "4.2.0",
           "dev": true
         },
-        "@svgr/babel-plugin-add-jsx-attribute": {
-          "version": "6.0.0",
-          "dev": true,
-          "requires": {}
-        },
-        "@svgr/babel-plugin-remove-jsx-attribute": {
-          "version": "6.0.0",
-          "dev": true,
-          "requires": {}
-        },
-        "@svgr/babel-plugin-remove-jsx-empty-expression": {
-          "version": "6.0.0",
-          "dev": true,
-          "requires": {}
-        },
-        "@svgr/babel-plugin-replace-jsx-attribute-value": {
-          "version": "6.0.0",
-          "dev": true,
-          "requires": {}
-        },
-        "@svgr/babel-plugin-svg-dynamic-title": {
-          "version": "6.0.0",
-          "dev": true,
-          "requires": {}
-        },
-        "@svgr/babel-plugin-svg-em-dimensions": {
-          "version": "6.0.0",
-          "dev": true,
-          "requires": {}
-        },
-        "@svgr/babel-plugin-transform-react-native-svg": {
-          "version": "6.0.0",
-          "dev": true,
-          "requires": {}
-        },
-        "@svgr/babel-plugin-transform-svg-component": {
-          "version": "6.2.0",
-          "dev": true,
-          "requires": {}
-        },
-        "@svgr/babel-preset": {
-          "version": "6.2.0",
-          "dev": true,
-          "requires": {
-            "@svgr/babel-plugin-add-jsx-attribute": "^6.0.0",
-            "@svgr/babel-plugin-remove-jsx-attribute": "^6.0.0",
-            "@svgr/babel-plugin-remove-jsx-empty-expression": "^6.0.0",
-            "@svgr/babel-plugin-replace-jsx-attribute-value": "^6.0.0",
-            "@svgr/babel-plugin-svg-dynamic-title": "^6.0.0",
-            "@svgr/babel-plugin-svg-em-dimensions": "^6.0.0",
-            "@svgr/babel-plugin-transform-react-native-svg": "^6.0.0",
-            "@svgr/babel-plugin-transform-svg-component": "^6.2.0"
-          }
-        },
-        "@svgr/core": {
-          "version": "6.2.1",
-          "dev": true,
-          "requires": {
-            "@svgr/plugin-jsx": "^6.2.1",
-            "camelcase": "^6.2.0",
-            "cosmiconfig": "^7.0.1"
-          }
-        },
-        "@svgr/hast-util-to-babel-ast": {
-          "version": "6.2.1",
-          "dev": true,
-          "requires": {
-            "@babel/types": "^7.15.6",
-            "entities": "^3.0.1"
-          },
-          "dependencies": {
-            "entities": {
-              "version": "3.0.1",
-              "dev": true
-            }
-          }
-        },
-        "@svgr/plugin-jsx": {
-          "version": "6.2.1",
-          "dev": true,
-          "requires": {
-            "@babel/core": "^7.15.5",
-            "@svgr/babel-preset": "^6.2.0",
-            "@svgr/hast-util-to-babel-ast": "^6.2.1",
-            "svg-parser": "^2.0.2"
-          }
-        },
-        "@svgr/plugin-svgo": {
-          "version": "6.2.0",
-          "dev": true,
-          "requires": {
-            "cosmiconfig": "^7.0.1",
-            "deepmerge": "^4.2.2",
-            "svgo": "^2.5.0"
-          }
-        },
-        "@svgr/rollup": {
-          "version": "6.2.1",
-          "dev": true,
-          "requires": {
-            "@babel/core": "^7.15.5",
-            "@babel/plugin-transform-react-constant-elements": "^7.14.5",
-            "@babel/preset-env": "^7.15.6",
-            "@babel/preset-react": "^7.14.5",
-            "@babel/preset-typescript": "^7.16.0",
-            "@svgr/core": "^6.2.1",
-            "@svgr/plugin-jsx": "^6.2.1",
-            "@svgr/plugin-svgo": "^6.2.0",
-            "rollup-pluginutils": "^2.8.2"
-          }
-        },
         "@szmarczak/http-timer": {
           "version": "4.0.6",
           "dev": true,
@@ -37258,7 +36875,9 @@
           }
         },
         "follow-redirects": {
-          "version": "1.14.2",
+          "version": "1.14.9",
+          "resolved": "https://registry.npmjs.org/follow-redirects/-/follow-redirects-1.14.9.tgz",
+          "integrity": "sha512-MQDfihBQYMcyy5dhRDJUHcw7lb2Pv/TuE6xP1vyraLukNDHKbDxDNaOE3NbCAdKQApno+GPRyo1YAp89yCjK4w==",
           "dev": true
         },
         "forever-agent": {
@@ -38136,7 +37755,9 @@
           }
         },
         "minimist": {
-          "version": "1.2.5",
+          "version": "1.2.6",
+          "resolved": "https://registry.npmjs.org/minimist/-/minimist-1.2.6.tgz",
+          "integrity": "sha512-Jsjnk4bw3YJqYzbdyBiNsPWHPfO++UGG749Cxs6peCu5Xg4nrena6OVxOYxrQTqww0Jmwt+Ref8rggumkTLz9Q==",
           "dev": true
         },
         "ms": {
@@ -39822,10 +39443,6 @@
             "has-flag": "^3.0.0"
           }
         },
-        "svg-parser": {
-          "version": "2.0.4",
-          "dev": true
-        },
         "svgo": {
           "version": "2.8.0",
           "dev": true,

package-lock.json

@@ -6452,9 +6452,9 @@
       }
     },
     "node_modules/minimist": {
-      "version": "1.2.5",
+      "version": "1.2.6",
-      "resolved": "https://registry.npmjs.org/minimist/-/minimist-1.2.5.tgz",
+      "resolved": "https://registry.npmjs.org/minimist/-/minimist-1.2.6.tgz",
-      "integrity": "sha512-FM9nNUYrRBAELZQT3xeZQ7fmMOBg6nWNmJKTcgsJeaLstP/UODVpGsr5OhXhhXg6f+qtJ8uiZ+PUxkDWcgIXLw==",
+      "integrity": "sha512-Jsjnk4bw3YJqYzbdyBiNsPWHPfO++UGG749Cxs6peCu5Xg4nrena6OVxOYxrQTqww0Jmwt+Ref8rggumkTLz9Q==",
       "dev": true
     },
     "node_modules/ms": {
@@ -15042,9 +15042,9 @@
       }
     },
     "minimist": {
-      "version": "1.2.5",
+      "version": "1.2.6",
-      "resolved": "https://registry.npmjs.org/minimist/-/minimist-1.2.5.tgz",
+      "resolved": "https://registry.npmjs.org/minimist/-/minimist-1.2.6.tgz",
-      "integrity": "sha512-FM9nNUYrRBAELZQT3xeZQ7fmMOBg6nWNmJKTcgsJeaLstP/UODVpGsr5OhXhhXg6f+qtJ8uiZ+PUxkDWcgIXLw==",
+      "integrity": "sha512-Jsjnk4bw3YJqYzbdyBiNsPWHPfO++UGG749Cxs6peCu5Xg4nrena6OVxOYxrQTqww0Jmwt+Ref8rggumkTLz9Q==",
       "dev": true
     },
     "ms": {

src/container/ReactFlow/Wrapper.tsx

@@ -1,8 +1,8 @@
-import React, { FC } from 'react';
+import React, { FC, PropsWithChildren } from 'react';
 
 import { Provider, createStore, useStoreApi } from '../../store';
 
-const Wrapper: FC = ({ children }) => {
+const Wrapper: FC<PropsWithChildren<{}>> = ({ children }) => {
   let isWrapped = true;
 
   try {