react-native-wgpu 0.1.0 → 0.1.3

package/cpp/rnwgpu/api/descriptors/GPUVertexState.h

@@ -1,30 +1,41 @@
 #pragma once
 
+#include <map>
 #include <memory>
 #include <string>
+#include <variant>
+#include <vector>
 
 #include "webgpu/webgpu_cpp.h"
 
-#include "Logger.h"
 #include "RNFJSIConverter.h"
-#include <RNFHybridObject.h>
+#include "WGPULogger.h"
+
+#include "GPUShaderModule.h"
+#include "GPUVertexBufferLayout.h"
+#include "RNFHybridObject.h"
 
 namespace jsi = facebook::jsi;
+namespace m = margelo;
 
 namespace rnwgpu {
 
-class GPUVertexState {
-public:
-  wgpu::VertexState *getInstance() { return &_instance; }
-
-  wgpu::VertexState _instance;
-
-  std::string entryPoint;
+struct GPUVertexState {
+  std::optional<std::vector<
+      std::variant<std::nullptr_t, std::shared_ptr<GPUVertexBufferLayout>>>>
+      buffers; // Iterable<GPUVertexBufferLayout | null>
+  std::shared_ptr<GPUShaderModule> module; // GPUShaderModule
+  std::optional<std::string> entryPoint;   // string
+  std::optional<std::map<std::string, double>>
+      constants; // Record< string, GPUPipelineConstantValue >
 };
+
 } // namespace rnwgpu
 
 namespace margelo {
 
+using namespace rnwgpu; // NOLINT(build/namespaces)
+
 template <> struct JSIConverter<std::shared_ptr<rnwgpu::GPUVertexState>> {
   static std::shared_ptr<rnwgpu::GPUVertexState>
   fromJSI(jsi::Runtime &runtime, const jsi::Value &arg, bool outOfBounds) {
@@ -32,46 +43,36 @@ template <> struct JSIConverter<std::shared_ptr<rnwgpu::GPUVertexState>> {
     if (!outOfBounds && arg.isObject()) {
       auto value = arg.getObject(runtime);
       if (value.hasProperty(runtime, "buffers")) {
-        auto buffers = value.getProperty(runtime, "buffers");
+        auto prop = value.getProperty(runtime, "buffers");
+        result->buffers = JSIConverter<std::optional<std::vector<std::variant<
+            std::nullptr_t, std::shared_ptr<GPUVertexBufferLayout>>>>>::
+            fromJSI(runtime, prop, false);
       }
       if (value.hasProperty(runtime, "module")) {
-        auto module = value.getProperty(runtime, "module");
-
-        if (module.isUndefined()) {
-          throw std::runtime_error(
-              "Property GPUVertexState::module is required");
-        }
-      } else {
-        throw std::runtime_error(
-            "Property GPUVertexState::module is not defined");
+        auto prop = value.getProperty(runtime, "module");
+        result->module =
+            JSIConverter<std::shared_ptr<GPUShaderModule>>::fromJSI(
+                runtime, prop, false);
       }
       if (value.hasProperty(runtime, "entryPoint")) {
-        auto entryPoint = value.getProperty(runtime, "entryPoint");
-
-        if (entryPoint.isString()) {
-          auto str = entryPoint.asString(runtime).utf8(runtime);
-          result->entryPoint = str;
-          result->_instance.entryPoint = result->entryPoint.c_str();
-        }
+        auto prop = value.getProperty(runtime, "entryPoint");
+        result->entryPoint = JSIConverter<std::optional<std::string>>::fromJSI(
+            runtime, prop, false);
       }
       if (value.hasProperty(runtime, "constants")) {
-        auto constants = value.getProperty(runtime, "constants");
+        auto prop = value.getProperty(runtime, "constants");
+        result->constants =
+            JSIConverter<std::optional<std::map<std::string, double>>>::fromJSI(
+                runtime, prop, false);
       }
     }
-    rnwgpu::Logger::logToConsole("GPUVertexState::buffers = %f",
-                                 result->_instance.buffers);
-    rnwgpu::Logger::logToConsole("GPUVertexState::module = %f",
-                                 result->_instance.module);
-    rnwgpu::Logger::logToConsole("GPUVertexState::entryPoint = %f",
-                                 result->_instance.entryPoint);
-    rnwgpu::Logger::logToConsole("GPUVertexState::constants = %f",
-                                 result->_instance.constants);
+
     return result;
   }
   static jsi::Value toJSI(jsi::Runtime &runtime,
                           std::shared_ptr<rnwgpu::GPUVertexState> arg) {
-    // No conversions here
-    return jsi::Value::null();
+    throw std::runtime_error("Invalid GPUVertexState::toJSI()");
   }
 };
-} // namespace margelo
+
+} // namespace margelo

package/cpp/rnwgpu/api/descriptors/Unions.h

@@ -2,9 +2,9 @@
 
 #include <string>
 
-#include "webgpu/webgpu_cpp.h"
-
+#include "External.h"
 #include "RNFEnumMapper.h"
+#include "webgpu/webgpu_cpp.h"
 
 namespace margelo {
 namespace EnumMapper {
@@ -1641,5 +1641,60 @@ static void convertEnumToJSUnion(wgpu::VertexStepMode inEnum,
   }
 }
 
+static void convertJSUnionToEnum(const std::string &inUnion,
+                                 rnwgpu::PredefinedColorSpace *outEnum) {
+  if (inUnion == "display-p3") {
+    *outEnum = rnwgpu::PredefinedColorSpace::DisplayP3;
+  } else if (inUnion == "srgb") {
+    *outEnum = rnwgpu::PredefinedColorSpace::Srgb;
+  } else {
+    throw invalidUnion(inUnion);
+  }
+}
+
+static void convertEnumToJSUnion(rnwgpu::PredefinedColorSpace inEnum,
+                                 std::string *outUnion) {
+  switch (inEnum) {
+  case rnwgpu::PredefinedColorSpace::DisplayP3:
+    *outUnion = "display-p3";
+    break;
+  case rnwgpu::PredefinedColorSpace::Srgb:
+    *outUnion = "srgb";
+    break;
+  default:
+    throw invalidEnum(inEnum);
+  }
+}
+
+static void convertJSUnionToEnum(const std::string &inUnion,
+                                 rnwgpu::PremultiplyAlpha *outEnum) {
+  if (inUnion == "none") {
+    *outEnum = rnwgpu::PremultiplyAlpha::None;
+  } else if (inUnion == "default") {
+    *outEnum = rnwgpu::PremultiplyAlpha::Default;
+  } else if (inUnion == "premultiply") {
+    *outEnum = rnwgpu::PremultiplyAlpha::Premultiply;
+  } else {
+    throw invalidUnion(inUnion);
+  }
+}
+
+static void convertEnumToJSUnion(rnwgpu::PremultiplyAlpha inEnum,
+                                 std::string *outUnion) {
+  switch (inEnum) {
+  case rnwgpu::PremultiplyAlpha::None:
+    *outUnion = "none";
+    break;
+  case rnwgpu::PremultiplyAlpha::Default:
+    *outUnion = "default";
+    break;
+  case rnwgpu::PremultiplyAlpha::Premultiply:
+    *outUnion = "premultiply";
+    break;
+  default:
+    throw invalidEnum(inEnum);
+  }
+}
+
 } // namespace EnumMapper
 } // namespace margelo

package/ios/IOSPlatformContext.h

@@ -0,0 +1,19 @@
+#pragma once
+
+#include "PlatformContext.h"
+
+namespace rnwgpu {
+
+class IOSPlatformContext : public PlatformContext {
+public:
+  IOSPlatformContext() = default;
+  ~IOSPlatformContext() = default;
+
+  wgpu::Surface makeSurface(wgpu::Instance instance, void *surface, int width,
+                            int height) override;
+
+  ImageData createImageBitmap(std::string blobId, double offset,
+                              double size) override;
+};
+
+} // namespace rnwgpu

package/ios/IOSPlatformContext.mm

@@ -0,0 +1,68 @@
+#include "IOSPlatformContext.h"
+
+#import <React/RCTBlobManager.h>
+#import <React/RCTBridge+Private.h>
+#import <ReactCommon/RCTTurboModule.h>
+
+#include "RNWebGPUManager.h"
+#include "WebGPUModule.h"
+
+namespace rnwgpu {
+
+wgpu::Surface IOSPlatformContext::makeSurface(wgpu::Instance instance,
+                                              void *surface, int width,
+                                              int height) {
+  wgpu::SurfaceDescriptorFromMetalLayer metalSurfaceDesc;
+  metalSurfaceDesc.layer = surface;
+  wgpu::SurfaceDescriptor surfaceDescriptor;
+  surfaceDescriptor.nextInChain = &metalSurfaceDesc;
+  return instance.CreateSurface(&surfaceDescriptor);
+}
+
+ImageData IOSPlatformContext::createImageBitmap(std::string blobId,
+                                                double offset, double size) {
+  RCTBlobManager *blobManager =
+      [[RCTBridge currentBridge] moduleForClass:RCTBlobManager.class];
+  NSData *blobData =
+      [blobManager resolve:[NSString stringWithUTF8String:blobId.c_str()]
+                    offset:(long)offset
+                      size:(long)size];
+
+  if (!blobData) {
+    throw std::runtime_error("Couldn't retrive blob data");
+  }
+
+  UIImage *image = [UIImage imageWithData:blobData];
+  if (!image) {
+    throw std::runtime_error("Couldn't decode image");
+  }
+
+  CGImageRef cgImage = image.CGImage;
+  size_t width = CGImageGetWidth(cgImage);
+  size_t height = CGImageGetHeight(cgImage);
+  size_t bitsPerComponent = 8;
+  size_t bytesPerRow = width * 4;
+  std::vector<uint8_t> imageData(height * bytesPerRow);
+
+  CGColorSpaceRef colorSpace = CGColorSpaceCreateDeviceRGB();
+  CGContextRef context = CGBitmapContextCreate(
+      imageData.data(), width, height, bitsPerComponent, bytesPerRow,
+      colorSpace, kCGImageAlphaPremultipliedLast | kCGBitmapByteOrder32Big);
+
+  CGContextDrawImage(context, CGRectMake(0, 0, width, height), cgImage);
+
+  // Now imageData contains a copy of the bitmap data
+
+  CGContextRelease(context);
+  CGColorSpaceRelease(colorSpace);
+
+  // Use the copied data
+  ImageData result;
+  result.width = static_cast<int>(width);
+  result.height = static_cast<int>(height);
+  result.data = imageData;
+  result.format = wgpu::TextureFormat::RGBA8Unorm;
+  return result;
+}
+
+} // namespace rnwgpu

package/ios/MetalView.h

@@ -0,0 +1,10 @@
+#pragma once
+
+#import "WebGPUModule.h"
+#import <UIKit/UIKit.h>
+
+@interface MetalView : UIView
+
+@property NSNumber *contextId;
+
+@end

package/ios/MetalView.mm

@@ -0,0 +1,27 @@
+#import "MetalView.h"
+#import "SurfaceUtils.h"
+#import "webgpu_cpp.h"
+#import <React/RCTViewManager.h>
+
+@implementation MetalView {
+  BOOL _isConfigured;
+}
+
++ (Class)layerClass {
+  return [CAMetalLayer class];
+}
+
+// Paper only method
+- (void)reactSetFrame:(CGRect)frame {
+  [super reactSetFrame:frame];
+  if (!_isConfigured) {
+    [SurfaceUtils configureSurface:self.layer
+                              size:self.frame.size
+                         contextId:[_contextId intValue]];
+    _isConfigured = YES;
+  } else {
+    [SurfaceUtils updateSurface:[_contextId intValue] size:self.frame.size];
+  }
+}
+
+@end

package/ios/SurfaceUtils.h

@@ -0,0 +1,13 @@
+#pragma once
+
+#import <UIKit/UIKit.h>
+
+@interface SurfaceUtils : NSObject
+
++ (void)configureSurface:(CALayer *)layer
+                    size:(CGSize)size
+               contextId:(int)contextId;
+
++ (void)updateSurface:(int)contextId size:(CGSize)size;
+
+@end

package/ios/SurfaceUtils.mm

@@ -0,0 +1,24 @@
+#import "SurfaceUtils.h"
+#import "MetalView.h"
+#import "WebGPUModule.h"
+#import "WebGPUView.h"
+
+// TODO: to delete now
+@implementation SurfaceUtils
+
++ (void)configureSurface:(CALayer *)layer
+                    size:(CGSize)size
+               contextId:(int)contextId {
+  std::shared_ptr<rnwgpu::RNWebGPUManager> manager = [WebGPUModule getManager];
+  CGFloat scaleFactor = [UIScreen mainScreen].scale;
+  void *nativeSurface = (__bridge void *)layer;
+  manager->surfacesRegistry.addSurface(contextId, nativeSurface, size.width,
+                                       size.height);
+}
+
++ (void)updateSurface:(int)contextId size:(CGSize)size {
+  std::shared_ptr<rnwgpu::RNWebGPUManager> manager = [WebGPUModule getManager];
+  manager->surfacesRegistry.updateSurface(contextId, size.width, size.height);
+}
+
+@end

package/ios/WebGPUModule.h

@@ -1,18 +1,19 @@
 #pragma once
 
+#import "RNWebGPUManager.h"
 #import <React/RCTBridgeModule.h>
 #import <React/RCTEventEmitter.h>
 
-@interface WebGPUModule : NSObject <RCTBridgeModule>
+#ifdef RCT_NEW_ARCH_ENABLED
+#import <RNWgpuViewSpec/RNWgpuViewSpec.h>
+@interface WebGPUModule : RCTEventEmitter <NativeWebGPUModuleSpec>
+#else
+@interface WebGPUModule : RCTEventEmitter <RCTBridgeModule>
+#endif
 
 @property(nonatomic, weak) RCTBridge *bridge;
 @property(nonatomic, weak) RCTModuleRegistry *moduleRegistry;
 
-@end
-
-#ifdef RCT_NEW_ARCH_ENABLED
-#import <rnwebgpu/rnwebgpu.h>
++ (std::shared_ptr<rnwgpu::RNWebGPUManager>)getManager;
 
-@interface WebGPUModule () <WebGPUModuleSpec>
 @end
-#endif

package/ios/WebGPUModule.mm

@@ -1,24 +1,25 @@
 #import "WebGPUModule.h"
+#import "GPUCanvasContext.h"
+#include "IOSPlatformContext.h"
+
 #import <React/RCTBridge+Private.h>
 #import <React/RCTLog.h>
+#import <React/RCTUIManagerUtils.h>
 #import <ReactCommon/RCTTurboModule.h>
-
-#include "RNFLogger.h"
-#include "RNWebGPUManager.h"
+#import <jsi/jsi.h>
+#import <memory>
 
 namespace jsi = facebook::jsi;
 namespace react = facebook::react;
 
-@implementation WebGPUModule {
-  rnwgpu::RNWebGPUManager *_webgpuManager;
-}
+@implementation WebGPUModule
 
 RCT_EXPORT_MODULE(WebGPUModule)
 
-#pragma Accessors
+static std::shared_ptr<rnwgpu::RNWebGPUManager> webgpuManager;
 
-- (rnwgpu::RNWebGPUManager *)manager {
-  return _webgpuManager;
++ (std::shared_ptr<rnwgpu::RNWebGPUManager>)getManager {
+  return webgpuManager;
 }
 
 #pragma Setup and invalidation
@@ -31,11 +32,15 @@ RCT_EXPORT_MODULE(WebGPUModule)
   // if (_webgpuManager != nil) {
   //   [_webgpuManager invalidate];
   // }
-  _webgpuManager = nil;
+  webgpuManager = nil;
+}
+
+- (std::shared_ptr<rnwgpu::RNWebGPUManager>)getManager {
+  return webgpuManager;
 }
 
 RCT_EXPORT_BLOCKING_SYNCHRONOUS_METHOD(install) {
-  if (_webgpuManager != nil) {
+  if (webgpuManager != nil) {
     // Already initialized, ignore call.
     return @true;
   }
@@ -61,16 +66,44 @@ RCT_EXPORT_BLOCKING_SYNCHRONOUS_METHOD(install) {
   if (!jsInvoker) {
     jsInvoker = cxxBridge.jsCallInvoker;
   }
+  std::shared_ptr<rnwgpu::PlatformContext> platformContext =
+      std::make_shared<rnwgpu::IOSPlatformContext>();
   // TODO: remove allocation here
-  _webgpuManager = new rnwgpu::RNWebGPUManager(runtime, jsInvoker);
+  webgpuManager = std::make_shared<rnwgpu::RNWebGPUManager>(runtime, jsInvoker,
+                                                            platformContext);
+  return @true;
+}
+
+RCT_EXPORT_BLOCKING_SYNCHRONOUS_METHOD(createSurfaceContext
+                                       : (double)contextId) {
+  int contextIdInt = contextId;
+  RCTCxxBridge *cxxBridge = (RCTCxxBridge *)self.bridge;
+  auto runtime = (jsi::Runtime *)cxxBridge.runtime;
+  auto webGPUContextRegistry = runtime->global().getPropertyAsObject(
+      *runtime, "__WebGPUContextRegistry");
+  auto canvas = webgpuManager->surfacesRegistry.getSurface(contextIdInt);
+  if (webGPUContextRegistry.hasProperty(*runtime,
+                                        std::to_string(contextIdInt).c_str())) {
+    // Context already exists, just update width/height
+    auto prop =
+        webGPUContextRegistry
+            .getPropertyAsObject(*runtime, std::to_string(contextIdInt).c_str())
+            .asHostObject<rnwgpu::Canvas>(*runtime);
+    prop->setWidth(canvas->getWidth());
+    prop->setHeight(canvas->getHeight());
+    return @true;
+  }
+  webGPUContextRegistry.setProperty(
+      *runtime, std::to_string(contextIdInt).c_str(),
+      facebook::jsi::Object::createFromHostObject(*runtime, canvas));
+
   return @true;
 }
 
 #ifdef RCT_NEW_ARCH_ENABLED
 - (std::shared_ptr<facebook::react::TurboModule>)getTurboModule:
     (const facebook::react::ObjCTurboModule::InitParams &)params {
-  jsInvoker = params.jsInvoker;
-  return std::make_shared<facebook::react::NativeSkiaModuleSpecJSI>(params);
+  return std::make_shared<facebook::react::NativeWebGPUModuleSpecJSI>(params);
 }
 #endif
 

package/ios/WebGPUView.h

@@ -1,13 +1,16 @@
-// This guard prevent this file to be compiled in the old architecture.
 #ifdef RCT_NEW_ARCH_ENABLED
+#pragma once
+
+#import "MetalView.h"
 #import <React/RCTViewComponentView.h>
 #import <UIKit/UIKit.h>
 
-#pragma once
-
 NS_ASSUME_NONNULL_BEGIN
 
 @interface WebGPUView : RCTViewComponentView
++ (void)registerMetalView:(MetalView *)metalView
+            withContextId:(NSNumber *)contextId;
++ (bool)isContextRegisterd:(NSNumber *)contextId;
 @end
 
 NS_ASSUME_NONNULL_END

package/ios/WebGPUView.mm

@@ -1,13 +1,15 @@
 #ifdef RCT_NEW_ARCH_ENABLED
 #import "WebGPUView.h"
 
-#import <react/renderer/components/RNWebGPUViewSpec/ComponentDescriptors.h>
-#import <react/renderer/components/RNWebGPUViewSpec/EventEmitters.h>
-#import <react/renderer/components/RNWebGPUViewSpec/Props.h>
-#import <react/renderer/components/RNWebGPUViewSpec/RCTComponentViewHelpers.h>
+#import <react/renderer/components/RNWgpuViewSpec/EventEmitters.h>
+#import <react/renderer/components/RNWgpuViewSpec/Props.h>
+#import <react/renderer/components/RNWgpuViewSpec/RCTComponentViewHelpers.h>
 
+#import "MetalView.h"
 #import "RCTFabricComponentsPlugins.h"
 #import "Utils.h"
+#import "WebGPUModule.h"
+#import "WebGPUViewComponentDescriptor.h"
 
 using namespace facebook::react;
 
@@ -16,40 +18,50 @@ using namespace facebook::react;
 @end
 
 @implementation WebGPUView {
-  UIView *_view;
+  NSNumber *_contextId;
 }
 
+static NSMutableDictionary<NSNumber *, MetalView *> *metalViewRegistry =
+    [NSMutableDictionary new];
+
 + (ComponentDescriptorProvider)componentDescriptorProvider {
-  return concreteComponentDescriptorProvider<WgpuViewComponentDescriptor>();
+  return concreteComponentDescriptorProvider<WebGPUViewComponentDescriptor>();
+}
+
++ (void)registerMetalView:(MetalView *)metalView
+            withContextId:(NSNumber *)contextId {
+  metalViewRegistry[contextId] = metalView;
+}
+
++ (bool)isContextRegisterd:(NSNumber *)contextId {
+  return metalViewRegistry[contextId] != nil;
 }
 
 - (instancetype)initWithFrame:(CGRect)frame {
   if (self = [super initWithFrame:frame]) {
-    static const auto defaultProps = std::make_shared<const WgpuViewProps>();
+    static const auto defaultProps = std::make_shared<const WebGPUViewProps>();
     _props = defaultProps;
-
-    _view = [[UIView alloc] init];
-
-    self.contentView = _view;
   }
 
   return self;
 }
 
-- (void)updateProps:(Props::Shared const &)props
-           oldProps:(Props::Shared const &)oldProps {
-  const auto &oldViewProps =
-      *std::static_pointer_cast<WebGPUViewProps const>(_props);
-  const auto &newViewProps =
-      *std::static_pointer_cast<WebGPUViewProps const>(props);
-
-  if (oldViewProps.color != newViewProps.color) {
-    NSString *colorToConvert =
-        [[NSString alloc] initWithUTF8String:newViewProps.color.c_str()];
-    [_view setBackgroundColor:[Utils hexStringToColor:colorToConvert]];
-  }
+- (void)prepareForRecycle {
+  [super prepareForRecycle];
+  self.contentView = nil;
+  [metalViewRegistry removeObjectForKey:_contextId];
+}
 
-  [super updateProps:props oldProps:oldProps];
+- (void)updateLayoutMetrics:
+            (const facebook::react::LayoutMetrics &)layoutMetrics
+           oldLayoutMetrics:
+               (const facebook::react::LayoutMetrics &)oldLayoutMetrics {
+  [super updateLayoutMetrics:layoutMetrics oldLayoutMetrics:oldLayoutMetrics];
+  if (!self.contentView) {
+    const auto &props =
+        *std::static_pointer_cast<WebGPUViewProps const>(_props);
+    self.contentView = metalViewRegistry[@(props.contextId)];
+  }
 }
 
 Class<RCTComponentViewProtocol> WebGPUViewCls(void) { return WebGPUView.class; }

package/ios/WebGPUViewComponentDescriptor.h

@@ -0,0 +1,61 @@
+#ifdef RCT_NEW_ARCH_ENABLED
+
+#pragma once
+
+#include <react/debug/react_native_assert.h>
+#include <react/renderer/components/RNWgpuViewSpec/ShadowNodes.h>
+#include <react/renderer/components/view/ConcreteViewShadowNode.h>
+#include <react/renderer/core/ConcreteComponentDescriptor.h>
+#include <react/renderer/core/LayoutContext.h>
+
+#import "MetalView.h"
+#import "SurfaceUtils.h"
+#import "WebGPUView.h"
+
+namespace facebook {
+namespace react {
+
+class WebGPUViewCustomShadowNode final : public WebGPUViewShadowNode {
+
+public:
+  using ConcreteViewShadowNode::ConcreteViewShadowNode;
+
+  void layout(LayoutContext layoutContext) override {
+    YogaLayoutableShadowNode::layout(layoutContext);
+    configureSurface();
+  }
+
+  void configureSurface() {
+    const auto &viewProps =
+        *std::static_pointer_cast<WebGPUViewProps const>(props_);
+    if ([WebGPUView isContextRegisterd:@(viewProps.contextId)]) {
+      return;
+    }
+    __block MetalView *metalView;
+    __block CALayer *layer;
+    dispatch_sync(dispatch_get_main_queue(), ^{
+      metalView = [[MetalView alloc] init];
+      layer = metalView.layer;
+    });
+    [WebGPUView registerMetalView:metalView
+                    withContextId:@(viewProps.contextId)];
+
+    // TODO: use physical size
+    float width = layoutMetrics_.frame.size.width;
+    float height = layoutMetrics_.frame.size.height;
+    [SurfaceUtils configureSurface:layer
+                              size:CGSizeMake(width, height)
+                         contextId:viewProps.contextId];
+  }
+};
+
+class WebGPUViewComponentDescriptor final
+    : public ConcreteComponentDescriptor<WebGPUViewCustomShadowNode> {
+public:
+  using ConcreteComponentDescriptor::ConcreteComponentDescriptor;
+};
+
+} // namespace react
+} // namespace facebook
+
+#endif // RCT_NEW_ARCH_ENABLED

package/ios/WebGPUViewManager.mm

@@ -1,5 +1,6 @@
+#import "MetalView.h"
 #import "RCTBridge.h"
-#import "Utils.h"
+#import "WebGPUModule.h"
 #import <React/RCTUIManager.h>
 #import <React/RCTViewManager.h>
 
@@ -11,11 +12,12 @@
 RCT_EXPORT_MODULE(WebGPUView)
 
 - (UIView *)view {
-  return [[UIView alloc] init];
+  return [MetalView new];
 }
 
-RCT_CUSTOM_VIEW_PROPERTY(color, NSString, UIView) {
-  [view setBackgroundColor:[Utils hexStringToColor:json]];
+RCT_CUSTOM_VIEW_PROPERTY(contextId, NSNumber, UIView) {
+  NSNumber *contextId = [RCTConvert NSNumber:json];
+  [(MetalView *)view setContextId:contextId];
 }
 
 @end