@shopify/react-native-skia 0.1.221 → 0.1.223

package/android/cpp/rnskia-android/RNSkAndroidView.h

@@ -56,6 +56,9 @@ public:
   void surfaceSizeChanged(int width, int height) override {
     std::static_pointer_cast<RNSkOpenGLCanvasProvider>(T::getCanvasProvider())
         ->surfaceSizeChanged(width, height);
+    // This is only need for the first time to frame, this renderImmediate call
+    // will invoke updateTexImage for the previous frame
+    RNSkView::renderImmediate();
   }
 
   float getPixelDensity() override {

package/android/cpp/rnskia-android/RNSkOpenGLCanvasProvider.cpp

@@ -39,6 +39,7 @@ bool RNSkOpenGLCanvasProvider::renderToCanvas(
       if (!_surfaceHolder->makeCurrent()) {
         return false;
       }
+      _surfaceHolder->updateTexImage();
 
       // Draw into canvas using callback
       cb(surface->getCanvas());

package/android/cpp/rnskia-android/SkiaOpenGLHelper.h

@@ -187,7 +187,6 @@ public:
         RNSkLogger::logToConsole("eglMakeCurrent failed: %d\n", eglGetError());
         return false;
       }
-      return true;
     }
     return true;
   }

package/android/cpp/rnskia-android/SkiaOpenGLSurfaceFactory.h

@@ -6,6 +6,8 @@
 #include <jni.h>
 
 #include <android/native_window_jni.h>
+#include <android/surface_texture.h>
+#include <android/surface_texture_jni.h>
 #include <condition_variable>
 #include <memory>
 #include <thread>
@@ -42,12 +44,34 @@ public:
  */
 class WindowSurfaceHolder {
 public:
-  WindowSurfaceHolder(jobject surface, int width, int height)
-      : _width(width), _height(height),
-        _window(ANativeWindow_fromSurface(facebook::jni::Environment::current(),
-                                          surface)) {}
+  WindowSurfaceHolder(jobject jSurfaceTexture, int width, int height)
+      : _width(width), _height(height) {
+    JNIEnv *env = facebook::jni::Environment::current();
+    _jSurfaceTexture = env->NewGlobalRef(jSurfaceTexture);
+    jclass surfaceClass = env->FindClass("android/view/Surface");
+    jmethodID surfaceConstructor = env->GetMethodID(
+        surfaceClass, "<init>", "(Landroid/graphics/SurfaceTexture;)V");
+    // Create a new Surface instance
+    jobject jSurface =
+        env->NewObject(surfaceClass, surfaceConstructor, jSurfaceTexture);
+
+    jclass surfaceTextureClass = env->GetObjectClass(_jSurfaceTexture);
+    _updateTexImageMethod =
+        env->GetMethodID(surfaceTextureClass, "updateTexImage", "()V");
+
+    // Acquire the native window from the Surface
+    _window = ANativeWindow_fromSurface(env, jSurface);
+    // Clean up local references
+    env->DeleteLocalRef(jSurface);
+    env->DeleteLocalRef(surfaceClass);
+    env->DeleteLocalRef(surfaceTextureClass);
+  }
 
-  ~WindowSurfaceHolder() { ANativeWindow_release(_window); }
+  ~WindowSurfaceHolder() {
+    JNIEnv *env = facebook::jni::Environment::current();
+    env->DeleteGlobalRef(_jSurfaceTexture);
+    ANativeWindow_release(_window);
+  }
 
   int getWidth() { return _width; }
   int getHeight() { return _height; }
@@ -57,6 +81,20 @@ public:
    */
   sk_sp<SkSurface> getSurface();
 
+  void updateTexImage() {
+    JNIEnv *env = facebook::jni::Environment::current();
+
+    // Call updateTexImage on the SurfaceTexture object
+    env->CallVoidMethod(_jSurfaceTexture, _updateTexImageMethod);
+
+    // Check for exceptions
+    if (env->ExceptionCheck()) {
+      RNSkLogger::logToConsole(
+          "updateTexImage() failed. The exception above can safely be ignored");
+      env->ExceptionClear();
+    }
+  }
+
   /**
    * Resizes the surface
    * @param width
@@ -92,9 +130,11 @@ public:
   }
 
 private:
-  ANativeWindow *_window = nullptr;
+  ANativeWindow *_window;
   sk_sp<SkSurface> _skSurface = nullptr;
+  jobject _jSurfaceTexture = nullptr;
   EGLSurface _glSurface = EGL_NO_SURFACE;
+  jmethodID _updateTexImageMethod = nullptr;
   int _width = 0;
   int _height = 0;
 };

package/android/src/main/java/com/shopify/reactnative/skia/PlatformContext.java

@@ -52,13 +52,13 @@ public class PlatformContext {
         Choreographer.FrameCallback frameCallback = new Choreographer.FrameCallback() {
             @Override
             public void doFrame(long frameTimeNanos) {
+                if (_drawLoopActive) {
+                    Choreographer.getInstance().postFrameCallback(this);
+                }
                 if (_isPaused) {
                     return;
                 }
                 notifyDrawLoop();
-                if (_drawLoopActive) {
-                    postFrameLoop();
-                }
             }
         };
         Choreographer.getInstance().postFrameCallback(frameCallback);

package/android/src/main/java/com/shopify/reactnative/skia/SkiaBaseView.java

@@ -4,16 +4,11 @@ import android.content.Context;
 import android.graphics.SurfaceTexture;
 import android.util.Log;
 import android.view.MotionEvent;
-import android.view.Surface;
 import android.view.TextureView;
 
-import com.facebook.jni.annotations.DoNotStrip;
 import com.facebook.react.views.view.ReactViewGroup;
 
 public abstract class SkiaBaseView extends ReactViewGroup implements TextureView.SurfaceTextureListener {
-
-    @DoNotStrip
-    private Surface mSurface;
     private TextureView mTexture;
 
     private String tag = "SkiaView";
@@ -30,12 +25,8 @@ public abstract class SkiaBaseView extends ReactViewGroup implements TextureView
     }
 
     public void destroySurface() {
-        if (mSurface != null) {
-            Log.i(tag, "destroySurface");
-            surfaceDestroyed();
-            mSurface.release();
-            mSurface = null;
-        }
+        Log.i(tag, "destroySurface");
+        surfaceDestroyed();
     }
 
     private void createSurfaceTexture() {
@@ -138,8 +129,7 @@ public abstract class SkiaBaseView extends ReactViewGroup implements TextureView
     @Override
     public void onSurfaceTextureAvailable(SurfaceTexture surface, int width, int height) {
         Log.i(tag, "onSurfaceTextureAvailable " + width + "/" + height);
-        mSurface = new Surface(surface);
-        surfaceAvailable(mSurface, width, height);
+        surfaceAvailable(surface, width, height);
     }
 
     @Override
@@ -153,6 +143,10 @@ public abstract class SkiaBaseView extends ReactViewGroup implements TextureView
         Log.i(tag, "onSurfaceTextureDestroyed");
         // https://developer.android.com/reference/android/view/TextureView.SurfaceTextureListener#onSurfaceTextureDestroyed(android.graphics.SurfaceTexture)
         destroySurface();
+        // Because of React Native Screens (which dettach the view), we always keep the surface alive.
+        // If not, Texture view will recreate the texture surface by itself and
+        // we will lose the fast first time to frame.
+        // We only delete the surface when the view is dropped (destroySurface invoked by SkiaBaseViewManager);
         createSurfaceTexture();
         return false;
     }
@@ -181,4 +175,4 @@ public abstract class SkiaBaseView extends ReactViewGroup implements TextureView
     protected abstract void registerView(int nativeId);
 
     protected abstract void unregisterView();
-}
+}

package/android/src/main/java/com/shopify/reactnative/skia/ViewScreenshotService.java

@@ -1,11 +1,10 @@
 package com.shopify.reactnative.skia;
 
-import static android.view.View.VISIBLE;
-
 import android.graphics.Bitmap;
 import android.graphics.Canvas;
 import android.graphics.Matrix;
 import android.graphics.Paint;
+import android.graphics.drawable.Drawable;
 import android.os.Build;
 import android.os.Handler;
 import android.os.Looper;
@@ -15,14 +14,12 @@ import android.view.SurfaceView;
 import android.view.TextureView;
 import android.view.View;
 import android.view.ViewGroup;
-
 import androidx.annotation.NonNull;
-
 import com.facebook.react.bridge.ReactContext;
 import com.facebook.react.uimanager.UIManagerModule;
+import com.facebook.react.views.view.ReactViewGroup;
 
-import java.util.ArrayList;
-import java.util.List;
+import java.lang.reflect.Method;
 import java.util.concurrent.CountDownLatch;
 import java.util.concurrent.TimeUnit;
 
@@ -42,143 +39,134 @@ public class ViewScreenshotService {
             return null;
         }
 
-        // Measure and get size of view
         int width = view.getWidth();
         int height = view.getHeight();
-
         if (width <= 0 || height <= 0) {
             return null;
         }
 
-        // The following code is taken from react-native-view-shot to be able to handle and
-        // correctly render all kinds of views, also including TextureViews and SurfaceViews
         Bitmap bitmap = Bitmap.createBitmap(width, height, Bitmap.Config.ARGB_8888);
+        final Canvas canvas = new Canvas(bitmap);
+        final Paint paint = createPaint();
+
+        canvas.save();
+        canvas.translate(-view.getLeft(), -view.getTop());
+        renderViewToCanvas(canvas, view, paint, 1.0f); // Initial opacity
+        canvas.restore();
+
+        return bitmap;
+    }
 
+    private static Paint createPaint() {
         final Paint paint = new Paint();
         paint.setAntiAlias(true);
         paint.setFilterBitmap(true);
         paint.setDither(true);
-
-        // Render the main view and its children
-        final Canvas canvas = new Canvas(bitmap);
-
-        // Renders view with child views to canvas
-        renderViewToCanvas(canvas, view, paint);
-
-        return bitmap;
+        return paint;
     }
 
-    private static void renderViewToCanvas(Canvas canvas, View view, Paint paint) {
-        // Apply transformations for the current view
+    private static void renderViewToCanvas(Canvas canvas, View view, Paint paint, float parentOpacity) {
+        float combinedOpacity = parentOpacity * view.getAlpha();
         canvas.save();
         applyTransformations(canvas, view);
 
-        // Draw children if the view has children
-        if ((view instanceof ViewGroup)) {
-            // Draw children
+        if (view instanceof ViewGroup) {
             ViewGroup group = (ViewGroup) view;
+            drawBackgroundIfPresent(canvas, view, combinedOpacity);
+            drawChildren(canvas, group, paint, combinedOpacity);
+        } else {
+            drawView(canvas, view, paint, combinedOpacity);
+        }
 
-            // Hide visible children - this needs to be done because view.draw(canvas)
-            // will render all visible non-texture/surface views directly - causing
-            // views to be rendered twice - once by view.draw() and once when we
-            // enumerate children. We therefore need to turn off rendering of visible
-            // children before we call view.draw:
-            List<View> visibleChildren = new ArrayList<>();
-            for (int i = 0; i < group.getChildCount(); i++) {
-                View child = group.getChildAt(i);
-                if (child.getVisibility() == VISIBLE) {
-                    visibleChildren.add(child);
-                    child.setVisibility(View.INVISIBLE);
-                }
-            }
+        canvas.restore();
+    }
 
-            // Draw ourselves
-            canvas.saveLayerAlpha(null, Math.round(view.getAlpha() * 255));
-            view.draw(canvas);
+    private static void drawBackgroundIfPresent(Canvas canvas, View view, float opacity) {
+        Drawable bg = view.getBackground();
+        if (bg != null) {
+            canvas.saveLayerAlpha(null, Math.round(opacity * 255));
+            bg.draw(canvas);
             canvas.restore();
+        }
+    }
 
-            // Enable children again
-            for (int i = 0; i < visibleChildren.size(); i++) {
-                View child = visibleChildren.get(i);
-                child.setVisibility(VISIBLE);
+    private static void drawChildren(Canvas canvas, ViewGroup group, Paint paint, float parentOpacity) {
+        // Handle clipping for ReactViewGroup
+        if (group instanceof ReactViewGroup) {
+            try {
+                Class[] cArg = new Class[1];
+                cArg[0] = Canvas.class;
+                Method method = ReactViewGroup.class.getDeclaredMethod("dispatchOverflowDraw", cArg);
+                method.setAccessible(true);
+                method.invoke(group, canvas);
+            } catch (Exception e) {
+                Log.e(TAG, "couldn't invoke dispatchOverflowDraw() on ReactViewGroup", e);
             }
+        }
+        for (int i = 0; i < group.getChildCount(); i++) {
+            View child = group.getChildAt(i);
+            if (child.getVisibility() != View.VISIBLE) continue;
+
+            if (child instanceof TextureView) {
+                drawTextureView(canvas, (TextureView) child, paint, parentOpacity);
+            } else if (child instanceof SurfaceView) {
+                drawSurfaceView(canvas, (SurfaceView) child, paint, parentOpacity);
+            } else {
+                renderViewToCanvas(canvas, child, paint, parentOpacity);
+            }
+        }
+    }
 
-            // Draw children
-            for (int i = 0; i < group.getChildCount(); i++) {
-                View child = group.getChildAt(i);
-
-                // skip all invisible to user child views
-                if (child.getVisibility() != VISIBLE) continue;
+    private static void drawView(Canvas canvas, View view, Paint paint, float opacity) {
+        canvas.saveLayerAlpha(null, Math.round(opacity * 255));
+        view.draw(canvas);
+        canvas.restore();
+    }
 
-                // skip any child that we don't know how to process
-                if (child instanceof TextureView) {
-                    final TextureView tvChild = (TextureView) child;
-                    tvChild.setOpaque(false); // <-- switch off background fill
+    private static void drawTextureView(Canvas canvas, TextureView tv, Paint paint, float opacity) {
+        tv.setOpaque(false);
+        Bitmap childBitmapBuffer = tv.getBitmap(Bitmap.createBitmap(tv.getWidth(), tv.getHeight(), Bitmap.Config.ARGB_8888));
+        canvas.save();
+        applyTransformations(canvas, tv);
+        paint.setAlpha(Math.round(opacity * 255)); // Set paint alpha based on opacity
+        canvas.drawBitmap(childBitmapBuffer, 0, 0, paint);
+        canvas.restore();
+    }
 
+    private static void drawSurfaceView(Canvas canvas, SurfaceView sv, Paint paint, float opacity) {
+        final CountDownLatch latch = new CountDownLatch(1);
+        if (Build.VERSION.SDK_INT >= Build.VERSION_CODES.N) {
+            Bitmap childBitmapBuffer = Bitmap.createBitmap(sv.getWidth(), sv.getHeight(), Bitmap.Config.ARGB_8888);
+            try {
+                PixelCopy.request(sv, childBitmapBuffer, copyResult -> {
                     canvas.save();
-                    applyTransformations(canvas, child);
-
-                    // TextureView should use bitmaps with matching size,
-                    // otherwise content of the TextureView will be scaled to provided bitmap dimensions
-                    final Bitmap childBitmapBuffer = tvChild.getBitmap(Bitmap.createBitmap(child.getWidth(), child.getHeight(), Bitmap.Config.ARGB_8888));
+                    applyTransformations(canvas, sv);
+                    paint.setAlpha(Math.round(opacity * 255)); // Set paint alpha based on opacity
                     canvas.drawBitmap(childBitmapBuffer, 0, 0, paint);
-
                     canvas.restore();
-
-                } else if (child instanceof SurfaceView) {
-                    final SurfaceView svChild = (SurfaceView) child;
-                    final CountDownLatch latch = new CountDownLatch(1);
-
-                    if (Build.VERSION.SDK_INT >= Build.VERSION_CODES.N) {
-                        final Bitmap childBitmapBuffer = Bitmap.createBitmap(child.getWidth(), child.getHeight(), Bitmap.Config.ARGB_8888);
-                        try {
-                            PixelCopy.request(svChild, childBitmapBuffer, copyResult -> {
-                                canvas.save();
-                                applyTransformations(canvas, child);
-                                canvas.drawBitmap(childBitmapBuffer, 0, 0, paint);
-                                canvas.restore();
-                                latch.countDown();
-                            }, new Handler(Looper.getMainLooper()));
-                            latch.await(SURFACE_VIEW_READ_PIXELS_TIMEOUT, TimeUnit.SECONDS);
-                        } catch (Exception e) {
-                            Log.e(TAG, "Cannot PixelCopy for " + svChild, e);
-                        }
-                    } else {
-                        Bitmap cache = svChild.getDrawingCache();
-                        if (cache != null) {
-                            canvas.save();
-                            applyTransformations(canvas, child);
-                            canvas.drawBitmap(svChild.getDrawingCache(), 0, 0, paint);
-                            canvas.restore();
-                        }
-                    }
-                } else {
-                    // Regular views needs to be rendered again to ensure correct z-index
-                    // order with texture views and surface views.
-                    renderViewToCanvas(canvas, child, paint);
-                }
+                    latch.countDown();
+                }, new Handler(Looper.getMainLooper()));
+                latch.await(SURFACE_VIEW_READ_PIXELS_TIMEOUT, TimeUnit.SECONDS);
+            } catch (Exception e) {
+                Log.e(TAG, "Cannot PixelCopy for " + sv, e);
             }
         } else {
-            // Draw ourselves
-            view.draw(canvas);
+            Bitmap cache = sv.getDrawingCache();
+            if (cache != null) {
+                canvas.save();
+                applyTransformations(canvas, sv);
+                paint.setAlpha(Math.round(opacity * 255)); // Set paint alpha based on opacity
+                canvas.drawBitmap(cache, 0, 0, paint);
+                canvas.restore();
+            }
         }
-
-        // Restore canvas
-        canvas.restore();
     }
 
     @NonNull
     private static void applyTransformations(final Canvas c, @NonNull final View view) {
-        // Get the transformation matrix of the view
         final Matrix matrix = view.getMatrix();
-
-        // Create a new matrix for translation
         final Matrix translateMatrix = new Matrix();
-        final float dx = view.getLeft() + view.getPaddingLeft();
-        final float dy = view.getTop() + view.getPaddingTop();
-        translateMatrix.setTranslate(dx, dy);
-
-        // Pre-concatenate the current matrix of the canvas with the translation and transformation matrices of the view
+        translateMatrix.setTranslate(view.getLeft() + view.getPaddingLeft(), view.getTop() + view.getPaddingTop());
         c.concat(translateMatrix);
         c.concat(matrix);
     }

package/cpp/api/JsiSkApi.h

@@ -24,6 +24,7 @@
 #include "JsiSkMaskFilterFactory.h"
 #include "JsiSkMatrix.h"
 #include "JsiSkPaint.h"
+#include "JsiSkParagraphBuilder.h"
 #include "JsiSkPath.h"
 #include "JsiSkPathEffect.h"
 #include "JsiSkPathEffectFactory.h"
@@ -112,6 +113,10 @@ public:
     installReadonlyProperty(
         "TypefaceFontProvider",
         std::make_shared<JsiSkTypefaceFontProviderFactory>(context));
+
+    installReadonlyProperty(
+        "ParagraphBuilder",
+        std::make_shared<JsiSkParagraphBuilderFactory>(context));
   }
 };
 } // namespace RNSkia

package/cpp/api/JsiSkFontMgrFactory.h

@@ -22,13 +22,18 @@ namespace jsi = facebook::jsi;
 
 class JsiSkFontMgrFactory : public JsiSkHostObject {
 public:
-  JSI_HOST_FUNCTION(System) {
-    auto context = getContext();
+  static sk_sp<SkFontMgr>
+  getFontMgr(std::shared_ptr<RNSkPlatformContext> context) {
     static SkOnce once;
     static sk_sp<SkFontMgr> fontMgr;
-    once([&context, &runtime] { fontMgr = context->createFontMgr(); });
+    once([&context] { fontMgr = context->createFontMgr(); });
+    return fontMgr;
+  }
+
+  JSI_HOST_FUNCTION(System) {
+    auto fontMgr = JsiSkFontMgrFactory::getFontMgr(getContext());
     return jsi::Object::createFromHostObject(
-        runtime, std::make_shared<JsiSkFontMgr>(std::move(context), fontMgr));
+        runtime, std::make_shared<JsiSkFontMgr>(getContext(), fontMgr));
   }
 
   JSI_EXPORT_FUNCTIONS(JSI_EXPORT_FUNC(JsiSkFontMgrFactory, System))

package/cpp/api/JsiSkParagraph.h

@@ -0,0 +1,135 @@
+#pragma once
+
+#include <memory>
+#include <string>
+#include <utility>
+#include <vector>
+
+#include <jsi/jsi.h>
+
+#include <JsiSkCanvas.h>
+#include <JsiSkHostObjects.h>
+#include <JsiSkPath.h>
+#include <JsiSkRect.h>
+
+#pragma clang diagnostic push
+#pragma clang diagnostic ignored "-Wdocumentation"
+
+#include "Paragraph.h"
+#include "ParagraphBuilder.h"
+#include "ParagraphStyle.h"
+
+#pragma clang diagnostic pop
+
+namespace RNSkia {
+
+namespace jsi = facebook::jsi;
+
+namespace para = skia::textlayout;
+
+/**
+ Implementation of the Paragraph object in JSI
+ */
+class JsiSkParagraph : public JsiSkHostObject {
+public:
+  JSI_HOST_FUNCTION(layout) {
+    auto width = getArgumentAsNumber(runtime, arguments, count, 0);
+    _paragraph->layout(width);
+    return jsi::Value::undefined();
+  }
+
+  JSI_HOST_FUNCTION(paint) {
+    auto jsiCanvas =
+        getArgumentAsHostObject<JsiSkCanvas>(runtime, arguments, count, 0);
+    auto x = getArgumentAsNumber(runtime, arguments, count, 1);
+    auto y = getArgumentAsNumber(runtime, arguments, count, 2);
+    _paragraph->paint(jsiCanvas->getCanvas(), x, y);
+    return jsi::Value::undefined();
+  }
+
+  JSI_HOST_FUNCTION(getHeight) {
+    return static_cast<double>(_paragraph->getHeight());
+  }
+
+  JSI_HOST_FUNCTION(getMaxWidth) {
+    return static_cast<double>(_paragraph->getMaxWidth());
+  }
+
+  JSI_HOST_FUNCTION(getGlyphPositionAtCoordinate) {
+    auto dx = getArgumentAsNumber(runtime, arguments, count, 0);
+    auto dy = getArgumentAsNumber(runtime, arguments, count, 1);
+    auto result = _paragraph->getGlyphPositionAtCoordinate(dx, dy);
+    return result.position;
+  }
+
+  JSI_HOST_FUNCTION(getRectsForRange) {
+    auto start = getArgumentAsNumber(runtime, arguments, count, 0);
+    auto end = getArgumentAsNumber(runtime, arguments, count, 1);
+    auto result =
+        _paragraph->getRectsForRange(start, end, para::RectHeightStyle::kTight,
+                                     para::RectWidthStyle::kTight);
+    auto returnValue = jsi::Array(runtime, result.size());
+    for (size_t i = 0; i < result.size(); ++i) {
+      returnValue.setValueAtIndex(
+          runtime, i,
+          JsiSkRect::toValue(runtime, getContext(), result[i].rect));
+    }
+    return returnValue;
+  }
+
+  JSI_HOST_FUNCTION(getLineMetrics) {
+    std::vector<para::LineMetrics> metrics;
+    _paragraph->getLineMetrics(metrics);
+    auto returnValue = jsi::Array(runtime, metrics.size());
+    auto height = 0;
+    for (size_t i = 0; i < metrics.size(); ++i) {
+      returnValue.setValueAtIndex(
+          runtime, i,
+          JsiSkRect::toValue(runtime, getContext(),
+                             SkRect::MakeXYWH(metrics[i].fLeft, height,
+                                              metrics[i].fWidth,
+                                              metrics[i].fHeight)));
+      height += metrics[i].fHeight;
+    }
+    return returnValue;
+  }
+
+  JSI_HOST_FUNCTION(getRectsForPlaceholders) {
+    std::vector<para::TextBox> placeholderInfos =
+        _paragraph->getRectsForPlaceholders();
+    auto returnValue = jsi::Array(runtime, placeholderInfos.size());
+    for (size_t i = 0; i < placeholderInfos.size(); ++i) {
+      auto obj = jsi::Object(runtime);
+      obj.setProperty(
+          runtime, "rect",
+          JsiSkRect::toValue(runtime, getContext(), placeholderInfos[i].rect));
+      obj.setProperty(runtime, "direction",
+                      static_cast<double>(placeholderInfos[i].direction));
+      returnValue.setValueAtIndex(runtime, i, obj);
+    }
+    return returnValue;
+  }
+
+  JSI_EXPORT_FUNCTIONS(JSI_EXPORT_FUNC(JsiSkParagraph, layout),
+                       JSI_EXPORT_FUNC(JsiSkParagraph, paint),
+                       JSI_EXPORT_FUNC(JsiSkParagraph, getMaxWidth),
+                       JSI_EXPORT_FUNC(JsiSkParagraph, getHeight),
+                       JSI_EXPORT_FUNC(JsiSkParagraph, getRectsForPlaceholders),
+                       JSI_EXPORT_FUNC(JsiSkParagraph,
+                                       getGlyphPositionAtCoordinate),
+                       JSI_EXPORT_FUNC(JsiSkParagraph, getRectsForRange),
+                       JSI_EXPORT_FUNC(JsiSkParagraph, getLineMetrics))
+
+  explicit JsiSkParagraph(std::shared_ptr<RNSkPlatformContext> context,
+                          para::ParagraphBuilder *paragraphBuilder)
+      : JsiSkHostObject(std::move(context)) {
+    _paragraph = paragraphBuilder->Build();
+  }
+
+  para::Paragraph *getParagraph() { return _paragraph.get(); }
+
+private:
+  std::unique_ptr<para::Paragraph> _paragraph;
+};
+
+} // namespace RNSkia