react-native-image-editor-skia 0.1.0

package/lib/module/canvas/InFlightLayer.js

@@ -0,0 +1,149 @@
+"use strict";
+
+import { Circle, Group, Line, Path, Rect, Skia } from '@shopify/react-native-skia';
+import { useDerivedValue } from 'react-native-reanimated';
+import { ARROW_HEAD_RATIO, MARKER_OPACITY } from '../constants';
+import { withOpacity } from '../utils/color';
+
+/**
+ * Renders the shape currently being drawn, bound to the `draw` shared values so
+ * it updates on the UI thread. The active tool is fixed for the duration of a
+ * draw, so switching on it here is safe. Opacity is 0 when not drawing.
+ *
+ * Receives `editor` as a prop (context does not cross the Skia Canvas boundary).
+ */
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+export function InFlightLayer({
+  editor
+}) {
+  const {
+    tool,
+    draw,
+    strokeColor,
+    strokeWidth
+  } = editor;
+  const opacity = useDerivedValue(() => draw.active.value ? 1 : 0);
+  return /*#__PURE__*/_jsxs(Group, {
+    opacity: opacity,
+    children: [tool === 'circle' && /*#__PURE__*/_jsx(CirclePreview, {
+      draw: draw,
+      color: strokeColor,
+      width: strokeWidth
+    }), tool === 'arrow' && /*#__PURE__*/_jsx(ArrowPreview, {
+      draw: draw,
+      color: strokeColor,
+      width: strokeWidth
+    }), tool === 'marker' && /*#__PURE__*/_jsx(MarkerPreview, {
+      draw: draw,
+      color: strokeColor
+    }), tool === 'freehand' && /*#__PURE__*/_jsx(FreehandPreview, {
+      draw: draw,
+      color: strokeColor,
+      width: strokeWidth
+    })]
+  });
+}
+function CirclePreview({
+  draw,
+  color,
+  width
+}) {
+  const cx = useDerivedValue(() => draw.start.value.x);
+  const cy = useDerivedValue(() => draw.start.value.y);
+  const r = useDerivedValue(() => Math.hypot(draw.current.value.x - draw.start.value.x, draw.current.value.y - draw.start.value.y));
+  return /*#__PURE__*/_jsx(Circle, {
+    cx: cx,
+    cy: cy,
+    r: r,
+    color: color,
+    style: "stroke",
+    strokeWidth: width
+  });
+}
+function ArrowPreview({
+  draw,
+  color,
+  width
+}) {
+  const headSize = width * ARROW_HEAD_RATIO;
+  const p1 = useDerivedValue(() => draw.start.value);
+  const p2 = useDerivedValue(() => draw.current.value);
+  const barb1 = useDerivedValue(() => {
+    const s = draw.start.value;
+    const e = draw.current.value;
+    const angle = Math.atan2(e.y - s.y, e.x - s.x);
+    const barb = Math.PI * 5 / 6;
+    return {
+      x: e.x + headSize * Math.cos(angle + barb),
+      y: e.y + headSize * Math.sin(angle + barb)
+    };
+  });
+  const barb2 = useDerivedValue(() => {
+    const s = draw.start.value;
+    const e = draw.current.value;
+    const angle = Math.atan2(e.y - s.y, e.x - s.x);
+    const barb = Math.PI * 5 / 6;
+    return {
+      x: e.x + headSize * Math.cos(angle - barb),
+      y: e.y + headSize * Math.sin(angle - barb)
+    };
+  });
+  return /*#__PURE__*/_jsxs(Group, {
+    color: color,
+    style: "stroke",
+    strokeWidth: width,
+    strokeCap: "round",
+    children: [/*#__PURE__*/_jsx(Line, {
+      p1: p1,
+      p2: p2
+    }), /*#__PURE__*/_jsx(Line, {
+      p1: p2,
+      p2: barb1
+    }), /*#__PURE__*/_jsx(Line, {
+      p1: p2,
+      p2: barb2
+    })]
+  });
+}
+function MarkerPreview({
+  draw,
+  color
+}) {
+  const x = useDerivedValue(() => Math.min(draw.start.value.x, draw.current.value.x));
+  const y = useDerivedValue(() => Math.min(draw.start.value.y, draw.current.value.y));
+  const w = useDerivedValue(() => Math.abs(draw.current.value.x - draw.start.value.x));
+  const h = useDerivedValue(() => Math.abs(draw.current.value.y - draw.start.value.y));
+  return /*#__PURE__*/_jsx(Rect, {
+    x: x,
+    y: y,
+    width: w,
+    height: h,
+    color: withOpacity(color, MARKER_OPACITY)
+  });
+}
+function FreehandPreview({
+  draw,
+  color,
+  width
+}) {
+  const path = useDerivedValue(() => {
+    const pts = draw.points.value;
+    const p = Skia.Path.Make();
+    if (pts.length > 0) {
+      p.moveTo(pts[0].x, pts[0].y);
+      for (let i = 1; i < pts.length; i++) {
+        p.lineTo(pts[i].x, pts[i].y);
+      }
+    }
+    return p;
+  });
+  return /*#__PURE__*/_jsx(Path, {
+    path: path,
+    color: color,
+    style: "stroke",
+    strokeWidth: width,
+    strokeCap: "round",
+    strokeJoin: "round"
+  });
+}
+//# sourceMappingURL=InFlightLayer.js.map

package/lib/module/canvas/InFlightLayer.js.map

@@ -0,0 +1 @@
+{"version":3,"names":["Circle","Group","Line","Path","Rect","Skia","useDerivedValue","ARROW_HEAD_RATIO","MARKER_OPACITY","withOpacity","jsx","_jsx","jsxs","_jsxs","InFlightLayer","editor","tool","draw","strokeColor","strokeWidth","opacity","active","value","children","CirclePreview","color","width","ArrowPreview","MarkerPreview","FreehandPreview","cx","start","x","cy","y","r","Math","hypot","current","style","headSize","p1","p2","barb1","s","e","angle","atan2","barb","PI","cos","sin","barb2","strokeCap","min","w","abs","h","height","path","pts","points","p","Make","length","moveTo","i","lineTo","strokeJoin"],"sourceRoot":"..\\..\\..\\src","sources":["canvas/InFlightLayer.tsx"],"mappings":"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","ignoreList":[]}

package/lib/module/canvas/SelectionOverlay.js

@@ -0,0 +1,85 @@
+"use strict";
+
+import React, { useMemo } from 'react';
+import { Circle, Group, Line, Path, Rect, Skia } from '@shopify/react-native-skia';
+import { useDerivedValue } from 'react-native-reanimated';
+import { getAnnotationById } from '../state/selectors';
+import { selectionHandles } from '../gestures/handles';
+import { HANDLE_SIZE } from '../constants';
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+const SELECTION_COLOR = '#1E90FF';
+
+/**
+ * Draws the selection bounding box + resize corners + rotate handle in SCREEN
+ * space (outside the scene transform, so handle size is zoom-independent). The
+ * overlay hides itself during an active live transform to avoid a stale double.
+ */
+export function SelectionOverlay({
+  editor
+}) {
+  const {
+    annotations,
+    selectedId,
+    matrix,
+    live
+  } = editor;
+  const selected = getAnnotationById(annotations, selectedId);
+  const opacity = useDerivedValue(() => live.active.value ? 0 : 1);
+  const handles = useMemo(() => selected ? selectionHandles(selected, matrix) : null, [selected, matrix]);
+  const boxPath = useMemo(() => {
+    if (!handles) {
+      return null;
+    }
+    const p = Skia.Path.Make();
+    const c = handles.corners;
+    p.moveTo(c[0].x, c[0].y);
+    p.lineTo(c[1].x, c[1].y);
+    p.lineTo(c[2].x, c[2].y);
+    p.lineTo(c[3].x, c[3].y);
+    p.close();
+    return p;
+  }, [handles]);
+  if (!selected || !handles || !boxPath) {
+    return null;
+  }
+  const topMid = {
+    x: (handles.corners[0].x + handles.corners[1].x) / 2,
+    y: (handles.corners[0].y + handles.corners[1].y) / 2
+  };
+  return /*#__PURE__*/_jsxs(Group, {
+    opacity: opacity,
+    children: [/*#__PURE__*/_jsx(Path, {
+      path: boxPath,
+      color: SELECTION_COLOR,
+      style: "stroke",
+      strokeWidth: 2
+    }), /*#__PURE__*/_jsx(Line, {
+      p1: topMid,
+      p2: handles.rotate,
+      color: SELECTION_COLOR,
+      strokeWidth: 2
+    }), /*#__PURE__*/_jsx(Circle, {
+      cx: handles.rotate.x,
+      cy: handles.rotate.y,
+      r: HANDLE_SIZE / 2,
+      color: SELECTION_COLOR
+    }), handles.corners.map((corner, i) => /*#__PURE__*/_jsxs(React.Fragment, {
+      children: [/*#__PURE__*/_jsx(Rect, {
+        x: corner.x - HANDLE_SIZE / 2,
+        y: corner.y - HANDLE_SIZE / 2,
+        width: HANDLE_SIZE,
+        height: HANDLE_SIZE,
+        color: "#FFFFFF"
+      }), /*#__PURE__*/_jsx(Rect, {
+        x: corner.x - HANDLE_SIZE / 2,
+        y: corner.y - HANDLE_SIZE / 2,
+        width: HANDLE_SIZE,
+        height: HANDLE_SIZE,
+        color: SELECTION_COLOR,
+        style: "stroke",
+        strokeWidth: 2
+      })]
+    }, i))]
+  });
+}
+//# sourceMappingURL=SelectionOverlay.js.map

package/lib/module/canvas/SelectionOverlay.js.map

@@ -0,0 +1 @@
+{"version":3,"names":["React","useMemo","Circle","Group","Line","Path","Rect","Skia","useDerivedValue","getAnnotationById","selectionHandles","HANDLE_SIZE","jsx","_jsx","jsxs","_jsxs","SELECTION_COLOR","SelectionOverlay","editor","annotations","selectedId","matrix","live","selected","opacity","active","value","handles","boxPath","p","Make","c","corners","moveTo","x","y","lineTo","close","topMid","children","path","color","style","strokeWidth","p1","p2","rotate","cx","cy","r","map","corner","i","Fragment","width","height"],"sourceRoot":"..\\..\\..\\src","sources":["canvas/SelectionOverlay.tsx"],"mappings":"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","ignoreList":[]}

package/lib/module/constants.js

@@ -0,0 +1,52 @@
+"use strict";
+
+/** Default stroke width (in image pixels) for new shapes. */
+export const DEFAULT_STROKE_WIDTH = 8;
+
+/** Default font size (in image pixels) for new text annotations. */
+export const DEFAULT_FONT_SIZE = 48;
+
+/** Default wrap width (in image pixels) for new text boxes. */
+export const DEFAULT_TEXT_WIDTH = 400;
+
+/** Semi-transparent opacity for the marker/highlighter tool. */
+export const MARKER_OPACITY = 0.4;
+
+/** Arrowhead barb length as a multiple of stroke width. */
+export const ARROW_HEAD_RATIO = 4;
+
+/** Touch slop (in screen points) added to hit-test radii for easier selection. */
+export const HIT_SLOP = 12;
+
+/** On-screen size (points) of selection handles. */
+export const HANDLE_SIZE = 14;
+
+/** Distance (points) the rotate handle sits above the selection's top edge. */
+export const ROTATE_HANDLE_OFFSET = 36;
+
+/** Max entries retained in the undo/redo history. */
+export const MAX_HISTORY = 50;
+
+/** Minimum spacing (image px) between sampled freehand points. */
+export const FREEHAND_MIN_DISTANCE = 3;
+export const DEFAULT_STROKE_COLOR = '#FF3B30';
+export const DEFAULT_TEXT_COLOR = '#FFFFFF';
+export const DEFAULT_PALETTE = ['#FF3B30',
+// red
+'#FF9500',
+// orange
+'#FFCC00',
+// yellow
+'#34C759',
+// green
+'#007AFF',
+// blue
+'#5856D6',
+// indigo
+'#AF52DE',
+// purple
+'#FFFFFF',
+// white
+'#000000' // black
+];
+//# sourceMappingURL=constants.js.map

package/lib/module/constants.js.map

@@ -0,0 +1 @@
+{"version":3,"names":["DEFAULT_STROKE_WIDTH","DEFAULT_FONT_SIZE","DEFAULT_TEXT_WIDTH","MARKER_OPACITY","ARROW_HEAD_RATIO","HIT_SLOP","HANDLE_SIZE","ROTATE_HANDLE_OFFSET","MAX_HISTORY","FREEHAND_MIN_DISTANCE","DEFAULT_STROKE_COLOR","DEFAULT_TEXT_COLOR","DEFAULT_PALETTE"],"sourceRoot":"..\\..\\src","sources":["constants.ts"],"mappings":";;AAEA;AACA,OAAO,MAAMA,oBAAoB,GAAG,CAAC;;AAErC;AACA,OAAO,MAAMC,iBAAiB,GAAG,EAAE;;AAEnC;AACA,OAAO,MAAMC,kBAAkB,GAAG,GAAG;;AAErC;AACA,OAAO,MAAMC,cAAc,GAAG,GAAG;;AAEjC;AACA,OAAO,MAAMC,gBAAgB,GAAG,CAAC;;AAEjC;AACA,OAAO,MAAMC,QAAQ,GAAG,EAAE;;AAE1B;AACA,OAAO,MAAMC,WAAW,GAAG,EAAE;;AAE7B;AACA,OAAO,MAAMC,oBAAoB,GAAG,EAAE;;AAEtC;AACA,OAAO,MAAMC,WAAW,GAAG,EAAE;;AAE7B;AACA,OAAO,MAAMC,qBAAqB,GAAG,CAAC;AAEtC,OAAO,MAAMC,oBAAiC,GAAG,SAAS;AAC1D,OAAO,MAAMC,kBAA+B,GAAG,SAAS;AAExD,OAAO,MAAMC,eAA8B,GAAG,CAC5C,SAAS;AAAE;AACX,SAAS;AAAE;AACX,SAAS;AAAE;AACX,SAAS;AAAE;AACX,SAAS;AAAE;AACX,SAAS;AAAE;AACX,SAAS;AAAE;AACX,SAAS;AAAE;AACX,SAAS,CAAE;AAAA,CACZ","ignoreList":[]}

package/lib/module/context/EditorContext.js

@@ -0,0 +1,126 @@
+"use strict";
+
+import React, { createContext, useContext, useEffect, useMemo, useState } from 'react';
+import { useSharedValue } from 'react-native-reanimated';
+import { DEFAULT_PALETTE, DEFAULT_STROKE_COLOR, DEFAULT_STROKE_WIDTH, DEFAULT_TEXT_COLOR } from '../constants';
+import { useEditorReducer } from '../state/useEditorReducer';
+import { canRedo, canUndo } from '../state/history';
+import { identity, imageToScreenMatrix } from '../utils/math';
+
+/** Live geometry of a shape currently being drawn (UI-thread shared values). */
+
+/** Live transform applied to the selected annotation during move/resize/rotate. */
+import { jsx as _jsx } from "react/jsx-runtime";
+const EditorContext = /*#__PURE__*/createContext(null);
+export function useEditor() {
+  const ctx = useContext(EditorContext);
+  if (!ctx) {
+    throw new Error('useEditor must be used within <EditorProvider>');
+  }
+  return ctx;
+}
+export function EditorProvider({
+  imageSize,
+  initialStrokeColor = DEFAULT_STROKE_COLOR,
+  initialTextColor = DEFAULT_TEXT_COLOR,
+  palette = DEFAULT_PALETTE,
+  children
+}) {
+  const [state, dispatch] = useEditorReducer();
+  const [tool, setTool] = useState('select');
+  const [selectedId, setSelectedId] = useState(null);
+  const [strokeColor, setStrokeColor] = useState(initialStrokeColor);
+  const [textColor, setTextColor] = useState(initialTextColor);
+  const [strokeWidth, setStrokeWidth] = useState(DEFAULT_STROKE_WIDTH);
+  const [editingTextId, setEditingTextId] = useState(null);
+  const [layout, setLayout] = useState({
+    width: 1,
+    height: 1
+  });
+  const doc = state.present;
+
+  // Draw shared values.
+  const drawActive = useSharedValue(false);
+  const drawStart = useSharedValue({
+    x: 0,
+    y: 0
+  });
+  const drawCurrent = useSharedValue({
+    x: 0,
+    y: 0
+  });
+  const drawPoints = useSharedValue([]);
+
+  // Live transform shared values.
+  const liveActive = useSharedValue(false);
+  const liveTx = useSharedValue(0);
+  const liveTy = useSharedValue(0);
+  const liveRotate = useSharedValue(0);
+  const liveScale = useSharedValue(1);
+  const liveOrigin = useSharedValue({
+    x: 0,
+    y: 0
+  });
+  const matrixSV = useSharedValue(identity());
+  const cropRectSV = useSharedValue({
+    x: 0,
+    y: 0,
+    width: imageSize.width,
+    height: imageSize.height
+  });
+  const matrix = useMemo(() => imageToScreenMatrix(doc.scene, imageSize, layout), [doc.scene, imageSize, layout]);
+
+  // Mirror the JS-thread matrix into the shared value for worklet reads.
+  useEffect(() => {
+    matrixSV.value = matrix;
+  }, [matrix, matrixSV]);
+  const value = useMemo(() => ({
+    state,
+    dispatch,
+    doc,
+    annotations: doc.annotations,
+    canUndo: canUndo(state),
+    canRedo: canRedo(state),
+    tool,
+    setTool,
+    selectedId,
+    setSelectedId,
+    strokeColor,
+    setStrokeColor,
+    textColor,
+    setTextColor,
+    strokeWidth,
+    setStrokeWidth,
+    palette,
+    editingTextId,
+    setEditingTextId,
+    layout,
+    setLayout,
+    imageSize,
+    matrix,
+    matrixSV,
+    draw: {
+      active: drawActive,
+      start: drawStart,
+      current: drawCurrent,
+      points: drawPoints
+    },
+    live: {
+      active: liveActive,
+      tx: liveTx,
+      ty: liveTy,
+      rotate: liveRotate,
+      scale: liveScale,
+      origin: liveOrigin
+    },
+    cropRectSV
+  }),
+  // Shared values are stable refs; only re-memoize on JS-state changes.
+  // eslint-disable-next-line react-hooks/exhaustive-deps
+  [state, doc, tool, selectedId, strokeColor, textColor, strokeWidth, palette, editingTextId, layout, imageSize, matrix]);
+  return /*#__PURE__*/_jsx(EditorContext.Provider, {
+    value: value,
+    children: children
+  });
+}
+//# sourceMappingURL=EditorContext.js.map

package/lib/module/context/EditorContext.js.map

@@ -0,0 +1 @@
+{"version":3,"names":["React","createContext","useContext","useEffect","useMemo","useState","useSharedValue","DEFAULT_PALETTE","DEFAULT_STROKE_COLOR","DEFAULT_STROKE_WIDTH","DEFAULT_TEXT_COLOR","useEditorReducer","canRedo","canUndo","identity","imageToScreenMatrix","jsx","_jsx","EditorContext","useEditor","ctx","Error","EditorProvider","imageSize","initialStrokeColor","initialTextColor","palette","children","state","dispatch","tool","setTool","selectedId","setSelectedId","strokeColor","setStrokeColor","textColor","setTextColor","strokeWidth","setStrokeWidth","editingTextId","setEditingTextId","layout","setLayout","width","height","doc","present","drawActive","drawStart","x","y","drawCurrent","drawPoints","liveActive","liveTx","liveTy","liveRotate","liveScale","liveOrigin","matrixSV","cropRectSV","matrix","scene","value","annotations","draw","active","start","current","points","live","tx","ty","rotate","scale","origin","Provider"],"sourceRoot":"..\\..\\..\\src","sources":["context/EditorContext.tsx"],"mappings":"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","ignoreList":[]}

package/lib/module/export/drawScene.js

@@ -0,0 +1,93 @@
+"use strict";
+
+import { PaintStyle, Skia, StrokeCap, StrokeJoin, matchFont } from '@shopify/react-native-skia';
+import { sortedByZ } from '../state/selectors';
+import { annotationCenter, buildArrowPath, buildFreehandPath } from '../annotations/geometry';
+import { withOpacity } from '../utils/color';
+const RAD_TO_DEG = 180 / Math.PI;
+
+/**
+ * Imperative draw of the base image + all annotations onto `canvas`, in IMAGE
+ * space. Shared by the off-screen export path. Mirrors the declarative on-screen
+ * renderers (same geometry, same rotation-about-center), so exports match the
+ * preview. The caller sets up the output transform + clip before calling this.
+ */
+export function drawScene(canvas, image, annotations) {
+  canvas.drawImage(image, 0, 0);
+  for (const a of sortedByZ(annotations)) {
+    drawAnnotation(canvas, a);
+  }
+}
+function strokePaint(color, width) {
+  const paint = Skia.Paint();
+  paint.setColor(Skia.Color(color));
+  paint.setStyle(PaintStyle.Stroke);
+  paint.setStrokeWidth(width);
+  paint.setAntiAlias(true);
+  paint.setStrokeCap(StrokeCap.Round);
+  paint.setStrokeJoin(StrokeJoin.Round);
+  return paint;
+}
+function fillPaint(color) {
+  const paint = Skia.Paint();
+  paint.setColor(Skia.Color(color));
+  paint.setStyle(PaintStyle.Fill);
+  paint.setAntiAlias(true);
+  return paint;
+}
+function drawAnnotation(canvas, a) {
+  const center = annotationCenter(a);
+  canvas.save();
+  if (a.rotation) {
+    canvas.translate(center.x, center.y);
+    canvas.rotate(a.rotation * RAD_TO_DEG, 0, 0);
+    canvas.translate(-center.x, -center.y);
+  }
+  switch (a.type) {
+    case 'circle':
+      {
+        if (a.fill) {
+          canvas.drawCircle(a.center.x, a.center.y, a.radius, fillPaint(a.fill));
+        }
+        canvas.drawCircle(a.center.x, a.center.y, a.radius, strokePaint(a.strokeColor, a.strokeWidth));
+        break;
+      }
+    case 'arrow':
+      {
+        const path = buildArrowPath(a.start, a.end, a.headSize);
+        canvas.drawPath(path, strokePaint(a.strokeColor, a.strokeWidth));
+        path.dispose?.();
+        break;
+      }
+    case 'marker':
+      {
+        const rect = Skia.XYWHRect(a.rect.x, a.rect.y, a.rect.width, a.rect.height);
+        canvas.drawRect(rect, fillPaint(withOpacity(a.color, a.opacity)));
+        break;
+      }
+    case 'freehand':
+      {
+        const path = buildFreehandPath(a.points);
+        canvas.drawPath(path, strokePaint(a.strokeColor, a.strokeWidth));
+        path.dispose?.();
+        break;
+      }
+    case 'text':
+      {
+        const font = matchFont({
+          fontFamily: 'sans-serif',
+          fontSize: a.fontSize,
+          fontStyle: 'normal',
+          fontWeight: 'normal'
+        });
+        const paint = fillPaint(a.color);
+        const lineHeight = a.fontSize * 1.2;
+        a.text.split('\n').forEach((line, i) => {
+          canvas.drawText(line, a.origin.x, a.origin.y + a.fontSize + i * lineHeight, paint, font);
+        });
+        break;
+      }
+  }
+  canvas.restore();
+}
+//# sourceMappingURL=drawScene.js.map

package/lib/module/export/drawScene.js.map

@@ -0,0 +1 @@
+{"version":3,"names":["PaintStyle","Skia","StrokeCap","StrokeJoin","matchFont","sortedByZ","annotationCenter","buildArrowPath","buildFreehandPath","withOpacity","RAD_TO_DEG","Math","PI","drawScene","canvas","image","annotations","drawImage","a","drawAnnotation","strokePaint","color","width","paint","Paint","setColor","Color","setStyle","Stroke","setStrokeWidth","setAntiAlias","setStrokeCap","Round","setStrokeJoin","fillPaint","Fill","center","save","rotation","translate","x","y","rotate","type","fill","drawCircle","radius","strokeColor","strokeWidth","path","start","end","headSize","drawPath","dispose","rect","XYWHRect","height","drawRect","opacity","points","font","fontFamily","fontSize","fontStyle","fontWeight","lineHeight","text","split","forEach","line","i","drawText","origin","restore"],"sourceRoot":"..\\..\\..\\src","sources":["export/drawScene.ts"],"mappings":"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","ignoreList":[]}

package/lib/module/export/exportImage.js

@@ -0,0 +1,88 @@
+"use strict";
+
+import { ClipOp, ImageFormat, Skia } from '@shopify/react-native-skia';
+import { clampSizeToMax } from '../utils/math';
+import { drawScene } from './drawScene';
+import { safeDispose } from '../image/disposeRegistry';
+const RAD_TO_DEG = 180 / Math.PI;
+/**
+ * Render the scene OFF-SCREEN at full resolution and return base64.
+ *
+ * Output = the (optionally cropped) image + annotations, scaled by `scene.scale`
+ * and rotated by `scene.rotation`, on a surface sized to the rotated content's
+ * bounding box (transparent corners for PNG). Because annotations live in image
+ * space, no per-annotation rescaling is needed — the exact preview geometry is
+ * drawn at native resolution.
+ *
+ * All Skia objects created here (surface + snapshot) are disposed before return.
+ */
+export async function exportImage(params) {
+  const {
+    image,
+    annotations,
+    scene,
+    imageWidth,
+    imageHeight,
+    options
+  } = params;
+  const format = options?.format ?? 'png';
+  const quality = options?.quality ?? 100;
+  const dataUri = options?.dataUri ?? true;
+  const src = scene.cropRect ?? {
+    x: 0,
+    y: 0,
+    width: imageWidth,
+    height: imageHeight
+  };
+  const contentW = src.width * scene.scale;
+  const contentH = src.height * scene.scale;
+  const absCos = Math.abs(Math.cos(scene.rotation));
+  const absSin = Math.abs(Math.sin(scene.rotation));
+  const rotatedW = contentW * absCos + contentH * absSin;
+  const rotatedH = contentW * absSin + contentH * absCos;
+  const clamped = clampSizeToMax(Math.max(1, Math.ceil(rotatedW)), Math.max(1, Math.ceil(rotatedH)), options?.maxExportSize);
+  // Reduce the drawing scale by the same factor the clamp shrank the surface.
+  const clampFactor = clamped.width / Math.max(1, Math.ceil(rotatedW));
+  const drawScale = scene.scale * clampFactor;
+  const surface = Skia.Surface.MakeOffscreen(clamped.width, clamped.height);
+  if (!surface) {
+    throw new Error('Skia.Surface.MakeOffscreen returned null — offscreen export unavailable on this device/version.');
+  }
+  let snapshot = null;
+  try {
+    const canvas = surface.getCanvas();
+    const srcCenter = {
+      x: src.x + src.width / 2,
+      y: src.y + src.height / 2
+    };
+    canvas.save();
+    canvas.translate(clamped.width / 2, clamped.height / 2);
+    if (scene.rotation) {
+      canvas.rotate(scene.rotation * RAD_TO_DEG, 0, 0);
+    }
+    canvas.scale(drawScale, drawScale);
+    canvas.translate(-srcCenter.x, -srcCenter.y);
+    // Clip to the crop region so only the selected area is drawn.
+    canvas.clipRect(Skia.XYWHRect(src.x, src.y, src.width, src.height), ClipOp.Intersect, true);
+    drawScene(canvas, image, annotations);
+    canvas.restore();
+    surface.flush();
+    snapshot = surface.makeImageSnapshot();
+    const skFormat = format === 'jpeg' ? ImageFormat.JPEG : ImageFormat.PNG;
+    const base64 = snapshot.encodeToBase64(skFormat, quality);
+
+    // File output: write the raw base64 via the caller-supplied writer.
+    if (options?.output === 'file') {
+      if (!options.filePath || !options.writeFile) {
+        throw new Error("exportImage: output:'file' requires both `filePath` and `writeFile`.");
+      }
+      await options.writeFile(options.filePath, base64);
+      return options.filePath;
+    }
+    return dataUri ? `data:image/${format};base64,${base64}` : base64;
+  } finally {
+    safeDispose(snapshot);
+    safeDispose(surface);
+  }
+}
+//# sourceMappingURL=exportImage.js.map

package/lib/module/export/exportImage.js.map

@@ -0,0 +1 @@
+{"version":3,"names":["ClipOp","ImageFormat","Skia","clampSizeToMax","drawScene","safeDispose","RAD_TO_DEG","Math","PI","exportImage","params","image","annotations","scene","imageWidth","imageHeight","options","format","quality","dataUri","src","cropRect","x","y","width","height","contentW","scale","contentH","absCos","abs","cos","rotation","absSin","sin","rotatedW","rotatedH","clamped","max","ceil","maxExportSize","clampFactor","drawScale","surface","Surface","MakeOffscreen","Error","snapshot","canvas","getCanvas","srcCenter","save","translate","rotate","clipRect","XYWHRect","Intersect","restore","flush","makeImageSnapshot","skFormat","JPEG","PNG","base64","encodeToBase64","output","filePath","writeFile"],"sourceRoot":"..\\..\\..\\src","sources":["export/exportImage.ts"],"mappings":"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","ignoreList":[]}