@shopify/react-native-skia 1.7.5 → 1.7.7

package/lib/module/sksg/Container.js

@@ -0,0 +1,94 @@
+function _defineProperty(e, r, t) { return (r = _toPropertyKey(r)) in e ? Object.defineProperty(e, r, { value: t, enumerable: !0, configurable: !0, writable: !0 }) : e[r] = t, e; }
+function _toPropertyKey(t) { var i = _toPrimitive(t, "string"); return "symbol" == typeof i ? i : i + ""; }
+function _toPrimitive(t, r) { if ("object" != typeof t || !t) return t; var e = t[Symbol.toPrimitive]; if (void 0 !== e) { var i = e.call(t, r || "default"); if ("object" != typeof i) return i; throw new TypeError("@@toPrimitive must return a primitive value."); } return ("string" === r ? String : Number)(t); }
+import Rea from "../external/reanimated/ReanimatedProxy";
+import { HAS_REANIMATED, HAS_REANIMATED_3 } from "../external/reanimated/renderHelpers";
+import { DrawingContext } from "./DrawingContext";
+import { draw, isSharedValue } from "./nodes";
+const drawOnscreen = (Skia, nativeId, root) => {
+  "worklet";
+
+  const rec = Skia.PictureRecorder();
+  const canvas = rec.beginRecording();
+  // TODO: This is only support from 3.15 and above (check the exact version)
+  // This could be polyfilled in C++ if needed (or in JS via functions only?)
+  const ctx = new DrawingContext(Skia, canvas);
+  root.forEach(node => {
+    draw(ctx, node);
+  });
+  const picture = rec.finishRecordingAsPicture();
+  SkiaViewApi.setJsiProperty(nativeId, "picture", picture);
+};
+export class Container {
+  constructor(Skia, nativeId) {
+    this.Skia = Skia;
+    this.nativeId = nativeId;
+    _defineProperty(this, "_root", []);
+    _defineProperty(this, "unmounted", false);
+    _defineProperty(this, "values", new Set());
+    _defineProperty(this, "mapperId", null);
+  }
+  get root() {
+    return this._root;
+  }
+  set root(root) {
+    const isOnscreen = this.nativeId !== -1;
+    if (HAS_REANIMATED && !HAS_REANIMATED_3) {
+      throw new Error("React Native Skia only supports Reanimated 3 and above");
+    }
+    if (isOnscreen) {
+      if (this.mapperId !== null) {
+        Rea.stopMapper(this.mapperId);
+      }
+      const {
+        nativeId,
+        Skia
+      } = this;
+      this.mapperId = Rea.startMapper(() => {
+        "worklet";
+
+        drawOnscreen(Skia, nativeId, root);
+      }, Array.from(this.values));
+    }
+    this._root = root;
+  }
+  clear() {
+    console.log("clear container");
+  }
+  redraw() {
+    const isOnscreen = this.nativeId !== -1;
+    if (HAS_REANIMATED && !HAS_REANIMATED_3) {
+      throw new Error("React Native Skia only supports Reanimated 3 and above");
+    }
+    if (isOnscreen) {
+      const {
+        nativeId,
+        Skia,
+        root
+      } = this;
+      Rea.runOnUI(() => {
+        drawOnscreen(Skia, nativeId, root);
+      })();
+    }
+  }
+  getNativeId() {
+    return this.nativeId;
+  }
+  unregisterValues(values) {
+    Object.values(values).filter(isSharedValue).forEach(value => {
+      this.values.delete(value);
+    });
+  }
+  registerValues(values) {
+    Object.values(values).filter(isSharedValue).forEach(value => {
+      this.values.add(value);
+    });
+  }
+  drawOnCanvas(canvas) {
+    const ctx = new DrawingContext(this.Skia, canvas);
+    this.root.forEach(node => {
+      draw(ctx, node);
+    });
+  }
+}
+//# sourceMappingURL=Container.js.map

package/lib/module/sksg/Container.js.map

@@ -0,0 +1 @@
+{"version":3,"names":["Rea","HAS_REANIMATED","HAS_REANIMATED_3","DrawingContext","draw","isSharedValue","drawOnscreen","Skia","nativeId","root","rec","PictureRecorder","canvas","beginRecording","ctx","forEach","node","picture","finishRecordingAsPicture","SkiaViewApi","setJsiProperty","Container","constructor","_defineProperty","Set","_root","isOnscreen","Error","mapperId","stopMapper","startMapper","Array","from","values","clear","console","log","redraw","runOnUI","getNativeId","unregisterValues","Object","filter","value","delete","registerValues","add","drawOnCanvas"],"sources":["Container.ts"],"sourcesContent":["import { type SharedValue } from \"react-native-reanimated\";\n\nimport Rea from \"../external/reanimated/ReanimatedProxy\";\nimport type { Skia, SkCanvas } from \"../skia/types\";\nimport {\n  HAS_REANIMATED,\n  HAS_REANIMATED_3,\n} from \"../external/reanimated/renderHelpers\";\n\nimport { DrawingContext } from \"./DrawingContext\";\nimport type { Node } from \"./nodes\";\nimport { draw, isSharedValue } from \"./nodes\";\n\nconst drawOnscreen = (Skia: Skia, nativeId: number, root: Node[]) => {\n  \"worklet\";\n  const rec = Skia.PictureRecorder();\n  const canvas = rec.beginRecording();\n  // TODO: This is only support from 3.15 and above (check the exact version)\n  // This could be polyfilled in C++ if needed (or in JS via functions only?)\n  const ctx = new DrawingContext(Skia, canvas);\n  root.forEach((node) => {\n    draw(ctx, node);\n  });\n  const picture = rec.finishRecordingAsPicture();\n  SkiaViewApi.setJsiProperty(nativeId, \"picture\", picture);\n};\n\nexport class Container {\n  public _root: Node[] = [];\n  public unmounted = false;\n\n  private values = new Set<SharedValue<unknown>>();\n  private mapperId: number | null = null;\n\n  constructor(public Skia: Skia, private nativeId: number) {}\n\n  get root() {\n    return this._root;\n  }\n\n  set root(root: Node[]) {\n    const isOnscreen = this.nativeId !== -1;\n    if (HAS_REANIMATED && !HAS_REANIMATED_3) {\n      throw new Error(\"React Native Skia only supports Reanimated 3 and above\");\n    }\n    if (isOnscreen) {\n      if (this.mapperId !== null) {\n        Rea.stopMapper(this.mapperId);\n      }\n      const { nativeId, Skia } = this;\n      this.mapperId = Rea.startMapper(() => {\n        \"worklet\";\n        drawOnscreen(Skia, nativeId, root);\n      }, Array.from(this.values));\n    }\n    this._root = root;\n  }\n\n  clear() {\n    console.log(\"clear container\");\n  }\n\n  redraw() {\n    const isOnscreen = this.nativeId !== -1;\n    if (HAS_REANIMATED && !HAS_REANIMATED_3) {\n      throw new Error(\"React Native Skia only supports Reanimated 3 and above\");\n    }\n    if (isOnscreen) {\n      const { nativeId, Skia, root } = this;\n      Rea.runOnUI(() => {\n        drawOnscreen(Skia, nativeId, root);\n      })();\n    }\n  }\n\n  getNativeId() {\n    return this.nativeId;\n  }\n\n  unregisterValues(values: object) {\n    Object.values(values)\n      .filter(isSharedValue)\n      .forEach((value) => {\n        this.values.delete(value);\n      });\n  }\n\n  registerValues(values: object) {\n    Object.values(values)\n      .filter(isSharedValue)\n      .forEach((value) => {\n        this.values.add(value);\n      });\n  }\n\n  drawOnCanvas(canvas: SkCanvas) {\n    const ctx = new DrawingContext(this.Skia, canvas);\n    this.root.forEach((node) => {\n      draw(ctx, node);\n    });\n  }\n}\n"],"mappings":"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","ignoreList":[]}

package/lib/module/sksg/DrawingContext.d.ts

@@ -0,0 +1,16 @@
+import type { DrawingNodeProps, GroupProps } from "../dom/types";
+import { DeclarationContext } from "../dom/types";
+import type { SkCanvas, Skia, SkPaint } from "../skia/types";
+export declare class DrawingContext {
+    private paints;
+    declCtx: DeclarationContext;
+    Skia: Skia;
+    canvas: SkCanvas;
+    constructor(Skia: Skia, canvas: SkCanvas);
+    save(): void;
+    restore(): void;
+    get paint(): SkPaint;
+    getLocalPaints(): SkPaint[];
+    processPaint({ opacity, color, strokeWidth, blendMode, style, strokeJoin, strokeCap, strokeMiter, antiAlias, dither, paint: paintProp, }: DrawingNodeProps): boolean;
+    processMatrixAndClipping(props: GroupProps, layer?: boolean | SkPaint): boolean;
+}

package/lib/module/sksg/DrawingContext.js

@@ -0,0 +1,180 @@
+"worklet";
+
+function _defineProperty(e, r, t) { return (r = _toPropertyKey(r)) in e ? Object.defineProperty(e, r, { value: t, enumerable: !0, configurable: !0, writable: !0 }) : e[r] = t, e; }
+function _toPropertyKey(t) { var i = _toPrimitive(t, "string"); return "symbol" == typeof i ? i : i + ""; }
+function _toPrimitive(t, r) { if ("object" != typeof t || !t) return t; var e = t[Symbol.toPrimitive]; if (void 0 !== e) { var i = e.call(t, r || "default"); if ("object" != typeof i) return i; throw new TypeError("@@toPrimitive must return a primitive value."); } return ("string" === r ? String : Number)(t); }
+import { enumKey, isPathDef, processPath, processTransformProps2 } from "../dom/nodes";
+import { DeclarationContext } from "../dom/types";
+import { BlendMode, ClipOp, isRRect, PaintStyle, StrokeCap, StrokeJoin } from "../skia/types";
+const computeClip = (Skia, clip) => {
+  if (clip) {
+    if (isPathDef(clip)) {
+      return {
+        clipPath: processPath(Skia, clip)
+      };
+    } else if (isRRect(clip)) {
+      return {
+        clipRRect: clip
+      };
+    } else {
+      return {
+        clipRect: clip
+      };
+    }
+  }
+  return undefined;
+};
+export class DrawingContext {
+  constructor(Skia, canvas) {
+    _defineProperty(this, "paints", void 0);
+    _defineProperty(this, "declCtx", void 0);
+    _defineProperty(this, "Skia", void 0);
+    _defineProperty(this, "canvas", void 0);
+    this.Skia = Skia;
+    this.canvas = canvas;
+    this.paints = [Skia.Paint()];
+    this.declCtx = new DeclarationContext(this.Skia);
+  }
+  save() {
+    this.paints.push(this.paint.copy());
+  }
+  restore() {
+    this.paints.pop();
+  }
+  get paint() {
+    const paint = this.paints[this.paints.length - 1];
+    if (!paint) {
+      throw new Error("Paint is undefined");
+    }
+    return paint;
+  }
+  getLocalPaints() {
+    const {
+      paint
+    } = this;
+    return [paint, ...this.declCtx.paints.popAll()];
+  }
+  processPaint({
+    opacity,
+    color,
+    strokeWidth,
+    blendMode,
+    style,
+    strokeJoin,
+    strokeCap,
+    strokeMiter,
+    antiAlias,
+    dither,
+    paint: paintProp
+  }) {
+    if (paintProp) {
+      this.declCtx.paints.push(paintProp);
+      return true;
+    }
+    let shouldRestore = false;
+    const colorFilter = this.declCtx.colorFilters.popAllAsOne();
+    const imageFilter = this.declCtx.imageFilters.popAllAsOne();
+    const shader = this.declCtx.shaders.pop();
+    const maskFilter = this.declCtx.maskFilters.pop();
+    const pathEffect = this.declCtx.pathEffects.popAllAsOne();
+    if (opacity !== undefined || color !== undefined || strokeWidth !== undefined || blendMode !== undefined || style !== undefined || strokeJoin !== undefined || strokeCap !== undefined || strokeMiter !== undefined || antiAlias !== undefined || dither !== undefined || colorFilter !== undefined || imageFilter !== undefined || shader !== undefined || maskFilter !== undefined || pathEffect !== undefined) {
+      if (!shouldRestore) {
+        this.save();
+        shouldRestore = true;
+      }
+    }
+    const {
+      paint
+    } = this;
+    if (opacity !== undefined) {
+      paint.setAlphaf(paint.getAlphaf() * opacity);
+    }
+    if (color !== undefined) {
+      const currentOpacity = paint.getAlphaf();
+      paint.setShader(null);
+      if (typeof color === "string" || typeof color === "number") {
+        paint.setColor(this.Skia.Color(color));
+      } else if (Array.isArray(color)) {
+        paint.setColor(new Float32Array(color));
+      } else if (color instanceof Float32Array) {
+        paint.setColor(color);
+      } else {
+        throw new Error("Invalid color");
+      }
+      paint.setAlphaf(currentOpacity * paint.getAlphaf());
+    }
+    if (strokeWidth !== undefined) {
+      paint.setStrokeWidth(strokeWidth);
+    }
+    if (blendMode !== undefined) {
+      paint.setBlendMode(BlendMode[enumKey(blendMode)]);
+    }
+    if (style !== undefined) {
+      paint.setStyle(PaintStyle[enumKey(style)]);
+    }
+    if (strokeJoin !== undefined) {
+      paint.setStrokeJoin(StrokeJoin[enumKey(strokeJoin)]);
+    }
+    if (strokeCap !== undefined) {
+      paint.setStrokeCap(StrokeCap[enumKey(strokeCap)]);
+    }
+    if (strokeMiter !== undefined) {
+      paint.setStrokeMiter(strokeMiter);
+    }
+    if (antiAlias !== undefined) {
+      paint.setAntiAlias(antiAlias);
+    }
+    if (dither !== undefined) {
+      paint.setDither(dither);
+    }
+    if (colorFilter) {
+      paint.setColorFilter(colorFilter);
+    }
+    if (imageFilter) {
+      paint.setImageFilter(imageFilter);
+    }
+    if (shader) {
+      paint.setShader(shader);
+    }
+    if (maskFilter) {
+      paint.setMaskFilter(maskFilter);
+    }
+    if (pathEffect) {
+      paint.setPathEffect(pathEffect);
+    }
+    return shouldRestore;
+  }
+  processMatrixAndClipping(props, layer) {
+    const hasTransform = props.matrix !== undefined || props.transform !== undefined;
+    const clip = computeClip(this.Skia, props.clip);
+    const hasClip = clip !== undefined;
+    const op = props.invertClip ? ClipOp.Difference : ClipOp.Intersect;
+    const m3 = processTransformProps2(this.Skia, props);
+    const shouldSave = hasTransform || hasClip || !!layer;
+    if (shouldSave) {
+      if (layer) {
+        if (typeof layer === "boolean") {
+          this.canvas.saveLayer();
+        } else {
+          this.canvas.saveLayer(layer);
+        }
+      } else {
+        this.canvas.save();
+      }
+    }
+    if (m3) {
+      this.canvas.concat(m3);
+    }
+    if (clip) {
+      if ("clipRect" in clip) {
+        this.canvas.clipRect(clip.clipRect, op, true);
+      } else if ("clipRRect" in clip) {
+        this.canvas.clipRRect(clip.clipRRect, op, true);
+      } else {
+        this.canvas.clipPath(clip.clipPath, op, true);
+      }
+    }
+    return shouldSave;
+  }
+}
+//# sourceMappingURL=DrawingContext.js.map

package/lib/module/sksg/DrawingContext.js.map

@@ -0,0 +1 @@
+{"version":3,"names":["_defineProperty","e","r","t","_toPropertyKey","Object","defineProperty","value","enumerable","configurable","writable","i","_toPrimitive","Symbol","toPrimitive","call","TypeError","String","Number","enumKey","isPathDef","processPath","processTransformProps2","DeclarationContext","BlendMode","ClipOp","isRRect","PaintStyle","StrokeCap","StrokeJoin","computeClip","Skia","clip","clipPath","clipRRect","clipRect","undefined","DrawingContext","constructor","canvas","paints","Paint","declCtx","save","push","paint","copy","restore","pop","length","Error","getLocalPaints","popAll","processPaint","opacity","color","strokeWidth","blendMode","style","strokeJoin","strokeCap","strokeMiter","antiAlias","dither","paintProp","shouldRestore","colorFilter","colorFilters","popAllAsOne","imageFilter","imageFilters","shader","shaders","maskFilter","maskFilters","pathEffect","pathEffects","setAlphaf","getAlphaf","currentOpacity","setShader","setColor","Color","Array","isArray","Float32Array","setStrokeWidth","setBlendMode","setStyle","setStrokeJoin","setStrokeCap","setStrokeMiter","setAntiAlias","setDither","setColorFilter","setImageFilter","setMaskFilter","setPathEffect","processMatrixAndClipping","props","layer","hasTransform","matrix","transform","hasClip","op","invertClip","Difference","Intersect","m3","shouldSave","saveLayer","concat"],"sources":["DrawingContext.ts"],"sourcesContent":["\"worklet\";\n\nimport {\n  enumKey,\n  isPathDef,\n  processPath,\n  processTransformProps2,\n} from \"../dom/nodes\";\nimport type { ClipDef, DrawingNodeProps, GroupProps } from \"../dom/types\";\nimport { DeclarationContext } from \"../dom/types\";\nimport {\n  BlendMode,\n  ClipOp,\n  isRRect,\n  PaintStyle,\n  StrokeCap,\n  StrokeJoin,\n} from \"../skia/types\";\nimport type {\n  SkPath,\n  SkRect,\n  SkRRect,\n  SkCanvas,\n  Skia,\n  SkPaint,\n} from \"../skia/types\";\n\nconst computeClip = (\n  Skia: Skia,\n  clip: ClipDef | undefined\n):\n  | undefined\n  | { clipPath: SkPath }\n  | { clipRect: SkRect }\n  | { clipRRect: SkRRect } => {\n  if (clip) {\n    if (isPathDef(clip)) {\n      return { clipPath: processPath(Skia, clip) };\n    } else if (isRRect(clip)) {\n      return { clipRRect: clip };\n    } else {\n      return { clipRect: clip };\n    }\n  }\n  return undefined;\n};\n\nexport class DrawingContext {\n  private paints: SkPaint[];\n  public declCtx: DeclarationContext;\n  public Skia: Skia;\n  public canvas: SkCanvas;\n\n  constructor(Skia: Skia, canvas: SkCanvas) {\n    this.Skia = Skia;\n    this.canvas = canvas;\n    this.paints = [Skia.Paint()];\n    this.declCtx = new DeclarationContext(this.Skia);\n  }\n\n  save() {\n    this.paints.push(this.paint.copy());\n  }\n\n  restore() {\n    this.paints.pop();\n  }\n\n  get paint() {\n    const paint = this.paints[this.paints.length - 1];\n    if (!paint) {\n      throw new Error(\"Paint is undefined\");\n    }\n    return paint;\n  }\n\n  getLocalPaints() {\n    const { paint } = this;\n    return [paint, ...this.declCtx.paints.popAll()];\n  }\n\n  processPaint({\n    opacity,\n    color,\n    strokeWidth,\n    blendMode,\n    style,\n    strokeJoin,\n    strokeCap,\n    strokeMiter,\n    antiAlias,\n    dither,\n    paint: paintProp,\n  }: DrawingNodeProps) {\n    if (paintProp) {\n      this.declCtx.paints.push(paintProp);\n      return true;\n    }\n    let shouldRestore = false;\n    const colorFilter = this.declCtx.colorFilters.popAllAsOne();\n    const imageFilter = this.declCtx.imageFilters.popAllAsOne();\n    const shader = this.declCtx.shaders.pop();\n    const maskFilter = this.declCtx.maskFilters.pop();\n    const pathEffect = this.declCtx.pathEffects.popAllAsOne();\n    if (\n      opacity !== undefined ||\n      color !== undefined ||\n      strokeWidth !== undefined ||\n      blendMode !== undefined ||\n      style !== undefined ||\n      strokeJoin !== undefined ||\n      strokeCap !== undefined ||\n      strokeMiter !== undefined ||\n      antiAlias !== undefined ||\n      dither !== undefined ||\n      colorFilter !== undefined ||\n      imageFilter !== undefined ||\n      shader !== undefined ||\n      maskFilter !== undefined ||\n      pathEffect !== undefined\n    ) {\n      if (!shouldRestore) {\n        this.save();\n        shouldRestore = true;\n      }\n    }\n    const { paint } = this;\n    if (opacity !== undefined) {\n      paint.setAlphaf(paint.getAlphaf() * opacity);\n    }\n    if (color !== undefined) {\n      const currentOpacity = paint.getAlphaf();\n      paint.setShader(null);\n      if (typeof color === \"string\" || typeof color === \"number\") {\n        paint.setColor(this.Skia.Color(color));\n      } else if (Array.isArray(color)) {\n        paint.setColor(new Float32Array(color));\n      } else if (color instanceof Float32Array) {\n        paint.setColor(color);\n      } else {\n        throw new Error(\"Invalid color\");\n      }\n      paint.setAlphaf(currentOpacity * paint.getAlphaf());\n    }\n    if (strokeWidth !== undefined) {\n      paint.setStrokeWidth(strokeWidth);\n    }\n    if (blendMode !== undefined) {\n      paint.setBlendMode(BlendMode[enumKey(blendMode)]);\n    }\n    if (style !== undefined) {\n      paint.setStyle(PaintStyle[enumKey(style)]);\n    }\n    if (strokeJoin !== undefined) {\n      paint.setStrokeJoin(StrokeJoin[enumKey(strokeJoin)]);\n    }\n    if (strokeCap !== undefined) {\n      paint.setStrokeCap(StrokeCap[enumKey(strokeCap)]);\n    }\n    if (strokeMiter !== undefined) {\n      paint.setStrokeMiter(strokeMiter);\n    }\n    if (antiAlias !== undefined) {\n      paint.setAntiAlias(antiAlias);\n    }\n    if (dither !== undefined) {\n      paint.setDither(dither);\n    }\n    if (colorFilter) {\n      paint.setColorFilter(colorFilter);\n    }\n    if (imageFilter) {\n      paint.setImageFilter(imageFilter);\n    }\n    if (shader) {\n      paint.setShader(shader);\n    }\n    if (maskFilter) {\n      paint.setMaskFilter(maskFilter);\n    }\n    if (pathEffect) {\n      paint.setPathEffect(pathEffect);\n    }\n    return shouldRestore;\n  }\n\n  processMatrixAndClipping(props: GroupProps, layer?: boolean | SkPaint) {\n    const hasTransform =\n      props.matrix !== undefined || props.transform !== undefined;\n    const clip = computeClip(this.Skia, props.clip);\n    const hasClip = clip !== undefined;\n    const op = props.invertClip ? ClipOp.Difference : ClipOp.Intersect;\n    const m3 = processTransformProps2(this.Skia, props);\n    const shouldSave = hasTransform || hasClip || !!layer;\n    if (shouldSave) {\n      if (layer) {\n        if (typeof layer === \"boolean\") {\n          this.canvas.saveLayer();\n        } else {\n          this.canvas.saveLayer(layer);\n        }\n      } else {\n        this.canvas.save();\n      }\n    }\n\n    if (m3) {\n      this.canvas.concat(m3);\n    }\n    if (clip) {\n      if (\"clipRect\" in clip) {\n        this.canvas.clipRect(clip.clipRect, op, true);\n      } else if (\"clipRRect\" in clip) {\n        this.canvas.clipRRect(clip.clipRRect, op, true);\n      } else {\n        this.canvas.clipPath(clip.clipPath, op, true);\n      }\n    }\n    return shouldSave;\n  }\n}\n"],"mappings":"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","ignoreList":[]}

package/lib/module/sksg/HostConfig.d.ts

@@ -0,0 +1,19 @@
+import type { HostConfig } from "react-reconciler";
+import { NodeType } from "../dom/types";
+import type { Node } from "./nodes/Node";
+import type { Container } from "./Container";
+export declare const debug: (message?: any, ...optionalParams: any[]) => void;
+type Instance = Node;
+type Props = object;
+type TextInstance = Node;
+type SuspenseInstance = Instance;
+type HydratableInstance = Instance;
+type PublicInstance = Instance;
+type HostContext = null;
+type UpdatePayload = Container;
+type ChildSet = Node[];
+type TimeoutHandle = NodeJS.Timeout;
+type NoTimeout = -1;
+type SkiaHostConfig = HostConfig<NodeType, Props, Container, Instance, TextInstance, SuspenseInstance, HydratableInstance, PublicInstance, HostContext, UpdatePayload, ChildSet, TimeoutHandle, NoTimeout>;
+export declare const sksgHostConfig: SkiaHostConfig;
+export {};

package/lib/module/sksg/HostConfig.js

@@ -0,0 +1,161 @@
+/*global NodeJS*/
+
+import { DefaultEventPriority } from "react-reconciler/constants";
+import { NodeType } from "../dom/types";
+import { shallowEq } from "../renderer/typeddash";
+const DEBUG = false;
+export const debug = (...args) => {
+  if (DEBUG) {
+    console.log(...args);
+  }
+};
+const isDeclaration = type => {
+  "worklet";
+
+  return (
+    // BlurMaskFilters
+    type === NodeType.BlurMaskFilter ||
+    // ImageFilters
+    type === NodeType.BlendImageFilter || type === NodeType.BlurImageFilter || type === NodeType.OffsetImageFilter || type === NodeType.DropShadowImageFilter || type === NodeType.MorphologyImageFilter || type === NodeType.DisplacementMapImageFilter || type === NodeType.RuntimeShaderImageFilter ||
+    // ColorFilters
+    type === NodeType.MatrixColorFilter || type === NodeType.BlendColorFilter || type === NodeType.LumaColorFilter || type === NodeType.LinearToSRGBGammaColorFilter || type === NodeType.SRGBToLinearGammaColorFilter || type === NodeType.LerpColorFilter ||
+    // Shaders
+    type === NodeType.Shader || type === NodeType.ImageShader || type === NodeType.ColorShader || type === NodeType.Turbulence || type === NodeType.FractalNoise || type === NodeType.LinearGradient || type === NodeType.RadialGradient || type === NodeType.SweepGradient || type === NodeType.TwoPointConicalGradient ||
+    // Path Effects
+    type === NodeType.CornerPathEffect || type === NodeType.DiscretePathEffect || type === NodeType.DashPathEffect || type === NodeType.Path1DPathEffect || type === NodeType.Path2DPathEffect || type === NodeType.SumPathEffect || type === NodeType.Line2DPathEffect ||
+    // Mixed
+    type === NodeType.Blend ||
+    // Paint
+    type === NodeType.Paint
+  );
+};
+export const sksgHostConfig = {
+  /**
+   * This function is used by the reconciler in order to calculate current time for prioritising work.
+   */
+  supportsMutation: false,
+  isPrimaryRenderer: false,
+  supportsPersistence: true,
+  supportsHydration: false,
+  //supportsMicrotask: true,
+  scheduleTimeout: setTimeout,
+  cancelTimeout: clearTimeout,
+  noTimeout: -1,
+  getRootHostContext: _rootContainerInstance => {
+    debug("getRootHostContext");
+    return null;
+  },
+  getChildHostContext(_parentHostContext, _type, _rootContainerInstance) {
+    debug("getChildHostContext");
+    return null;
+  },
+  shouldSetTextContent(_type, _props) {
+    return false;
+  },
+  createTextInstance(_text, _rootContainerInstance, _hostContext, _internalInstanceHandle) {
+    debug("createTextInstance");
+    // return SpanNode({}, text) as SkNode;
+    throw new Error("Text nodes are not supported yet");
+  },
+  createInstance(type, props, container, _hostContext, _internalInstanceHandle) {
+    debug("createInstance", type);
+    container.registerValues(props);
+    const instance = {
+      type,
+      isDeclaration: isDeclaration(type),
+      props,
+      children: []
+    };
+    return instance;
+  },
+  appendInitialChild(parentInstance, child) {
+    parentInstance.children.push(child);
+  },
+  finalizeInitialChildren(parentInstance, _type, _props, _rootContainerInstance, _hostContext) {
+    debug("finalizeInitialChildren", parentInstance);
+    return false;
+  },
+  commitMount() {
+    // if finalizeInitialChildren = true
+    debug("commitMount");
+  },
+  prepareForCommit(_containerInfo) {
+    debug("prepareForCommit");
+    return null;
+  },
+  resetAfterCommit(container) {
+    debug("resetAfterCommit");
+    container.redraw();
+  },
+  getPublicInstance(node) {
+    debug("getPublicInstance");
+    return node;
+  },
+  commitTextUpdate: (_textInstance, _oldText, _newText) => {
+    //  textInstance.instance = newText;
+  },
+  clearContainer: container => {
+    debug("clearContainer");
+    container.clear();
+  },
+  prepareUpdate(_instance, _type, oldProps, newProps, container, _hostContext) {
+    debug("prepareUpdate");
+    const propsAreEqual = shallowEq(oldProps, newProps);
+    if (propsAreEqual) {
+      return null;
+    }
+    container.unregisterValues(oldProps);
+    container.registerValues(newProps);
+    return container;
+  },
+  preparePortalMount: () => {
+    debug("preparePortalMount");
+  },
+  cloneInstance(instance, _updatePayload, _type, _oldProps, newProps, _internalInstanceHandle, keepChildren, _recyclableInstance) {
+    debug("cloneInstance");
+    return {
+      type: instance.type,
+      props: newProps,
+      children: keepChildren ? [...instance.children] : [],
+      isDeclaration: instance.isDeclaration
+    };
+  },
+  createContainerChildSet() {
+    debug("createContainerChildSet");
+    return [];
+  },
+  appendChildToContainerChildSet(childSet, child) {
+    childSet.push(child);
+  },
+  finalizeContainerChildren(container, newChildren) {
+    debug("finalizeContainerChildren");
+    container.root = newChildren;
+  },
+  replaceContainerChildren(container, newChildren) {
+    debug("replaceContainerChildren");
+    container.root = newChildren;
+  },
+  cloneHiddenInstance(_instance, _type, _props) {
+    debug("cloneHiddenInstance");
+    throw new Error("Not yet implemented.");
+  },
+  cloneHiddenTextInstance(_instance, _text) {
+    debug("cloneHiddenTextInstance");
+    throw new Error("Not yet implemented.");
+  },
+  // see https://github.com/pmndrs/react-three-fiber/pull/2360#discussion_r916356874
+  getCurrentEventPriority: () => DefaultEventPriority,
+  beforeActiveInstanceBlur: () => {},
+  afterActiveInstanceBlur: () => {},
+  detachDeletedInstance: () => {},
+  getInstanceFromNode: function (_node) {
+    throw new Error("Function not implemented.");
+  },
+  prepareScopeUpdate: function (_scopeInstance, _instance) {
+    throw new Error("Function not implemented.");
+  },
+  getInstanceFromScope: function (_scopeInstance) {
+    throw new Error("Function not implemented.");
+  }
+};
+//# sourceMappingURL=HostConfig.js.map

package/lib/module/sksg/HostConfig.js.map

@@ -0,0 +1 @@
+{"version":3,"names":["DefaultEventPriority","NodeType","shallowEq","DEBUG","debug","args","console","log","isDeclaration","type","BlurMaskFilter","BlendImageFilter","BlurImageFilter","OffsetImageFilter","DropShadowImageFilter","MorphologyImageFilter","DisplacementMapImageFilter","RuntimeShaderImageFilter","MatrixColorFilter","BlendColorFilter","LumaColorFilter","LinearToSRGBGammaColorFilter","SRGBToLinearGammaColorFilter","LerpColorFilter","Shader","ImageShader","ColorShader","Turbulence","FractalNoise","LinearGradient","RadialGradient","SweepGradient","TwoPointConicalGradient","CornerPathEffect","DiscretePathEffect","DashPathEffect","Path1DPathEffect","Path2DPathEffect","SumPathEffect","Line2DPathEffect","Blend","Paint","sksgHostConfig","supportsMutation","isPrimaryRenderer","supportsPersistence","supportsHydration","scheduleTimeout","setTimeout","cancelTimeout","clearTimeout","noTimeout","getRootHostContext","_rootContainerInstance","getChildHostContext","_parentHostContext","_type","shouldSetTextContent","_props","createTextInstance","_text","_hostContext","_internalInstanceHandle","Error","createInstance","props","container","registerValues","instance","children","appendInitialChild","parentInstance","child","push","finalizeInitialChildren","commitMount","prepareForCommit","_containerInfo","resetAfterCommit","redraw","getPublicInstance","node","commitTextUpdate","_textInstance","_oldText","_newText","clearContainer","clear","prepareUpdate","_instance","oldProps","newProps","propsAreEqual","unregisterValues","preparePortalMount","cloneInstance","_updatePayload","_oldProps","keepChildren","_recyclableInstance","createContainerChildSet","appendChildToContainerChildSet","childSet","finalizeContainerChildren","newChildren","root","replaceContainerChildren","cloneHiddenInstance","cloneHiddenTextInstance","getCurrentEventPriority","beforeActiveInstanceBlur","afterActiveInstanceBlur","detachDeletedInstance","getInstanceFromNode","_node","prepareScopeUpdate","_scopeInstance","getInstanceFromScope"],"sources":["HostConfig.ts"],"sourcesContent":["/*global NodeJS*/\nimport type { Fiber, HostConfig } from \"react-reconciler\";\nimport { DefaultEventPriority } from \"react-reconciler/constants\";\n\nimport { NodeType } from \"../dom/types\";\nimport { shallowEq } from \"../renderer/typeddash\";\n\nimport type { Node } from \"./nodes/Node\";\nimport type { Container } from \"./Container\";\n\nconst DEBUG = false;\nexport const debug = (...args: Parameters<typeof console.log>) => {\n  if (DEBUG) {\n    console.log(...args);\n  }\n};\n\nconst isDeclaration = (type: NodeType) => {\n  \"worklet\";\n  return (\n    // BlurMaskFilters\n    type === NodeType.BlurMaskFilter ||\n    // ImageFilters\n    type === NodeType.BlendImageFilter ||\n    type === NodeType.BlurImageFilter ||\n    type === NodeType.OffsetImageFilter ||\n    type === NodeType.DropShadowImageFilter ||\n    type === NodeType.MorphologyImageFilter ||\n    type === NodeType.DisplacementMapImageFilter ||\n    type === NodeType.RuntimeShaderImageFilter ||\n    // ColorFilters\n    type === NodeType.MatrixColorFilter ||\n    type === NodeType.BlendColorFilter ||\n    type === NodeType.LumaColorFilter ||\n    type === NodeType.LinearToSRGBGammaColorFilter ||\n    type === NodeType.SRGBToLinearGammaColorFilter ||\n    type === NodeType.LerpColorFilter ||\n    // Shaders\n    type === NodeType.Shader ||\n    type === NodeType.ImageShader ||\n    type === NodeType.ColorShader ||\n    type === NodeType.Turbulence ||\n    type === NodeType.FractalNoise ||\n    type === NodeType.LinearGradient ||\n    type === NodeType.RadialGradient ||\n    type === NodeType.SweepGradient ||\n    type === NodeType.TwoPointConicalGradient ||\n    // Path Effects\n    type === NodeType.CornerPathEffect ||\n    type === NodeType.DiscretePathEffect ||\n    type === NodeType.DashPathEffect ||\n    type === NodeType.Path1DPathEffect ||\n    type === NodeType.Path2DPathEffect ||\n    type === NodeType.SumPathEffect ||\n    type === NodeType.Line2DPathEffect ||\n    // Mixed\n    type === NodeType.Blend ||\n    // Paint\n    type === NodeType.Paint\n  );\n};\n\ntype Instance = Node;\n\ntype Props = object;\ntype TextInstance = Node;\ntype SuspenseInstance = Instance;\ntype HydratableInstance = Instance;\ntype PublicInstance = Instance;\ntype HostContext = null;\ntype UpdatePayload = Container;\ntype ChildSet = Node[];\ntype TimeoutHandle = NodeJS.Timeout;\ntype NoTimeout = -1;\n\ntype SkiaHostConfig = HostConfig<\n  NodeType,\n  Props,\n  Container,\n  Instance,\n  TextInstance,\n  SuspenseInstance,\n  HydratableInstance,\n  PublicInstance,\n  HostContext,\n  UpdatePayload,\n  ChildSet,\n  TimeoutHandle,\n  NoTimeout\n>;\n\nexport const sksgHostConfig: SkiaHostConfig = {\n  /**\n   * This function is used by the reconciler in order to calculate current time for prioritising work.\n   */\n  supportsMutation: false,\n  isPrimaryRenderer: false,\n  supportsPersistence: true,\n  supportsHydration: false,\n  //supportsMicrotask: true,\n  scheduleTimeout: setTimeout,\n  cancelTimeout: clearTimeout,\n  noTimeout: -1,\n\n  getRootHostContext: (_rootContainerInstance: Container) => {\n    debug(\"getRootHostContext\");\n    return null;\n  },\n\n  getChildHostContext(_parentHostContext, _type, _rootContainerInstance) {\n    debug(\"getChildHostContext\");\n    return null;\n  },\n\n  shouldSetTextContent(_type, _props) {\n    return false;\n  },\n\n  createTextInstance(\n    _text,\n    _rootContainerInstance,\n    _hostContext,\n    _internalInstanceHandle\n  ) {\n    debug(\"createTextInstance\");\n    // return SpanNode({}, text) as SkNode;\n    throw new Error(\"Text nodes are not supported yet\");\n  },\n\n  createInstance(\n    type,\n    props,\n    container,\n    _hostContext,\n    _internalInstanceHandle\n  ) {\n    debug(\"createInstance\", type);\n    container.registerValues(props);\n    const instance = {\n      type,\n      isDeclaration: isDeclaration(type),\n      props,\n      children: [],\n    };\n    return instance;\n  },\n\n  appendInitialChild(parentInstance: Instance, child: Instance | TextInstance) {\n    parentInstance.children.push(child);\n  },\n\n  finalizeInitialChildren(\n    parentInstance,\n    _type,\n    _props,\n    _rootContainerInstance,\n    _hostContext\n  ) {\n    debug(\"finalizeInitialChildren\", parentInstance);\n    return false;\n  },\n\n  commitMount() {\n    // if finalizeInitialChildren = true\n    debug(\"commitMount\");\n  },\n\n  prepareForCommit(_containerInfo) {\n    debug(\"prepareForCommit\");\n    return null;\n  },\n\n  resetAfterCommit(container) {\n    debug(\"resetAfterCommit\");\n    container.redraw();\n  },\n\n  getPublicInstance(node: Instance) {\n    debug(\"getPublicInstance\");\n    return node;\n  },\n\n  commitTextUpdate: (\n    _textInstance: TextInstance,\n    _oldText: string,\n    _newText: string\n  ) => {\n    //  textInstance.instance = newText;\n  },\n\n  clearContainer: (container) => {\n    debug(\"clearContainer\");\n    container.clear();\n  },\n\n  prepareUpdate(\n    _instance: Instance,\n    _type: string,\n    oldProps: Props,\n    newProps: Props,\n    container: Container,\n    _hostContext: HostContext\n  ) {\n    debug(\"prepareUpdate\");\n    const propsAreEqual = shallowEq(oldProps, newProps);\n    if (propsAreEqual) {\n      return null;\n    }\n    container.unregisterValues(oldProps);\n    container.registerValues(newProps);\n    return container;\n  },\n\n  preparePortalMount: () => {\n    debug(\"preparePortalMount\");\n  },\n\n  cloneInstance(\n    instance,\n    _updatePayload,\n    _type,\n    _oldProps,\n    newProps,\n    _internalInstanceHandle,\n    keepChildren: boolean,\n    _recyclableInstance: null | Instance\n  ) {\n    debug(\"cloneInstance\");\n\n    return {\n      type: instance.type,\n      props: newProps,\n      children: keepChildren ? [...instance.children] : [],\n      isDeclaration: instance.isDeclaration,\n    };\n  },\n\n  createContainerChildSet(): ChildSet {\n    debug(\"createContainerChildSet\");\n    return [];\n  },\n\n  appendChildToContainerChildSet(\n    childSet: ChildSet,\n    child: Instance | TextInstance\n  ): void {\n    childSet.push(child);\n  },\n\n  finalizeContainerChildren(container: Container, newChildren: ChildSet) {\n    debug(\"finalizeContainerChildren\");\n    container.root = newChildren;\n  },\n\n  replaceContainerChildren(container: Container, newChildren: ChildSet) {\n    debug(\"replaceContainerChildren\");\n    container.root = newChildren;\n  },\n\n  cloneHiddenInstance(\n    _instance: Instance,\n    _type: string,\n    _props: Props\n  ): Instance {\n    debug(\"cloneHiddenInstance\");\n    throw new Error(\"Not yet implemented.\");\n  },\n\n  cloneHiddenTextInstance(_instance: Instance, _text: string): TextInstance {\n    debug(\"cloneHiddenTextInstance\");\n    throw new Error(\"Not yet implemented.\");\n  },\n  // see https://github.com/pmndrs/react-three-fiber/pull/2360#discussion_r916356874\n  getCurrentEventPriority: () => DefaultEventPriority,\n  beforeActiveInstanceBlur: () => {},\n  afterActiveInstanceBlur: () => {},\n  detachDeletedInstance: () => {},\n  getInstanceFromNode: function (_node): Fiber | null | undefined {\n    throw new Error(\"Function not implemented.\");\n  },\n  prepareScopeUpdate: function (_scopeInstance, _instance): void {\n    throw new Error(\"Function not implemented.\");\n  },\n  getInstanceFromScope: function (_scopeInstance): Instance | null {\n    throw new Error(\"Function not implemented.\");\n  },\n};\n"],"mappings":"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","ignoreList":[]}

package/lib/module/sksg/Reconciler.d.ts

@@ -0,0 +1,17 @@
+import type { ReactNode } from "react";
+import type { SkCanvas, Skia } from "../skia/types";
+import { NodeType } from "../dom/types";
+export declare class SkiaSGRoot {
+    private root;
+    private container;
+    constructor(Skia: Skia, nativeId?: number);
+    get sg(): {
+        type: NodeType;
+        props: {};
+        children: import("./nodes").Node<unknown>[];
+        isDeclaration: boolean;
+    };
+    render(element: ReactNode): void;
+    drawOnCanvas(canvas: SkCanvas): void;
+    unmount(): void;
+}

package/lib/module/sksg/Reconciler.js

@@ -0,0 +1,46 @@
+function _defineProperty(e, r, t) { return (r = _toPropertyKey(r)) in e ? Object.defineProperty(e, r, { value: t, enumerable: !0, configurable: !0, writable: !0 }) : e[r] = t, e; }
+function _toPropertyKey(t) { var i = _toPrimitive(t, "string"); return "symbol" == typeof i ? i : i + ""; }
+function _toPrimitive(t, r) { if ("object" != typeof t || !t) return t; var e = t[Symbol.toPrimitive]; if (void 0 !== e) { var i = e.call(t, r || "default"); if ("object" != typeof i) return i; throw new TypeError("@@toPrimitive must return a primitive value."); } return ("string" === r ? String : Number)(t); }
+import ReactReconciler from "react-reconciler";
+import { NodeType } from "../dom/types";
+import { debug, sksgHostConfig } from "./HostConfig";
+import { Container } from "./Container";
+const skiaReconciler = ReactReconciler(sksgHostConfig);
+skiaReconciler.injectIntoDevTools({
+  bundleType: 1,
+  version: "0.0.1",
+  rendererPackageName: "react-native-skia"
+});
+export class SkiaSGRoot {
+  constructor(Skia, nativeId = -1) {
+    _defineProperty(this, "root", void 0);
+    _defineProperty(this, "container", void 0);
+    this.container = new Container(Skia, nativeId);
+    this.root = skiaReconciler.createContainer(this.container, 0, null, true, null, "", console.error, null);
+  }
+  get sg() {
+    const children = this.container.root;
+    return {
+      type: NodeType.Group,
+      props: {},
+      children,
+      isDeclaration: false
+    };
+  }
+  render(element) {
+    // eslint-disable-next-line @typescript-eslint/no-explicit-any
+    skiaReconciler.updateContainer(element, this.root, null, () => {
+      debug("updateContainer");
+    });
+  }
+  drawOnCanvas(canvas) {
+    this.container.drawOnCanvas(canvas);
+  }
+  unmount() {
+    this.container.unmounted = true;
+    skiaReconciler.updateContainer(null, this.root, null, () => {
+      debug("unmountContainer");
+    });
+  }
+}
+//# sourceMappingURL=Reconciler.js.map

package/lib/module/sksg/Reconciler.js.map

@@ -0,0 +1 @@
+{"version":3,"names":["ReactReconciler","NodeType","debug","sksgHostConfig","Container","skiaReconciler","injectIntoDevTools","bundleType","version","rendererPackageName","SkiaSGRoot","constructor","Skia","nativeId","_defineProperty","container","root","createContainer","console","error","sg","children","type","Group","props","isDeclaration","render","element","updateContainer","drawOnCanvas","canvas","unmount","unmounted"],"sources":["Reconciler.ts"],"sourcesContent":["import type { ReactNode } from \"react\";\nimport type { OpaqueRoot } from \"react-reconciler\";\nimport ReactReconciler from \"react-reconciler\";\n\nimport type { SkCanvas, Skia } from \"../skia/types\";\nimport { NodeType } from \"../dom/types\";\n\nimport { debug, sksgHostConfig } from \"./HostConfig\";\nimport { Container } from \"./Container\";\n\nconst skiaReconciler = ReactReconciler(sksgHostConfig);\n\nskiaReconciler.injectIntoDevTools({\n  bundleType: 1,\n  version: \"0.0.1\",\n  rendererPackageName: \"react-native-skia\",\n});\n\nexport class SkiaSGRoot {\n  private root: OpaqueRoot;\n  private container: Container;\n\n  constructor(Skia: Skia, nativeId = -1) {\n    this.container = new Container(Skia, nativeId);\n    this.root = skiaReconciler.createContainer(\n      this.container,\n      0,\n      null,\n      true,\n      null,\n      \"\",\n      console.error,\n      null\n    );\n  }\n\n  get sg() {\n    const children = this.container.root;\n    return { type: NodeType.Group, props: {}, children, isDeclaration: false };\n  }\n\n  render(element: ReactNode) {\n    // eslint-disable-next-line @typescript-eslint/no-explicit-any\n    skiaReconciler.updateContainer(element as any, this.root, null, () => {\n      debug(\"updateContainer\");\n    });\n  }\n\n  drawOnCanvas(canvas: SkCanvas) {\n    this.container.drawOnCanvas(canvas);\n  }\n\n  unmount() {\n    this.container.unmounted = true;\n    skiaReconciler.updateContainer(null, this.root, null, () => {\n      debug(\"unmountContainer\");\n    });\n  }\n}\n"],"mappings":";;;AAEA,OAAOA,eAAe,MAAM,kBAAkB;AAG9C,SAASC,QAAQ,QAAQ,cAAc;AAEvC,SAASC,KAAK,EAAEC,cAAc,QAAQ,cAAc;AACpD,SAASC,SAAS,QAAQ,aAAa;AAEvC,MAAMC,cAAc,GAAGL,eAAe,CAACG,cAAc,CAAC;AAEtDE,cAAc,CAACC,kBAAkB,CAAC;EAChCC,UAAU,EAAE,CAAC;EACbC,OAAO,EAAE,OAAO;EAChBC,mBAAmB,EAAE;AACvB,CAAC,CAAC;AAEF,OAAO,MAAMC,UAAU,CAAC;EAItBC,WAAWA,CAACC,IAAU,EAAEC,QAAQ,GAAG,CAAC,CAAC,EAAE;IAAAC,eAAA;IAAAA,eAAA;IACrC,IAAI,CAACC,SAAS,GAAG,IAAIX,SAAS,CAACQ,IAAI,EAAEC,QAAQ,CAAC;IAC9C,IAAI,CAACG,IAAI,GAAGX,cAAc,CAACY,eAAe,CACxC,IAAI,CAACF,SAAS,EACd,CAAC,EACD,IAAI,EACJ,IAAI,EACJ,IAAI,EACJ,EAAE,EACFG,OAAO,CAACC,KAAK,EACb,IACF,CAAC;EACH;EAEA,IAAIC,EAAEA,CAAA,EAAG;IACP,MAAMC,QAAQ,GAAG,IAAI,CAACN,SAAS,CAACC,IAAI;IACpC,OAAO;MAAEM,IAAI,EAAErB,QAAQ,CAACsB,KAAK;MAAEC,KAAK,EAAE,CAAC,CAAC;MAAEH,QAAQ;MAAEI,aAAa,EAAE;IAAM,CAAC;EAC5E;EAEAC,MAAMA,CAACC,OAAkB,EAAE;IACzB;IACAtB,cAAc,CAACuB,eAAe,CAACD,OAAO,EAAS,IAAI,CAACX,IAAI,EAAE,IAAI,EAAE,MAAM;MACpEd,KAAK,CAAC,iBAAiB,CAAC;IAC1B,CAAC,CAAC;EACJ;EAEA2B,YAAYA,CAACC,MAAgB,EAAE;IAC7B,IAAI,CAACf,SAAS,CAACc,YAAY,CAACC,MAAM,CAAC;EACrC;EAEAC,OAAOA,CAAA,EAAG;IACR,IAAI,CAAChB,SAAS,CAACiB,SAAS,GAAG,IAAI;IAC/B3B,cAAc,CAACuB,eAAe,CAAC,IAAI,EAAE,IAAI,CAACZ,IAAI,EAAE,IAAI,EAAE,MAAM;MAC1Dd,KAAK,CAAC,kBAAkB,CAAC;IAC3B,CAAC,CAAC;EACJ;AACF","ignoreList":[]}