fix: rotate slow path clipped content by keeping canvas at input size

The rotate slow path on iOS (NativeImage.swift) and Android
(HybridImage.kt) sized the output canvas to the input image's
dimensions. When degrees is not a multiple of 180 (e.g., a 90 degree
rotation of a portrait image into a landscape), the rotated content
extends beyond the canvas and gets clipped -- the caller sees an image
at the input dimensions with half the rotated content missing.

Fix: compute the rotated bounding box as
  outputW = abs(cos(r)) * w + abs(sin(r)) * h
  outputH = abs(sin(r)) * w + abs(cos(r)) * h

Size the renderer / destination bitmap to that, then translate so the
rotated content lands centered on the output canvas.

Verified end-to-end on iPhone 15 Pro (3x) and a Pixel-class Android
device via a vision-camera v5 photo-scanning app: rotating a portrait
card 90 degrees now produces a correctly sized landscape JPEG with
complete content, rather than a portrait JPEG with a clipped landscape
rectangle inside.

Works for any angle (the cos/sin formula gives a tight bounding box for
arbitrary rotations), but the bug is most visible at 90/270 where the
canvas is transposed from the content.

Author: rayabelcode

packages/react-native-nitro-image/android/src/main/java/com/margelo/nitro/image/HybridImage.kt

@@ -82,16 +82,31 @@ class HybridImage: HybridImageSpec {
     override fun rotate(degrees: Double, allowFastFlagRotation: Boolean?): HybridImageSpec {
         // 1. Make sure the Bitmap we want to draw is drawable (HARDWARE isn't)
         val source = bitmap.toCpuAccessible()
-        // 2. Create a rotation Matrix
+
+        // 2. Compute the rotated bounding box size. The output Bitmap must be
+        //    sized to contain the rotated content; using the original width/
+        //    height clips content when degrees % 180 != 0 (e.g., rotating a
+        //    portrait 90 degrees produces a landscape rect that doesn't fit a
+        //    portrait canvas).
+        val radians = Math.toRadians(degrees)
+        val srcW = source.width.toDouble()
+        val srcH = source.height.toDouble()
+        val outputW = (Math.abs(Math.cos(radians)) * srcW + Math.abs(Math.sin(radians)) * srcH).toInt()
+        val outputH = (Math.abs(Math.sin(radians)) * srcW + Math.abs(Math.cos(radians)) * srcH).toInt()
+
+        // 3. Create a rotation matrix centered on the source, then translate so
+        //    the rotated bounding box lands at (0, 0) of the output canvas.
         val matrix = Matrix()
         matrix.setRotate(degrees.toFloat(), source.width / 2f, source.height / 2f)
-        // 3. Create a new blank Bitmap as our output
-        val destination = createBitmap(bitmap.width, bitmap.height)
-        // 4. Draw the Bitmap to our destination
+        matrix.postTranslate((outputW - source.width) / 2f, (outputH - source.height) / 2f)
+
+        // 4. Create the output Bitmap sized to the rotated bounding box.
+        val destination = createBitmap(outputW, outputH)
+
+        // 5. Draw source into the destination with the rotation matrix applied.
         Canvas(destination).apply {
             drawBitmap(source, matrix, null)
         }
-        // 5. Return it!
         return HybridImage(destination)
     }
 

packages/react-native-nitro-image/ios/Public/NativeImage.swift

@@ -63,21 +63,31 @@ public extension NativeImage {
       return HybridImage(uiImage: rotated)
     } else {
       // Slow path: we actually rotate using UIGraphicsImageRenderer.
-      // Force scale=1 so output pixel dims match uiImage.size. Without a format,
-      // UIGraphicsImageRenderer defaults to UIScreen.main.scale (2x/3x on modern
-      // iPhones), producing a pixel-inflated bitmap.
+      // Force scale=1 so output pixel dims match the rotated bounding box
+      // (avoids UIScreen.main.scale default).
+      //
+      // Output canvas must be sized to the ROTATED bounding box, not the original
+      // image. Using uiImage.size clips content when degrees % 180 != 0 (e.g., a
+      // portrait rotated 90 degrees produces a landscape rect that extends
+      // outside a portrait canvas).
+      let radians = degrees * .pi / 180
+      let width = uiImage.size.width
+      let height = uiImage.size.height
+      let outputWidth = abs(cos(radians)) * width + abs(sin(radians)) * height
+      let outputHeight = abs(sin(radians)) * width + abs(cos(radians)) * height
+      let outputSize = CGSize(width: outputWidth, height: outputHeight)
+
       let format = UIGraphicsImageRendererFormat()
       format.scale = 1
-      let renderer = UIGraphicsImageRenderer(size: uiImage.size, format: format)
+      let renderer = UIGraphicsImageRenderer(size: outputSize, format: format)
       let rotatedImage = renderer.image { context in
-        let width = uiImage.size.width
-        let height = uiImage.size.height
-        // 1. Move to the center of the image so our origin is the center
-        context.cgContext.translateBy(x: width / 2, y: height / 2)
+        // 1. Move to the center of the OUTPUT canvas so our origin is its center
+        context.cgContext.translateBy(x: outputWidth / 2, y: outputHeight / 2)
         // 2. Rotate by the given radians
-        let radians = degrees * .pi / 180
         context.cgContext.rotate(by: radians)
-        // 3. Draw the Image offset by half the frame so we counter our center origin from step 1.
+        // 3. Draw the Image offset by half the ORIGINAL frame so we counter our
+        //    center origin from step 1. The rotated content now fills the
+        //    output canvas exactly (tight bounding box).
         let rect = CGRect(x: -(width / 2),
                           y: -(height / 2),
                           width: width,