Docs - LiveCode in table cell - block interaction (#3610)

* LiveCode in table cell - block interaction

* bump version

* Changing for wrapper with pointerEvents

* remove unused

* moving style to css

Author: Inbal-Tish

docuilib/package.json

@@ -1,6 +1,6 @@
 {
   "name": "uilib-docs",
-  "version": "3.9.0",
+  "version": "3.10.0",
   "main": "./src/index.ts",
   "scripts": {
     "docusaurus": "docusaurus",

docuilib/src/components/pageComponents/ContentItem.module.scss

@@ -10,6 +10,10 @@
   top: 0px;
 }
 
+.blocker {
+  pointer-events: none;
+}
+
 .componentExample {
   display: flex;
   justify-content: space-between;

docuilib/src/components/pageComponents/ContentItem.tsx

@@ -53,9 +53,11 @@ const ComponentItem = (props: ComponentItemProps) => {
   }, []);
 
   const componentPreview = (
-    <LiveProvider code={code} scope={ReactLiveScope}>
-      <LivePreview/>
-    </LiveProvider>
+    <div className={styles.blocker}>
+      <LiveProvider code={code} scope={ReactLiveScope}>
+        <LivePreview/>
+      </LiveProvider>
+    </div>
   );
 
   const codePreview = <CodeBlock snippet={code} title="Code Example"/>;