canvu-react 0.4.57 → 0.4.58

package/dist/native.js

@@ -1,6 +1,6 @@
 import getStroke from 'perfect-freehand';
 import { Group, Canvas, Rect, Circle, Path, RoundedRect, Oval, DashPathEffect, Line, vec, matchFont, Text as Text$1, Image } from '@shopify/react-native-skia';
-import { memo, forwardRef, useState, useRef, useEffect, useCallback, useMemo, useImperativeHandle } from 'react';
+import { memo, forwardRef, useState, useImperativeHandle, useRef, useEffect, useCallback, useMemo } from 'react';
 import { StyleSheet, PanResponder, View, Modal, Text, TextInput, Pressable, ScrollView, Image as Image$1 } from 'react-native';
 import { jsx, jsxs, Fragment } from 'react/jsx-runtime';
 
@@ -5541,6 +5541,58 @@ function NativeSelectionContextMenuButton({
     }
   );
 }
+var NativeCameraRenderLayer = forwardRef(function NativeCameraRenderLayer2({
+  items,
+  camera,
+  width,
+  height,
+  interactive,
+  selectedItems,
+  showResizeHandles,
+  placementPreview,
+  laserTrail,
+  eraserTrail,
+  eraserPreviewItems,
+  previewStrokeStyle,
+  remotePresence
+}, ref) {
+  const [cameraTick, setCameraTick] = useState(0);
+  useImperativeHandle(
+    ref,
+    () => ({
+      requestRender: () => setCameraTick((n) => n + 1)
+    }),
+    []
+  );
+  return /* @__PURE__ */ jsxs(Fragment, { children: [
+    /* @__PURE__ */ jsx(
+      NativeSceneRenderer,
+      {
+        items,
+        camera,
+        width,
+        height,
+        renderTick: cameraTick
+      }
+    ),
+    interactive && /* @__PURE__ */ jsx(
+      NativeInteractionOverlay,
+      {
+        camera,
+        width,
+        height,
+        selectedItems,
+        showResizeHandles,
+        placementPreview,
+        laserTrail,
+        eraserTrail,
+        eraserPreviewItems,
+        previewStrokeStyle,
+        remotePresence
+      }
+    )
+  ] });
+});
 var NativeVectorViewport = forwardRef(function NativeVectorViewport2({
   items,
   selectedIds = [],
@@ -5568,6 +5620,7 @@ var NativeVectorViewport = forwardRef(function NativeVectorViewport2({
 }, ref) {
   const [size, setSize] = useState({ width: 0, height: 0 });
   const cameraRef = useRef(null);
+  const cameraRenderLayerRef = useRef(null);
   const toolIdRef = useRef(toolId);
   toolIdRef.current = toolId;
   const toolLockedRef = useRef(toolLocked);
@@ -5762,7 +5815,6 @@ var NativeVectorViewport = forwardRef(function NativeVectorViewport2({
     cameraRef.current = new Camera2D({ minZoom: 0.05, maxZoom: 32 });
   }
   const camera = cameraRef.current;
-  const [cameraTick, setCameraTick] = useState(0);
   const selectedItems = useMemo(
     () => activeItems.filter((item) => selectedIds.includes(item.id)),
     [activeItems, selectedIds]
@@ -5839,7 +5891,7 @@ var NativeVectorViewport = forwardRef(function NativeVectorViewport2({
     onWorldPointerLeaveRef.current?.();
   }, []);
   const requestRender = useCallback(() => {
-    setCameraTick((n) => n + 1);
+    cameraRenderLayerRef.current?.requestRender();
     onCameraChangeRef.current?.();
   }, []);
   const onLayout = useCallback((e) => {
@@ -6746,7 +6798,7 @@ var NativeVectorViewport = forwardRef(function NativeVectorViewport2({
   const nativeLinkCanSubmit = pendingNativeLinkRequest !== null && normalizedNativeLinkHref !== null && onItemsChange != null;
   return /* @__PURE__ */ jsxs(View, { style: { flex: 1, overflow: "hidden" }, onLayout, children: [
     size.width > 0 && size.height > 0 && /* @__PURE__ */ jsxs(Fragment, { children: [
-      /* @__PURE__ */ jsxs(
+      /* @__PURE__ */ jsx(
         View,
         {
           style: StyleSheet.absoluteFill,
@@ -6759,34 +6811,25 @@ var NativeVectorViewport = forwardRef(function NativeVectorViewport2({
             notifyWorldPointerLeave();
           },
           ...panResponder.panHandlers,
-          children: [
-            /* @__PURE__ */ jsx(
-              NativeSceneRenderer,
-              {
-                items: sceneItems,
-                camera,
-                width: size.width,
-                height: size.height,
-                renderTick: cameraTick
-              }
-            ),
-            interactive && /* @__PURE__ */ jsx(
-              NativeInteractionOverlay,
-              {
-                camera,
-                width: size.width,
-                height: size.height,
-                selectedItems,
-                showResizeHandles,
-                placementPreview,
-                laserTrail,
-                eraserTrail,
-                eraserPreviewItems,
-                previewStrokeStyle: strokeStyleState,
-                remotePresence
-              }
-            )
-          ]
+          children: /* @__PURE__ */ jsx(
+            NativeCameraRenderLayer,
+            {
+              ref: cameraRenderLayerRef,
+              items: sceneItems,
+              camera,
+              width: size.width,
+              height: size.height,
+              interactive,
+              selectedItems,
+              showResizeHandles,
+              placementPreview,
+              laserTrail,
+              eraserTrail,
+              eraserPreviewItems,
+              previewStrokeStyle: strokeStyleState,
+              remotePresence
+            }
+          )
         }
       ),
       overlay ? /* @__PURE__ */ jsx(