Remove usePaintRef deprecation (#1005)

Author: wcandillon

docs/docs/paint/overview.md

@@ -143,4 +143,4 @@ export const PaintDemo = () => {
 };
 ```
 
-<img src={require("/static/img/paint/assignement.png").default} width="256" height="256" />
+<img src={require("/static/img/paint/assignement.png").default} width="256" height="256" />

package/src/dom/nodes/DrawingNode.ts

@@ -9,7 +9,7 @@ import type {
 import type { NodeContext } from "./Node";
 import { JsiDeclarationNode } from "./Node";
 import { PaintNode } from "./PaintNode";
-import { isSkPaint, JsiRenderNode } from "./RenderNode";
+import { JsiRenderNode } from "./RenderNode";
 
 export abstract class JsiDrawingNode<P extends DrawingNodeProps, C>
   extends JsiRenderNode<P>
@@ -52,10 +52,8 @@ export abstract class JsiDrawingNode<P extends DrawingNodeProps, C>
   }
 
   renderNode(ctx: DrawingContext): void {
-    if (this.props.paint && isSkPaint(this.props.paint)) {
+    if (this.props.paint) {
       this.draw({ ...ctx, paint: this.props.paint });
-    } else if (this.props.paint && this.props.paint.current != null) {
-      this.draw({ ...ctx, paint: this.props.paint.current.materialize() });
     } else {
       this.draw(ctx);
     }

package/src/dom/nodes/RenderNode.ts

@@ -1,5 +1,3 @@
-import type { RefObject } from "react";
-
 import type {
   SkMatrix,
   SkRect,
@@ -21,7 +19,6 @@ import type {
   DrawingContext,
   NodeType,
   Node,
-  DeclarationNode,
 } from "../types";
 
 import { isPathDef, processPath, processTransformProps } from "./datatypes";
@@ -236,17 +233,12 @@ export abstract class JsiRenderNode<P extends GroupProps>
       this.clipRRect !== undefined;
     const shouldSave = hasTransform || hasClip || !!layer;
     const op = invertClip ? ClipOp.Difference : ClipOp.Intersect;
-
     if (shouldSave) {
       if (layer) {
         if (typeof layer === "boolean") {
           canvas.saveLayer();
-        } else if (isSkPaint(layer)) {
-          canvas.saveLayer(layer);
         } else {
-          canvas.saveLayer(
-            layer.current ? layer.current.materialize() : undefined
-          );
+          canvas.saveLayer(layer);
         }
       } else {
         canvas.save();
@@ -274,10 +266,6 @@ export abstract class JsiRenderNode<P extends GroupProps>
   abstract renderNode(ctx: DrawingContext): void;
 }
 
-export const isSkPaint = (
-  obj: RefObject<DeclarationNode<unknown, SkPaint>> | SkPaint
-): obj is SkPaint => "__typename__" in obj && obj.__typename__ === "Paint";
-
 const concatPaint = (
   parent: SkPaint,
   {

package/src/dom/types/Common.ts

@@ -1,4 +1,4 @@
-import type { ReactNode, RefObject } from "react";
+import type { ReactNode } from "react";
 
 import type {
   BlendMode,
@@ -15,8 +15,6 @@ import type {
   Vector,
 } from "../../skia/types";
 
-import type { DeclarationNode } from "./Node";
-
 export type SkEnum<T> = Uncapitalize<keyof T extends string ? keyof T : never>;
 
 export type PathDef = string | SkPath;
@@ -86,5 +84,5 @@ export interface PaintProps extends ChildrenProps {
 export interface GroupProps extends PaintProps, TransformProps {
   clip?: ClipDef;
   invertClip?: boolean;
-  layer?: RefObject<DeclarationNode<unknown, SkPaint>> | SkPaint | boolean;
+  layer?: SkPaint | boolean;
 }

package/src/dom/types/Drawings.ts

@@ -1,5 +1,3 @@
-import type { RefObject } from "react";
-
 import type {
   FillType,
   SkImage,
@@ -29,10 +27,9 @@ import type {
   SkEnum,
 } from "./Common";
 import type { DrawingContext } from "./DrawingContext";
-import type { DeclarationNode } from "./Node";
 
 export interface DrawingNodeProps extends GroupProps {
-  paint?: SkPaint | RefObject<DeclarationNode<unknown, SkPaint>>;
+  paint?: SkPaint;
 }
 
 export type ImageProps = DrawingNodeProps &

package/src/renderer/HostComponents.ts

@@ -1,5 +1,3 @@
-import type { ForwardedRef } from "react";
-
 import { NodeType } from "../dom/types";
 import type {
   CircleProps,
@@ -55,7 +53,6 @@ import type {
   BlendProps,
   MorphologyImageFilterProps,
 } from "../dom/types/ImageFilters";
-import type { PaintNode } from "../dom/nodes/PaintNode";
 
 import type { Container } from "./Container";
 import { exhaustiveCheck } from "./typeddash";
@@ -67,7 +64,7 @@ declare global {
     interface IntrinsicElements {
       skGroup: SkiaProps<GroupProps>;
       skLayer: SkiaProps<ChildrenProps>;
-      skPaint: SkiaProps<PaintProps> & { ref: ForwardedRef<PaintNode> };
+      skPaint: SkiaProps<PaintProps>;
 
       // Drawings
       skFill: SkiaProps<DrawingNodeProps>;

package/src/renderer/components/Paint.tsx

@@ -1,19 +1,8 @@
-/* eslint-disable max-len */
-import React, { useRef, forwardRef } from "react";
+import React from "react";
 
 import type { SkiaProps } from "../processors";
 import type { DrawingNodeProps } from "../../dom/types";
-import type { PaintNode } from "../../dom/nodes/PaintNode";
 
-export const usePaintRef = () => {
-  console.log(`usePaintRef() is now deprecated.
-If you are using the layer property, simply pass the component directly: https://shopify.github.io/react-native-skia/docs/group#layer-effects.
-If you are using the paint property, please the following paint properties directly: https://shopify.github.io/react-native-skia/docs/paint/overview`);
-  return useRef<PaintNode>(null);
+export const Paint = (props: SkiaProps<DrawingNodeProps>) => {
+  return <skPaint {...props} />;
 };
-
-export const Paint = forwardRef<PaintNode, SkiaProps<DrawingNodeProps>>(
-  (props, ref) => {
-    return <skPaint ref={ref} {...props} />;
-  }
-);