@shopify/react-native-skia 1.7.5 → 1.7.7

package/lib/module/sksg/nodes/paint.js

@@ -0,0 +1,74 @@
+"worklet";
+
+import { enumKey } from "../../dom/nodes";
+import { BlendMode, PaintStyle, StrokeCap, StrokeJoin } from "../../skia/types";
+export const declarePaint = (ctx, props) => {
+  const {
+    color,
+    strokeWidth,
+    blendMode,
+    style,
+    strokeJoin,
+    strokeCap,
+    strokeMiter,
+    opacity,
+    antiAlias,
+    dither
+  } = props;
+  const paint = ctx.Skia.Paint();
+  if (color !== undefined) {
+    paint.setColor(ctx.Skia.Color(color));
+  }
+  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 (opacity !== undefined) {
+    paint.setAlphaf(opacity);
+  }
+  if (antiAlias !== undefined) {
+    paint.setAntiAlias(antiAlias);
+  }
+  if (dither !== undefined) {
+    paint.setDither(dither);
+  }
+  //ctx.save();
+
+  const colorFilter = ctx.colorFilters.popAllAsOne();
+  const imageFilter = ctx.imageFilters.popAllAsOne();
+  const shader = ctx.shaders.pop();
+  const maskFilter = ctx.maskFilters.pop();
+  const pathEffect = ctx.pathEffects.popAllAsOne();
+  //ctx.restore();
+  if (imageFilter) {
+    paint.setImageFilter(imageFilter);
+  }
+  if (shader) {
+    paint.setShader(shader);
+  }
+  if (pathEffect) {
+    paint.setPathEffect(pathEffect);
+  }
+  if (colorFilter) {
+    paint.setColorFilter(colorFilter);
+  }
+  if (maskFilter) {
+    paint.setMaskFilter(maskFilter);
+  }
+  ctx.paints.push(paint);
+};
+//# sourceMappingURL=paint.js.map

package/lib/module/sksg/nodes/paint.js.map

@@ -0,0 +1 @@
+{"version":3,"names":["enumKey","BlendMode","PaintStyle","StrokeCap","StrokeJoin","declarePaint","ctx","props","color","strokeWidth","blendMode","style","strokeJoin","strokeCap","strokeMiter","opacity","antiAlias","dither","paint","Skia","Paint","undefined","setColor","Color","setStrokeWidth","setBlendMode","setStyle","setStrokeJoin","setStrokeCap","setStrokeMiter","setAlphaf","setAntiAlias","setDither","colorFilter","colorFilters","popAllAsOne","imageFilter","imageFilters","shader","shaders","pop","maskFilter","maskFilters","pathEffect","pathEffects","setImageFilter","setShader","setPathEffect","setColorFilter","setMaskFilter","paints","push"],"sources":["paint.ts"],"sourcesContent":["\"worklet\";\n\nimport { enumKey } from \"../../dom/nodes\";\nimport type { DeclarationContext, PaintProps } from \"../../dom/types\";\nimport { BlendMode, PaintStyle, StrokeCap, StrokeJoin } from \"../../skia/types\";\n\nexport const declarePaint = (ctx: DeclarationContext, props: PaintProps) => {\n  const {\n    color,\n    strokeWidth,\n    blendMode,\n    style,\n    strokeJoin,\n    strokeCap,\n    strokeMiter,\n    opacity,\n    antiAlias,\n    dither,\n  } = props;\n  const paint = ctx.Skia.Paint();\n  if (color !== undefined) {\n    paint.setColor(ctx.Skia.Color(color));\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 (opacity !== undefined) {\n    paint.setAlphaf(opacity);\n  }\n  if (antiAlias !== undefined) {\n    paint.setAntiAlias(antiAlias);\n  }\n  if (dither !== undefined) {\n    paint.setDither(dither);\n  }\n  //ctx.save();\n\n  const colorFilter = ctx.colorFilters.popAllAsOne();\n  const imageFilter = ctx.imageFilters.popAllAsOne();\n  const shader = ctx.shaders.pop();\n  const maskFilter = ctx.maskFilters.pop();\n  const pathEffect = ctx.pathEffects.popAllAsOne();\n  //ctx.restore();\n  if (imageFilter) {\n    paint.setImageFilter(imageFilter);\n  }\n  if (shader) {\n    paint.setShader(shader);\n  }\n  if (pathEffect) {\n    paint.setPathEffect(pathEffect);\n  }\n  if (colorFilter) {\n    paint.setColorFilter(colorFilter);\n  }\n  if (maskFilter) {\n    paint.setMaskFilter(maskFilter);\n  }\n  ctx.paints.push(paint);\n};\n"],"mappings":"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","ignoreList":[]}

package/lib/module/sksg/nodes/pathEffects.d.ts

@@ -0,0 +1,8 @@
+import type { CornerPathEffectProps, DashPathEffectProps, DeclarationContext, DiscretePathEffectProps, Line2DPathEffectProps, Path1DPathEffectProps, Path2DPathEffectProps } from "../../dom/types";
+export declare const makeDiscretePathEffect: (ctx: DeclarationContext, props: DiscretePathEffectProps) => import("../../skia/types").SkPathEffect;
+export declare const makePath2DPathEffect: (ctx: DeclarationContext, props: Path2DPathEffectProps) => import("../../skia/types").SkPathEffect;
+export declare const makeDashPathEffect: (ctx: DeclarationContext, props: DashPathEffectProps) => import("../../skia/types").SkPathEffect;
+export declare const makeCornerPathEffect: (ctx: DeclarationContext, props: CornerPathEffectProps) => import("../../skia/types").SkPathEffect;
+export declare const declareSumPathEffect: (ctx: DeclarationContext) => void;
+export declare const makeLine2DPathEffect: (ctx: DeclarationContext, props: Line2DPathEffectProps) => import("../../skia/types").SkPathEffect;
+export declare const makePath1DPathEffect: (ctx: DeclarationContext, props: Path1DPathEffectProps) => import("../../skia/types").SkPathEffect;

package/lib/module/sksg/nodes/pathEffects.js

@@ -0,0 +1,72 @@
+"worklet";
+
+import { composeDeclarations, enumKey, processPath } from "../../dom/nodes";
+import { Path1DEffectStyle } from "../../skia/types";
+export const makeDiscretePathEffect = (ctx, props) => {
+  const {
+    length,
+    deviation,
+    seed
+  } = props;
+  return ctx.Skia.PathEffect.MakeDiscrete(length, deviation, seed);
+};
+export const makePath2DPathEffect = (ctx, props) => {
+  const {
+    matrix
+  } = props;
+  const path = processPath(ctx.Skia, props.path);
+  const pe = ctx.Skia.PathEffect.MakePath2D(matrix, path);
+  if (pe === null) {
+    throw new Error("Path2DPathEffect: invalid path");
+  }
+  return pe;
+};
+export const makeDashPathEffect = (ctx, props) => {
+  const {
+    intervals,
+    phase
+  } = props;
+  const pe = ctx.Skia.PathEffect.MakeDash(intervals, phase);
+  return pe;
+};
+export const makeCornerPathEffect = (ctx, props) => {
+  const {
+    r
+  } = props;
+  const pe = ctx.Skia.PathEffect.MakeCorner(r);
+  if (pe === null) {
+    throw new Error("CornerPathEffect: couldn't create path effect");
+  }
+  return pe;
+};
+export const declareSumPathEffect = ctx => {
+  // Note: decorateChildren functionality needs to be handled differently
+  const pes = ctx.pathEffects.popAll();
+  const pe = composeDeclarations(pes, ctx.Skia.PathEffect.MakeSum.bind(ctx.Skia.PathEffect));
+  ctx.pathEffects.push(pe);
+};
+export const makeLine2DPathEffect = (ctx, props) => {
+  const {
+    width,
+    matrix
+  } = props;
+  const pe = ctx.Skia.PathEffect.MakeLine2D(width, matrix);
+  if (pe === null) {
+    throw new Error("Line2DPathEffect: could not create path effect");
+  }
+  return pe;
+};
+export const makePath1DPathEffect = (ctx, props) => {
+  const {
+    advance,
+    phase,
+    style
+  } = props;
+  const path = processPath(ctx.Skia, props.path);
+  const pe = ctx.Skia.PathEffect.MakePath1D(path, advance, phase, Path1DEffectStyle[enumKey(style)]);
+  if (pe === null) {
+    throw new Error("Path1DPathEffect: could not create path effect");
+  }
+  return pe;
+};
+//# sourceMappingURL=pathEffects.js.map

package/lib/module/sksg/nodes/pathEffects.js.map

@@ -0,0 +1 @@
+{"version":3,"names":["composeDeclarations","enumKey","processPath","Path1DEffectStyle","makeDiscretePathEffect","ctx","props","length","deviation","seed","Skia","PathEffect","MakeDiscrete","makePath2DPathEffect","matrix","path","pe","MakePath2D","Error","makeDashPathEffect","intervals","phase","MakeDash","makeCornerPathEffect","r","MakeCorner","declareSumPathEffect","pes","pathEffects","popAll","MakeSum","bind","push","makeLine2DPathEffect","width","MakeLine2D","makePath1DPathEffect","advance","style","MakePath1D"],"sources":["pathEffects.ts"],"sourcesContent":["\"worklet\";\n\nimport { composeDeclarations, enumKey, processPath } from \"../../dom/nodes\";\nimport type {\n  CornerPathEffectProps,\n  DashPathEffectProps,\n  DeclarationContext,\n  DiscretePathEffectProps,\n  Line2DPathEffectProps,\n  Path1DPathEffectProps,\n  Path2DPathEffectProps,\n} from \"../../dom/types\";\nimport { Path1DEffectStyle } from \"../../skia/types\";\n\nexport const makeDiscretePathEffect = (\n  ctx: DeclarationContext,\n  props: DiscretePathEffectProps\n) => {\n  const { length, deviation, seed } = props;\n  return ctx.Skia.PathEffect.MakeDiscrete(length, deviation, seed);\n};\n\nexport const makePath2DPathEffect = (\n  ctx: DeclarationContext,\n  props: Path2DPathEffectProps\n) => {\n  const { matrix } = props;\n  const path = processPath(ctx.Skia, props.path);\n  const pe = ctx.Skia.PathEffect.MakePath2D(matrix, path);\n  if (pe === null) {\n    throw new Error(\"Path2DPathEffect: invalid path\");\n  }\n  return pe;\n};\n\nexport const makeDashPathEffect = (\n  ctx: DeclarationContext,\n  props: DashPathEffectProps\n) => {\n  const { intervals, phase } = props;\n  const pe = ctx.Skia.PathEffect.MakeDash(intervals, phase);\n  return pe;\n};\n\nexport const makeCornerPathEffect = (\n  ctx: DeclarationContext,\n  props: CornerPathEffectProps\n) => {\n  const { r } = props;\n  const pe = ctx.Skia.PathEffect.MakeCorner(r);\n  if (pe === null) {\n    throw new Error(\"CornerPathEffect: couldn't create path effect\");\n  }\n  return pe;\n};\n\nexport const declareSumPathEffect = (ctx: DeclarationContext) => {\n  // Note: decorateChildren functionality needs to be handled differently\n  const pes = ctx.pathEffects.popAll();\n  const pe = composeDeclarations(\n    pes,\n    ctx.Skia.PathEffect.MakeSum.bind(ctx.Skia.PathEffect)\n  );\n  ctx.pathEffects.push(pe);\n};\n\nexport const makeLine2DPathEffect = (\n  ctx: DeclarationContext,\n  props: Line2DPathEffectProps\n) => {\n  const { width, matrix } = props;\n  const pe = ctx.Skia.PathEffect.MakeLine2D(width, matrix);\n  if (pe === null) {\n    throw new Error(\"Line2DPathEffect: could not create path effect\");\n  }\n  return pe;\n};\n\nexport const makePath1DPathEffect = (\n  ctx: DeclarationContext,\n  props: Path1DPathEffectProps\n) => {\n  const { advance, phase, style } = props;\n  const path = processPath(ctx.Skia, props.path);\n  const pe = ctx.Skia.PathEffect.MakePath1D(\n    path,\n    advance,\n    phase,\n    Path1DEffectStyle[enumKey(style)]\n  );\n  if (pe === null) {\n    throw new Error(\"Path1DPathEffect: could not create path effect\");\n  }\n  return pe;\n};\n"],"mappings":"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","ignoreList":[]}

package/lib/module/sksg/nodes/shaders.d.ts

@@ -0,0 +1,10 @@
+import type { ColorProps, DeclarationContext, FractalNoiseProps, ImageShaderProps, LinearGradientProps, RadialGradientProps, ShaderProps, SweepGradientProps, TurbulenceProps, TwoPointConicalGradientProps } from "../../dom/types";
+export declare const declareShader: (ctx: DeclarationContext, props: ShaderProps) => void;
+export declare const declareColorShader: (ctx: DeclarationContext, props: ColorProps) => void;
+export declare const declareFractalNoiseShader: (ctx: DeclarationContext, props: FractalNoiseProps) => void;
+export declare const declareTwoPointConicalGradientShader: (ctx: DeclarationContext, props: TwoPointConicalGradientProps) => void;
+export declare const declareRadialGradientShader: (ctx: DeclarationContext, props: RadialGradientProps) => void;
+export declare const declareSweepGradientShader: (ctx: DeclarationContext, props: SweepGradientProps) => void;
+export declare const declareLinearGradientShader: (ctx: DeclarationContext, props: LinearGradientProps) => void;
+export declare const declareTurbulenceShader: (ctx: DeclarationContext, props: TurbulenceProps) => void;
+export declare const declareImageShader: (ctx: DeclarationContext, props: ImageShaderProps) => void;

package/lib/module/sksg/nodes/shaders.js

@@ -0,0 +1,142 @@
+"worklet";
+
+import { enumKey, fitRects, getRect, processGradientProps, processTransformProps, rect2rect } from "../../dom/nodes";
+import { FilterMode, MipmapMode, processUniforms, TileMode } from "../../skia/types";
+export const declareShader = (ctx, props) => {
+  const {
+    source,
+    uniforms,
+    ...transform
+  } = props;
+  const m3 = ctx.Skia.Matrix();
+  processTransformProps(m3, transform);
+  const shader = source.makeShaderWithChildren(processUniforms(source, uniforms), ctx.shaders.popAll(), m3);
+  ctx.shaders.push(shader);
+};
+export const declareColorShader = (ctx, props) => {
+  const {
+    color
+  } = props;
+  const shader = ctx.Skia.Shader.MakeColor(ctx.Skia.Color(color));
+  ctx.shaders.push(shader);
+};
+export const declareFractalNoiseShader = (ctx, props) => {
+  const {
+    freqX,
+    freqY,
+    octaves,
+    seed,
+    tileWidth,
+    tileHeight
+  } = props;
+  const shader = ctx.Skia.Shader.MakeFractalNoise(freqX, freqY, octaves, seed, tileWidth, tileHeight);
+  ctx.shaders.push(shader);
+};
+export const declareTwoPointConicalGradientShader = (ctx, props) => {
+  const {
+    startR,
+    endR,
+    start,
+    end
+  } = props;
+  const {
+    colors,
+    positions,
+    mode,
+    localMatrix,
+    flags
+  } = processGradientProps(ctx.Skia, props);
+  const shader = ctx.Skia.Shader.MakeTwoPointConicalGradient(start, startR, end, endR, colors, positions, mode, localMatrix, flags);
+  ctx.shaders.push(shader);
+};
+export const declareRadialGradientShader = (ctx, props) => {
+  const {
+    c,
+    r
+  } = props;
+  const {
+    colors,
+    positions,
+    mode,
+    localMatrix,
+    flags
+  } = processGradientProps(ctx.Skia, props);
+  const shader = ctx.Skia.Shader.MakeRadialGradient(c, r, colors, positions, mode, localMatrix, flags);
+  ctx.shaders.push(shader);
+};
+export const declareSweepGradientShader = (ctx, props) => {
+  const {
+    c,
+    start,
+    end
+  } = props;
+  const {
+    colors,
+    positions,
+    mode,
+    localMatrix,
+    flags
+  } = processGradientProps(ctx.Skia, props);
+  const shader = ctx.Skia.Shader.MakeSweepGradient(c.x, c.y, colors, positions, mode, localMatrix, flags, start, end);
+  ctx.shaders.push(shader);
+};
+export const declareLinearGradientShader = (ctx, props) => {
+  const {
+    start,
+    end
+  } = props;
+  const {
+    colors,
+    positions,
+    mode,
+    localMatrix,
+    flags
+  } = processGradientProps(ctx.Skia, props);
+  const shader = ctx.Skia.Shader.MakeLinearGradient(start, end, colors, positions !== null && positions !== void 0 ? positions : null, mode, localMatrix, flags);
+  ctx.shaders.push(shader);
+};
+export const declareTurbulenceShader = (ctx, props) => {
+  const {
+    freqX,
+    freqY,
+    octaves,
+    seed,
+    tileWidth,
+    tileHeight
+  } = props;
+  const shader = ctx.Skia.Shader.MakeTurbulence(freqX, freqY, octaves, seed, tileWidth, tileHeight);
+  ctx.shaders.push(shader);
+};
+export const declareImageShader = (ctx, props) => {
+  const {
+    fit,
+    image,
+    tx,
+    ty,
+    fm,
+    mm,
+    ...imageShaderProps
+  } = props;
+  if (!image) {
+    return;
+  }
+  const rct = getRect(ctx.Skia, imageShaderProps);
+  const m3 = ctx.Skia.Matrix();
+  if (rct) {
+    const rects = fitRects(fit, {
+      x: 0,
+      y: 0,
+      width: image.width(),
+      height: image.height()
+    }, rct);
+    const [x, y, sx, sy] = rect2rect(rects.src, rects.dst);
+    m3.translate(x.translateX, y.translateY);
+    m3.scale(sx.scaleX, sy.scaleY);
+  }
+  const lm = ctx.Skia.Matrix();
+  lm.concat(m3);
+  processTransformProps(lm, imageShaderProps);
+  const shader = image.makeShaderOptions(TileMode[enumKey(tx)], TileMode[enumKey(ty)], FilterMode[enumKey(fm)], MipmapMode[enumKey(mm)], lm);
+  ctx.shaders.push(shader);
+};
+//# sourceMappingURL=shaders.js.map

package/lib/module/sksg/nodes/shaders.js.map

@@ -0,0 +1 @@
+{"version":3,"names":["enumKey","fitRects","getRect","processGradientProps","processTransformProps","rect2rect","FilterMode","MipmapMode","processUniforms","TileMode","declareShader","ctx","props","source","uniforms","transform","m3","Skia","Matrix","shader","makeShaderWithChildren","shaders","popAll","push","declareColorShader","color","Shader","MakeColor","Color","declareFractalNoiseShader","freqX","freqY","octaves","seed","tileWidth","tileHeight","MakeFractalNoise","declareTwoPointConicalGradientShader","startR","endR","start","end","colors","positions","mode","localMatrix","flags","MakeTwoPointConicalGradient","declareRadialGradientShader","c","r","MakeRadialGradient","declareSweepGradientShader","MakeSweepGradient","x","y","declareLinearGradientShader","MakeLinearGradient","declareTurbulenceShader","MakeTurbulence","declareImageShader","fit","image","tx","ty","fm","mm","imageShaderProps","rct","rects","width","height","sx","sy","src","dst","translate","translateX","translateY","scale","scaleX","scaleY","lm","concat","makeShaderOptions"],"sources":["shaders.ts"],"sourcesContent":["\"worklet\";\n\nimport {\n  enumKey,\n  fitRects,\n  getRect,\n  processGradientProps,\n  processTransformProps,\n  rect2rect,\n} from \"../../dom/nodes\";\nimport type {\n  ColorProps,\n  DeclarationContext,\n  FractalNoiseProps,\n  ImageShaderProps,\n  LinearGradientProps,\n  RadialGradientProps,\n  ShaderProps,\n  SweepGradientProps,\n  TurbulenceProps,\n  TwoPointConicalGradientProps,\n} from \"../../dom/types\";\nimport {\n  FilterMode,\n  MipmapMode,\n  processUniforms,\n  TileMode,\n} from \"../../skia/types\";\n\nexport const declareShader = (ctx: DeclarationContext, props: ShaderProps) => {\n  const { source, uniforms, ...transform } = props;\n  const m3 = ctx.Skia.Matrix();\n  processTransformProps(m3, transform);\n  const shader = source.makeShaderWithChildren(\n    processUniforms(source, uniforms),\n    ctx.shaders.popAll(),\n    m3\n  );\n  ctx.shaders.push(shader);\n};\n\nexport const declareColorShader = (\n  ctx: DeclarationContext,\n  props: ColorProps\n) => {\n  const { color } = props;\n  const shader = ctx.Skia.Shader.MakeColor(ctx.Skia.Color(color));\n  ctx.shaders.push(shader);\n};\n\nexport const declareFractalNoiseShader = (\n  ctx: DeclarationContext,\n  props: FractalNoiseProps\n) => {\n  const { freqX, freqY, octaves, seed, tileWidth, tileHeight } = props;\n  const shader = ctx.Skia.Shader.MakeFractalNoise(\n    freqX,\n    freqY,\n    octaves,\n    seed,\n    tileWidth,\n    tileHeight\n  );\n  ctx.shaders.push(shader);\n};\n\nexport const declareTwoPointConicalGradientShader = (\n  ctx: DeclarationContext,\n  props: TwoPointConicalGradientProps\n) => {\n  const { startR, endR, start, end } = props;\n  const { colors, positions, mode, localMatrix, flags } = processGradientProps(\n    ctx.Skia,\n    props\n  );\n  const shader = ctx.Skia.Shader.MakeTwoPointConicalGradient(\n    start,\n    startR,\n    end,\n    endR,\n    colors,\n    positions,\n    mode,\n    localMatrix,\n    flags\n  );\n  ctx.shaders.push(shader);\n};\n\nexport const declareRadialGradientShader = (\n  ctx: DeclarationContext,\n  props: RadialGradientProps\n) => {\n  const { c, r } = props;\n  const { colors, positions, mode, localMatrix, flags } = processGradientProps(\n    ctx.Skia,\n    props\n  );\n  const shader = ctx.Skia.Shader.MakeRadialGradient(\n    c,\n    r,\n    colors,\n    positions,\n    mode,\n    localMatrix,\n    flags\n  );\n  ctx.shaders.push(shader);\n};\n\nexport const declareSweepGradientShader = (\n  ctx: DeclarationContext,\n  props: SweepGradientProps\n) => {\n  const { c, start, end } = props;\n  const { colors, positions, mode, localMatrix, flags } = processGradientProps(\n    ctx.Skia,\n    props\n  );\n  const shader = ctx.Skia.Shader.MakeSweepGradient(\n    c.x,\n    c.y,\n    colors,\n    positions,\n    mode,\n    localMatrix,\n    flags,\n    start,\n    end\n  );\n  ctx.shaders.push(shader);\n};\n\nexport const declareLinearGradientShader = (\n  ctx: DeclarationContext,\n  props: LinearGradientProps\n) => {\n  const { start, end } = props;\n  const { colors, positions, mode, localMatrix, flags } = processGradientProps(\n    ctx.Skia,\n    props\n  );\n  const shader = ctx.Skia.Shader.MakeLinearGradient(\n    start,\n    end,\n    colors,\n    positions ?? null,\n    mode,\n    localMatrix,\n    flags\n  );\n  ctx.shaders.push(shader);\n};\n\nexport const declareTurbulenceShader = (\n  ctx: DeclarationContext,\n  props: TurbulenceProps\n) => {\n  const { freqX, freqY, octaves, seed, tileWidth, tileHeight } = props;\n  const shader = ctx.Skia.Shader.MakeTurbulence(\n    freqX,\n    freqY,\n    octaves,\n    seed,\n    tileWidth,\n    tileHeight\n  );\n  ctx.shaders.push(shader);\n};\n\nexport const declareImageShader = (\n  ctx: DeclarationContext,\n  props: ImageShaderProps\n) => {\n  const { fit, image, tx, ty, fm, mm, ...imageShaderProps } = props;\n  if (!image) {\n    return;\n  }\n\n  const rct = getRect(ctx.Skia, imageShaderProps);\n  const m3 = ctx.Skia.Matrix();\n  if (rct) {\n    const rects = fitRects(\n      fit,\n      { x: 0, y: 0, width: image.width(), height: image.height() },\n      rct\n    );\n    const [x, y, sx, sy] = rect2rect(rects.src, rects.dst);\n    m3.translate(x.translateX, y.translateY);\n    m3.scale(sx.scaleX, sy.scaleY);\n  }\n  const lm = ctx.Skia.Matrix();\n  lm.concat(m3);\n  processTransformProps(lm, imageShaderProps);\n  const shader = image.makeShaderOptions(\n    TileMode[enumKey(tx)],\n    TileMode[enumKey(ty)],\n    FilterMode[enumKey(fm)],\n    MipmapMode[enumKey(mm)],\n    lm\n  );\n  ctx.shaders.push(shader);\n};\n"],"mappings":"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","ignoreList":[]}

package/lib/module/sksg/nodes/utils.d.ts

@@ -0,0 +1,3 @@
+import type { SharedValue } from "react-native-reanimated";
+export declare const isSharedValue: <T = unknown>(value: unknown) => value is SharedValue<T>;
+export declare const materialize: <T extends object>(props: T) => T;

package/lib/module/sksg/nodes/utils.js

@@ -0,0 +1,18 @@
+"worklet";
+
+import { mapKeys } from "../../renderer/typeddash";
+export const isSharedValue = value => {
+  // We cannot use `in` operator here because `value` could be a HostObject and therefore we cast.
+  return (value === null || value === void 0 ? void 0 : value._isReanimatedSharedValue) === true;
+};
+export const materialize = props => {
+  const result = Object.assign({}, props);
+  mapKeys(result).forEach(key => {
+    const value = result[key];
+    if (isSharedValue(value)) {
+      result[key] = value.value;
+    }
+  });
+  return result;
+};
+//# sourceMappingURL=utils.js.map

package/lib/module/sksg/nodes/utils.js.map

@@ -0,0 +1 @@
+{"version":3,"names":["mapKeys","isSharedValue","value","_isReanimatedSharedValue","materialize","props","result","Object","assign","forEach","key"],"sources":["utils.ts"],"sourcesContent":["\"worklet\";\n\nimport type { SharedValue } from \"react-native-reanimated\";\n\nimport { mapKeys } from \"../../renderer/typeddash\";\n\nexport const isSharedValue = <T = unknown>(\n  value: unknown\n): value is SharedValue<T> => {\n  // We cannot use `in` operator here because `value` could be a HostObject and therefore we cast.\n  return (value as Record<string, unknown>)?._isReanimatedSharedValue === true;\n};\n\nexport const materialize = <T extends object>(props: T) => {\n  const result: T = Object.assign({}, props);\n  mapKeys(result).forEach((key) => {\n    const value = result[key];\n    if (isSharedValue(value)) {\n      result[key] = value.value as never;\n    }\n  });\n  return result;\n};\n"],"mappings":"AAAA,SAAS;;AAIT,SAASA,OAAO,QAAQ,0BAA0B;AAElD,OAAO,MAAMC,aAAa,GACxBC,KAAc,IACc;EAC5B;EACA,OAAO,CAACA,KAAK,aAALA,KAAK,uBAALA,KAAK,CAA8BC,wBAAwB,MAAK,IAAI;AAC9E,CAAC;AAED,OAAO,MAAMC,WAAW,GAAsBC,KAAQ,IAAK;EACzD,MAAMC,MAAS,GAAGC,MAAM,CAACC,MAAM,CAAC,CAAC,CAAC,EAAEH,KAAK,CAAC;EAC1CL,OAAO,CAACM,MAAM,CAAC,CAACG,OAAO,CAAEC,GAAG,IAAK;IAC/B,MAAMR,KAAK,GAAGI,MAAM,CAACI,GAAG,CAAC;IACzB,IAAIT,aAAa,CAACC,KAAK,CAAC,EAAE;MACxBI,MAAM,CAACI,GAAG,CAAC,GAAGR,KAAK,CAACA,KAAc;IACpC;EACF,CAAC,CAAC;EACF,OAAOI,MAAM;AACf,CAAC","ignoreList":[]}

package/lib/module/views/SkiaDomView.js

@@ -46,7 +46,9 @@ export class SkiaDomView extends React.Component {
       assertSkiaViewApi();
       SkiaViewApi.setJsiProperty(this._nativeId, "onSize", onSize);
     }
-    this.tick();
+    if (onSize !== prevProps.onSize || root !== prevProps.root) {
+      this.tick();
+    }
   }
   componentWillUnmount() {
     if (this.requestId) {

package/lib/module/views/SkiaDomView.js.map

@@ -1 +1 @@
-{"version":3,"names":["React","Platform","SkiaDomViewNativeComponent","SkiaViewApi","SkiaViewNativeId","NativeSkiaDomView","OS","SkiaDomView","Component","constructor","props","_defineProperty","_nativeId","current","root","onSize","assertSkiaViewApi","setJsiProperty","tick","nativeId","componentDidUpdate","prevProps","componentWillUnmount","requestId","cancelAnimationFrame","redraw","mode","requestAnimationFrame","bind","makeImageSnapshot","rect","makeImageSnapshotAsync","requestRedraw","render","debug","opaque","viewProps","createElement","_extends","collapsable","nativeID","Error"],"sources":["SkiaDomView.tsx"],"sourcesContent":["import React from \"react\";\nimport type { HostComponent } from \"react-native\";\n\nimport type { SkRect } from \"../skia/types\";\nimport { Platform } from \"../Platform\";\nimport SkiaDomViewNativeComponent from \"../specs/SkiaDomViewNativeComponent\";\n\nimport { SkiaViewApi } from \"./api\";\nimport type { SkiaDomViewNativeProps } from \"./types\";\nimport { SkiaViewNativeId } from \"./SkiaViewNativeId\";\n\nconst NativeSkiaDomView: HostComponent<SkiaDomViewNativeProps> =\n  Platform.OS !== \"web\"\n    ? SkiaDomViewNativeComponent\n    : // eslint-disable-next-line @typescript-eslint/no-explicit-any\n      (null as any);\n\ninterface SkiaDomViewProps extends SkiaDomViewNativeProps {\n  mode?: \"default\" | \"continuous\";\n}\n\nexport class SkiaDomView extends React.Component<SkiaDomViewProps> {\n  constructor(props: SkiaDomViewProps) {\n    super(props);\n    this._nativeId = SkiaViewNativeId.current++;\n    const { root, onSize } = props;\n    if (root) {\n      assertSkiaViewApi();\n      SkiaViewApi.setJsiProperty(this._nativeId, \"root\", root);\n    }\n    if (onSize) {\n      assertSkiaViewApi();\n      SkiaViewApi.setJsiProperty(this._nativeId, \"onSize\", onSize);\n    }\n    this.tick();\n  }\n\n  private _nativeId: number;\n  private requestId = 0;\n\n  public get nativeId() {\n    return this._nativeId;\n  }\n\n  componentDidUpdate(prevProps: SkiaDomViewProps) {\n    const { root, onSize } = this.props;\n    if (root !== prevProps.root) {\n      assertSkiaViewApi();\n      SkiaViewApi.setJsiProperty(this._nativeId, \"root\", root);\n    }\n    if (onSize !== prevProps.onSize) {\n      assertSkiaViewApi();\n      SkiaViewApi.setJsiProperty(this._nativeId, \"onSize\", onSize);\n    }\n    this.tick();\n  }\n\n  componentWillUnmount(): void {\n    if (this.requestId) {\n      cancelAnimationFrame(this.requestId);\n    }\n  }\n\n  private tick() {\n    this.redraw();\n    if (this.props.mode === \"continuous\") {\n      this.requestId = requestAnimationFrame(this.tick.bind(this));\n    }\n  }\n\n  /**\n   * Creates a snapshot from the canvas in the surface\n   * @param rect Rect to use as bounds. Optional.\n   * @returns An Image object.\n   */\n  public makeImageSnapshot(rect?: SkRect) {\n    assertSkiaViewApi();\n    return SkiaViewApi.makeImageSnapshot(this._nativeId, rect);\n  }\n\n  /**\n   * Creates a snapshot from the canvas in the surface\n   * @param rect Rect to use as bounds. Optional.\n   * @returns An Image object.\n   */\n  public makeImageSnapshotAsync(rect?: SkRect) {\n    assertSkiaViewApi();\n    return SkiaViewApi.makeImageSnapshotAsync(this._nativeId, rect);\n  }\n\n  /**\n   * Sends a redraw request to the native SkiaView.\n   */\n  public redraw() {\n    assertSkiaViewApi();\n    SkiaViewApi.requestRedraw(this._nativeId);\n  }\n\n  render() {\n    const { debug = false, opaque = false, ...viewProps } = this.props;\n    return (\n      <NativeSkiaDomView\n        collapsable={false}\n        nativeID={`${this._nativeId}`}\n        debug={debug}\n        opaque={opaque}\n        {...viewProps}\n      />\n    );\n  }\n}\n\nconst assertSkiaViewApi = () => {\n  if (\n    SkiaViewApi === null ||\n    SkiaViewApi.setJsiProperty === null ||\n    SkiaViewApi.requestRedraw === null ||\n    SkiaViewApi.makeImageSnapshot === null\n  ) {\n    throw Error(\"Skia View Api was not found.\");\n  }\n};\n"],"mappings":"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","ignoreList":[]}
+{"version":3,"names":["React","Platform","SkiaDomViewNativeComponent","SkiaViewApi","SkiaViewNativeId","NativeSkiaDomView","OS","SkiaDomView","Component","constructor","props","_defineProperty","_nativeId","current","root","onSize","assertSkiaViewApi","setJsiProperty","tick","nativeId","componentDidUpdate","prevProps","componentWillUnmount","requestId","cancelAnimationFrame","redraw","mode","requestAnimationFrame","bind","makeImageSnapshot","rect","makeImageSnapshotAsync","requestRedraw","render","debug","opaque","viewProps","createElement","_extends","collapsable","nativeID","Error"],"sources":["SkiaDomView.tsx"],"sourcesContent":["import React from \"react\";\nimport type { HostComponent } from \"react-native\";\n\nimport type { SkRect } from \"../skia/types\";\nimport { Platform } from \"../Platform\";\nimport SkiaDomViewNativeComponent from \"../specs/SkiaDomViewNativeComponent\";\n\nimport { SkiaViewApi } from \"./api\";\nimport type { SkiaDomViewNativeProps } from \"./types\";\nimport { SkiaViewNativeId } from \"./SkiaViewNativeId\";\n\nconst NativeSkiaDomView: HostComponent<SkiaDomViewNativeProps> =\n  Platform.OS !== \"web\"\n    ? SkiaDomViewNativeComponent\n    : // eslint-disable-next-line @typescript-eslint/no-explicit-any\n      (null as any);\n\ninterface SkiaDomViewProps extends SkiaDomViewNativeProps {\n  mode?: \"default\" | \"continuous\";\n}\n\nexport class SkiaDomView extends React.Component<SkiaDomViewProps> {\n  constructor(props: SkiaDomViewProps) {\n    super(props);\n    this._nativeId = SkiaViewNativeId.current++;\n    const { root, onSize } = props;\n    if (root) {\n      assertSkiaViewApi();\n      SkiaViewApi.setJsiProperty(this._nativeId, \"root\", root);\n    }\n    if (onSize) {\n      assertSkiaViewApi();\n      SkiaViewApi.setJsiProperty(this._nativeId, \"onSize\", onSize);\n    }\n    this.tick();\n  }\n\n  private _nativeId: number;\n  private requestId = 0;\n\n  public get nativeId() {\n    return this._nativeId;\n  }\n\n  componentDidUpdate(prevProps: SkiaDomViewProps) {\n    const { root, onSize } = this.props;\n    if (root !== prevProps.root) {\n      assertSkiaViewApi();\n      SkiaViewApi.setJsiProperty(this._nativeId, \"root\", root);\n    }\n    if (onSize !== prevProps.onSize) {\n      assertSkiaViewApi();\n      SkiaViewApi.setJsiProperty(this._nativeId, \"onSize\", onSize);\n    }\n    if (onSize !== prevProps.onSize || root !== prevProps.root) {\n      this.tick();\n    }\n  }\n\n  componentWillUnmount(): void {\n    if (this.requestId) {\n      cancelAnimationFrame(this.requestId);\n    }\n  }\n\n  private tick() {\n    this.redraw();\n    if (this.props.mode === \"continuous\") {\n      this.requestId = requestAnimationFrame(this.tick.bind(this));\n    }\n  }\n\n  /**\n   * Creates a snapshot from the canvas in the surface\n   * @param rect Rect to use as bounds. Optional.\n   * @returns An Image object.\n   */\n  public makeImageSnapshot(rect?: SkRect) {\n    assertSkiaViewApi();\n    return SkiaViewApi.makeImageSnapshot(this._nativeId, rect);\n  }\n\n  /**\n   * Creates a snapshot from the canvas in the surface\n   * @param rect Rect to use as bounds. Optional.\n   * @returns An Image object.\n   */\n  public makeImageSnapshotAsync(rect?: SkRect) {\n    assertSkiaViewApi();\n    return SkiaViewApi.makeImageSnapshotAsync(this._nativeId, rect);\n  }\n\n  /**\n   * Sends a redraw request to the native SkiaView.\n   */\n  public redraw() {\n    assertSkiaViewApi();\n    SkiaViewApi.requestRedraw(this._nativeId);\n  }\n\n  render() {\n    const { debug = false, opaque = false, ...viewProps } = this.props;\n    return (\n      <NativeSkiaDomView\n        collapsable={false}\n        nativeID={`${this._nativeId}`}\n        debug={debug}\n        opaque={opaque}\n        {...viewProps}\n      />\n    );\n  }\n}\n\nconst assertSkiaViewApi = () => {\n  if (\n    SkiaViewApi === null ||\n    SkiaViewApi.setJsiProperty === null ||\n    SkiaViewApi.requestRedraw === null ||\n    SkiaViewApi.makeImageSnapshot === null\n  ) {\n    throw Error(\"Skia View Api was not found.\");\n  }\n};\n"],"mappings":"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","ignoreList":[]}

package/lib/module/views/SkiaPictureView.js

@@ -31,7 +31,6 @@ export class SkiaPictureView extends React.Component {
     return this._nativeId;
   }
   componentDidUpdate(prevProps) {
-    console.log("componentDidUpdate");
     const {
       picture,
       onSize
@@ -73,7 +72,6 @@ export class SkiaPictureView extends React.Component {
    */
   redraw() {
     assertSkiaViewApi();
-    console.log("Request redraw: ", this._nativeId);
     SkiaViewApi.requestRedraw(this._nativeId);
   }
   render() {

package/lib/module/views/SkiaPictureView.js.map

@@ -1 +1 @@
-{"version":3,"names":["React","SkiaPictureViewNativeComponent","SkiaViewApi","SkiaViewNativeId","NativeSkiaPictureView","SkiaPictureView","Component","constructor","props","_defineProperty","_nativeId","current","picture","onSize","assertSkiaViewApi","setJsiProperty","tick","nativeId","componentDidUpdate","prevProps","console","log","componentWillUnmount","requestId","cancelAnimationFrame","redraw","mode","requestAnimationFrame","bind","makeImageSnapshot","rect","requestRedraw","render","debug","opaque","viewProps","createElement","_extends","collapsable","nativeID","Error"],"sources":["SkiaPictureView.tsx"],"sourcesContent":["import React from \"react\";\n\nimport type { SkRect } from \"../skia/types\";\nimport SkiaPictureViewNativeComponent from \"../specs/SkiaPictureViewNativeComponent\";\n\nimport { SkiaViewApi } from \"./api\";\nimport type { SkiaPictureViewNativeProps } from \"./types\";\nimport { SkiaViewNativeId } from \"./SkiaViewNativeId\";\n\nconst NativeSkiaPictureView = SkiaPictureViewNativeComponent;\n\ninterface SkiaPictureViewProps extends SkiaPictureViewNativeProps {\n  mode?: \"default\" | \"continuous\";\n}\n\nexport class SkiaPictureView extends React.Component<SkiaPictureViewProps> {\n  private requestId = 0;\n\n  constructor(props: SkiaPictureViewProps) {\n    super(props);\n    this._nativeId = SkiaViewNativeId.current++;\n    const { picture, onSize } = props;\n    if (picture) {\n      assertSkiaViewApi();\n      SkiaViewApi.setJsiProperty(this._nativeId, \"picture\", picture);\n    }\n    if (onSize) {\n      assertSkiaViewApi();\n      SkiaViewApi.setJsiProperty(this._nativeId, \"onSize\", onSize);\n    }\n    this.tick();\n  }\n\n  private _nativeId: number;\n\n  public get nativeId() {\n    return this._nativeId;\n  }\n\n  componentDidUpdate(prevProps: SkiaPictureViewProps) {\n    console.log(\"componentDidUpdate\");\n    const { picture, onSize } = this.props;\n    if (picture !== prevProps.picture) {\n      assertSkiaViewApi();\n      SkiaViewApi.setJsiProperty(this._nativeId, \"picture\", picture);\n    }\n    if (onSize !== prevProps.onSize) {\n      assertSkiaViewApi();\n      SkiaViewApi.setJsiProperty(this._nativeId, \"onSize\", onSize);\n    }\n    this.tick();\n  }\n\n  componentWillUnmount() {\n    if (this.requestId) {\n      cancelAnimationFrame(this.requestId);\n    }\n  }\n\n  private tick() {\n    this.redraw();\n    if (this.props.mode === \"continuous\") {\n      this.requestId = requestAnimationFrame(this.tick.bind(this));\n    }\n  }\n\n  /**\n   * Creates a snapshot from the canvas in the surface\n   * @param rect Rect to use as bounds. Optional.\n   * @returns An Image object.\n   */\n  public makeImageSnapshot(rect?: SkRect) {\n    assertSkiaViewApi();\n    return SkiaViewApi.makeImageSnapshot(this._nativeId, rect);\n  }\n\n  /**\n   * Sends a redraw request to the native SkiaView.\n   */\n  public redraw() {\n    assertSkiaViewApi();\n    console.log(\"Request redraw: \", this._nativeId);\n    SkiaViewApi.requestRedraw(this._nativeId);\n  }\n\n  render() {\n    const { mode, debug = false, opaque = false, ...viewProps } = this.props;\n    return (\n      <NativeSkiaPictureView\n        collapsable={false}\n        nativeID={`${this._nativeId}`}\n        debug={debug}\n        opaque={opaque}\n        {...viewProps}\n      />\n    );\n  }\n}\n\nconst assertSkiaViewApi = () => {\n  if (\n    SkiaViewApi === null ||\n    SkiaViewApi.setJsiProperty === null ||\n    SkiaViewApi.requestRedraw === null ||\n    SkiaViewApi.makeImageSnapshot === null\n  ) {\n    throw Error(\"Skia View Api was not found.\");\n  }\n};\n"],"mappings":"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","ignoreList":[]}
+{"version":3,"names":["React","SkiaPictureViewNativeComponent","SkiaViewApi","SkiaViewNativeId","NativeSkiaPictureView","SkiaPictureView","Component","constructor","props","_defineProperty","_nativeId","current","picture","onSize","assertSkiaViewApi","setJsiProperty","tick","nativeId","componentDidUpdate","prevProps","componentWillUnmount","requestId","cancelAnimationFrame","redraw","mode","requestAnimationFrame","bind","makeImageSnapshot","rect","requestRedraw","render","debug","opaque","viewProps","createElement","_extends","collapsable","nativeID","Error"],"sources":["SkiaPictureView.tsx"],"sourcesContent":["import React from \"react\";\n\nimport type { SkRect } from \"../skia/types\";\nimport SkiaPictureViewNativeComponent from \"../specs/SkiaPictureViewNativeComponent\";\n\nimport { SkiaViewApi } from \"./api\";\nimport type { SkiaPictureViewNativeProps } from \"./types\";\nimport { SkiaViewNativeId } from \"./SkiaViewNativeId\";\n\nconst NativeSkiaPictureView = SkiaPictureViewNativeComponent;\n\ninterface SkiaPictureViewProps extends SkiaPictureViewNativeProps {\n  mode?: \"default\" | \"continuous\";\n}\n\nexport class SkiaPictureView extends React.Component<SkiaPictureViewProps> {\n  private requestId = 0;\n\n  constructor(props: SkiaPictureViewProps) {\n    super(props);\n    this._nativeId = SkiaViewNativeId.current++;\n    const { picture, onSize } = props;\n    if (picture) {\n      assertSkiaViewApi();\n      SkiaViewApi.setJsiProperty(this._nativeId, \"picture\", picture);\n    }\n    if (onSize) {\n      assertSkiaViewApi();\n      SkiaViewApi.setJsiProperty(this._nativeId, \"onSize\", onSize);\n    }\n    this.tick();\n  }\n\n  private _nativeId: number;\n\n  public get nativeId() {\n    return this._nativeId;\n  }\n\n  componentDidUpdate(prevProps: SkiaPictureViewProps) {\n    const { picture, onSize } = this.props;\n    if (picture !== prevProps.picture) {\n      assertSkiaViewApi();\n      SkiaViewApi.setJsiProperty(this._nativeId, \"picture\", picture);\n    }\n    if (onSize !== prevProps.onSize) {\n      assertSkiaViewApi();\n      SkiaViewApi.setJsiProperty(this._nativeId, \"onSize\", onSize);\n    }\n    this.tick();\n  }\n\n  componentWillUnmount() {\n    if (this.requestId) {\n      cancelAnimationFrame(this.requestId);\n    }\n  }\n\n  private tick() {\n    this.redraw();\n    if (this.props.mode === \"continuous\") {\n      this.requestId = requestAnimationFrame(this.tick.bind(this));\n    }\n  }\n\n  /**\n   * Creates a snapshot from the canvas in the surface\n   * @param rect Rect to use as bounds. Optional.\n   * @returns An Image object.\n   */\n  public makeImageSnapshot(rect?: SkRect) {\n    assertSkiaViewApi();\n    return SkiaViewApi.makeImageSnapshot(this._nativeId, rect);\n  }\n\n  /**\n   * Sends a redraw request to the native SkiaView.\n   */\n  public redraw() {\n    assertSkiaViewApi();\n    SkiaViewApi.requestRedraw(this._nativeId);\n  }\n\n  render() {\n    const { mode, debug = false, opaque = false, ...viewProps } = this.props;\n    return (\n      <NativeSkiaPictureView\n        collapsable={false}\n        nativeID={`${this._nativeId}`}\n        debug={debug}\n        opaque={opaque}\n        {...viewProps}\n      />\n    );\n  }\n}\n\nconst assertSkiaViewApi = () => {\n  if (\n    SkiaViewApi === null ||\n    SkiaViewApi.setJsiProperty === null ||\n    SkiaViewApi.requestRedraw === null ||\n    SkiaViewApi.makeImageSnapshot === null\n  ) {\n    throw Error(\"Skia View Api was not found.\");\n  }\n};\n"],"mappings":"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","ignoreList":[]}

package/lib/module/views/types.d.ts

@@ -1,7 +1,7 @@
 import type { ViewProps } from "react-native";
+import type { SharedValue } from "react-native-reanimated";
 import type { GroupProps, RenderNode } from "../dom/types";
 import type { SkImage, SkPicture, SkRect, SkSize } from "../skia/types";
-import type { SharedValueType } from "../renderer/processors/Animations/Animations";
 export type NativeSkiaViewProps = ViewProps & {
     debug?: boolean;
     opaque?: boolean;
@@ -27,7 +27,7 @@ export interface SkiaBaseViewProps extends ViewProps {
      * Pass an animated value to the onSize property to get updates when
      * the Skia view is resized.
      */
-    onSize?: SharedValueType<SkSize>;
+    onSize?: SharedValue<SkSize>;
     opaque?: boolean;
 }
 export interface SkiaPictureViewNativeProps extends SkiaBaseViewProps {

package/lib/module/views/types.js.map

@@ -1 +1 @@
-{"version":3,"names":[],"sources":["types.ts"],"sourcesContent":["import type { ViewProps } from \"react-native\";\n\nimport type { GroupProps, RenderNode } from \"../dom/types\";\nimport type { SkImage, SkPicture, SkRect, SkSize } from \"../skia/types\";\nimport type { SharedValueType } from \"../renderer/processors/Animations/Animations\";\n\nexport type NativeSkiaViewProps = ViewProps & {\n  debug?: boolean;\n  opaque?: boolean;\n};\n\nexport interface DrawingInfo {\n  width: number;\n  height: number;\n  timestamp: number;\n}\n\nexport interface ISkiaViewApi {\n  setJsiProperty: <T>(nativeId: number, name: string, value: T) => void;\n  requestRedraw: (nativeId: number) => void;\n  makeImageSnapshot: (nativeId: number, rect?: SkRect) => SkImage;\n  makeImageSnapshotAsync: (nativeId: number, rect?: SkRect) => Promise<SkImage>;\n}\n\nexport interface SkiaBaseViewProps extends ViewProps {\n  /**\n   * When set to true the view will display information about the\n   * average time it takes to render.\n   */\n  debug?: boolean;\n  /**\n   * Pass an animated value to the onSize property to get updates when\n   * the Skia view is resized.\n   */\n  onSize?: SharedValueType<SkSize>;\n\n  opaque?: boolean;\n}\n\nexport interface SkiaPictureViewNativeProps extends SkiaBaseViewProps {\n  picture?: SkPicture;\n}\n\nexport interface SkiaDomViewNativeProps extends SkiaBaseViewProps {\n  root?: RenderNode<GroupProps>;\n}\n"],"mappings":"","ignoreList":[]}
+{"version":3,"names":[],"sources":["types.ts"],"sourcesContent":["import type { ViewProps } from \"react-native\";\nimport type { SharedValue } from \"react-native-reanimated\";\n\nimport type { GroupProps, RenderNode } from \"../dom/types\";\nimport type { SkImage, SkPicture, SkRect, SkSize } from \"../skia/types\";\n\nexport type NativeSkiaViewProps = ViewProps & {\n  debug?: boolean;\n  opaque?: boolean;\n};\n\nexport interface DrawingInfo {\n  width: number;\n  height: number;\n  timestamp: number;\n}\n\nexport interface ISkiaViewApi {\n  setJsiProperty: <T>(nativeId: number, name: string, value: T) => void;\n  requestRedraw: (nativeId: number) => void;\n  makeImageSnapshot: (nativeId: number, rect?: SkRect) => SkImage;\n  makeImageSnapshotAsync: (nativeId: number, rect?: SkRect) => Promise<SkImage>;\n}\n\nexport interface SkiaBaseViewProps extends ViewProps {\n  /**\n   * When set to true the view will display information about the\n   * average time it takes to render.\n   */\n  debug?: boolean;\n  /**\n   * Pass an animated value to the onSize property to get updates when\n   * the Skia view is resized.\n   */\n  onSize?: SharedValue<SkSize>;\n\n  opaque?: boolean;\n}\n\nexport interface SkiaPictureViewNativeProps extends SkiaBaseViewProps {\n  picture?: SkPicture;\n}\n\nexport interface SkiaDomViewNativeProps extends SkiaBaseViewProps {\n  root?: RenderNode<GroupProps>;\n}\n"],"mappings":"","ignoreList":[]}

package/lib/typescript/lib/commonjs/dom/nodes/datatypes/Circle.d.ts

@@ -1,3 +1,3 @@
 export const __esModule: boolean;
 export function isCircleScalarDef(def: any): boolean;
-export function processCircle(Skia: any, def: any): any;
+export function processCircle(def: any): any;

package/lib/typescript/lib/commonjs/dom/nodes/datatypes/Rect.d.ts

@@ -2,3 +2,5 @@ export const __esModule: boolean;
 export function isEdge(pos: any, b: any): boolean;
 export function processRect(Skia: any, def: any): any;
 export function processRRect(Skia: any, def: any): any;
+export function inflate(Skia: any, box: any, dx: any, dy: any, tx?: number, ty?: number): any;
+export function deflate(Skia: any, box: any, dx: any, dy: any, tx?: number, ty?: number): any;

package/lib/typescript/lib/commonjs/dom/nodes/datatypes/Transform.d.ts

@@ -1,2 +1,3 @@
 export const __esModule: boolean;
 export function processTransformProps(m3: any, props: any): void;
+export function processTransformProps2(Skia: any, props: any): any;

package/lib/typescript/lib/commonjs/external/reanimated/renderHelpers.d.ts

@@ -1,4 +1,6 @@
 export const __esModule: boolean;
+export const HAS_REANIMATED: any;
+export const HAS_REANIMATED_3: any;
 export function bindReanimatedProps(container: any, node: any, reanimatedProps: any): void;
 export function extractReanimatedProps(props: any): any[];
 export function unbindReanimatedNode(node: any): void;

package/lib/typescript/lib/commonjs/renderer/HostConfig.d.ts

@@ -1,6 +1,5 @@
 export const __esModule: boolean;
 export namespace skHostConfig {
-    let now: () => number;
     let supportsMutation: boolean;
     let isPrimaryRenderer: boolean;
     let supportsPersistence: boolean;
@@ -34,5 +33,8 @@ export namespace skHostConfig {
     function beforeActiveInstanceBlur(): void;
     function afterActiveInstanceBlur(): void;
     function detachDeletedInstance(): void;
+    function getInstanceFromNode(_node: any): null;
+    function prepareScopeUpdate(_scopeInstance: any, _instance: any): void;
+    function getInstanceFromScope(_scopeInstance: any): null;
 }
 export function debug(...args: any[]): void;

package/lib/typescript/lib/commonjs/sksg/Container.d.ts

@@ -0,0 +1,16 @@
+export const __esModule: boolean;
+export class Container {
+    constructor(Skia: any, nativeId: any);
+    Skia: any;
+    nativeId: any;
+    set root(root: any);
+    get root(): any;
+    mapperId: any;
+    _root: any;
+    clear(): void;
+    redraw(): void;
+    getNativeId(): any;
+    unregisterValues(values: any): void;
+    registerValues(values: any): void;
+    drawOnCanvas(canvas: any): void;
+}

package/lib/typescript/lib/commonjs/sksg/DrawingContext.d.ts

@@ -0,0 +1,26 @@
+export const __esModule: boolean;
+export class DrawingContext {
+    constructor(Skia: any, canvas: any);
+    Skia: any;
+    canvas: any;
+    paints: any[];
+    declCtx: any;
+    save(): void;
+    restore(): void;
+    get paint(): any;
+    getLocalPaints(): any[];
+    processPaint({ opacity, color, strokeWidth, blendMode, style, strokeJoin, strokeCap, strokeMiter, antiAlias, dither, paint: paintProp }: {
+        opacity: any;
+        color: any;
+        strokeWidth: any;
+        blendMode: any;
+        style: any;
+        strokeJoin: any;
+        strokeCap: any;
+        strokeMiter: any;
+        antiAlias: any;
+        dither: any;
+        paint: any;
+    }): boolean;
+    processMatrixAndClipping(props: any, layer: any): boolean;
+}