Added console warnings and improved rules for react integration (#190)

Author: ydaniv

packages/interact/rules/full-lean.md

@@ -62,9 +62,20 @@ The `config` object is an `InteractConfig` containing `interactions` (required),
 
 **React:**
 
+- Wrap the `Interact.create()` call in a `useEffect` hook to prevent it from running on server-side.
+- Store the returned instance, and call its `.destroy()` method on the effect's cleanup function.
+
 ```ts
+import { useEffect } from 'react';
 import { Interact } from '@wix/interact/react';
-const instance = Interact.create(config);
+
+useEffect(() => {
+  const instance = Interact.create(config);
+
+  return () => {
+    instance.destroy();
+  };
+}, [config]);
 ```
 
 **Vanilla JS:**

packages/interact/rules/integration.md

@@ -53,10 +53,20 @@ Wrap target elements with `<interact-element>`:
 
 ### React
 
+- Wrap the `Interact.create()` call in a `useEffect` hook to prevent it from running on server-side.
+- Store the returned instance, and call its `.destroy()` method on the effect's cleanup function.
+
 ```typescript
+import { useEffect } from 'react';
 import { Interact } from '@wix/interact/react';
 
-Interact.create(config);
+useEffect(() => {
+  const instance = Interact.create(config);
+
+  return () => {
+    instance.destroy();
+  };
+}, [config]);
 ```
 
 Replace target elements with `<Interaction>`:

packages/interact/src/core/Interact.ts

@@ -220,11 +220,19 @@ export class Interact {
   }
 
   static getInstance(key: string): Interact | undefined {
-    return Interact.instances.find((instance) => instance.has(key));
+    const instance = Interact.instances.find((instance) => instance.has(key));
+    if (!instance) {
+      console.warn(`Interact: Instance for key "${key}" not found`);
+    }
+    return instance;
   }
 
   static getController(key: string | undefined): IInteractionController | undefined {
-    return key ? Interact.controllerCache.get(key) : undefined;
+    const controller = key ? Interact.controllerCache.get(key) : undefined;
+    if (!controller) {
+      console.warn(`Interact: Controller for key "${key}" not found`);
+    }
+    return controller;
   }
 
   static setController(key: string, controller: IInteractionController): void {