react-native-figma-shadow 0.1.0-alpha.1

package/LICENSE

@@ -0,0 +1,21 @@
+MIT License
+
+Copyright (c) 2026 RaoMK
+
+Permission is hereby granted, free of charge, to any person obtaining a copy
+of this software and associated documentation files (the "Software"), to deal
+in the Software without restriction, including without limitation the rights
+to use, copy, modify, merge, publish, distribute, sublicense, and/or sell
+copies of the Software, and to permit persons to whom the Software is
+furnished to do so, subject to the following conditions:
+
+The above copyright notice and this permission notice shall be included in all
+copies or substantial portions of the Software.
+
+THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR
+IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,
+FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE
+AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER
+LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,
+OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE
+SOFTWARE.

package/README.md

@@ -0,0 +1,152 @@
+# react-native-figma-shadow
+
+> **Status: alpha (`0.1.0-alpha.x`).** The C++ core is tested and the package
+> builds, but the native iOS/Android layers have not yet been run through a full
+> app build. Install with `react-native-figma-shadow@alpha` and expect rough
+> edges. Feedback welcome.
+
+Paste a CSS `box-shadow` — the exact string Figma's **Copy as CSS** produces, or
+what you already use on the web — and get a **pixel-identical** shadow on iOS and
+Android.
+
+```tsx
+import { Shadow } from 'react-native-figma-shadow';
+
+<Shadow shadow="0px 4px 20px 0px rgba(0, 0, 0, 0.15)" borderRadius={16}>
+  <Card />
+</Shadow>;
+```
+
+- **One renderer, both platforms.** The shadow is rasterized by a shared C++
+  core (an analytic Gaussian convolution of a rounded rectangle). iOS and Android
+  run the same code and produce the same bytes — no `CALayer` blur vs `elevation`
+  mismatch.
+- **Zero peer dependencies.** No Skia, no `react-native-svg`. Adds roughly
+  50–100 KB to your app download.
+- **New Architecture native component** (Fabric). Requires React Native 0.76+
+  with the New Architecture enabled.
+- **Real CSS semantics:** multiple comma-separated shadows, `inset`, spread,
+  negative spread, and any CSS color (`#rgb`, `#rrggbbaa`, `rgb()/rgba()`,
+  `hsl()/hsla()`, named colors).
+
+| `0 0 20px rgba(0,0,0,.5)` | `8px 10px 16px rgba(0,0,0,.6)` | `inset 0 8px 12px rgba(0,0,0,.7)` |
+| :---: | :---: | :---: |
+| ![drop](docs/images/fs_drop.png) | ![offset](docs/images/fs_offset.png) | ![inset](docs/images/fs_inset.png) |
+
+<sub>Rendered by the shared C++ core — byte-for-byte identical output feeds both the iOS `CALayer` and the Android `Canvas`.</sub>
+
+## Why the numbers finally match
+
+"Blur" means different things across systems:
+
+| System                    | `blur` value is…            |
+| ------------------------- | --------------------------- |
+| Figma / CSS `box-shadow`  | ≈ 2× the Gaussian σ         |
+| iOS `shadowRadius`        | ≈ the Gaussian σ            |
+| Android `elevation`       | not configurable            |
+
+This library normalizes everything to the CSS/Figma definition (`σ = blur / 2`),
+so the number you paste is the number you get.
+
+## Install
+
+```sh
+npm install react-native-figma-shadow
+# or: yarn add react-native-figma-shadow   (Yarn 1 or Yarn 3+/Berry)
+cd ios && pod install
+```
+
+The C++ core is compiled into your app automatically by the New Architecture
+build (CocoaPods on iOS, CMake/`externalNativeBuild` on Android). There is no
+extra setup step, no postinstall script, and no peer dependency beyond
+`react` / `react-native` themselves.
+
+### Yarn 3+ (Berry)
+
+The package ships a modern `exports` map and installs cleanly under Yarn Berry.
+As with every React Native native module, use the **`node-modules` linker** —
+Metro, CocoaPods, and Gradle autolinking all expect a real `node_modules` tree,
+so Yarn PnP is not supported by the RN toolchain:
+
+```yaml
+# .yarnrc.yml
+nodeLinker: node-modules
+```
+
+## API
+
+### `<Shadow>`
+
+| Prop                                                                             | Type      | Notes                                                        |
+| -------------------------------------------------------------------------------- | --------- | ----------------------------------------------------------- |
+| `shadow`                                                                         | `string`  | A CSS `box-shadow` value. `box-shadow:` prefix and trailing `;` are tolerated. |
+| `borderRadius`                                                                   | `number`  | Uniform corner radius of the shadow shape. Match your child. |
+| `borderTopLeftRadius` / `borderTopRightRadius` / `borderBottomRightRadius` / `borderBottomLeftRadius` | `number` | Per-corner override.                                         |
+| `backgroundColor`                                                                | `string`  | Fill painted inside the content box, **below** an inset shadow and below children (use this instead of a background on the child for CSS-correct inset shadows). |
+| `highQuality`                                                                    | `boolean` | Opt into the slower exact rounded-corner quadrature. Default `false`. |
+| `style`                                                                          | `ViewStyle` | Applied to the outer layout box.                            |
+
+```tsx
+// multiple shadows — comma-separated, straight from Figma / CSS
+<Shadow
+  shadow="0 2px 4px rgba(0,0,0,.10), 0 12px 32px rgba(0,0,0,.14)"
+  borderRadius={16}
+>
+  <Card />
+</Shadow>
+
+// inner shadow (Figma "Inner shadow")
+<Shadow shadow="inset 0 2px 8px rgba(0,0,0,0.25)" borderRadius={12} backgroundColor="#fff">
+  <TextInput />
+</Shadow>
+
+// per-corner radius
+<Shadow
+  shadow="0 8px 24px rgba(0,0,0,.12)"
+  borderTopLeftRadius={16}
+  borderTopRightRadius={16}
+>
+  <Sheet />
+</Shadow>
+```
+
+### Helpers
+
+```ts
+import { parseBoxShadow, computeBleed } from 'react-native-figma-shadow';
+
+parseBoxShadow('0 4px 20px rgba(0,0,0,.15)');
+// [{ offsetX: 0, offsetY: 4, blur: 20, spread: 0, inset: false }]
+
+computeBleed(parseBoxShadow('0 4px 20px rgba(0,0,0,.15)'));
+// { left: 30, top: 30, right: 30, bottom: 34 }
+```
+
+## How it works
+
+1. `<Shadow>` parses the value on the JS side only to compute the **bleed** — how
+   far the shadow extends past the element box — and reserves that space with
+   negative margins so layout stays neutral.
+2. The native Fabric view (`FigmaShadowView`) hands the raw `box-shadow` string,
+   the content size, corner radii, bleed and pixel ratio to the shared C++
+   `render()`.
+3. C++ parses the declaration, rasterizes every layer into one premultiplied
+   RGBA8888 bitmap, and memoizes it (identical requests — e.g. every row of a
+   list — reuse one bitmap).
+4. iOS sets the bitmap as a `CALayer`'s `contents`; Android blits it in
+   `dispatchDraw` behind the children. Neither platform does any blur math.
+
+## Limitations
+
+- **Shape shadows only.** The shadow follows the `borderRadius` you give it, not
+  the actual alpha of arbitrary content (text, transparent PNGs). `drop-shadow`
+  that hugs content alpha is not in this version.
+- **New Architecture required** (RN 0.76+). No legacy-architecture fallback.
+- First render of a given shadow happens on a background thread and appears a
+  frame or two later; after that it is cached.
+- The `backgroundColor` fill uses the top-left radius for all four corners when
+  per-corner radii differ (the shadow itself is always exact).
+
+## License
+
+MIT

package/android/CMakeLists.txt

@@ -0,0 +1,30 @@
+cmake_minimum_required(VERSION 3.13)
+project(FigmaShadow)
+
+set(CMAKE_CXX_STANDARD 17)
+set(CMAKE_CXX_STANDARD_REQUIRED ON)
+set(CMAKE_VERBOSE_MAKEFILE ON)
+
+set(SHARED_CORE_DIR "${CMAKE_CURRENT_SOURCE_DIR}/../cpp")
+
+file(GLOB CORE_SOURCES CONFIGURE_DEPENDS "${SHARED_CORE_DIR}/figmashadow/*.cpp")
+
+add_library(react-native-figma-shadow
+  SHARED
+  ${CORE_SOURCES}
+  "${CMAKE_CURRENT_SOURCE_DIR}/src/main/jni/cpp-adapter.cpp"
+)
+
+target_include_directories(react-native-figma-shadow
+  PUBLIC
+  "${SHARED_CORE_DIR}"
+  "${SHARED_CORE_DIR}/figmashadow"
+)
+
+find_library(log-lib log)
+find_library(jnigraphics-lib jnigraphics)
+
+target_link_libraries(react-native-figma-shadow
+  ${log-lib}
+  ${jnigraphics-lib}
+)

package/android/build.gradle

@@ -0,0 +1,76 @@
+buildscript {
+  repositories {
+    google()
+    mavenCentral()
+  }
+  dependencies {
+    classpath "com.android.tools.build:gradle:8.7.2"
+    classpath "org.jetbrains.kotlin:kotlin-gradle-plugin:1.9.24"
+    classpath "com.facebook.react:react-native-gradle-plugin"
+  }
+}
+
+def getExtOrDefault = { name, fallback ->
+  return rootProject.ext.has(name) ? rootProject.ext.get(name) : fallback
+}
+
+def reactNativeArchitectures() {
+  def value = rootProject.getProperties().get("reactNativeArchitectures")
+  return value ? value.split(",") : ["armeabi-v7a", "x86", "x86_64", "arm64-v8a"]
+}
+
+apply plugin: "com.android.library"
+apply plugin: "org.jetbrains.kotlin.android"
+apply plugin: "com.facebook.react"
+
+android {
+  namespace "com.figmashadow"
+
+  compileSdkVersion getExtOrDefault("compileSdkVersion", 35)
+
+  defaultConfig {
+    minSdkVersion getExtOrDefault("minSdkVersion", 24)
+    targetSdkVersion getExtOrDefault("targetSdkVersion", 34)
+
+    externalNativeBuild {
+      cmake {
+        cppFlags "-O2", "-frtti", "-fexceptions", "-Wall"
+        arguments "-DANDROID_STL=c++_shared"
+        abiFilters(*reactNativeArchitectures())
+      }
+    }
+  }
+
+  externalNativeBuild {
+    cmake {
+      path "CMakeLists.txt"
+    }
+  }
+
+  buildTypes {
+    release {
+      minifyEnabled false
+    }
+  }
+
+  compileOptions {
+    sourceCompatibility JavaVersion.VERSION_17
+    targetCompatibility JavaVersion.VERSION_17
+  }
+}
+
+repositories {
+  google()
+  mavenCentral()
+}
+
+dependencies {
+  implementation "com.facebook.react:react-android"
+  implementation "org.jetbrains.kotlin:kotlin-stdlib:1.9.24"
+}
+
+react {
+  jsRootDir = file("../src/")
+  libraryName = "RNFigmaShadowSpec"
+  codegenJavaPackageName = "com.figmashadow"
+}

package/android/gradle.properties

@@ -0,0 +1,3 @@
+FigmaShadow_compileSdkVersion=35
+FigmaShadow_targetSdkVersion=34
+FigmaShadow_minSdkVersion=24

package/android/src/main/AndroidManifest.xml

@@ -0,0 +1 @@
+<manifest xmlns:android="http://schemas.android.com/apk/res/android" />

package/android/src/main/java/com/figmashadow/FigmaShadowView.kt

@@ -0,0 +1,224 @@
+package com.figmashadow
+
+import android.content.Context
+import android.graphics.Bitmap
+import android.graphics.Canvas
+import android.graphics.Paint
+import android.graphics.Path
+import android.graphics.RectF
+import android.os.Handler
+import android.os.Looper
+import android.util.DisplayMetrics
+import com.facebook.react.views.view.ReactViewGroup
+import java.util.concurrent.Executors
+
+/**
+ * Container that paints a CSS-style shadow behind its children. All shadow
+ * geometry is produced by the shared C++ core (see [nativeRenderShadow]); this
+ * view only blits the resulting bitmap.
+ */
+class FigmaShadowView(context: Context) : ReactViewGroup(context) {
+
+  private val density: Float =
+    context.resources.displayMetrics.densityDpi.toFloat() / DisplayMetrics.DENSITY_DEFAULT
+
+  private var shadowSpec: String = ""
+  private var backgroundSpec: String? = null
+  private var radiusTopLeft = 0f
+  private var radiusTopRight = 0f
+  private var radiusBottomRight = 0f
+  private var radiusBottomLeft = 0f
+  private var bleedLeft = 0f
+  private var bleedTop = 0f
+  private var bleedRight = 0f
+  private var bleedBottom = 0f
+  private var highQuality = false
+
+  private var shadowBitmap: Bitmap? = null
+  private var dirty = true
+  private var renderGeneration = 0
+  private var renderInFlight = -1
+
+  private val bitmapPaint = Paint(Paint.FILTER_BITMAP_FLAG)
+  private val fillPaint = Paint(Paint.ANTI_ALIAS_FLAG)
+  private var hasFill = false
+  private val fillPath = Path()
+  private val fillRect = RectF()
+  private val fillRadii = FloatArray(8)
+
+  init {
+    setWillNotDraw(false)
+    // The shadow is drawn outside the padded content box.
+    clipChildren = false
+  }
+
+  fun setShadowSpec(value: String?) {
+    val next = value ?: ""
+    if (next != shadowSpec) {
+      shadowSpec = next
+      dirty = true
+      invalidate()
+    }
+  }
+
+  fun setFillColor(value: String?) {
+    if (value != backgroundSpec) {
+      backgroundSpec = value
+      resolveFill()
+      invalidate()
+    }
+  }
+
+  fun setHighQuality(value: Boolean) {
+    if (value != highQuality) {
+      highQuality = value
+      dirty = true
+      invalidate()
+    }
+  }
+
+  private inline fun updateRadius(current: Float, next: Float, apply: (Float) -> Unit) {
+    if (current != next) {
+      apply(next)
+      dirty = true
+      invalidate()
+    }
+  }
+
+  fun setRadiusTopLeft(v: Float) = updateRadius(radiusTopLeft, v) { radiusTopLeft = it }
+  fun setRadiusTopRight(v: Float) = updateRadius(radiusTopRight, v) { radiusTopRight = it }
+  fun setRadiusBottomRight(v: Float) = updateRadius(radiusBottomRight, v) { radiusBottomRight = it }
+  fun setRadiusBottomLeft(v: Float) = updateRadius(radiusBottomLeft, v) { radiusBottomLeft = it }
+
+  fun setBleedLeft(v: Float) = updateRadius(bleedLeft, v) { bleedLeft = it }
+  fun setBleedTop(v: Float) = updateRadius(bleedTop, v) { bleedTop = it }
+  fun setBleedRight(v: Float) = updateRadius(bleedRight, v) { bleedRight = it }
+  fun setBleedBottom(v: Float) = updateRadius(bleedBottom, v) { bleedBottom = it }
+
+  override fun onSizeChanged(w: Int, h: Int, oldw: Int, oldh: Int) {
+    super.onSizeChanged(w, h, oldw, oldh)
+    dirty = true
+  }
+
+  private fun contentWidthPx(): Float = width - (bleedLeft + bleedRight) * density
+  private fun contentHeightPx(): Float = height - (bleedTop + bleedBottom) * density
+
+  /** Kicks off an off-thread raster; the current bitmap keeps showing until it lands. */
+  private fun rebuildShadow() {
+    dirty = false
+
+    val contentW = contentWidthPx() / density
+    val contentH = contentHeightPx() / density
+    if (contentW <= 0f || contentH <= 0f || shadowSpec.isEmpty()) {
+      shadowBitmap = null
+      return
+    }
+
+    val generation = ++renderGeneration
+    if (generation == renderInFlight) return
+    renderInFlight = generation
+
+    val spec = shadowSpec
+    val rtl = radiusTopLeft
+    val rtr = radiusTopRight
+    val rbr = radiusBottomRight
+    val rbl = radiusBottomLeft
+    val bl = bleedLeft
+    val bt = bleedTop
+    val br = bleedRight
+    val bb = bleedBottom
+    val hq = highQuality
+
+    executor.execute {
+      val bitmap = nativeRenderShadow(
+        contentW, contentH, rtl, rtr, rbr, rbl, spec, bl, bt, br, bb, density, hq,
+      )
+      mainHandler.post {
+        renderInFlight = -1
+        if (generation == renderGeneration) {
+          shadowBitmap = bitmap
+          invalidate()
+        }
+      }
+    }
+  }
+
+  private fun resolveFill() {
+    val spec = backgroundSpec
+    val rgba = FloatArray(4)
+    hasFill = spec != null && nativeParseColor(spec, rgba) && rgba[3] > 0f
+    if (hasFill) {
+      fillPaint.setARGB(
+        (rgba[3] * 255).toInt(),
+        (rgba[0] * 255).toInt(),
+        (rgba[1] * 255).toInt(),
+        (rgba[2] * 255).toInt(),
+      )
+    }
+  }
+
+  private fun updateFillPath() {
+    val left = bleedLeft * density
+    val top = bleedTop * density
+    fillRect.set(left, top, left + contentWidthPx(), top + contentHeightPx())
+    val tl = radiusTopLeft * density
+    val tr = radiusTopRight * density
+    val br = radiusBottomRight * density
+    val bl = radiusBottomLeft * density
+    fillRadii[0] = tl; fillRadii[1] = tl
+    fillRadii[2] = tr; fillRadii[3] = tr
+    fillRadii[4] = br; fillRadii[5] = br
+    fillRadii[6] = bl; fillRadii[7] = bl
+    fillPath.reset()
+    fillPath.addRoundRect(fillRect, fillRadii, Path.Direction.CW)
+  }
+
+  override fun dispatchDraw(canvas: Canvas) {
+    if (dirty) rebuildShadow()
+
+    if (hasFill) {
+      updateFillPath()
+      canvas.drawPath(fillPath, fillPaint)
+    }
+
+    shadowBitmap?.let { bmp ->
+      canvas.drawBitmap(bmp, null, RectF(0f, 0f, width.toFloat(), height.toFloat()), bitmapPaint)
+    }
+
+    super.dispatchDraw(canvas)
+  }
+
+  companion object {
+    init {
+      System.loadLibrary("react-native-figma-shadow")
+    }
+
+    private val executor = Executors.newSingleThreadExecutor { r ->
+      Thread(r, "figma-shadow-raster").apply { priority = Thread.NORM_PRIORITY - 1 }
+    }
+    private val mainHandler = Handler(Looper.getMainLooper())
+
+    @JvmStatic
+    external fun nativeRenderShadow(
+      contentWidth: Float,
+      contentHeight: Float,
+      radiusTopLeft: Float,
+      radiusTopRight: Float,
+      radiusBottomRight: Float,
+      radiusBottomLeft: Float,
+      boxShadow: String,
+      bleedLeft: Float,
+      bleedTop: Float,
+      bleedRight: Float,
+      bleedBottom: Float,
+      scale: Float,
+      highQuality: Boolean,
+    ): Bitmap?
+
+    @JvmStatic
+    external fun nativeParseColor(token: String, out: FloatArray): Boolean
+
+    @JvmStatic
+    external fun nativeClearCache()
+  }
+}

package/android/src/main/java/com/figmashadow/FigmaShadowViewManager.kt

@@ -0,0 +1,71 @@
+package com.figmashadow
+
+import com.facebook.react.module.annotations.ReactModule
+import com.facebook.react.uimanager.SimpleViewManager
+import com.facebook.react.uimanager.ThemedReactContext
+import com.facebook.react.uimanager.ViewManagerDelegate
+import com.facebook.react.uimanager.annotations.ReactProp
+import com.facebook.react.viewmanagers.FigmaShadowViewManagerDelegate
+import com.facebook.react.viewmanagers.FigmaShadowViewManagerInterface
+
+@ReactModule(name = FigmaShadowViewManager.NAME)
+class FigmaShadowViewManager :
+  SimpleViewManager<FigmaShadowView>(),
+  FigmaShadowViewManagerInterface<FigmaShadowView> {
+
+  private val delegate: ViewManagerDelegate<FigmaShadowView> =
+    FigmaShadowViewManagerDelegate(this)
+
+  override fun getDelegate(): ViewManagerDelegate<FigmaShadowView> = delegate
+
+  override fun getName(): String = NAME
+
+  override fun createViewInstance(context: ThemedReactContext): FigmaShadowView =
+    FigmaShadowView(context)
+
+  @ReactProp(name = "shadow")
+  override fun setShadow(view: FigmaShadowView, value: String?) = view.setShadowSpec(value)
+
+  @ReactProp(name = "fillColor")
+  override fun setFillColor(view: FigmaShadowView, value: String?) = view.setFillColor(value)
+
+  @ReactProp(name = "highQuality")
+  override fun setHighQuality(view: FigmaShadowView, value: Boolean) = view.setHighQuality(value)
+
+  @ReactProp(name = "pixelRatio")
+  override fun setPixelRatio(view: FigmaShadowView, value: Float) {
+    // Android derives density from resources; the JS-supplied value is unused.
+  }
+
+  @ReactProp(name = "borderTopLeftRadius", defaultFloat = 0f)
+  override fun setBorderTopLeftRadius(view: FigmaShadowView, value: Float) =
+    view.setRadiusTopLeft(value)
+
+  @ReactProp(name = "borderTopRightRadius", defaultFloat = 0f)
+  override fun setBorderTopRightRadius(view: FigmaShadowView, value: Float) =
+    view.setRadiusTopRight(value)
+
+  @ReactProp(name = "borderBottomRightRadius", defaultFloat = 0f)
+  override fun setBorderBottomRightRadius(view: FigmaShadowView, value: Float) =
+    view.setRadiusBottomRight(value)
+
+  @ReactProp(name = "borderBottomLeftRadius", defaultFloat = 0f)
+  override fun setBorderBottomLeftRadius(view: FigmaShadowView, value: Float) =
+    view.setRadiusBottomLeft(value)
+
+  @ReactProp(name = "bleedLeft", defaultFloat = 0f)
+  override fun setBleedLeft(view: FigmaShadowView, value: Float) = view.setBleedLeft(value)
+
+  @ReactProp(name = "bleedTop", defaultFloat = 0f)
+  override fun setBleedTop(view: FigmaShadowView, value: Float) = view.setBleedTop(value)
+
+  @ReactProp(name = "bleedRight", defaultFloat = 0f)
+  override fun setBleedRight(view: FigmaShadowView, value: Float) = view.setBleedRight(value)
+
+  @ReactProp(name = "bleedBottom", defaultFloat = 0f)
+  override fun setBleedBottom(view: FigmaShadowView, value: Float) = view.setBleedBottom(value)
+
+  companion object {
+    const val NAME = "FigmaShadowView"
+  }
+}

package/android/src/main/java/com/figmashadow/FigmaShadowViewPackage.kt

@@ -0,0 +1,30 @@
+package com.figmashadow
+
+import com.facebook.react.BaseReactPackage
+import com.facebook.react.bridge.NativeModule
+import com.facebook.react.bridge.ReactApplicationContext
+import com.facebook.react.module.model.ReactModuleInfo
+import com.facebook.react.module.model.ReactModuleInfoProvider
+import com.facebook.react.uimanager.ViewManager
+
+class FigmaShadowViewPackage : BaseReactPackage() {
+
+  override fun getModule(name: String, reactContext: ReactApplicationContext): NativeModule? = null
+
+  override fun createViewManagers(
+    reactContext: ReactApplicationContext,
+  ): List<ViewManager<*, *>> = listOf(FigmaShadowViewManager())
+
+  override fun getReactModuleInfoProvider(): ReactModuleInfoProvider = ReactModuleInfoProvider {
+    mapOf(
+      FigmaShadowViewManager.NAME to ReactModuleInfo(
+        FigmaShadowViewManager.NAME,
+        FigmaShadowViewManager.NAME,
+        false, // canOverrideExistingModule
+        false, // needsEagerInit
+        false, // isCxxModule
+        true, // isTurboModule
+      ),
+    )
+  }
+}

package/android/src/main/jni/cpp-adapter.cpp

@@ -0,0 +1,77 @@
+#include <android/bitmap.h>
+#include <jni.h>
+
+#include <cstring>
+#include <string>
+
+#include "Color.h"
+#include "FigmaShadow.h"
+
+namespace {
+
+std::string jstringToStd(JNIEnv *env, jstring value) {
+  if (value == nullptr) return {};
+  const char *chars = env->GetStringUTFChars(value, nullptr);
+  std::string out(chars ? chars : "");
+  if (chars) env->ReleaseStringUTFChars(value, chars);
+  return out;
+}
+
+jobject createArgb8888Bitmap(JNIEnv *env, int width, int height) {
+  jclass bitmapClass = env->FindClass("android/graphics/Bitmap");
+  jclass configClass = env->FindClass("android/graphics/Bitmap$Config");
+  jfieldID argb8888Field = env->GetStaticFieldID(
+      configClass, "ARGB_8888", "Landroid/graphics/Bitmap$Config;");
+  jobject config = env->GetStaticObjectField(configClass, argb8888Field);
+  jmethodID createBitmap = env->GetStaticMethodID(
+      bitmapClass, "createBitmap",
+      "(IILandroid/graphics/Bitmap$Config;)Landroid/graphics/Bitmap;");
+  return env->CallStaticObjectMethod(bitmapClass, createBitmap, width, height, config);
+}
+
+}  // namespace
+
+extern "C" JNIEXPORT jobject JNICALL
+Java_com_figmashadow_FigmaShadowView_nativeRenderShadow(
+    JNIEnv *env, jclass /*clazz*/, jfloat contentWidth, jfloat contentHeight,
+    jfloat radiusTopLeft, jfloat radiusTopRight, jfloat radiusBottomRight,
+    jfloat radiusBottomLeft, jstring boxShadow, jfloat bleedLeft, jfloat bleedTop,
+    jfloat bleedRight, jfloat bleedBottom, jfloat scale, jboolean highQuality) {
+  const std::string shadow = jstringToStd(env, boxShadow);
+
+  figmashadow::Bitmap bmp = figmashadow::render(
+      contentWidth, contentHeight, radiusTopLeft, radiusTopRight,
+      radiusBottomRight, radiusBottomLeft, shadow, bleedLeft, bleedTop, bleedRight,
+      bleedBottom, scale, highQuality == JNI_TRUE);
+
+  if (bmp.empty()) return nullptr;
+
+  jobject bitmap = createArgb8888Bitmap(env, bmp.width, bmp.height);
+  if (bitmap == nullptr) return nullptr;
+
+  void *pixels = nullptr;
+  if (AndroidBitmap_lockPixels(env, bitmap, &pixels) != ANDROID_BITMAP_RESULT_SUCCESS) {
+    return nullptr;
+  }
+  // figmashadow::Bitmap is premultiplied RGBA8888; Android's ARGB_8888 is stored
+  // in the same byte order (R,G,B,A) and premultiplied by default.
+  std::memcpy(pixels, bmp.pixels.data(), bmp.pixels.size());
+  AndroidBitmap_unlockPixels(env, bitmap);
+
+  return bitmap;
+}
+
+extern "C" JNIEXPORT jboolean JNICALL
+Java_com_figmashadow_FigmaShadowView_nativeParseColor(JNIEnv *env, jclass /*clazz*/,
+                                                      jstring token, jfloatArray out) {
+  figmashadow::Color color;
+  if (!figmashadow::parseColor(jstringToStd(env, token), color)) return JNI_FALSE;
+  jfloat values[4] = {color.r, color.g, color.b, color.a};
+  env->SetFloatArrayRegion(out, 0, 4, values);
+  return JNI_TRUE;
+}
+
+extern "C" JNIEXPORT void JNICALL
+Java_com_figmashadow_FigmaShadowView_nativeClearCache(JNIEnv * /*env*/, jclass /*clazz*/) {
+  figmashadow::clearCache();
+}