canvu-react 0.4.44 → 0.4.45

package/dist/native.cjs

@@ -963,6 +963,9 @@ function rebuildItemSvg(item) {
   }
   return item;
 }
+function applyStrokeToItem(item, patch) {
+  return rebuildItemSvg({ ...item, ...patch });
+}
 function createRectangleItem(id, bounds, style) {
   const r = normalizeRect(bounds);
   const s = { ...DEFAULT_STROKE_STYLE, ...style };
@@ -5197,6 +5200,14 @@ function isPlacementTool(toolId) {
 function isDefaultMarkerToolStyle(style) {
   return style.stroke === MARKER_TOOL_STYLE.stroke && style.strokeWidth === MARKER_TOOL_STYLE.strokeWidth && style.strokeOpacity === MARKER_TOOL_STYLE.strokeOpacity;
 }
+function getNativeStyleInspectorToolId(item) {
+  const kind = item.toolKind;
+  if (kind === "marker") return "marker";
+  if (kind === "draw" || kind === "pencil" || kind === "brush" || kind === "rect" || kind === "ellipse" || kind === "architectural-cloud" || kind === "line" || kind === "arrow") {
+    return "draw";
+  }
+  return null;
+}
 function placementPreviewForTool(toolId, start, end) {
   if (toolId === "rect" || toolId === "ellipse" || toolId === "architectural-cloud") {
     return { kind: toolId, rect: rectFromCorners(start, end) };
@@ -5460,12 +5471,45 @@ var NativeVectorViewport = react.forwardRef(function NativeVectorViewport2({
     () => items.filter((it) => selectedIds.includes(it.id)),
     [items, selectedIds]
   );
+  const selectedStyleInspectorState = react.useMemo(() => {
+    const styleableItems = selectedItems.filter(
+      (item) => !item.locked && getNativeStyleInspectorToolId(item) !== null
+    );
+    if (styleableItems.length === 0) return null;
+    const toolId2 = styleableItems.every((item) => item.toolKind === "marker") ? "marker" : "draw";
+    const primaryItem = toolId2 === "marker" ? styleableItems[0] : styleableItems.find((item) => item.toolKind !== "marker") ?? styleableItems[0];
+    if (!primaryItem) return null;
+    return {
+      toolId: toolId2,
+      value: resolveStrokeStyle(primaryItem)
+    };
+  }, [selectedItems]);
   const sceneItems = react.useMemo(() => {
     if (eraserPreviewIds.length === 0) return items;
     const hidden = new Set(eraserPreviewIds);
     return items.filter((it) => !hidden.has(it.id));
   }, [items, eraserPreviewIds]);
   const showResizeHandles = interactive && selectedItems.length === 1 && !selectedItems[0]?.locked && supportsNativeResizeHandles(selectedItems[0]);
+  const patchSelectedItemsStrokeStyle = react.useCallback(
+    (patch) => {
+      const change = onItemsChangeRef.current;
+      if (!change) return;
+      const selectedIdSet = new Set(selectedIdsRef.current);
+      if (selectedIdSet.size === 0) return;
+      let changed = false;
+      const nextItems = itemsRef.current.map((item) => {
+        if (!selectedIdSet.has(item.id) || item.locked || getNativeStyleInspectorToolId(item) === null) {
+          return item;
+        }
+        changed = true;
+        return applyStrokeToItem(item, patch);
+      });
+      if (!changed) return;
+      change(nextItems);
+      patchCurrentStrokeStyle(patch);
+    },
+    [patchCurrentStrokeStyle]
+  );
   const lastPinchDist = react.useRef(null);
   const lastPanPoint = react.useRef(null);
   const beginDragAtScreenPoint = react.useCallback(
@@ -6211,6 +6255,9 @@ var NativeVectorViewport = react.forwardRef(function NativeVectorViewport2({
     [requestRender, size]
   );
   const activeStyleToolId = toolId === "draw" || toolId === "marker" ? toolId : null;
+  const styleInspectorToolId = selectedStyleInspectorState?.toolId ?? activeStyleToolId;
+  const styleInspectorValue = selectedStyleInspectorState?.value ?? strokeStyleState;
+  const styleInspectorChange = selectedStyleInspectorState ? patchSelectedItemsStrokeStyle : patchCurrentStrokeStyle;
   const nativeLinkDialogLabels = {
     ...DEFAULT_NATIVE_LINK_TOOL_DIALOG_LABELS,
     ...linkToolDialogLabels ?? {}
@@ -6277,7 +6324,7 @@ var NativeVectorViewport = react.forwardRef(function NativeVectorViewport2({
           children: overlay
         }
       ) : null,
-      interactive && showStyleInspector && activeStyleToolId ? /* @__PURE__ */ jsxRuntime.jsx(
+      interactive && showStyleInspector && styleInspectorToolId ? /* @__PURE__ */ jsxRuntime.jsx(
         reactNative.View,
         {
           pointerEvents: "box-none",
@@ -6300,9 +6347,9 @@ var NativeVectorViewport = react.forwardRef(function NativeVectorViewport2({
           children: /* @__PURE__ */ jsxRuntime.jsx(
             NativeVectorStyleInspector,
             {
-              toolId: activeStyleToolId,
-              value: strokeStyleState,
-              onChange: patchCurrentStrokeStyle
+              toolId: styleInspectorToolId,
+              value: styleInspectorValue,
+              onChange: styleInspectorChange
             }
           )
         }