feat(node-toolbar): add node-toolbar component

2022-11-15 21:48:08 +01:00
parent fd00b18ebe
commit beba0a32de
17 changed files with 386 additions and 50 deletions
--- a/examples/vite-app/src/App/index.tsx
+++ b/examples/vite-app/src/App/index.tsx
@@ -40,6 +40,7 @@ import EdgeRouting from '../examples/EdgeRouting';
 import CancelConnection from '../examples/CancelConnection';
 import InteractiveMinimap from '../examples/InteractiveMinimap';
 import UseOnSelectionChange from '../examples/UseOnSelectionChange';
+import NodeToolbar from '../examples/NodeToolbar';

 interface IRoute {
  name: string;
@@ -168,6 +169,11 @@ const routes: IRoute[] = [
    path: '/nodetypesobject-change',
    component: NodeTypesObjectChange,
  },
+  {
+    name: 'NodeToolbar',
+    path: '/node-toolbar',
+    component: NodeToolbar,
+  },
  {
    name: 'Overview',
    path: '/overview',
--- a/examples/vite-app/src/examples/NodeToolbar/CustomNode.tsx
+++ b/examples/vite-app/src/examples/NodeToolbar/CustomNode.tsx
@@ -0,0 +1,19 @@
+import { memo, FC } from 'react';
+import { Handle, Position, NodeProps, NodeToolbar } from 'reactflow';
+
+const CustomNode: FC<NodeProps> = ({ id, data, selected }) => {
+  return (
+    <>
+      <NodeToolbar isActive={selected} nodeId={id} position={data.toolbarPosition}>
+        <button>delete</button>
+        <button>copy</button>
+        <button>expand</button>
+      </NodeToolbar>
+      <div>{data.label}</div>
+      <Handle type="target" position={Position.Left} />
+      <Handle type="source" position={Position.Right} />
+    </>
+  );
+};
+
+export default memo(CustomNode);
--- a/examples/vite-app/src/examples/NodeToolbar/index.tsx
+++ b/examples/vite-app/src/examples/NodeToolbar/index.tsx
@@ -0,0 +1,74 @@
+import ReactFlow, {
+  MiniMap,
+  Background,
+  BackgroundVariant,
+  Controls,
+  Node,
+  Edge,
+  NodeTypes,
+  Position,
+} from 'reactflow';
+
+import CustomNode from './CustomNode';
+
+const nodeTypes: NodeTypes = {
+  custom: CustomNode,
+};
+
+const initialNodes: Node[] = [
+  {
+    id: '1',
+    type: 'custom',
+    data: { label: 'toolbar top', toolbarPosition: Position.Top },
+    position: { x: 0, y: 100 },
+    className: 'react-flow__node-default',
+  },
+  {
+    id: '2',
+    type: 'custom',
+    data: { label: 'toolbar right', toolbarPosition: Position.Right },
+    position: { x: 400, y: 0 },
+    className: 'react-flow__node-default',
+  },
+  {
+    id: '3',
+    type: 'custom',
+    data: { label: 'toolbar bottom', toolbarPosition: Position.Bottom },
+    position: { x: 400, y: 100 },
+    className: 'react-flow__node-default',
+  },
+  {
+    id: '4',
+    type: 'custom',
+    data: { label: 'toolbar left', toolbarPosition: Position.Left },
+    position: { x: 400, y: 200 },
+    className: 'react-flow__node-default',
+  },
+];
+
+const initialEdges: Edge[] = [
+  { id: 'e1-2', source: '1', target: '2' },
+  { id: 'e1-3', source: '1', target: '3' },
+  { id: 'e1-4', source: '1', target: '4' },
+];
+
+const defaultEdgeOptions = { zIndex: 0 };
+
+export default function NodeToolbarExample() {
+  return (
+    <ReactFlow
+      defaultNodes={initialNodes}
+      defaultEdges={initialEdges}
+      className="react-flow-node-toolbar-example"
+      minZoom={0.2}
+      maxZoom={4}
+      fitView
+      defaultEdgeOptions={defaultEdgeOptions}
+      nodeTypes={nodeTypes}
+    >
+      <Background variant={BackgroundVariant.Dots} />
+      <MiniMap />
+      <Controls />
+    </ReactFlow>
+  );
+}
--- a/packages/node-toolbar/.eslintrc.js
+++ b/packages/node-toolbar/.eslintrc.js
@@ -0,0 +1,4 @@
+module.exports = {
+  root: true,
+  extends: ['@reactflow/eslint-config'],
+};
--- a/packages/node-toolbar/CHANGELOG.md
+++ b/packages/node-toolbar/CHANGELOG.md
@@ -0,0 +1 @@
+# @reactflow/node-toolbar
--- a/packages/node-toolbar/README.md
+++ b/packages/node-toolbar/README.md
@@ -0,0 +1,10 @@
+# @reactflow/node-toolbar
+
+A toolbar component for React Flow that can be attached to a node.
+
+## Installation 
+
+```sh 
+npm install @reactflow/node-toolbar
+```
+
--- a/packages/node-toolbar/package.json
+++ b/packages/node-toolbar/package.json
@@ -0,0 +1,68 @@
+{
+  "name": "@reactflow/node-toolbar",
+  "version": "0.0.1",
+  "description": "A toolbar component for React Flow that can be attached to a node.",
+  "keywords": [
+    "react",
+    "node-based UI",
+    "graph",
+    "diagram",
+    "workflow",
+    "react-flow"
+  ],
+  "files": [
+    "dist"
+  ],
+  "source": "src/index.tsx",
+  "main": "dist/umd/index.js",
+  "module": "dist/esm/index.js",
+  "types": "dist/esm/index.d.ts",
+  "sideEffects": [
+    "*.css"
+  ],
+  "publishConfig": {
+    "access": "public"
+  },
+  "license": "MIT",
+  "repository": {
+    "type": "git",
+    "url": "https://github.com/wbkd/react-flow.git",
+    "directory": "packages/node-toolbar"
+  },
+  "scripts": {
+    "dev": "concurrently \"rollup --config node:@reactflow/rollup-config --watch\" pnpm:css-watch",
+    "build": "rollup --config node:@reactflow/rollup-config --environment NODE_ENV:production && npm run css",
+    "css": "postcss src/*.css --config ../../tooling/postcss-config/postcss.config.js --dir dist",
+    "css-watch": "pnpm css --watch",
+    "lint": "eslint --ext .js,.jsx,.ts,.tsx src",
+    "typecheck": "tsc --noEmit"
+  },
+  "dependencies": {
+    "@babel/runtime": "^7.18.9",
+    "@reactflow/core": "workspace:*",
+    "classcat": "^5.0.3",
+    "zustand": "^4.1.1"
+  },
+  "peerDependencies": {
+    "react": ">=17",
+    "react-dom": ">=17"
+  },
+  "devDependencies": {
+    "@reactflow/eslint-config": "workspace:^0.0.0",
+    "@reactflow/rollup-config": "workspace:*",
+    "@reactflow/tsconfig": "workspace:*",
+    "@types/node": "^18.7.16",
+    "@types/react": "^18.0.19",
+    "@types/react-dom": "^18.0.6",
+    "react": "^18.2.0",
+    "typescript": "^4.8.3"
+  },
+  "rollup": {
+    "globals": {
+      "zustand": "Zustand",
+      "zustand/shallow": "zustandShallow",
+      "classcat": "cc"
+    },
+    "name": "ReactFlowNodeToolbar"
+  }
+}
--- a/packages/node-toolbar/src/NodeToolbar.tsx
+++ b/packages/node-toolbar/src/NodeToolbar.tsx
@@ -0,0 +1,83 @@
+import { useCallback, CSSProperties } from 'react';
+import { Node, ReactFlowState, useStore, getRectOfNodes, Transform, Rect, Position } from '@reactflow/core';
+import cc from 'classcat';
+import shallow from 'zustand/shallow';
+
+import NodeToolbarPortal from './NodeToolbarPortal';
+import { NodeToolbarProps } from './types';
+
+type SelectedNode = Node | undefined;
+
+const nodeEqualityFn = (a: SelectedNode, b: SelectedNode) =>
+  a?.positionAbsolute?.x === b?.positionAbsolute?.x &&
+  a?.positionAbsolute?.y === b?.positionAbsolute?.y &&
+  a?.width === b?.width &&
+  a?.height === b?.height &&
+  a?.selected === b?.selected;
+
+const transformSelector = (state: ReactFlowState) => state.transform;
+
+function getTransform(nodeRect: Rect, transform: Transform, position: Position, offset: number): string {
+  // position === Position.Top
+  let xPos = (nodeRect.x + nodeRect.width / 2) * transform[2] + transform[0];
+  let yPos = nodeRect.y * transform[2] + transform[1] - offset;
+  let xShift = -50;
+  let yShift = -100;
+
+  switch (position) {
+    case Position.Right:
+      xPos = (nodeRect.x + nodeRect.width) * transform[2] + transform[0] + offset;
+      yPos = (nodeRect.y + nodeRect.height / 2) * transform[2] + transform[1];
+      xShift = 0;
+      yShift = -50;
+      break;
+    case Position.Bottom:
+      yPos = (nodeRect.y + nodeRect.height) * transform[2] + transform[1] + offset;
+      yShift = 0;
+      break;
+    case Position.Left:
+      xPos = nodeRect.x * transform[2] + transform[0] - offset;
+      yPos = (nodeRect.y + nodeRect.height / 2) * transform[2] + transform[1];
+      xShift = -100;
+      yShift = -50;
+      break;
+  }
+
+  return `translate(${xPos}px, ${yPos}px) translate(${xShift}%, ${yShift}%)`;
+}
+
+function NodeToolbar({
+  nodeId,
+  children,
+  className,
+  style,
+  isActive,
+  position = Position.Top,
+  offset = 10,
+  ...rest
+}: NodeToolbarProps) {
+  const nodeSelector = useCallback((state: ReactFlowState): SelectedNode => state.nodeInternals.get(nodeId), [nodeId]);
+  const node = useStore(nodeSelector, nodeEqualityFn);
+  const transform = useStore(transformSelector, shallow);
+
+  if (!isActive || !node) {
+    return null;
+  }
+
+  const nodeRect: Rect = getRectOfNodes([node]);
+
+  const wrapperStyle: CSSProperties = {
+    transform: getTransform(nodeRect, transform, position, offset),
+    ...style,
+  };
+
+  return (
+    <NodeToolbarPortal>
+      <div style={wrapperStyle} className={cc(['react-flow__node-toolbar', className])} {...rest}>
+        {children}
+      </div>
+    </NodeToolbarPortal>
+  );
+}
+
+export default NodeToolbar;
--- a/packages/node-toolbar/src/NodeToolbarPortal.tsx
+++ b/packages/node-toolbar/src/NodeToolbarPortal.tsx
@@ -0,0 +1,15 @@
+import { ReactNode } from 'react';
+import { createPortal } from 'react-dom';
+import { ReactFlowState, useStore } from '@reactflow/core';
+
+function NodeToolbarPortal({ children }: { children: ReactNode }) {
+  const wrapperRef = useStore((state: ReactFlowState) => state.domNode?.querySelector('.react-flow__pane'));
+
+  if (!wrapperRef) {
+    return null;
+  }
+
+  return createPortal(children, wrapperRef);
+}
+
+export default NodeToolbarPortal;
--- a/packages/node-toolbar/src/index.tsx
+++ b/packages/node-toolbar/src/index.tsx
@@ -0,0 +1,2 @@
+export { default as NodeToolbar } from './NodeToolbar';
+export * from './types';
--- a/packages/node-toolbar/src/style.css
+++ b/packages/node-toolbar/src/style.css
@@ -0,0 +1,4 @@
+.react-flow__node-toolbar {
+  position: absolute;
+  z-index: 1000;
+}
--- a/packages/node-toolbar/src/types.ts
+++ b/packages/node-toolbar/src/types.ts
@@ -0,0 +1,9 @@
+import { Position } from '@reactflow/core';
+import type { HTMLAttributes } from 'react';
+
+export type NodeToolbarProps = HTMLAttributes<HTMLDivElement> & {
+  nodeId: string;
+  isActive?: boolean;
+  position?: Position;
+  offset?: number;
+};
--- a/packages/node-toolbar/tsconfig.json
+++ b/packages/node-toolbar/tsconfig.json
@@ -0,0 +1,6 @@
+{
+  "extends": "@reactflow/tsconfig/react.json",
+  "display": "@reactflow/node-toolbar",
+  "include": ["**/*.ts", "**/*.tsx"],
+  "exclude": ["node_modules", "dist"]
+}
--- a/packages/reactflow/package.json
+++ b/packages/reactflow/package.json
@@ -38,7 +38,8 @@
    "@reactflow/background": "workspace:*",
    "@reactflow/controls": "workspace:*",
    "@reactflow/core": "workspace:*",
-    "@reactflow/minimap": "workspace:*"
+    "@reactflow/minimap": "workspace:*",
+    "@reactflow/node-toolbar": "workspace:*"
  },
  "peerDependencies": {
    "react": ">=17",
@@ -58,7 +59,8 @@
      "@reactflow/background": "ReactFlowBackground",
      "@reactflow/controls": "ReactFlowControls",
      "@reactflow/core": "ReactFlowCore",
-      "@reactflow/minimap": "ReactFlowMinimap"
+      "@reactflow/minimap": "ReactFlowMinimap",
+      "@reactflow/node-toolbar": "ReactFlowNodeToolbar"
    },
    "name": "ReactFlow"
  }
--- a/packages/reactflow/src/index.ts
+++ b/packages/reactflow/src/index.ts
@@ -2,5 +2,6 @@ export * from '@reactflow/core';
 export * from '@reactflow/minimap';
 export * from '@reactflow/controls';
 export * from '@reactflow/background';
+export * from '@reactflow/node-toolbar';

 export { ReactFlow as default } from '@reactflow/core';
--- a/packages/reactflow/src/style.css
+++ b/packages/reactflow/src/style.css
@@ -1,3 +1,4 @@
@import '@reactflow/core/dist/style.css';
@import '@reactflow/controls/dist/style.css';
@import '@reactflow/minimap/dist/style.css';
+@import '@reactflow/node-toolbar/dist/style.css';
--- a/pnpm-lock.yaml
+++ b/pnpm-lock.yaml
@@ -32,8 +32,8 @@ importers:
      '@changesets/changelog-github': registry.npmjs.org/@changesets/changelog-github/0.4.7
      '@changesets/cli': registry.npmjs.org/@changesets/cli/2.25.0
      '@preconstruct/cli': registry.npmjs.org/@preconstruct/cli/2.2.1
-      '@typescript-eslint/eslint-plugin': registry.npmjs.org/@typescript-eslint/eslint-plugin/5.42.0_dcn2ddfkdgyby36a3kmqplwxkq
-      '@typescript-eslint/parser': registry.npmjs.org/@typescript-eslint/parser/5.42.0_irgkl5vooow2ydyo6aokmferha
+      '@typescript-eslint/eslint-plugin': registry.npmjs.org/@typescript-eslint/eslint-plugin/5.43.0_nctdnn3gg3ldnbrjkdxid2oppm
+      '@typescript-eslint/parser': registry.npmjs.org/@typescript-eslint/parser/5.43.0_irgkl5vooow2ydyo6aokmferha
      autoprefixer: registry.npmjs.org/autoprefixer/10.4.9_postcss@8.4.16
      concurrently: registry.npmjs.org/concurrently/7.4.0
      cypress: registry.npmjs.org/cypress/10.7.0
@@ -215,6 +215,35 @@ importers:
      react: registry.npmjs.org/react/18.2.0
      typescript: registry.npmjs.org/typescript/4.8.3

+  packages/node-toolbar:
+    specifiers:
+      '@babel/runtime': ^7.18.9
+      '@reactflow/core': workspace:*
+      '@reactflow/eslint-config': workspace:^0.0.0
+      '@reactflow/rollup-config': workspace:*
+      '@reactflow/tsconfig': workspace:*
+      '@types/node': ^18.7.16
+      '@types/react': ^18.0.19
+      '@types/react-dom': ^18.0.6
+      classcat: ^5.0.3
+      react: ^18.2.0
+      typescript: ^4.8.3
+      zustand: ^4.1.1
+    dependencies:
+      '@babel/runtime': registry.npmjs.org/@babel/runtime/7.19.0
+      '@reactflow/core': link:../core
+      classcat: registry.npmjs.org/classcat/5.0.4
+      zustand: registry.npmjs.org/zustand/4.1.1_react@18.2.0
+    devDependencies:
+      '@reactflow/eslint-config': link:../../tooling/eslint-config
+      '@reactflow/rollup-config': link:../../tooling/rollup-config
+      '@reactflow/tsconfig': link:../../tooling/tsconfig
+      '@types/node': registry.npmjs.org/@types/node/18.7.16
+      '@types/react': registry.npmjs.org/@types/react/18.0.19
+      '@types/react-dom': registry.npmjs.org/@types/react-dom/18.0.6
+      react: registry.npmjs.org/react/18.2.0
+      typescript: registry.npmjs.org/typescript/4.8.3
+
  packages/reactflow:
    specifiers:
      '@reactflow/background': workspace:*
@@ -222,6 +251,7 @@ importers:
      '@reactflow/core': workspace:*
      '@reactflow/eslint-config': workspace:^0.0.0
      '@reactflow/minimap': workspace:*
+      '@reactflow/node-toolbar': workspace:*
      '@reactflow/rollup-config': workspace:*
      '@reactflow/tsconfig': workspace:*
      '@types/node': ^18.7.16
@@ -233,6 +263,7 @@ importers:
      '@reactflow/controls': link:../controls
      '@reactflow/core': link:../core
      '@reactflow/minimap': link:../minimap
+      '@reactflow/node-toolbar': link:../node-toolbar
    devDependencies:
      '@reactflow/eslint-config': link:../../tooling/eslint-config
      '@reactflow/rollup-config': link:../../tooling/rollup-config
@@ -1720,11 +1751,11 @@ packages:
    dev: true
    optional: true

-  registry.npmjs.org/@typescript-eslint/eslint-plugin/5.42.0_dcn2ddfkdgyby36a3kmqplwxkq:
-    resolution: {integrity: sha512-5TJh2AgL6+wpL8H/GTSjNb4WrjKoR2rqvFxR/DDTqYNk6uXn8BJMEcncLSpMbf/XV1aS0jAjYwn98uvVCiAywQ==, registry: https://registry.npmjs.com/, tarball: https://registry.npmjs.org/@typescript-eslint/eslint-plugin/-/eslint-plugin-5.42.0.tgz}
-    id: registry.npmjs.org/@typescript-eslint/eslint-plugin/5.42.0
+  registry.npmjs.org/@typescript-eslint/eslint-plugin/5.43.0_nctdnn3gg3ldnbrjkdxid2oppm:
+    resolution: {integrity: sha512-wNPzG+eDR6+hhW4yobEmpR36jrqqQv1vxBq5LJO3fBAktjkvekfr4BRl+3Fn1CM/A+s8/EiGUbOMDoYqWdbtXA==, registry: https://registry.npmjs.com/, tarball: https://registry.npmjs.org/@typescript-eslint/eslint-plugin/-/eslint-plugin-5.43.0.tgz}
+    id: registry.npmjs.org/@typescript-eslint/eslint-plugin/5.43.0
    name: '@typescript-eslint/eslint-plugin'
-    version: 5.42.0
+    version: 5.43.0
    engines: {node: ^12.22.0 || ^14.17.0 || >=16.0.0}
    peerDependencies:
      '@typescript-eslint/parser': ^5.0.0
@@ -1734,10 +1765,10 @@ packages:
      typescript:
        optional: true
    dependencies:
-      '@typescript-eslint/parser': registry.npmjs.org/@typescript-eslint/parser/5.42.0_irgkl5vooow2ydyo6aokmferha
-      '@typescript-eslint/scope-manager': registry.npmjs.org/@typescript-eslint/scope-manager/5.42.0
-      '@typescript-eslint/type-utils': registry.npmjs.org/@typescript-eslint/type-utils/5.42.0_irgkl5vooow2ydyo6aokmferha
-      '@typescript-eslint/utils': registry.npmjs.org/@typescript-eslint/utils/5.42.0_irgkl5vooow2ydyo6aokmferha
+      '@typescript-eslint/parser': registry.npmjs.org/@typescript-eslint/parser/5.43.0_irgkl5vooow2ydyo6aokmferha
+      '@typescript-eslint/scope-manager': registry.npmjs.org/@typescript-eslint/scope-manager/5.43.0
+      '@typescript-eslint/type-utils': registry.npmjs.org/@typescript-eslint/type-utils/5.43.0_irgkl5vooow2ydyo6aokmferha
+      '@typescript-eslint/utils': registry.npmjs.org/@typescript-eslint/utils/5.43.0_irgkl5vooow2ydyo6aokmferha
      debug: registry.npmjs.org/debug/4.3.4
      eslint: registry.npmjs.org/eslint/8.23.1
      ignore: registry.npmjs.org/ignore/5.2.0
@@ -1750,11 +1781,11 @@ packages:
      - supports-color
    dev: true

-  registry.npmjs.org/@typescript-eslint/parser/5.42.0_irgkl5vooow2ydyo6aokmferha:
-    resolution: {integrity: sha512-Ixh9qrOTDRctFg3yIwrLkgf33AHyEIn6lhyf5cCfwwiGtkWhNpVKlEZApi3inGQR/barWnY7qY8FbGKBO7p3JA==, registry: https://registry.npmjs.com/, tarball: https://registry.npmjs.org/@typescript-eslint/parser/-/parser-5.42.0.tgz}
-    id: registry.npmjs.org/@typescript-eslint/parser/5.42.0
+  registry.npmjs.org/@typescript-eslint/parser/5.43.0_irgkl5vooow2ydyo6aokmferha:
+    resolution: {integrity: sha512-2iHUK2Lh7PwNUlhFxxLI2haSDNyXvebBO9izhjhMoDC+S3XI9qt2DGFUsiJ89m2k7gGYch2aEpYqV5F/+nwZug==, registry: https://registry.npmjs.com/, tarball: https://registry.npmjs.org/@typescript-eslint/parser/-/parser-5.43.0.tgz}
+    id: registry.npmjs.org/@typescript-eslint/parser/5.43.0
    name: '@typescript-eslint/parser'
-    version: 5.42.0
+    version: 5.43.0
    engines: {node: ^12.22.0 || ^14.17.0 || >=16.0.0}
    peerDependencies:
      eslint: ^6.0.0 || ^7.0.0 || ^8.0.0
@@ -1763,9 +1794,9 @@ packages:
      typescript:
        optional: true
    dependencies:
-      '@typescript-eslint/scope-manager': registry.npmjs.org/@typescript-eslint/scope-manager/5.42.0
-      '@typescript-eslint/types': registry.npmjs.org/@typescript-eslint/types/5.42.0
-      '@typescript-eslint/typescript-estree': registry.npmjs.org/@typescript-eslint/typescript-estree/5.42.0_typescript@4.8.3
+      '@typescript-eslint/scope-manager': registry.npmjs.org/@typescript-eslint/scope-manager/5.43.0
+      '@typescript-eslint/types': registry.npmjs.org/@typescript-eslint/types/5.43.0
+      '@typescript-eslint/typescript-estree': registry.npmjs.org/@typescript-eslint/typescript-estree/5.43.0_typescript@4.8.3
      debug: registry.npmjs.org/debug/4.3.4
      eslint: registry.npmjs.org/eslint/8.23.1
      typescript: registry.npmjs.org/typescript/4.8.3
@@ -1773,21 +1804,21 @@ packages:
      - supports-color
    dev: true

-  registry.npmjs.org/@typescript-eslint/scope-manager/5.42.0:
-    resolution: {integrity: sha512-l5/3IBHLH0Bv04y+H+zlcLiEMEMjWGaCX6WyHE5Uk2YkSGAMlgdUPsT/ywTSKgu9D1dmmKMYgYZijObfA39Wow==, registry: https://registry.npmjs.com/, tarball: https://registry.npmjs.org/@typescript-eslint/scope-manager/-/scope-manager-5.42.0.tgz}
+  registry.npmjs.org/@typescript-eslint/scope-manager/5.43.0:
+    resolution: {integrity: sha512-XNWnGaqAtTJsUiZaoiGIrdJYHsUOd3BZ3Qj5zKp9w6km6HsrjPk/TGZv0qMTWyWj0+1QOqpHQ2gZOLXaGA9Ekw==, registry: https://registry.npmjs.com/, tarball: https://registry.npmjs.org/@typescript-eslint/scope-manager/-/scope-manager-5.43.0.tgz}
    name: '@typescript-eslint/scope-manager'
-    version: 5.42.0
+    version: 5.43.0
    engines: {node: ^12.22.0 || ^14.17.0 || >=16.0.0}
    dependencies:
-      '@typescript-eslint/types': registry.npmjs.org/@typescript-eslint/types/5.42.0
-      '@typescript-eslint/visitor-keys': registry.npmjs.org/@typescript-eslint/visitor-keys/5.42.0
+      '@typescript-eslint/types': registry.npmjs.org/@typescript-eslint/types/5.43.0
+      '@typescript-eslint/visitor-keys': registry.npmjs.org/@typescript-eslint/visitor-keys/5.43.0
    dev: true

-  registry.npmjs.org/@typescript-eslint/type-utils/5.42.0_irgkl5vooow2ydyo6aokmferha:
-    resolution: {integrity: sha512-HW14TXC45dFVZxnVW8rnUGnvYyRC0E/vxXShFCthcC9VhVTmjqOmtqj6H5rm9Zxv+ORxKA/1aLGD7vmlLsdlOg==, registry: https://registry.npmjs.com/, tarball: https://registry.npmjs.org/@typescript-eslint/type-utils/-/type-utils-5.42.0.tgz}
-    id: registry.npmjs.org/@typescript-eslint/type-utils/5.42.0
+  registry.npmjs.org/@typescript-eslint/type-utils/5.43.0_irgkl5vooow2ydyo6aokmferha:
+    resolution: {integrity: sha512-K21f+KY2/VvYggLf5Pk4tgBOPs2otTaIHy2zjclo7UZGLyFH86VfUOm5iq+OtDtxq/Zwu2I3ujDBykVW4Xtmtg==, registry: https://registry.npmjs.com/, tarball: https://registry.npmjs.org/@typescript-eslint/type-utils/-/type-utils-5.43.0.tgz}
+    id: registry.npmjs.org/@typescript-eslint/type-utils/5.43.0
    name: '@typescript-eslint/type-utils'
-    version: 5.42.0
+    version: 5.43.0
    engines: {node: ^12.22.0 || ^14.17.0 || >=16.0.0}
    peerDependencies:
      eslint: '*'
@@ -1796,8 +1827,8 @@ packages:
      typescript:
        optional: true
    dependencies:
-      '@typescript-eslint/typescript-estree': registry.npmjs.org/@typescript-eslint/typescript-estree/5.42.0_typescript@4.8.3
-      '@typescript-eslint/utils': registry.npmjs.org/@typescript-eslint/utils/5.42.0_irgkl5vooow2ydyo6aokmferha
+      '@typescript-eslint/typescript-estree': registry.npmjs.org/@typescript-eslint/typescript-estree/5.43.0_typescript@4.8.3
+      '@typescript-eslint/utils': registry.npmjs.org/@typescript-eslint/utils/5.43.0_irgkl5vooow2ydyo6aokmferha
      debug: registry.npmjs.org/debug/4.3.4
      eslint: registry.npmjs.org/eslint/8.23.1
      tsutils: registry.npmjs.org/tsutils/3.21.0_typescript@4.8.3
@@ -1806,18 +1837,18 @@ packages:
      - supports-color
    dev: true

-  registry.npmjs.org/@typescript-eslint/types/5.42.0:
-    resolution: {integrity: sha512-t4lzO9ZOAUcHY6bXQYRuu+3SSYdD9TS8ooApZft4WARt4/f2Cj/YpvbTe8A4GuhT4bNW72goDMOy7SW71mZwGw==, registry: https://registry.npmjs.com/, tarball: https://registry.npmjs.org/@typescript-eslint/types/-/types-5.42.0.tgz}
+  registry.npmjs.org/@typescript-eslint/types/5.43.0:
+    resolution: {integrity: sha512-jpsbcD0x6AUvV7tyOlyvon0aUsQpF8W+7TpJntfCUWU1qaIKu2K34pMwQKSzQH8ORgUrGYY6pVIh1Pi8TNeteg==, registry: https://registry.npmjs.com/, tarball: https://registry.npmjs.org/@typescript-eslint/types/-/types-5.43.0.tgz}
    name: '@typescript-eslint/types'
-    version: 5.42.0
+    version: 5.43.0
    engines: {node: ^12.22.0 || ^14.17.0 || >=16.0.0}
    dev: true

-  registry.npmjs.org/@typescript-eslint/typescript-estree/5.42.0_typescript@4.8.3:
-    resolution: {integrity: sha512-2O3vSq794x3kZGtV7i4SCWZWCwjEtkWfVqX4m5fbUBomOsEOyd6OAD1qU2lbvV5S8tgy/luJnOYluNyYVeOTTg==, registry: https://registry.npmjs.com/, tarball: https://registry.npmjs.org/@typescript-eslint/typescript-estree/-/typescript-estree-5.42.0.tgz}
-    id: registry.npmjs.org/@typescript-eslint/typescript-estree/5.42.0
+  registry.npmjs.org/@typescript-eslint/typescript-estree/5.43.0_typescript@4.8.3:
+    resolution: {integrity: sha512-BZ1WVe+QQ+igWal2tDbNg1j2HWUkAa+CVqdU79L4HP9izQY6CNhXfkNwd1SS4+sSZAP/EthI1uiCSY/+H0pROg==, registry: https://registry.npmjs.com/, tarball: https://registry.npmjs.org/@typescript-eslint/typescript-estree/-/typescript-estree-5.43.0.tgz}
+    id: registry.npmjs.org/@typescript-eslint/typescript-estree/5.43.0
    name: '@typescript-eslint/typescript-estree'
-    version: 5.42.0
+    version: 5.43.0
    engines: {node: ^12.22.0 || ^14.17.0 || >=16.0.0}
    peerDependencies:
      typescript: '*'
@@ -1825,8 +1856,8 @@ packages:
      typescript:
        optional: true
    dependencies:
-      '@typescript-eslint/types': registry.npmjs.org/@typescript-eslint/types/5.42.0
-      '@typescript-eslint/visitor-keys': registry.npmjs.org/@typescript-eslint/visitor-keys/5.42.0
+      '@typescript-eslint/types': registry.npmjs.org/@typescript-eslint/types/5.43.0
+      '@typescript-eslint/visitor-keys': registry.npmjs.org/@typescript-eslint/visitor-keys/5.43.0
      debug: registry.npmjs.org/debug/4.3.4
      globby: registry.npmjs.org/globby/11.1.0
      is-glob: registry.npmjs.org/is-glob/4.0.3
@@ -1837,20 +1868,20 @@ packages:
      - supports-color
    dev: true

-  registry.npmjs.org/@typescript-eslint/utils/5.42.0_irgkl5vooow2ydyo6aokmferha:
-    resolution: {integrity: sha512-JZ++3+h1vbeG1NUECXQZE3hg0kias9kOtcQr3+JVQ3whnjvKuMyktJAAIj6743OeNPnGBmjj7KEmiDL7qsdnCQ==, registry: https://registry.npmjs.com/, tarball: https://registry.npmjs.org/@typescript-eslint/utils/-/utils-5.42.0.tgz}
-    id: registry.npmjs.org/@typescript-eslint/utils/5.42.0
+  registry.npmjs.org/@typescript-eslint/utils/5.43.0_irgkl5vooow2ydyo6aokmferha:
+    resolution: {integrity: sha512-8nVpA6yX0sCjf7v/NDfeaOlyaIIqL7OaIGOWSPFqUKK59Gnumd3Wa+2l8oAaYO2lk0sO+SbWFWRSvhu8gLGv4A==, registry: https://registry.npmjs.com/, tarball: https://registry.npmjs.org/@typescript-eslint/utils/-/utils-5.43.0.tgz}
+    id: registry.npmjs.org/@typescript-eslint/utils/5.43.0
    name: '@typescript-eslint/utils'
-    version: 5.42.0
+    version: 5.43.0
    engines: {node: ^12.22.0 || ^14.17.0 || >=16.0.0}
    peerDependencies:
      eslint: ^6.0.0 || ^7.0.0 || ^8.0.0
    dependencies:
      '@types/json-schema': registry.npmjs.org/@types/json-schema/7.0.11
      '@types/semver': registry.npmjs.org/@types/semver/7.3.13
-      '@typescript-eslint/scope-manager': registry.npmjs.org/@typescript-eslint/scope-manager/5.42.0
-      '@typescript-eslint/types': registry.npmjs.org/@typescript-eslint/types/5.42.0
-      '@typescript-eslint/typescript-estree': registry.npmjs.org/@typescript-eslint/typescript-estree/5.42.0_typescript@4.8.3
+      '@typescript-eslint/scope-manager': registry.npmjs.org/@typescript-eslint/scope-manager/5.43.0
+      '@typescript-eslint/types': registry.npmjs.org/@typescript-eslint/types/5.43.0
+      '@typescript-eslint/typescript-estree': registry.npmjs.org/@typescript-eslint/typescript-estree/5.43.0_typescript@4.8.3
      eslint: registry.npmjs.org/eslint/8.23.1
      eslint-scope: registry.npmjs.org/eslint-scope/5.1.1
      eslint-utils: registry.npmjs.org/eslint-utils/3.0.0_eslint@8.23.1
@@ -1860,13 +1891,13 @@ packages:
      - typescript
    dev: true

-  registry.npmjs.org/@typescript-eslint/visitor-keys/5.42.0:
-    resolution: {integrity: sha512-QHbu5Hf/2lOEOwy+IUw0GoSCuAzByTAWWrOTKzTzsotiUnWFpuKnXcAhC9YztAf2EElQ0VvIK+pHJUPkM0q7jg==, registry: https://registry.npmjs.com/, tarball: https://registry.npmjs.org/@typescript-eslint/visitor-keys/-/visitor-keys-5.42.0.tgz}
+  registry.npmjs.org/@typescript-eslint/visitor-keys/5.43.0:
+    resolution: {integrity: sha512-icl1jNH/d18OVHLfcwdL3bWUKsBeIiKYTGxMJCoGe7xFht+E4QgzOqoWYrU8XSLJWhVw8nTacbm03v23J/hFTg==, registry: https://registry.npmjs.com/, tarball: https://registry.npmjs.org/@typescript-eslint/visitor-keys/-/visitor-keys-5.43.0.tgz}
    name: '@typescript-eslint/visitor-keys'
-    version: 5.42.0
+    version: 5.43.0
    engines: {node: ^12.22.0 || ^14.17.0 || >=16.0.0}
    dependencies:
-      '@typescript-eslint/types': registry.npmjs.org/@typescript-eslint/types/5.42.0
+      '@typescript-eslint/types': registry.npmjs.org/@typescript-eslint/types/5.43.0
      eslint-visitor-keys: registry.npmjs.org/eslint-visitor-keys/3.3.0
    dev: true