@shopify/react-native-skia 0.1.216 → 0.1.219

package/lib/commonjs/dom/types/Node.d.ts

@@ -12,7 +12,7 @@ export interface Node<P> {
     removeChild(child: Node<unknown>): void;
     insertChildBefore(child: Node<unknown>, before: Node<unknown>): void;
 }
-export declare type Invalidate = () => void;
+export type Invalidate = () => void;
 export interface DeclarationNode<P> extends Node<P> {
     declarationType: DeclarationType;
     decorate(ctx: DeclarationContext): void;

package/lib/commonjs/dom/types/SkDOM.d.ts

@@ -6,10 +6,10 @@ import type { ImageProps, CircleProps, PathProps, CustomDrawingNodeProps, LinePr
 import type { BlurMaskFilterProps } from "./MaskFilters";
 import type { FractalNoiseProps, SweepGradientProps, ImageShaderProps, LinearGradientProps, ShaderProps, TurbulenceProps, TwoPointConicalGradientProps, RadialGradientProps, ColorProps } from "./Shaders";
 import type { CornerPathEffectProps, DashPathEffectProps, DiscretePathEffectProps, Line2DPathEffectProps, Path1DPathEffectProps, Path2DPathEffectProps } from "./PathEffects";
-declare type ImageFilterNode<P> = DeclarationNode<P>;
-declare type PathEffectNode<P> = DeclarationNode<P>;
-declare type NullablePathEffectNode<P> = DeclarationNode<P>;
-declare type DrawingNode<P extends GroupProps> = RenderNode<P>;
+type ImageFilterNode<P> = DeclarationNode<P>;
+type PathEffectNode<P> = DeclarationNode<P>;
+type NullablePathEffectNode<P> = DeclarationNode<P>;
+type DrawingNode<P extends GroupProps> = RenderNode<P>;
 export interface SkDOM {
     Layer(props?: ChildrenProps): RenderNode<ChildrenProps>;
     Group(props?: GroupProps): RenderNode<GroupProps>;

package/lib/commonjs/external/reanimated/renderHelpers.js

@@ -10,8 +10,6 @@ exports.unbindReanimatedNode = void 0;
 var _moduleWrapper = require("./moduleWrapper");
 
 /* eslint-disable @typescript-eslint/no-explicit-any */
-
-/* eslint-disable reanimated/js-function-in-worklet */
 const _bindings = new WeakMap();
 
 const unbindReanimatedNode = node => {

package/lib/commonjs/external/reanimated/renderHelpers.js.map

@@ -1 +1 @@
-{"version":3,"names":["_bindings","WeakMap","unbindReanimatedNode","node","previousMapperId","get","undefined","stopMapper","extractReanimatedProps","props","HAS_REANIMATED3","HAS_REANIMATED2","reanimatedProps","otherProps","propName","propValue","isSharedValue","value","bindReanimatedProps2","container","sharedValues","Object","values","length","viewId","getNativeId","SkiaViewApi","global","updateProps","setProp","requestRedraw","redraw","mapperId","startMapper","runOnJS","set","bindReanimatedProps"],"sources":["renderHelpers.ts"],"sourcesContent":["/* eslint-disable @typescript-eslint/no-explicit-any */\n/* eslint-disable reanimated/js-function-in-worklet */\nimport type { Container } from \"../../renderer/Container\";\nimport type { AnimatedProps } from \"../../renderer/processors\";\nimport type { Node } from \"../../dom/types\";\n\nimport {\n  startMapper,\n  stopMapper,\n  isSharedValue,\n  HAS_REANIMATED3,\n  HAS_REANIMATED2,\n  runOnJS,\n} from \"./moduleWrapper\";\n\nconst _bindings = new WeakMap<Node<unknown>, unknown>();\n\nexport const unbindReanimatedNode = (node: Node<unknown>) => {\n  const previousMapperId = _bindings.get(node);\n  if (previousMapperId !== undefined) {\n    stopMapper(previousMapperId as number);\n  }\n};\n\nexport function extractReanimatedProps(props: AnimatedProps<any>) {\n  if (!HAS_REANIMATED3 && !HAS_REANIMATED2) {\n    return [props, {}];\n  }\n  const reanimatedProps = {} as AnimatedProps<any>;\n  const otherProps = {} as AnimatedProps<any>;\n  for (const propName in props) {\n    if (propName === \"children\") {\n      continue;\n    }\n    const propValue = props[propName];\n    if (isSharedValue(propValue)) {\n      reanimatedProps[propName] = propValue;\n      otherProps[propName] = propValue.value;\n    } else {\n      otherProps[propName] = propValue;\n    }\n  }\n  return [otherProps, reanimatedProps];\n}\n\nfunction bindReanimatedProps2(\n  container: Container,\n  node: Node<any>,\n  reanimatedProps: AnimatedProps<any>\n) {\n  const sharedValues = Object.values(reanimatedProps);\n  const previousMapperId = _bindings.get(node);\n  if (previousMapperId !== undefined) {\n    stopMapper(previousMapperId as number);\n  }\n  if (sharedValues.length > 0) {\n    const viewId = container.getNativeId();\n    const { SkiaViewApi } = global;\n    const updateProps = () => {\n      for (const propName in reanimatedProps) {\n        node && node.setProp(propName, reanimatedProps[propName].value);\n      }\n      // On React Native we use the SkiaViewApi to redraw because it can\n      // run on the worklet thread (container.redraw can't)\n      // if SkiaViewApi is undefined, we are on web and container.redraw()\n      // can safely be invoked\n      if (SkiaViewApi) {\n        SkiaViewApi.requestRedraw(viewId);\n      } else {\n        container.redraw();\n      }\n    };\n    const mapperId = startMapper(() => {\n      \"worklet\";\n      runOnJS(updateProps)();\n    }, sharedValues);\n    _bindings.set(node, mapperId);\n  }\n}\n\nexport function bindReanimatedProps(\n  container: Container,\n  node: Node<any>,\n  reanimatedProps: AnimatedProps<any>\n) {\n  if (HAS_REANIMATED2 && !HAS_REANIMATED3) {\n    return bindReanimatedProps2(container, node, reanimatedProps);\n  }\n  if (!HAS_REANIMATED3) {\n    return;\n  }\n  const sharedValues = Object.values(reanimatedProps);\n  const previousMapperId = _bindings.get(node);\n  if (previousMapperId !== undefined) {\n    stopMapper(previousMapperId as number);\n  }\n  if (sharedValues.length > 0) {\n    const viewId = container.getNativeId();\n    const { SkiaViewApi } = global;\n    const mapperId = startMapper(() => {\n      \"worklet\";\n      if (node) {\n        for (const propName in reanimatedProps) {\n          node.setProp(propName, reanimatedProps[propName].value);\n        }\n      }\n      // On React Native we use the SkiaViewApi to redraw because it can\n      // run on the worklet thread (container.redraw can't)\n      // if SkiaViewApi is undefined, we are on web and container.redraw()\n      // can safely be invoked\n      if (SkiaViewApi) {\n        SkiaViewApi.requestRedraw(viewId);\n      } else {\n        container.redraw();\n      }\n    }, sharedValues);\n    _bindings.set(node, mapperId);\n  }\n}\n"],"mappings":"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"}
+{"version":3,"names":["_bindings","WeakMap","unbindReanimatedNode","node","previousMapperId","get","undefined","stopMapper","extractReanimatedProps","props","HAS_REANIMATED3","HAS_REANIMATED2","reanimatedProps","otherProps","propName","propValue","isSharedValue","value","bindReanimatedProps2","container","sharedValues","Object","values","length","viewId","getNativeId","SkiaViewApi","global","updateProps","setProp","requestRedraw","redraw","mapperId","startMapper","runOnJS","set","bindReanimatedProps"],"sources":["renderHelpers.ts"],"sourcesContent":["/* eslint-disable @typescript-eslint/no-explicit-any */\n\nimport type { Container } from \"../../renderer/Container\";\nimport type { AnimatedProps } from \"../../renderer/processors\";\nimport type { Node } from \"../../dom/types\";\n\nimport {\n  startMapper,\n  stopMapper,\n  isSharedValue,\n  HAS_REANIMATED3,\n  HAS_REANIMATED2,\n  runOnJS,\n} from \"./moduleWrapper\";\n\nconst _bindings = new WeakMap<Node<unknown>, unknown>();\n\nexport const unbindReanimatedNode = (node: Node<unknown>) => {\n  const previousMapperId = _bindings.get(node);\n  if (previousMapperId !== undefined) {\n    stopMapper(previousMapperId as number);\n  }\n};\n\nexport function extractReanimatedProps(props: AnimatedProps<any>) {\n  if (!HAS_REANIMATED3 && !HAS_REANIMATED2) {\n    return [props, {}];\n  }\n  const reanimatedProps = {} as AnimatedProps<any>;\n  const otherProps = {} as AnimatedProps<any>;\n  for (const propName in props) {\n    if (propName === \"children\") {\n      continue;\n    }\n    const propValue = props[propName];\n    if (isSharedValue(propValue)) {\n      reanimatedProps[propName] = propValue;\n      otherProps[propName] = propValue.value;\n    } else {\n      otherProps[propName] = propValue;\n    }\n  }\n  return [otherProps, reanimatedProps];\n}\n\nfunction bindReanimatedProps2(\n  container: Container,\n  node: Node<any>,\n  reanimatedProps: AnimatedProps<any>\n) {\n  const sharedValues = Object.values(reanimatedProps);\n  const previousMapperId = _bindings.get(node);\n  if (previousMapperId !== undefined) {\n    stopMapper(previousMapperId as number);\n  }\n  if (sharedValues.length > 0) {\n    const viewId = container.getNativeId();\n    const { SkiaViewApi } = global;\n    const updateProps = () => {\n      for (const propName in reanimatedProps) {\n        node && node.setProp(propName, reanimatedProps[propName].value);\n      }\n      // On React Native we use the SkiaViewApi to redraw because it can\n      // run on the worklet thread (container.redraw can't)\n      // if SkiaViewApi is undefined, we are on web and container.redraw()\n      // can safely be invoked\n      if (SkiaViewApi) {\n        SkiaViewApi.requestRedraw(viewId);\n      } else {\n        container.redraw();\n      }\n    };\n    const mapperId = startMapper(() => {\n      \"worklet\";\n      runOnJS(updateProps)();\n    }, sharedValues);\n    _bindings.set(node, mapperId);\n  }\n}\n\nexport function bindReanimatedProps(\n  container: Container,\n  node: Node<any>,\n  reanimatedProps: AnimatedProps<any>\n) {\n  if (HAS_REANIMATED2 && !HAS_REANIMATED3) {\n    return bindReanimatedProps2(container, node, reanimatedProps);\n  }\n  if (!HAS_REANIMATED3) {\n    return;\n  }\n  const sharedValues = Object.values(reanimatedProps);\n  const previousMapperId = _bindings.get(node);\n  if (previousMapperId !== undefined) {\n    stopMapper(previousMapperId as number);\n  }\n  if (sharedValues.length > 0) {\n    const viewId = container.getNativeId();\n    const { SkiaViewApi } = global;\n    const mapperId = startMapper(() => {\n      \"worklet\";\n      if (node) {\n        for (const propName in reanimatedProps) {\n          node.setProp(propName, reanimatedProps[propName].value);\n        }\n      }\n      // On React Native we use the SkiaViewApi to redraw because it can\n      // run on the worklet thread (container.redraw can't)\n      // if SkiaViewApi is undefined, we are on web and container.redraw()\n      // can safely be invoked\n      if (SkiaViewApi) {\n        SkiaViewApi.requestRedraw(viewId);\n      } else {\n        container.redraw();\n      }\n    }, sharedValues);\n    _bindings.set(node, mapperId);\n  }\n}\n"],"mappings":"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"}

package/lib/commonjs/renderer/Canvas.d.ts

@@ -8,4 +8,4 @@ export interface CanvasProps extends SkiaBaseViewProps {
     children: ReactNode;
     onTouch?: TouchHandler;
 }
-export declare const Canvas: React.FC<CanvasProps & React.RefAttributes<SkiaDomView>>;
+export declare const Canvas: React.FunctionComponent<CanvasProps & React.RefAttributes<SkiaDomView>>;

package/lib/commonjs/renderer/Canvas.js.map

@@ -1 +1 @@
-{"version":3,"names":["useCanvasRef","useRef","useOnSizeEvent","resultValue","onSize","useValue","width","height","useLayoutEffect","addListener","newValue","isValue","current","value","Canvas","forwardRef","forwardedRef","children","style","debug","mode","onTouch","_onSize","props","innerRef","ref","useCombinedRefs","redraw","useCallback","getNativeId","id","nativeId","registerValues","values","root","useMemo","SkiaRoot","Skia","useEffect","render","unmount","NATIVE_DOM","dom","canvas","info","touches","ctx","JsiDrawingContext","refs","targetRef","React","forEach"],"sources":["Canvas.tsx"],"sourcesContent":["import React, {\n  useEffect,\n  useCallback,\n  useMemo,\n  forwardRef,\n  useRef,\n  useLayoutEffect,\n} from \"react\";\nimport type {\n  RefObject,\n  ReactNode,\n  MutableRefObject,\n  ForwardedRef,\n} from \"react\";\n\nimport { SkiaDomView, SkiaView } from \"../views\";\nimport { Skia } from \"../skia/Skia\";\nimport type { TouchHandler, SkiaBaseViewProps } from \"../views\";\nimport type { SkiaValue } from \"../values/types\";\nimport { JsiDrawingContext } from \"../dom/types\";\nimport { useValue } from \"../values\";\n\nimport { SkiaRoot } from \"./Reconciler\";\nimport { NATIVE_DOM } from \"./HostComponents\";\nimport { isValue } from \"./processors\";\n\nexport const useCanvasRef = () => useRef<SkiaDomView>(null);\n\nexport interface CanvasProps extends SkiaBaseViewProps {\n  ref?: RefObject<SkiaDomView>;\n  children: ReactNode;\n  onTouch?: TouchHandler;\n}\n\nconst useOnSizeEvent = (resultValue: SkiaBaseViewProps[\"onSize\"]) => {\n  const onSize = useValue({\n    width: 0,\n    height: 0,\n  });\n\n  useLayoutEffect(() => {\n    if (!resultValue) {\n      return;\n    }\n    return onSize.addListener((newValue) => {\n      if (isValue(resultValue)) {\n        resultValue.current = newValue;\n      } else {\n        resultValue.value = newValue;\n      }\n    });\n  }, [resultValue, onSize]);\n\n  return onSize;\n};\n\nexport const Canvas = forwardRef<SkiaDomView, CanvasProps>(\n  (\n    { children, style, debug, mode, onTouch, onSize: _onSize, ...props },\n    forwardedRef\n  ) => {\n    const onSize = useOnSizeEvent(_onSize);\n    const innerRef = useCanvasRef();\n    const ref = useCombinedRefs(forwardedRef, innerRef);\n    const redraw = useCallback(() => {\n      innerRef.current?.redraw();\n    }, [innerRef]);\n    const getNativeId = useCallback(() => {\n      const id = innerRef.current?.nativeId ?? -1;\n      return id;\n    }, [innerRef]);\n\n    const registerValues = useCallback(\n      (values: Array<SkiaValue<unknown>>) => {\n        if (ref.current !== null) {\n          return ref.current.registerValues(values);\n        }\n        return () => {};\n      },\n      [ref]\n    );\n    const root = useMemo(\n      () => new SkiaRoot(Skia, registerValues, redraw, getNativeId),\n      [redraw, registerValues, getNativeId]\n    );\n\n    // Render effect\n    useEffect(() => {\n      root.render(children);\n    }, [children, root, redraw]);\n\n    useEffect(() => {\n      return () => {\n        root.unmount();\n      };\n    }, [root]);\n    if (NATIVE_DOM) {\n      return (\n        <SkiaDomView\n          ref={ref}\n          style={style}\n          root={root.dom}\n          onTouch={onTouch}\n          onSize={onSize}\n          mode={mode}\n          debug={debug}\n          {...props}\n        />\n      );\n    } else {\n      return (\n        <SkiaView\n          // eslint-disable-next-line @typescript-eslint/no-explicit-any\n          ref={ref as any}\n          style={style}\n          mode={mode}\n          debug={debug}\n          onSize={onSize}\n          onDraw={(canvas, info) => {\n            onTouch && onTouch(info.touches);\n            const ctx = new JsiDrawingContext(Skia, canvas);\n            root.dom.render(ctx);\n          }}\n          {...props}\n        />\n      );\n    }\n  }\n) as React.FC<CanvasProps & React.RefAttributes<SkiaDomView>>;\n\n/**\n * Combines a list of refs into a single ref. This can be used to provide\n * both a forwarded ref and an internal ref keeping the same functionality\n * on both of the refs.\n * @param refs Array of refs to combine\n * @returns A single ref that can be used in a ref prop.\n */\nconst useCombinedRefs = <T,>(\n  ...refs: Array<MutableRefObject<T> | ForwardedRef<T>>\n) => {\n  const targetRef = React.useRef<T>(null);\n  React.useEffect(() => {\n    refs.forEach((ref) => {\n      if (ref) {\n        if (typeof ref === \"function\") {\n          ref(targetRef.current);\n        } else {\n          ref.current = targetRef.current;\n        }\n      }\n    });\n  }, [refs]);\n  return targetRef;\n};\n"],"mappings":"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"}
+{"version":3,"names":["useCanvasRef","useRef","useOnSizeEvent","resultValue","onSize","useValue","width","height","useLayoutEffect","addListener","newValue","isValue","current","value","Canvas","forwardRef","forwardedRef","children","style","debug","mode","onTouch","_onSize","props","innerRef","ref","useCombinedRefs","redraw","useCallback","getNativeId","id","nativeId","registerValues","values","root","useMemo","SkiaRoot","Skia","useEffect","render","unmount","NATIVE_DOM","dom","canvas","info","touches","ctx","JsiDrawingContext","refs","targetRef","React","forEach"],"sources":["Canvas.tsx"],"sourcesContent":["import React, {\n  useEffect,\n  useCallback,\n  useMemo,\n  forwardRef,\n  useRef,\n  useLayoutEffect,\n} from \"react\";\nimport type {\n  RefObject,\n  ReactNode,\n  MutableRefObject,\n  ForwardedRef,\n  FunctionComponent,\n} from \"react\";\n\nimport { SkiaDomView, SkiaView } from \"../views\";\nimport { Skia } from \"../skia/Skia\";\nimport type { TouchHandler, SkiaBaseViewProps } from \"../views\";\nimport type { SkiaValue } from \"../values/types\";\nimport { JsiDrawingContext } from \"../dom/types\";\nimport { useValue } from \"../values\";\n\nimport { SkiaRoot } from \"./Reconciler\";\nimport { NATIVE_DOM } from \"./HostComponents\";\nimport { isValue } from \"./processors\";\n\nexport const useCanvasRef = () => useRef<SkiaDomView>(null);\n\nexport interface CanvasProps extends SkiaBaseViewProps {\n  ref?: RefObject<SkiaDomView>;\n  children: ReactNode;\n  onTouch?: TouchHandler;\n}\n\nconst useOnSizeEvent = (resultValue: SkiaBaseViewProps[\"onSize\"]) => {\n  const onSize = useValue({\n    width: 0,\n    height: 0,\n  });\n\n  useLayoutEffect(() => {\n    if (!resultValue) {\n      return;\n    }\n    return onSize.addListener((newValue) => {\n      if (isValue(resultValue)) {\n        resultValue.current = newValue;\n      } else {\n        resultValue.value = newValue;\n      }\n    });\n  }, [resultValue, onSize]);\n\n  return onSize;\n};\n\nexport const Canvas = forwardRef<SkiaDomView, CanvasProps>(\n  (\n    { children, style, debug, mode, onTouch, onSize: _onSize, ...props },\n    forwardedRef\n  ) => {\n    const onSize = useOnSizeEvent(_onSize);\n    const innerRef = useCanvasRef();\n    const ref = useCombinedRefs(forwardedRef, innerRef);\n    const redraw = useCallback(() => {\n      innerRef.current?.redraw();\n    }, [innerRef]);\n    const getNativeId = useCallback(() => {\n      const id = innerRef.current?.nativeId ?? -1;\n      return id;\n    }, [innerRef]);\n\n    const registerValues = useCallback(\n      (values: Array<SkiaValue<unknown>>) => {\n        if (ref.current !== null) {\n          return ref.current.registerValues(values);\n        }\n        return () => {};\n      },\n      [ref]\n    );\n    const root = useMemo(\n      () => new SkiaRoot(Skia, registerValues, redraw, getNativeId),\n      [redraw, registerValues, getNativeId]\n    );\n\n    // Render effect\n    useEffect(() => {\n      root.render(children);\n    }, [children, root, redraw]);\n\n    useEffect(() => {\n      return () => {\n        root.unmount();\n      };\n    }, [root]);\n    if (NATIVE_DOM) {\n      return (\n        <SkiaDomView\n          ref={ref}\n          style={style}\n          root={root.dom}\n          onTouch={onTouch}\n          onSize={onSize}\n          mode={mode}\n          debug={debug}\n          {...props}\n        />\n      );\n    } else {\n      return (\n        <SkiaView\n          // eslint-disable-next-line @typescript-eslint/no-explicit-any\n          ref={ref as any}\n          style={style}\n          mode={mode}\n          debug={debug}\n          onSize={onSize}\n          onDraw={(canvas, info) => {\n            onTouch && onTouch(info.touches);\n            const ctx = new JsiDrawingContext(Skia, canvas);\n            root.dom.render(ctx);\n          }}\n          {...props}\n        />\n      );\n    }\n  }\n) as FunctionComponent<CanvasProps & React.RefAttributes<SkiaDomView>>;\n\n/**\n * Combines a list of refs into a single ref. This can be used to provide\n * both a forwarded ref and an internal ref keeping the same functionality\n * on both of the refs.\n * @param refs Array of refs to combine\n * @returns A single ref that can be used in a ref prop.\n */\nconst useCombinedRefs = <T,>(\n  ...refs: Array<MutableRefObject<T> | ForwardedRef<T>>\n) => {\n  const targetRef = React.useRef<T>(null);\n  React.useEffect(() => {\n    refs.forEach((ref) => {\n      if (ref) {\n        if (typeof ref === \"function\") {\n          ref(targetRef.current);\n        } else {\n          ref.current = targetRef.current;\n        }\n      }\n    });\n  }, [refs]);\n  return targetRef;\n};\n"],"mappings":"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"}

package/lib/commonjs/renderer/DependencyManager.d.ts

@@ -1,9 +1,9 @@
 import type { Node } from "../dom/types";
 import type { SkiaValue } from "../values";
 import type { AnimatedProps } from "./processors";
-declare type Unsubscribe = () => void;
-declare type Mutator = (value: unknown) => void;
-declare type SubscriptionState = {
+type Unsubscribe = () => void;
+type Mutator = (value: unknown) => void;
+type SubscriptionState = {
     nodes: Map<Node<unknown>, Mutator[]>;
     unsubscribe: null | Unsubscribe;
 };

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

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

package/lib/commonjs/renderer/Reconciler.d.ts

@@ -1,7 +1,7 @@
 import type { ReactNode } from "react";
 import type { Skia } from "../skia/types";
 import type { SkiaValue } from "../values/types";
-declare type RegisterValues = (values: Array<SkiaValue<unknown>>) => () => void;
+type RegisterValues = (values: Array<SkiaValue<unknown>>) => () => void;
 export declare class SkiaRoot {
     private root;
     private container;

package/lib/commonjs/renderer/Reconciler.js

@@ -45,6 +45,7 @@ class SkiaRoot {
   }
 
   render(element) {
+    // eslint-disable-next-line @typescript-eslint/no-explicit-any
     skiaReconciler.updateContainer(element, this.root, null, () => {
       (0, _HostConfig.debug)("updateContainer");
     });

package/lib/commonjs/renderer/Reconciler.js.map

@@ -1 +1 @@
-{"version":3,"names":["skiaReconciler","ReactReconciler","skHostConfig","createDependencyManager","registerValues","NATIVE_DOM","global","SkiaDomApi","DependencyManager","injectIntoDevTools","bundleType","version","rendererPackageName","SkiaRoot","constructor","Skia","redraw","getNativeId","depMgr","container","Container","root","createContainer","console","error","render","element","updateContainer","hostDebug","unmount","remove","dom"],"sources":["Reconciler.tsx"],"sourcesContent":["import type { ReactNode } from \"react\";\nimport type { OpaqueRoot } from \"react-reconciler\";\nimport ReactReconciler from \"react-reconciler\";\n\nimport type { Skia } from \"../skia/types\";\nimport type { SkiaValue } from \"../values/types\";\n\nimport { DependencyManager } from \"./DependencyManager\";\nimport { skHostConfig, debug as hostDebug } from \"./HostConfig\";\nimport { Container } from \"./Container\";\nimport { NATIVE_DOM } from \"./HostComponents\";\n\nconst skiaReconciler = ReactReconciler(skHostConfig);\n\ntype RegisterValues = (values: Array<SkiaValue<unknown>>) => () => void;\n\nconst createDependencyManager = (registerValues: RegisterValues) =>\n  NATIVE_DOM\n    ? global.SkiaDomApi.DependencyManager(registerValues)\n    : new DependencyManager(registerValues);\n\nskiaReconciler.injectIntoDevTools({\n  bundleType: 1,\n  version: \"0.0.1\",\n  rendererPackageName: \"react-native-skia\",\n});\n\nexport class SkiaRoot {\n  private root: OpaqueRoot;\n  private container: Container;\n\n  constructor(\n    Skia: Skia,\n    registerValues: RegisterValues = () => () => {},\n    redraw: () => void = () => {},\n    getNativeId: () => number = () => 0\n  ) {\n    const depMgr = createDependencyManager(registerValues);\n    this.container = new Container(Skia, depMgr, redraw, getNativeId);\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  render(element: ReactNode) {\n    skiaReconciler.updateContainer(element, this.root, null, () => {\n      hostDebug(\"updateContainer\");\n    });\n  }\n\n  unmount() {\n    skiaReconciler.updateContainer(null, this.root, null, () => {\n      this.container.depMgr.remove();\n    });\n  }\n\n  get dom() {\n    return this.container.root;\n  }\n}\n"],"mappings":";;;;;;;AAEA;;AAKA;;AACA;;AACA;;AACA;;;;;;AAEA,MAAMA,cAAc,GAAG,IAAAC,wBAAA,EAAgBC,wBAAhB,CAAvB;;AAIA,MAAMC,uBAAuB,GAAIC,cAAD,IAC9BC,0BAAA,GACIC,MAAM,CAACC,UAAP,CAAkBC,iBAAlB,CAAoCJ,cAApC,CADJ,GAEI,IAAII,oCAAJ,CAAsBJ,cAAtB,CAHN;;AAKAJ,cAAc,CAACS,kBAAf,CAAkC;EAChCC,UAAU,EAAE,CADoB;EAEhCC,OAAO,EAAE,OAFuB;EAGhCC,mBAAmB,EAAE;AAHW,CAAlC;;AAMO,MAAMC,QAAN,CAAe;EAIpBC,WAAW,CACTC,IADS,EAKT;IAAA,IAHAX,cAGA,uEAHiC,MAAM,MAAM,CAAE,CAG/C;IAAA,IAFAY,MAEA,uEAFqB,MAAM,CAAE,CAE7B;IAAA,IADAC,WACA,uEAD4B,MAAM,CAClC;;IAAA;;IAAA;;IACA,MAAMC,MAAM,GAAGf,uBAAuB,CAACC,cAAD,CAAtC;IACA,KAAKe,SAAL,GAAiB,IAAIC,oBAAJ,CAAcL,IAAd,EAAoBG,MAApB,EAA4BF,MAA5B,EAAoCC,WAApC,CAAjB;IACA,KAAKI,IAAL,GAAYrB,cAAc,CAACsB,eAAf,CACV,KAAKH,SADK,EAEV,CAFU,EAGV,IAHU,EAIV,IAJU,EAKV,IALU,EAMV,EANU,EAOVI,OAAO,CAACC,KAPE,EAQV,IARU,CAAZ;EAUD;;EAEDC,MAAM,CAACC,OAAD,EAAqB;IACzB1B,cAAc,CAAC2B,eAAf,CAA+BD,OAA/B,EAAwC,KAAKL,IAA7C,EAAmD,IAAnD,EAAyD,MAAM;MAC7D,IAAAO,iBAAA,EAAU,iBAAV;IACD,CAFD;EAGD;;EAEDC,OAAO,GAAG;IACR7B,cAAc,CAAC2B,eAAf,CAA+B,IAA/B,EAAqC,KAAKN,IAA1C,EAAgD,IAAhD,EAAsD,MAAM;MAC1D,KAAKF,SAAL,CAAeD,MAAf,CAAsBY,MAAtB;IACD,CAFD;EAGD;;EAEM,IAAHC,GAAG,GAAG;IACR,OAAO,KAAKZ,SAAL,CAAeE,IAAtB;EACD;;AAtCmB"}
+{"version":3,"names":["skiaReconciler","ReactReconciler","skHostConfig","createDependencyManager","registerValues","NATIVE_DOM","global","SkiaDomApi","DependencyManager","injectIntoDevTools","bundleType","version","rendererPackageName","SkiaRoot","constructor","Skia","redraw","getNativeId","depMgr","container","Container","root","createContainer","console","error","render","element","updateContainer","hostDebug","unmount","remove","dom"],"sources":["Reconciler.tsx"],"sourcesContent":["import type { ReactNode } from \"react\";\nimport type { OpaqueRoot } from \"react-reconciler\";\nimport ReactReconciler from \"react-reconciler\";\n\nimport type { Skia } from \"../skia/types\";\nimport type { SkiaValue } from \"../values/types\";\n\nimport { DependencyManager } from \"./DependencyManager\";\nimport { skHostConfig, debug as hostDebug } from \"./HostConfig\";\nimport { Container } from \"./Container\";\nimport { NATIVE_DOM } from \"./HostComponents\";\n\nconst skiaReconciler = ReactReconciler(skHostConfig);\n\ntype RegisterValues = (values: Array<SkiaValue<unknown>>) => () => void;\n\nconst createDependencyManager = (registerValues: RegisterValues) =>\n  NATIVE_DOM\n    ? global.SkiaDomApi.DependencyManager(registerValues)\n    : new DependencyManager(registerValues);\n\nskiaReconciler.injectIntoDevTools({\n  bundleType: 1,\n  version: \"0.0.1\",\n  rendererPackageName: \"react-native-skia\",\n});\n\nexport class SkiaRoot {\n  private root: OpaqueRoot;\n  private container: Container;\n\n  constructor(\n    Skia: Skia,\n    registerValues: RegisterValues = () => () => {},\n    redraw: () => void = () => {},\n    getNativeId: () => number = () => 0\n  ) {\n    const depMgr = createDependencyManager(registerValues);\n    this.container = new Container(Skia, depMgr, redraw, getNativeId);\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  render(element: ReactNode) {\n    // eslint-disable-next-line @typescript-eslint/no-explicit-any\n    skiaReconciler.updateContainer(element as any, this.root, null, () => {\n      hostDebug(\"updateContainer\");\n    });\n  }\n\n  unmount() {\n    skiaReconciler.updateContainer(null, this.root, null, () => {\n      this.container.depMgr.remove();\n    });\n  }\n\n  get dom() {\n    return this.container.root;\n  }\n}\n"],"mappings":";;;;;;;AAEA;;AAKA;;AACA;;AACA;;AACA;;;;;;AAEA,MAAMA,cAAc,GAAG,IAAAC,wBAAA,EAAgBC,wBAAhB,CAAvB;;AAIA,MAAMC,uBAAuB,GAAIC,cAAD,IAC9BC,0BAAA,GACIC,MAAM,CAACC,UAAP,CAAkBC,iBAAlB,CAAoCJ,cAApC,CADJ,GAEI,IAAII,oCAAJ,CAAsBJ,cAAtB,CAHN;;AAKAJ,cAAc,CAACS,kBAAf,CAAkC;EAChCC,UAAU,EAAE,CADoB;EAEhCC,OAAO,EAAE,OAFuB;EAGhCC,mBAAmB,EAAE;AAHW,CAAlC;;AAMO,MAAMC,QAAN,CAAe;EAIpBC,WAAW,CACTC,IADS,EAKT;IAAA,IAHAX,cAGA,uEAHiC,MAAM,MAAM,CAAE,CAG/C;IAAA,IAFAY,MAEA,uEAFqB,MAAM,CAAE,CAE7B;IAAA,IADAC,WACA,uEAD4B,MAAM,CAClC;;IAAA;;IAAA;;IACA,MAAMC,MAAM,GAAGf,uBAAuB,CAACC,cAAD,CAAtC;IACA,KAAKe,SAAL,GAAiB,IAAIC,oBAAJ,CAAcL,IAAd,EAAoBG,MAApB,EAA4BF,MAA5B,EAAoCC,WAApC,CAAjB;IACA,KAAKI,IAAL,GAAYrB,cAAc,CAACsB,eAAf,CACV,KAAKH,SADK,EAEV,CAFU,EAGV,IAHU,EAIV,IAJU,EAKV,IALU,EAMV,EANU,EAOVI,OAAO,CAACC,KAPE,EAQV,IARU,CAAZ;EAUD;;EAEDC,MAAM,CAACC,OAAD,EAAqB;IACzB;IACA1B,cAAc,CAAC2B,eAAf,CAA+BD,OAA/B,EAA+C,KAAKL,IAApD,EAA0D,IAA1D,EAAgE,MAAM;MACpE,IAAAO,iBAAA,EAAU,iBAAV;IACD,CAFD;EAGD;;EAEDC,OAAO,GAAG;IACR7B,cAAc,CAAC2B,eAAf,CAA+B,IAA/B,EAAqC,KAAKN,IAA1C,EAAgD,IAAhD,EAAsD,MAAM;MAC1D,KAAKF,SAAL,CAAeD,MAAf,CAAsBY,MAAtB;IACD,CAFD;EAGD;;EAEM,IAAHC,GAAG,GAAG;IACR,OAAO,KAAKZ,SAAL,CAAeE,IAAtB;EACD;;AAvCmB"}

package/lib/commonjs/renderer/components/Blend.d.ts

@@ -1,4 +1,4 @@
-/// <reference types="react" />
+import React from "react";
 import type { BlendProps } from "../../dom/types";
 import type { SkiaProps } from "../processors";
-export declare const Blend: (props: SkiaProps<BlendProps>) => JSX.Element;
+export declare const Blend: (props: SkiaProps<BlendProps>) => React.JSX.Element;

package/lib/commonjs/renderer/components/Drawing.d.ts

@@ -1,3 +1,3 @@
-/// <reference types="react" />
+import React from "react";
 import type { CustomDrawingNodeProps } from "../../dom/types";
-export declare const Drawing: (props: CustomDrawingNodeProps) => JSX.Element;
+export declare const Drawing: (props: CustomDrawingNodeProps) => React.JSX.Element;

package/lib/commonjs/renderer/components/Group.d.ts

@@ -1,8 +1,8 @@
-/// <reference types="react" />
+import React from "react";
 import type { SkiaProps } from "../processors";
 import type { GroupProps } from "../../dom/types";
 import type { ChildrenProps } from "../../dom/types/Common";
 export interface PublicGroupProps extends Omit<GroupProps, "layer"> {
     layer?: GroupProps["layer"] | ChildrenProps["children"];
 }
-export declare const Group: ({ layer, ...props }: SkiaProps<PublicGroupProps>) => JSX.Element;
+export declare const Group: ({ layer, ...props }: SkiaProps<PublicGroupProps>) => React.JSX.Element;

package/lib/commonjs/renderer/components/Mask.d.ts

@@ -1,9 +1,10 @@
 import type { ReactNode } from "react";
+import React from "react";
 interface MaskProps {
     mode?: "luminance" | "alpha";
     clip?: boolean;
     mask: ReactNode | ReactNode[];
     children: ReactNode | ReactNode[];
 }
-export declare const Mask: ({ children, mask, mode, clip, }: MaskProps) => JSX.Element;
+export declare const Mask: ({ children, mask, mode, clip, }: MaskProps) => React.JSX.Element;
 export {};

package/lib/commonjs/renderer/components/Paint.d.ts

@@ -1,4 +1,4 @@
-/// <reference types="react" />
+import React from "react";
 import type { SkiaProps } from "../processors";
 import type { DrawingNodeProps } from "../../dom/types";
-export declare const Paint: (props: SkiaProps<DrawingNodeProps>) => JSX.Element;
+export declare const Paint: (props: SkiaProps<DrawingNodeProps>) => React.JSX.Element;

package/lib/commonjs/renderer/components/Picture.d.ts

@@ -1,4 +1,4 @@
-/// <reference types="react" />
+import React from "react";
 import type { PictureProps } from "../../dom/types";
 import type { SkiaProps } from "../processors";
-export declare const Picture: (props: SkiaProps<PictureProps>) => JSX.Element;
+export declare const Picture: (props: SkiaProps<PictureProps>) => React.JSX.Element;

package/lib/commonjs/renderer/components/backdrop/BackdropBlur.d.ts

@@ -1,9 +1,9 @@
-/// <reference types="react" />
+import React from "react";
 import type { AnimatedProps } from "../../processors";
 import type { Radius } from "../../../dom/types";
 import type { BackdropFilterProps } from "./BackdropFilter";
 interface BackdropBlurProps extends Omit<BackdropFilterProps, "filter"> {
     blur: Radius;
 }
-export declare const BackdropBlur: ({ blur, children, ...props }: AnimatedProps<BackdropBlurProps>) => JSX.Element;
+export declare const BackdropBlur: ({ blur, children, ...props }: AnimatedProps<BackdropBlurProps>) => React.JSX.Element;
 export {};

package/lib/commonjs/renderer/components/backdrop/BackdropFilter.d.ts

@@ -1,7 +1,8 @@
 import type { ReactNode } from "react";
+import React from "react";
 import type { GroupProps } from "../../../dom/types";
 import type { SkiaProps } from "../../processors/Animations/Animations";
 export interface BackdropFilterProps extends GroupProps {
     filter: ReactNode | ReactNode[];
 }
-export declare const BackdropFilter: ({ filter, children, ...props }: SkiaProps<BackdropFilterProps, "filter">) => JSX.Element;
+export declare const BackdropFilter: ({ filter, children: groupChildren, ...props }: SkiaProps<BackdropFilterProps, "filter">) => React.JSX.Element;

package/lib/commonjs/renderer/components/colorFilters/BlendColor.d.ts

@@ -1,4 +1,4 @@
-/// <reference types="react" />
+import React from "react";
 import type { SkiaProps } from "../../processors";
 import type { BlendColorFilterProps } from "../../../dom/types";
-export declare const BlendColor: (props: SkiaProps<BlendColorFilterProps>) => JSX.Element;
+export declare const BlendColor: (props: SkiaProps<BlendColorFilterProps>) => React.JSX.Element;

package/lib/commonjs/renderer/components/colorFilters/Lerp.d.ts

@@ -1,4 +1,4 @@
-/// <reference types="react" />
+import React from "react";
 import type { SkiaProps } from "../../processors/Animations/Animations";
 import type { LerpColorFilterProps } from "../../../dom/types";
-export declare const Lerp: (props: SkiaProps<LerpColorFilterProps>) => JSX.Element;
+export declare const Lerp: (props: SkiaProps<LerpColorFilterProps>) => React.JSX.Element;

package/lib/commonjs/renderer/components/colorFilters/LinearToSRGBGamma.d.ts

@@ -1,4 +1,4 @@
-/// <reference types="react" />
+import React from "react";
 import type { ChildrenProps } from "../../../dom/types";
 import type { SkiaProps } from "../../processors";
-export declare const LinearToSRGBGamma: (props: SkiaProps<ChildrenProps>) => JSX.Element;
+export declare const LinearToSRGBGamma: (props: SkiaProps<ChildrenProps>) => React.JSX.Element;

package/lib/commonjs/renderer/components/colorFilters/LumaColorFilter.d.ts

@@ -1,4 +1,4 @@
-/// <reference types="react" />
+import React from "react";
 import type { ChildrenProps } from "../../../dom/types";
 import type { SkiaProps } from "../../processors/Animations/Animations";
-export declare const LumaColorFilter: (props: SkiaProps<ChildrenProps>) => JSX.Element;
+export declare const LumaColorFilter: (props: SkiaProps<ChildrenProps>) => React.JSX.Element;

package/lib/commonjs/renderer/components/colorFilters/Matrix.d.ts

@@ -1,5 +1,5 @@
-/// <reference types="react" />
+import React from "react";
 import type { SkiaProps } from "../../processors";
 import type { MatrixColorFilterProps } from "../../../dom/types";
-export declare const ColorMatrix: (props: SkiaProps<MatrixColorFilterProps>) => JSX.Element;
+export declare const ColorMatrix: (props: SkiaProps<MatrixColorFilterProps>) => React.JSX.Element;
 export declare const OpacityMatrix: (opacity: number) => number[];

package/lib/commonjs/renderer/components/colorFilters/SRGBToLinearGamma.d.ts

@@ -1,4 +1,4 @@
-/// <reference types="react" />
+import React from "react";
 import type { ChildrenProps } from "../../../dom/types";
 import type { SkiaProps } from "../../processors/Animations/Animations";
-export declare const SRGBToLinearGamma: (props: SkiaProps<ChildrenProps>) => JSX.Element;
+export declare const SRGBToLinearGamma: (props: SkiaProps<ChildrenProps>) => React.JSX.Element;

package/lib/commonjs/renderer/components/image/Image.d.ts

@@ -1,4 +1,4 @@
-/// <reference types="react" />
+import React from "react";
 import type { SkiaProps } from "../../processors";
 import type { ImageProps } from "../../../dom/types";
-export declare const Image: (props: SkiaProps<ImageProps>) => JSX.Element;
+export declare const Image: (props: SkiaProps<ImageProps>) => React.JSX.Element;

package/lib/commonjs/renderer/components/image/ImageSVG.d.ts

@@ -1,4 +1,4 @@
-/// <reference types="react" />
+import React from "react";
 import type { ImageSVGProps } from "../../../dom/types";
 import type { AnimatedProps } from "../../processors";
-export declare const ImageSVG: (props: AnimatedProps<ImageSVGProps>) => JSX.Element;
+export declare const ImageSVG: (props: AnimatedProps<ImageSVGProps>) => React.JSX.Element;

package/lib/commonjs/renderer/components/image/ImageShader.d.ts

@@ -1,4 +1,4 @@
-/// <reference types="react" />
+import React from "react";
 import type { ImageShaderProps } from "../../../dom/types";
 import type { SkiaDefaultProps } from "../../processors";
-export declare const ImageShader: ({ tx, ty, fm, mm, fit, transform, ...props }: SkiaDefaultProps<ImageShaderProps, "tx" | "ty" | "fm" | "mm" | "fit" | "transform">) => JSX.Element;
+export declare const ImageShader: ({ tx, ty, fm, mm, fit, transform, ...props }: SkiaDefaultProps<ImageShaderProps, "tx" | "ty" | "fm" | "mm" | "fit" | "transform">) => React.JSX.Element;

package/lib/commonjs/renderer/components/imageFilters/Blur.d.ts

@@ -1,4 +1,4 @@
-/// <reference types="react" />
+import React from "react";
 import type { SkiaDefaultProps } from "../../processors/Animations/Animations";
 import type { BlurImageFilterProps } from "../../../dom/types";
-export declare const Blur: ({ mode, ...props }: SkiaDefaultProps<BlurImageFilterProps, "mode">) => JSX.Element;
+export declare const Blur: ({ mode, ...props }: SkiaDefaultProps<BlurImageFilterProps, "mode">) => React.JSX.Element;

package/lib/commonjs/renderer/components/imageFilters/DisplacementMap.d.ts

@@ -1,4 +1,4 @@
-/// <reference types="react" />
+import React from "react";
 import type { SkiaProps } from "../../processors";
 import type { DisplacementMapImageFilterProps } from "../../../dom/types";
-export declare const DisplacementMap: (props: SkiaProps<DisplacementMapImageFilterProps>) => JSX.Element;
+export declare const DisplacementMap: (props: SkiaProps<DisplacementMapImageFilterProps>) => React.JSX.Element;

package/lib/commonjs/renderer/components/imageFilters/Morphology.d.ts

@@ -1,4 +1,4 @@
-/// <reference types="react" />
+import React from "react";
 import type { MorphologyImageFilterProps } from "../../../dom/types";
 import type { SkiaDefaultProps } from "../../processors";
-export declare const Morphology: ({ operator, ...props }: SkiaDefaultProps<MorphologyImageFilterProps, "operator">) => JSX.Element;
+export declare const Morphology: ({ operator, ...props }: SkiaDefaultProps<MorphologyImageFilterProps, "operator">) => React.JSX.Element;

package/lib/commonjs/renderer/components/imageFilters/Offset.d.ts

@@ -1,4 +1,4 @@
-/// <reference types="react" />
+import React from "react";
 import type { SkiaDefaultProps } from "../../processors/Animations/Animations";
 import type { OffsetImageFilterProps } from "../../../dom/types";
-export declare const Offset: ({ x, y, ...props }: SkiaDefaultProps<OffsetImageFilterProps, "x" | "y">) => JSX.Element;
+export declare const Offset: ({ x, y, ...props }: SkiaDefaultProps<OffsetImageFilterProps, "x" | "y">) => React.JSX.Element;

package/lib/commonjs/renderer/components/imageFilters/RuntimeShader.d.ts

@@ -1,4 +1,4 @@
-/// <reference types="react" />
+import React from "react";
 import type { SkiaProps } from "../../processors/Animations/Animations";
 import type { RuntimeShaderImageFilterProps } from "../../../dom/types";
-export declare const RuntimeShader: (props: SkiaProps<RuntimeShaderImageFilterProps>) => JSX.Element;
+export declare const RuntimeShader: (props: SkiaProps<RuntimeShaderImageFilterProps>) => React.JSX.Element;

package/lib/commonjs/renderer/components/imageFilters/Shadow.d.ts

@@ -1,4 +1,4 @@
-/// <reference types="react" />
+import React from "react";
 import type { DropShadowImageFilterProps } from "../../../dom/types";
 import type { SkiaProps } from "../../processors/Animations/Animations";
-export declare const Shadow: (props: SkiaProps<DropShadowImageFilterProps>) => JSX.Element;
+export declare const Shadow: (props: SkiaProps<DropShadowImageFilterProps>) => React.JSX.Element;

package/lib/commonjs/renderer/components/maskFilters/Blur.d.ts

@@ -1,4 +1,4 @@
-/// <reference types="react" />
+import React from "react";
 import type { BlurMaskFilterProps } from "../../../dom/types";
 import type { SkiaDefaultProps } from "../../processors/Animations/Animations";
-export declare const BlurMask: ({ style, respectCTM, ...props }: SkiaDefaultProps<BlurMaskFilterProps, "style" | "respectCTM">) => JSX.Element;
+export declare const BlurMask: ({ style, respectCTM, ...props }: SkiaDefaultProps<BlurMaskFilterProps, "style" | "respectCTM">) => React.JSX.Element;

package/lib/commonjs/renderer/components/pathEffects/Corner.d.ts

@@ -1,4 +1,4 @@
-/// <reference types="react" />
+import React from "react";
 import type { CornerPathEffectProps } from "../../../dom/types";
 import type { SkiaProps } from "../../processors";
-export declare const CornerPathEffect: (props: SkiaProps<CornerPathEffectProps>) => JSX.Element;
+export declare const CornerPathEffect: (props: SkiaProps<CornerPathEffectProps>) => React.JSX.Element;

package/lib/commonjs/renderer/components/pathEffects/Dash.d.ts

@@ -1,4 +1,4 @@
-/// <reference types="react" />
+import React from "react";
 import type { DashPathEffectProps } from "../../../dom/types";
 import type { SkiaProps } from "../../processors";
-export declare const DashPathEffect: (props: SkiaProps<DashPathEffectProps>) => JSX.Element;
+export declare const DashPathEffect: (props: SkiaProps<DashPathEffectProps>) => React.JSX.Element;

package/lib/commonjs/renderer/components/pathEffects/Discrete.d.ts

@@ -1,4 +1,4 @@
-/// <reference types="react" />
+import React from "react";
 import type { SkiaDefaultProps } from "../../processors/Animations/Animations";
 import type { DiscretePathEffectProps } from "../../../dom/types";
-export declare const DiscretePathEffect: ({ seed, ...props }: SkiaDefaultProps<DiscretePathEffectProps, "seed">) => JSX.Element;
+export declare const DiscretePathEffect: ({ seed, ...props }: SkiaDefaultProps<DiscretePathEffectProps, "seed">) => React.JSX.Element;

package/lib/commonjs/renderer/components/pathEffects/Line2D.d.ts

@@ -1,4 +1,4 @@
-/// <reference types="react" />
+import React from "react";
 import type { SkiaProps } from "../../processors/Animations/Animations";
 import type { Line2DPathEffectProps } from "../../../dom/types";
-export declare const Line2DPathEffect: (props: SkiaProps<Line2DPathEffectProps>) => JSX.Element;
+export declare const Line2DPathEffect: (props: SkiaProps<Line2DPathEffectProps>) => React.JSX.Element;

package/lib/commonjs/renderer/components/pathEffects/Path1D.d.ts

@@ -1,4 +1,4 @@
-/// <reference types="react" />
+import React from "react";
 import type { SkiaProps } from "../../processors/Animations/Animations";
 import type { Path1DPathEffectProps } from "../../../dom/types";
-export declare const Path1DPathEffect: (props: SkiaProps<Path1DPathEffectProps>) => JSX.Element;
+export declare const Path1DPathEffect: (props: SkiaProps<Path1DPathEffectProps>) => React.JSX.Element;

package/lib/commonjs/renderer/components/pathEffects/Path2D.d.ts

@@ -1,4 +1,4 @@
-/// <reference types="react" />
+import React from "react";
 import type { SkiaProps } from "../../processors/Animations/Animations";
 import type { Path2DPathEffectProps } from "../../../dom/types";
-export declare const Path2DPathEffect: (props: SkiaProps<Path2DPathEffectProps>) => JSX.Element;
+export declare const Path2DPathEffect: (props: SkiaProps<Path2DPathEffectProps>) => React.JSX.Element;

package/lib/commonjs/renderer/components/pathEffects/Sum.d.ts

@@ -1,3 +1,3 @@
-/// <reference types="react" />
+import React from "react";
 import type { ChildrenProps } from "../../../dom/types";
-export declare const SumPathEffect: (props: ChildrenProps) => JSX.Element;
+export declare const SumPathEffect: (props: ChildrenProps) => React.JSX.Element;

package/lib/commonjs/renderer/components/shaders/Color.d.ts

@@ -1,4 +1,4 @@
-/// <reference types="react" />
+import React from "react";
 import type { SkiaProps } from "../../processors";
 import type { ColorProps } from "../../../dom/types";
-export declare const ColorShader: (props: SkiaProps<ColorProps>) => JSX.Element;
+export declare const ColorShader: (props: SkiaProps<ColorProps>) => React.JSX.Element;

package/lib/commonjs/renderer/components/shaders/FractalNoise.d.ts

@@ -1,4 +1,4 @@
-/// <reference types="react" />
+import React from "react";
 import type { FractalNoiseProps } from "../../../dom/types";
 import type { SkiaDefaultProps } from "../../processors/Animations/Animations";
-export declare const FractalNoise: ({ seed, tileWidth, tileHeight, ...props }: SkiaDefaultProps<FractalNoiseProps, "seed" | "tileHeight" | "tileWidth">) => JSX.Element;
+export declare const FractalNoise: ({ seed, tileWidth, tileHeight, ...props }: SkiaDefaultProps<FractalNoiseProps, "seed" | "tileHeight" | "tileWidth">) => React.JSX.Element;

package/lib/commonjs/renderer/components/shaders/LinearGradient.d.ts

@@ -1,4 +1,4 @@
-/// <reference types="react" />
+import React from "react";
 import type { SkiaProps } from "../../processors";
 import type { LinearGradientProps } from "../../../dom/types";
-export declare const LinearGradient: (props: SkiaProps<LinearGradientProps>) => JSX.Element;
+export declare const LinearGradient: (props: SkiaProps<LinearGradientProps>) => React.JSX.Element;

package/lib/commonjs/renderer/components/shaders/RadialGradient.d.ts

@@ -1,4 +1,4 @@
-/// <reference types="react" />
+import React from "react";
 import type { SkiaProps } from "../../processors";
 import type { RadialGradientProps } from "../../../dom/types";
-export declare const RadialGradient: (props: SkiaProps<RadialGradientProps>) => JSX.Element;
+export declare const RadialGradient: (props: SkiaProps<RadialGradientProps>) => React.JSX.Element;

package/lib/commonjs/renderer/components/shaders/Shader.d.ts

@@ -1,4 +1,4 @@
-/// <reference types="react" />
+import React from "react";
 import type { SkiaDefaultProps } from "../../processors";
 import type { ShaderProps } from "../../../dom/types";
-export declare const Shader: ({ uniforms, ...props }: SkiaDefaultProps<ShaderProps, "uniforms">) => JSX.Element;
+export declare const Shader: ({ uniforms, ...props }: SkiaDefaultProps<ShaderProps, "uniforms">) => React.JSX.Element;

package/lib/commonjs/renderer/components/shaders/SweepGradient.d.ts

@@ -1,4 +1,4 @@
-/// <reference types="react" />
+import React from "react";
 import type { SweepGradientProps } from "../../../dom/types";
 import type { SkiaProps } from "../../processors";
-export declare const SweepGradient: (props: SkiaProps<SweepGradientProps>) => JSX.Element;
+export declare const SweepGradient: (props: SkiaProps<SweepGradientProps>) => React.JSX.Element;

package/lib/commonjs/renderer/components/shaders/Turbulence.d.ts

@@ -1,4 +1,4 @@
-/// <reference types="react" />
+import React from "react";
 import type { TurbulenceProps } from "../../../dom/types";
 import type { SkiaDefaultProps } from "../../processors/Animations/Animations";
-export declare const Turbulence: ({ seed, tileWidth, tileHeight, ...props }: SkiaDefaultProps<TurbulenceProps, "seed" | "tileWidth" | "tileHeight">) => JSX.Element;
+export declare const Turbulence: ({ seed, tileWidth, tileHeight, ...props }: SkiaDefaultProps<TurbulenceProps, "seed" | "tileWidth" | "tileHeight">) => React.JSX.Element;

package/lib/commonjs/renderer/components/shaders/TwoPointConicalGradient.d.ts

@@ -1,4 +1,4 @@
-/// <reference types="react" />
+import React from "react";
 import type { TwoPointConicalGradientProps } from "../../../dom/types";
 import type { SkiaProps } from "../../processors";
-export declare const TwoPointConicalGradient: (props: SkiaProps<TwoPointConicalGradientProps>) => JSX.Element;
+export declare const TwoPointConicalGradient: (props: SkiaProps<TwoPointConicalGradientProps>) => React.JSX.Element;

package/lib/commonjs/renderer/components/shapes/Box.d.ts

@@ -1,5 +1,5 @@
-/// <reference types="react" />
+import React from "react";
 import type { BoxProps, BoxShadowProps } from "../../../dom/types";
 import type { SkiaProps } from "../../processors";
-export declare const BoxShadow: (props: SkiaProps<BoxShadowProps>) => JSX.Element;
-export declare const Box: (props: SkiaProps<BoxProps>) => JSX.Element;
+export declare const BoxShadow: (props: SkiaProps<BoxShadowProps>) => React.JSX.Element;
+export declare const Box: (props: SkiaProps<BoxProps>) => React.JSX.Element;

package/lib/commonjs/renderer/components/shapes/Circle.d.ts

@@ -1,4 +1,4 @@
-/// <reference types="react" />
+import React from "react";
 import type { SkiaProps } from "../../processors";
 import type { CircleProps } from "../../../dom/types";
-export declare const Circle: (props: SkiaProps<CircleProps>) => JSX.Element;
+export declare const Circle: (props: SkiaProps<CircleProps>) => React.JSX.Element;

package/lib/commonjs/renderer/components/shapes/DiffRect.d.ts

@@ -1,4 +1,4 @@
-/// <reference types="react" />
+import React from "react";
 import type { SkiaProps } from "../../processors/Animations/Animations";
 import type { DiffRectProps } from "../../../dom/types";
-export declare const DiffRect: (props: SkiaProps<DiffRectProps>) => JSX.Element;
+export declare const DiffRect: (props: SkiaProps<DiffRectProps>) => React.JSX.Element;