@shopify/react-native-skia 2.4.15 → 2.4.17

package/cpp/rnskia/RNDawnContext.h

@@ -174,6 +174,120 @@ public:
     return surface;
   }
 
+  // Get the wgpu::Instance for WebGPU bindings
+  wgpu::Instance getWGPUInstance() {
+    return wgpu::Instance(instance->Get());
+  }
+
+  // Get the wgpu::Device for WebGPU bindings
+  wgpu::Device getWGPUDevice() {
+    return backendContext.fDevice;
+  }
+
+  // Create an SkImage from a WebGPU texture
+  // The texture must have TextureBinding usage
+  sk_sp<SkImage> MakeImageFromTexture(wgpu::Texture texture, int width,
+                                      int height,
+                                      wgpu::TextureFormat format) {
+    if (!texture) {
+      return nullptr;
+    }
+
+    // Map WebGPU format to Skia color type
+    SkColorType colorType;
+    switch (format) {
+    case wgpu::TextureFormat::RGBA8Unorm:
+      colorType = kRGBA_8888_SkColorType;
+      break;
+    case wgpu::TextureFormat::BGRA8Unorm:
+      colorType = kBGRA_8888_SkColorType;
+      break;
+    case wgpu::TextureFormat::RGBA16Float:
+      colorType = kRGBA_F16_SkColorType;
+      break;
+    case wgpu::TextureFormat::R8Unorm:
+      colorType = kGray_8_SkColorType;
+      break;
+    default:
+      // Use preferred color type for unsupported formats
+      colorType = DawnUtils::PreferedColorType;
+      break;
+    }
+
+    skgpu::graphite::BackendTexture backendTexture =
+        skgpu::graphite::BackendTextures::MakeDawn(texture.Get());
+
+    // Wrap the texture - we use a release proc that adds a reference to the
+    // texture to prevent it from being destroyed while the SkImage is alive
+    struct TextureRef {
+      wgpu::Texture texture;
+    };
+    auto textureRef = new TextureRef{texture};
+
+    return SkImages::WrapTexture(
+        getRecorder(), backendTexture, colorType, kPremul_SkAlphaType, nullptr,
+        [](void *context) {
+          auto ref = static_cast<TextureRef *>(context);
+          delete ref;
+        },
+        textureRef);
+  }
+
+  // Create a WebGPU texture from an SkImage
+  // Returns a texture with CopySrc and TextureBinding usage
+  wgpu::Texture MakeTextureFromImage(sk_sp<SkImage> image) {
+    if (!image) {
+      return nullptr;
+    }
+
+    int width = image->width();
+    int height = image->height();
+
+    // Create a texture with the appropriate format
+    wgpu::TextureDescriptor textureDesc;
+    textureDesc.label = "SkImage Texture";
+    textureDesc.size = {static_cast<uint32_t>(width),
+                        static_cast<uint32_t>(height), 1};
+    textureDesc.format = DawnUtils::PreferredTextureFormat;
+    textureDesc.usage = wgpu::TextureUsage::CopyDst |
+                        wgpu::TextureUsage::CopySrc |
+                        wgpu::TextureUsage::TextureBinding |
+                        wgpu::TextureUsage::RenderAttachment;
+    textureDesc.dimension = wgpu::TextureDimension::e2D;
+    textureDesc.mipLevelCount = 1;
+    textureDesc.sampleCount = 1;
+
+    wgpu::Texture texture = backendContext.fDevice.CreateTexture(&textureDesc);
+    if (!texture) {
+      return nullptr;
+    }
+
+    // Create a surface backed by this texture
+    skgpu::graphite::BackendTexture backendTexture =
+        skgpu::graphite::BackendTextures::MakeDawn(texture.Get());
+
+    sk_sp<SkSurface> surface = SkSurfaces::WrapBackendTexture(
+        getRecorder(), backendTexture, DawnUtils::PreferedColorType,
+        nullptr,  // colorspace
+        nullptr); // surfaceProps
+
+    if (!surface) {
+      return nullptr;
+    }
+
+    // Draw the image onto the surface
+    SkCanvas *canvas = surface->getCanvas();
+    canvas->drawImage(image, 0, 0);
+
+    // Flush the surface to ensure the image is rendered
+    auto recording = getRecorder()->snap();
+    if (recording) {
+      submitRecording(recording.get(), skgpu::graphite::SyncToCpu::kYes);
+    }
+
+    return texture;
+  }
+
   // Create onscreen surface with window
   std::unique_ptr<WindowContext> MakeWindow(void *window, int width,
                                             int height) {

package/cpp/rnskia/RNSkManager.cpp

@@ -11,6 +11,16 @@
 
 #include "RuntimeAwareCache.h"
 
+#ifdef SK_GRAPHITE
+#include "RNDawnContext.h"
+#include "rnwgpu/api/GPU.h"
+#include "rnwgpu/api/descriptors/GPUBufferUsage.h"
+#include "rnwgpu/api/descriptors/GPUColorWrite.h"
+#include "rnwgpu/api/descriptors/GPUMapMode.h"
+#include "rnwgpu/api/descriptors/GPUShaderStage.h"
+#include "rnwgpu/api/descriptors/GPUTextureUsage.h"
+#endif
+
 namespace RNSkia {
 namespace jsi = facebook::jsi;
 
@@ -22,7 +32,7 @@ RNSkManager::RNSkManager(
       _jsCallInvoker(jsCallInvoker),
       _viewApi(std::make_shared<RNSkJsiViewApi>(platformContext)) {
 
-  // Register main runtime
+  // Register main runtime (used by both Skia and WebGPU bindings)
   RNJsi::BaseRuntimeAwareCache::setMainJsRuntime(_jsRuntime);
 
   // Install bindings
@@ -61,5 +71,35 @@ void RNSkManager::installBindings() {
   _jsRuntime->global().setProperty(
       *_jsRuntime, "SkiaViewApi",
       jsi::Object::createFromHostObject(*_jsRuntime, _viewApi));
+
+#ifdef SK_GRAPHITE
+  // Install WebGPU GPU constructor
+  rnwgpu::GPU::installConstructor(*_jsRuntime);
+  // Create and expose navigator.gpu using DawnContext's instance
+  auto &dawnContext = DawnContext::getInstance();
+  auto gpu = std::make_shared<rnwgpu::GPU>(*_jsRuntime, dawnContext.getWGPUInstance());
+  auto navigatorValue = _jsRuntime->global().getProperty(*_jsRuntime, "navigator");
+  if (navigatorValue.isObject()) {
+    auto navigator = navigatorValue.asObject(*_jsRuntime);
+    navigator.setProperty(*_jsRuntime, "gpu", rnwgpu::GPU::create(*_jsRuntime, gpu));
+  } else {
+    // Create navigator object if it doesn't exist
+    jsi::Object navigator(*_jsRuntime);
+    navigator.setProperty(*_jsRuntime, "gpu", rnwgpu::GPU::create(*_jsRuntime, gpu));
+    _jsRuntime->global().setProperty(*_jsRuntime, "navigator", std::move(navigator));
+  }
+
+  // Install WebGPU constant objects as plain JS objects
+  _jsRuntime->global().setProperty(*_jsRuntime, "GPUBufferUsage",
+                                   rnwgpu::GPUBufferUsage::create(*_jsRuntime));
+  _jsRuntime->global().setProperty(*_jsRuntime, "GPUColorWrite",
+                                   rnwgpu::GPUColorWrite::create(*_jsRuntime));
+  _jsRuntime->global().setProperty(*_jsRuntime, "GPUMapMode",
+                                   rnwgpu::GPUMapMode::create(*_jsRuntime));
+  _jsRuntime->global().setProperty(*_jsRuntime, "GPUShaderStage",
+                                   rnwgpu::GPUShaderStage::create(*_jsRuntime));
+  _jsRuntime->global().setProperty(*_jsRuntime, "GPUTextureUsage",
+                                   rnwgpu::GPUTextureUsage::create(*_jsRuntime));
+#endif
 }
 } // namespace RNSkia

package/cpp/rnwgpu/ArrayBuffer.h

@@ -0,0 +1,68 @@
+#pragma once
+#include <jsi/jsi.h>
+
+#include <memory>
+
+#include "jsi2/JSIConverter.h"
+
+namespace rnwgpu {
+
+namespace jsi = facebook::jsi;
+
+struct ArrayBuffer : jsi::MutableBuffer {
+  ArrayBuffer(void *data, size_t size, size_t bytesPerElement)
+      : _data(data), _size(size), _bytesPerElement(bytesPerElement) {}
+
+  ~ArrayBuffer() override {}
+
+  size_t size() const override { return _size; }
+
+  uint8_t *data() override { return static_cast<uint8_t *>(_data); }
+
+  void *_data;
+  size_t _size;
+  size_t _bytesPerElement;
+};
+
+static std::shared_ptr<ArrayBuffer>
+createArrayBufferFromJSI(jsi::Runtime &runtime,
+                         const jsi::ArrayBuffer &arrayBuffer,
+                         size_t bytesPerElement) {
+  auto size = arrayBuffer.size(runtime);
+  return std::make_shared<ArrayBuffer>(arrayBuffer.data(runtime), size,
+                                       bytesPerElement);
+}
+
+template <> struct JSIConverter<std::shared_ptr<ArrayBuffer>> {
+  static std::shared_ptr<ArrayBuffer>
+  fromJSI(jsi::Runtime &runtime, const jsi::Value &arg, bool outOfBound) {
+    if (arg.isObject()) {
+      auto obj = arg.getObject(runtime);
+      if (obj.isArrayBuffer(runtime)) {
+        return createArrayBufferFromJSI(runtime, obj.getArrayBuffer(runtime),
+                                        1);
+      }
+      if (obj.hasProperty(runtime, "buffer")) {
+        auto bufferProp = obj.getProperty(runtime, "buffer");
+        if (bufferProp.isObject() &&
+            bufferProp.getObject(runtime).isArrayBuffer(runtime)) {
+          auto buff = bufferProp.getObject(runtime);
+          auto bytesPerElements =
+              obj.getProperty(runtime, "BYTES_PER_ELEMENT").asNumber();
+          return createArrayBufferFromJSI(
+              runtime, buff.getArrayBuffer(runtime),
+              static_cast<size_t>(bytesPerElements));
+        }
+      }
+    }
+    throw std::runtime_error("ArrayBuffer::fromJSI: argument is not an object "
+                             "with an ArrayBuffer 'buffer' property");
+  }
+
+  static jsi::Value toJSI(jsi::Runtime &runtime,
+                          std::shared_ptr<ArrayBuffer> arg) {
+    return jsi::ArrayBuffer(runtime, arg);
+  }
+};
+
+} // namespace rnwgpu