fix: Make toArrayBuffer() return raw RGBA data on iOS too (#7)

* fix: Make `toArrayBuffer()` return raw RGBA data on iOS too

* feat: Add some docs

* use ARGB on iOS too

Author: mrousavy

example/ios/Podfile.lock

@@ -1866,7 +1866,7 @@ DEPENDENCIES:
   - glog (from `../../node_modules/react-native/third-party-podspecs/glog.podspec`)
   - hermes-engine (from `../../node_modules/react-native/sdks/hermes-engine/hermes-engine.podspec`)
   - NitroImage (from `../node_modules/react-native-nitro-image`)
-  - NitroModules (from `../../node_modules/react-native-nitro-modules`)
+  - NitroModules (from `../node_modules/react-native-nitro-modules`)
   - RCT-Folly (from `../../node_modules/react-native/third-party-podspecs/RCT-Folly.podspec`)
   - RCT-Folly/Fabric (from `../../node_modules/react-native/third-party-podspecs/RCT-Folly.podspec`)
   - RCTDeprecation (from `../../node_modules/react-native/ReactApple/Libraries/RCTFoundation/RCTDeprecation`)
@@ -1963,7 +1963,7 @@ EXTERNAL SOURCES:
   NitroImage:
     :path: "../node_modules/react-native-nitro-image"
   NitroModules:
-    :path: "../../node_modules/react-native-nitro-modules"
+    :path: "../node_modules/react-native-nitro-modules"
   RCT-Folly:
     :podspec: "../../node_modules/react-native/third-party-podspecs/RCT-Folly.podspec"
   RCTDeprecation:

ios/HybridImage.swift

@@ -27,10 +27,7 @@ class HybridImage: HybridImageSpec {
   }
 
   func toArrayBuffer() throws -> ArrayBufferHolder {
-    guard let data = uiImage.pngData() else {
-      throw RuntimeError.error(withMessage: "Failed to convert UIImage to png data!")
-    }
-    return try ArrayBufferHolder.copy(data: data)
+    return try uiImage.toRawRgbaArrayBuffer()
   }
   func toArrayBufferAsync() throws -> Promise<ArrayBufferHolder> {
     return Promise.async {

ios/UIImage+rawRgbaData.swift

@@ -0,0 +1,46 @@
+import UIKit
+import CoreGraphics
+import NitroModules
+
+extension UIImage {
+  /**
+   * Returns raw RGBA data of this UIImage
+   */
+  func toRawRgbaArrayBuffer() throws -> ArrayBufferHolder {
+    guard let cg = self.cgImage else {
+      throw RuntimeError.error(withMessage: "Failed to get Image's underlying cgImage!")
+    }
+
+    let width = cg.width
+    let height = cg.height
+    let bytesPerPixel = 4
+    let bytesPerRow = bytesPerPixel * width
+    let bitsPerComponent = 8
+
+    // Allocate a Data buffer of the right size
+    let totalSize = width * height * bytesPerPixel
+    let arrayBuffer = ArrayBufferHolder.allocate(size: totalSize)
+
+    // Create a RGB-premultiplied-first context (aka ARGB)
+    let colorSpace = CGColorSpaceCreateDeviceRGB()
+    let bitmapInfo = CGImageAlphaInfo.premultipliedFirst.rawValue
+
+    guard let ctx = CGContext(
+      data: arrayBuffer.data,
+      width: width,
+      height: height,
+      bitsPerComponent: bitsPerComponent,
+      bytesPerRow: bytesPerRow,
+      space: colorSpace,
+      bitmapInfo: bitmapInfo
+    ) else {
+      throw RuntimeError.error(withMessage: "Failed to create CGContext for \(width)x\(height) RGBA Image!")
+    }
+
+    // Draw the Image into the CGContext
+    let rect = CGRect(x: 0, y: 0, width: width, height: height)
+    ctx.draw(cg, in: rect)
+
+    return arrayBuffer
+  }
+}

src/specs/Image.nitro.ts

@@ -7,22 +7,47 @@ export interface Image
   readonly width: number
   readonly height: number
 
+  /**
+   * Returns an array buffer containing the raw pixel data of the Image.
+   * Raw pixel data is always in `ARGB` format;
+   * ```
+   * [
+   *   A1, R1, G1, B1,
+   *   A2, R2, G2, B2,
+   *   ...
+   * ]
+   * ```
+   */
   toArrayBuffer(): ArrayBuffer
   toArrayBufferAsync(): Promise<ArrayBuffer>
 
+  /**
+   * Resizes this Image into a new image with the new given {@linkcode width} and {@linkcode height}.
+   */
   resize(width: number, height: number): Image
   resizeAsync(width: number, height: number): Promise<Image>
 
+  /**
+   * Saves this image in the given {@linkcode ImageFormat} to the given {@linkcode path}.
+   */
   saveToFileAsync(
     path: string,
     format: ImageFormat,
     quality: number
   ): Promise<void>
+  /**
+   * Saves this image in the given {@linkcode ImageFormat} to a temporary file, and return it's path.
+   */
   saveToTemporaryFileAsync(
     format: ImageFormat,
     quality: number
   ): Promise<string>
 
+  /**
+   * Encodes this Image into a ThumbHash.
+   * To convert the returned ThumbHash to a string, use `thumbHashToBase64String(...)`.
+   * @note To keep this efficient, {@linkcode resize} this image to a small size (<100x100) first.
+   */
   toThumbHash(): ArrayBuffer
   toThumbHashAsync(): Promise<ArrayBuffer>
 }