@neo4j-nvl/react 0.3.1-c678d7aa → 0.3.1-d62fa5e9

package/README.md

@@ -14,15 +14,10 @@ npm install @neo4j-nvl/react
 
 ### Using the library
 
-This is an example on how to use the BasicReactWrapper component: 
+This is an example on how to use the BasicReactWrapper component:
 
 ```tsx
-<BasicNvlWrapper
- nodes={nodes}
- rels={relationships}
- nvlOptions={options}
- nvlCallbacks={callbacks}
-/>
+<BasicNvlWrapper nodes={nodes} rels={relationships} nvlOptions={options} nvlCallbacks={callbacks} />
 ```
 
 When nodes and/or relationships are updated in the React wrapper, the NVL instance will be updated accordingly:
@@ -81,5 +76,9 @@ const [multiSelect, setMultiSelect] = useState(false)
 </>
 ```
 
+You can also find more instructions and examples on how to use the NVL React wrappers in the [docs](https://neo4j.com/docs/nvl/current/react-wrappers/).
 
-You can also find more instructions and examples on how to use the NVL React wrappers in the [docs](https://neo4j.com/docs/nvl/current/react-wrappers/).
+### Product analytics
+
+In order to improve the library we are collecting some information about the usage of NVL. If you prefer to disable this behavior set the parameter `disableTelemetry=true` as a parameter in `nvlOptions`.
+For example: `<BasicNvlWrapper nvlOptions={{ disableTelemetry: true }} nodes=[0,1] rels=[0,1]/>` or `<InteractiveNvlWrapper nvlOptions={{ disableTelemetry: true }} nodes=[0,1] rels=[0,1]/>`

package/lib/basic-wrapper/BasicNvlWrapper.js

@@ -1,6 +1,7 @@
 import { jsx as _jsx } from "react/jsx-runtime";
 import NVL from '@neo4j-nvl/base';
 import { forwardRef, memo, useEffect, useImperativeHandle, useRef, useState } from 'react';
+import { BASIC_WRAPPER_ID } from '../utils/constants';
 import { getMapDifferences, getNodeAttributeDifferences } from '../utils/graph-comparison';
 import { useDeepCompareEffect } from '../utils/hooks';
 /**
@@ -192,5 +193,5 @@ export const BasicNvlWrapper = memo(forwardRef(({ nodes, rels, layout, layoutOpt
         }
         nvlRef.current.setDisableWebGL(nvlOptions.disableWebGL);
     }, [nvlOptions.disableWebGL]);
-    return _jsx("div", { ref: containerRef, style: { height: '100%', outline: '0' }, ...nvlEvents });
+    return _jsx("div", { id: BASIC_WRAPPER_ID, ref: containerRef, style: { height: '100%', outline: '0' }, ...nvlEvents });
 }));

package/lib/interactive-nvl-wrapper/InteractiveNvlWrapper.js

@@ -2,6 +2,7 @@ import { jsx as _jsx } from "react/jsx-runtime";
 import { BoxSelectInteraction, ClickInteraction, DragNodeInteraction, DrawInteraction, HoverInteraction, LassoInteraction, PanInteraction, ZoomInteraction } from '@neo4j-nvl/interaction-handlers';
 import { forwardRef, memo, useEffect, useRef } from 'react';
 import { BasicNvlWrapper } from '../basic-wrapper/BasicNvlWrapper';
+import { INTERACTIVE_WRAPPER_ID } from '../utils/constants';
 import { destroyInteraction, useInteraction } from './hooks';
 const options = {
     selectOnClick: false,
@@ -82,5 +83,5 @@ export const InteractiveNvlWrapper = memo(forwardRef(({ nodes, rels, layout, lay
         destroyInteraction(multiSelectInteraction);
         destroyInteraction(lassoInteraction);
     }, []);
-    return (_jsx(BasicNvlWrapper, { ref: myNvlRef, nodes: nodes, rels: rels, nvlOptions: nvlOptions, nvlCallbacks: nvlCallbacks, layout: layout, layoutOptions: layoutOptions, onInitializationError: onInitializationError, ...nvlEvents }));
+    return (_jsx(BasicNvlWrapper, { ref: myNvlRef, nodes: nodes, id: INTERACTIVE_WRAPPER_ID, rels: rels, nvlOptions: nvlOptions, nvlCallbacks: nvlCallbacks, layout: layout, layoutOptions: layoutOptions, onInitializationError: onInitializationError, ...nvlEvents }));
 }));

package/lib/utils/constants.d.ts

@@ -0,0 +1,2 @@
+export const BASIC_WRAPPER_ID: "NVL_basic-wrapper";
+export const INTERACTIVE_WRAPPER_ID: "NVL_interactive-wrapper";

package/lib/utils/constants.js

@@ -0,0 +1,2 @@
+export const BASIC_WRAPPER_ID = 'NVL_basic-wrapper';
+export const INTERACTIVE_WRAPPER_ID = 'NVL_interactive-wrapper';

package/lib/utils/hooks.js

@@ -11,5 +11,6 @@ function useDeepCompareMemoize(value) {
     return ref.current;
 }
 export const useDeepCompareEffect = (callback, dependencies) => {
+    // eslint-disable-next-line react-hooks/exhaustive-deps
     useEffect(callback, dependencies.map(useDeepCompareMemoize));
 };

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@neo4j-nvl/react",
-  "version": "0.3.1-c678d7aa",
+  "version": "0.3.1-d62fa5e9",
   "main": "lib/index.js",
   "homepage": "https://neo4j.com/docs/nvl/current/",
   "license": "SEE LICENSE IN 'LICENSE.txt'",
@@ -41,8 +41,8 @@
     "typescript": "^5.4.5"
   },
   "dependencies": {
-    "@neo4j-nvl/base": "^0.3.1-c678d7aa",
-    "@neo4j-nvl/interaction-handlers": "^0.3.1-c678d7aa",
+    "@neo4j-nvl/base": "^0.3.1-d62fa5e9",
+    "@neo4j-nvl/interaction-handlers": "^0.3.1-d62fa5e9",
     "lodash": "4.17.21",
     "react": "^18.2.0",
     "react-dom": "^18.2.0"