@shortkitsdk/react-native 0.2.6 → 0.2.12

package/ShortKitReactNative.podspec

@@ -11,6 +11,7 @@ Pod::Spec.new do |s|
   s.platforms    = { :ios => "16.0" }
   s.source       = { :git => "https://github.com/shortkit/shortkit.git", :tag => "v#{s.version}" }
   s.source_files = "ios/*.{h,m,mm,cpp,swift}"
+  s.public_header_files = "ios/ShortKitModule.h", "ios/SKFabricSurfaceWrapper.h"
   s.requires_arc = true
 
   # When the vendored XCFramework is present (npm published package), use it.

package/android/build.gradle.kts

@@ -1,6 +1,7 @@
 plugins {
     id("com.android.library")
     id("org.jetbrains.kotlin.android")
+    id("org.jetbrains.kotlin.plugin.serialization")
     id("com.facebook.react")
 }
 
@@ -30,5 +31,20 @@ android {
 
 dependencies {
     implementation("com.facebook.react:react-android")
-    implementation("dev.shortkit:shortkit:0.1.0")
+    // When Reco's settings.gradle has the composite build, Gradle substitutes
+    // this with the live source from android_sdk/shortkit automatically.
+    // implementation("dev.shortkit:shortkit:0.2.11")
+    implementation(files("/Users/michaelseleman/shortkit/android_sdk/shortkit/build/outputs/aar/shortkit-release.aar"))
+    // Transitive deps needed when using local AAR (Maven artifact bundles these automatically)
+    implementation("androidx.media3:media3-exoplayer:1.5.1")
+    implementation("androidx.media3:media3-exoplayer-hls:1.5.1")
+    implementation("androidx.media3:media3-datasource:1.5.1")
+    implementation("androidx.media3:media3-ui:1.5.1")
+    implementation("androidx.recyclerview:recyclerview:1.4.0")
+    implementation("androidx.viewpager2:viewpager2:1.1.0")
+    implementation("androidx.fragment:fragment-ktx:1.8.5")
+    implementation("androidx.lifecycle:lifecycle-runtime-ktx:2.8.7")
+    implementation("com.squareup.okhttp3:okhttp:4.12.0")
+    implementation("org.jetbrains.kotlinx:kotlinx-coroutines-android:1.9.0")
+    implementation("org.jetbrains.kotlinx:kotlinx-serialization-json:1.7.3")
 }

package/android/src/main/java/com/shortkit/reactnative/ReactCarouselOverlayHost.kt

@@ -0,0 +1,379 @@
+package com.shortkit.reactnative
+
+import android.content.Context
+import android.graphics.Bitmap
+import android.os.Bundle
+import android.widget.FrameLayout
+import com.facebook.react.ReactApplication
+import com.facebook.react.bridge.Arguments
+import com.facebook.react.interfaces.fabric.ReactSurface
+import com.facebook.react.runtime.ReactSurfaceImpl
+import com.shortkit.sdk.model.CarouselImage
+import com.shortkit.sdk.model.ImageCarouselItem
+import com.shortkit.sdk.overlay.CarouselOverlay
+import kotlinx.coroutines.CoroutineScope
+import kotlinx.coroutines.Dispatchers
+import kotlinx.coroutines.Job
+import kotlinx.coroutines.SupervisorJob
+import kotlinx.coroutines.launch
+import kotlinx.coroutines.withContext
+import kotlinx.serialization.encodeToString
+import kotlinx.serialization.json.Json
+import java.io.File
+import java.io.FileOutputStream
+
+/**
+ * A [FrameLayout] that conforms to [CarouselOverlay] and hosts a React Native
+ * Fabric [ReactSurface] for rendering the developer's React carousel overlay
+ * component inside a feed cell.
+ *
+ * Unlike [ReactOverlayHost], this does not subscribe to player state (carousels
+ * are image-based). It pushes [ImageCarouselItem] data as surface properties.
+ *
+ * Android equivalent of `react_native_sdk/ios/ReactCarouselOverlayHost.swift`.
+ */
+class ReactCarouselOverlayHost(context: Context) : FrameLayout(context), CarouselOverlay {
+
+    private companion object {
+        const val TAG = "SK:CarouselHost"
+    }
+
+    // ------------------------------------------------------------------
+    // Configuration
+    // ------------------------------------------------------------------
+
+    /** Suffix for the surface module name (e.g. "news" -> "ShortKitCarouselOverlay_news"). */
+    var carouselOverlayName: String = "Default"
+
+    // ------------------------------------------------------------------
+    // State
+    // ------------------------------------------------------------------
+
+    private var surface: ReactSurface? = null
+    private var pendingProps: Bundle? = null
+    private var isInLayoutPass: Boolean = false
+    private val ioScope = CoroutineScope(Dispatchers.Main + SupervisorJob())
+    private var pendingWriteJob: Job? = null
+    private var configureGeneration: Int = 0
+
+    // ------------------------------------------------------------------
+    // Fabric layout workaround
+    // ------------------------------------------------------------------
+
+    private val layoutHandler = android.os.Handler(android.os.Looper.getMainLooper())
+
+    private val layoutRunnable = Runnable {
+        measure(
+            MeasureSpec.makeMeasureSpec(width, MeasureSpec.EXACTLY),
+            MeasureSpec.makeMeasureSpec(height, MeasureSpec.EXACTLY)
+        )
+        layout(left, top, right, bottom)
+    }
+
+    override fun requestLayout() {
+        super.requestLayout()
+        if (!isInLayoutPass) {
+            @Suppress("UNNECESSARY_SAFE_CALL")
+            layoutHandler?.post(layoutRunnable)
+        }
+    }
+
+    // ------------------------------------------------------------------
+    // Init
+    // ------------------------------------------------------------------
+
+    init {
+        setBackgroundColor(android.graphics.Color.TRANSPARENT)
+    }
+
+    // ------------------------------------------------------------------
+    // Surface warmup
+    // ------------------------------------------------------------------
+
+    /**
+     * Eagerly create the Fabric surface so it's mounted and ready before
+     * the cell scrolls into view. Called from the overlay factory closure
+     * at pool creation time — mirrors iOS ReactCarouselOverlayHost.prepareSurface().
+     */
+    fun prepareSurface() {
+        createSurfaceIfNeeded()
+
+        // Pre-measure the host and surface view to screen dimensions so they
+        // have non-zero size before being attached to a cell. This prevents
+        // the black flash that occurs when the host is added at 0x0 and needs
+        // an async layout pass to become visible.
+        val displayW = context.resources.displayMetrics.widthPixels
+        val displayH = context.resources.displayMetrics.heightPixels
+        val wSpec = MeasureSpec.makeMeasureSpec(displayW, MeasureSpec.EXACTLY)
+        val hSpec = MeasureSpec.makeMeasureSpec(displayH, MeasureSpec.EXACTLY)
+        measure(wSpec, hSpec)
+        layout(0, 0, displayW, displayH)
+        measureAndLayoutSurfaceView(displayW, displayH)
+    }
+
+    // ------------------------------------------------------------------
+    // CarouselOverlay — native image cache
+    // ------------------------------------------------------------------
+
+    /** Injected by the SDK's PrefetchManager. Returns a cached Bitmap or null. */
+    override var cachedImage: ((String) -> Bitmap?)? = null
+
+    // ------------------------------------------------------------------
+    // CarouselOverlay
+    // ------------------------------------------------------------------
+
+    override fun configure(item: ImageCarouselItem) {
+        // Increment generation — any in-flight coroutine from a previous
+        // configure() call will see a stale generation and bail out.
+        val gen = ++configureGeneration
+
+        // Cancel any in-flight write job from a previous configure() call.
+        pendingWriteJob?.cancel()
+
+        // Fast path: check for pre-existing temp files synchronously (just
+        // file.exists(), no I/O). This avoids the flicker of remote→local
+        // URL swap for images that were cached in a previous session.
+        val lookup = cachedImage
+        val fastItem = if (lookup != null) {
+            val fastImages = item.images.map { image ->
+                val hash = image.url.hashCode()
+                val fileName = "sk-carousel-${kotlin.math.abs(hash)}.jpg"
+                val file = File(context.cacheDir, fileName)
+                if (file.exists()) CarouselImage(url = "file://${file.absolutePath}", alt = image.alt)
+                else image
+            }
+            ImageCarouselItem(
+                id = item.id,
+                images = fastImages,
+                caption = item.caption,
+                title = item.title,
+                description = item.description,
+                author = item.author,
+                section = item.section,
+                articleUrl = item.articleUrl,
+            )
+        } else item
+
+        val json = Json.encodeToString(fastItem)
+        val bundle = Bundle().apply { putString("item", json) }
+        applySurfaceProps(bundle)
+
+        // Pre-size the surface view NOW — before the overlay is attached to a cell.
+        val parentView = parent as? android.view.View
+        val w = if (width > 0) width
+                else if (parentView != null && parentView.width > 0) parentView.width
+                else context.resources.displayMetrics.widthPixels
+        val h = if (height > 0) height
+                else if (parentView != null && parentView.height > 0) parentView.height
+                else context.resources.displayMetrics.heightPixels
+        measureAndLayoutSurfaceView(w, h)
+
+        // Background: write any newly-cached images to temp files.
+        // Only runs if there are remote URLs remaining (not all were fast-pathed).
+        if (lookup == null) return
+        val hasRemoteUrls = fastItem.images.any { !it.url.startsWith("file://") }
+        if (!hasRemoteUrls) return
+
+        pendingWriteJob = ioScope.launch {
+            val modifiedItem = withContext(Dispatchers.IO) {
+                val localImages = item.images.map { image ->
+                    val bitmap = lookup(image.url)
+                    if (bitmap != null) {
+                        val localUrl = writeTempImage(bitmap, image.url)
+                        if (localUrl != null) CarouselImage(url = localUrl, alt = image.alt)
+                        else image
+                    } else {
+                        image
+                    }
+                }
+                ImageCarouselItem(
+                    id = item.id,
+                    images = localImages,
+                    caption = item.caption,
+                    title = item.title,
+                    description = item.description,
+                    author = item.author,
+                    section = item.section,
+                    articleUrl = item.articleUrl,
+                )
+            }
+
+            // Back on Main — only update if this configure() is still current
+            if (gen != configureGeneration) return@launch
+            val hasLocalImages = modifiedItem.images.any { it.url.startsWith("file://") }
+            if (hasLocalImages) {
+                val localJson = Json.encodeToString(modifiedItem)
+                val localBundle = Bundle().apply { putString("item", localJson) }
+                applySurfaceProps(localBundle)
+            }
+        }
+    }
+
+    /** Apply props to the surface, handling all lifecycle states. */
+    private fun applySurfaceProps(bundle: Bundle) {
+        val s = surface
+        if (s != null && s.isRunning) {
+            (s as? ReactSurfaceImpl)?.updateInitProps(bundle)
+        } else if (s != null && !s.isRunning) {
+            (s as? ReactSurfaceImpl)?.updateInitProps(bundle)
+            s.start()
+        } else {
+            pendingProps = bundle
+            createSurfaceIfNeeded()
+        }
+    }
+
+    /**
+     * Write a Bitmap to the temp directory as JPEG, returning a file:// URL.
+     * Uses a hash of the remote URL as filename to avoid duplicates.
+     * Matches iOS ReactCarouselOverlayHost.writeTempImage().
+     */
+    private fun writeTempImage(bitmap: Bitmap, remoteUrl: String): String? {
+        val hash = remoteUrl.hashCode()
+        val fileName = "sk-carousel-${kotlin.math.abs(hash)}.jpg"
+        val file = File(context.cacheDir, fileName)
+
+        // Skip if already written
+        if (file.exists()) return "file://${file.absolutePath}"
+
+        return try {
+            FileOutputStream(file).use { out ->
+                bitmap.compress(Bitmap.CompressFormat.JPEG, 90, out)
+            }
+            "file://${file.absolutePath}"
+        } catch (e: Exception) {
+            android.util.Log.w(TAG, "writeTempImage failed for $remoteUrl", e)
+            null
+        }
+    }
+
+    override fun resetState() {
+        val surfaceImpl = surface as? ReactSurfaceImpl ?: return
+        surfaceImpl.updateInitProps(Bundle())
+    }
+
+    override fun fadeOutForTransition() {
+        ShortKitBridge.shared?.emitCarouselOverlayEvent(
+            "onCarouselOverlayFadeOut",
+            Arguments.createMap()
+        )
+    }
+
+    override fun restoreFromTransition() {
+        ShortKitBridge.shared?.emitCarouselOverlayEvent(
+            "onCarouselOverlayRestore",
+            Arguments.createMap()
+        )
+    }
+
+    // ------------------------------------------------------------------
+    // Surface Creation
+    // ------------------------------------------------------------------
+
+    override fun onSizeChanged(w: Int, h: Int, oldw: Int, oldh: Int) {
+        super.onSizeChanged(w, h, oldw, oldh)
+        if (w > 0 && h > 0) {
+            measureAndLayoutSurfaceView(w, h)
+        }
+    }
+
+    override fun onLayout(changed: Boolean, left: Int, top: Int, right: Int, bottom: Int) {
+        isInLayoutPass = true
+        try {
+            super.onLayout(changed, left, top, right, bottom)
+            val w = right - left
+            val h = bottom - top
+            if (w > 0 && h > 0) {
+                measureAndLayoutSurfaceView(w, h)
+            } else {
+                val parentView = parent as? android.view.View
+                val pw = parentView?.width ?: 0
+                val ph = parentView?.height ?: 0
+                if (pw > 0 && ph > 0) {
+                    measureAndLayoutSurfaceView(pw, ph)
+                }
+            }
+        } finally {
+            isInLayoutPass = false
+        }
+    }
+
+    private fun measureAndLayoutSurfaceView(w: Int, h: Int) {
+        val sv = surface?.view ?: return
+        if (sv.width == w && sv.height == h) return
+        val wSpec = android.view.View.MeasureSpec.makeMeasureSpec(w, android.view.View.MeasureSpec.EXACTLY)
+        val hSpec = android.view.View.MeasureSpec.makeMeasureSpec(h, android.view.View.MeasureSpec.EXACTLY)
+        sv.measure(wSpec, hSpec)
+        sv.layout(0, 0, w, h)
+    }
+
+    override fun onAttachedToWindow() {
+        super.onAttachedToWindow()
+
+        val parentView = parent as? android.view.View
+        if (parentView != null && parentView.width > 0 && parentView.height > 0 && (width == 0 || height == 0)) {
+            val wSpec = android.view.View.MeasureSpec.makeMeasureSpec(parentView.width, android.view.View.MeasureSpec.EXACTLY)
+            val hSpec = android.view.View.MeasureSpec.makeMeasureSpec(parentView.height, android.view.View.MeasureSpec.EXACTLY)
+            measure(wSpec, hSpec)
+            layout(0, 0, parentView.width, parentView.height)
+        }
+    }
+
+    /**
+     * Create the surface object and attach its view, but do NOT start it yet.
+     * Called from prepareSurface() to warm the surface ahead of configure().
+     */
+    private fun createSurfaceIfNeeded() {
+        if (surface != null) return
+
+        val reactHost = (context.applicationContext as? ReactApplication)?.reactHost
+        if (reactHost == null) {
+            android.util.Log.e(TAG, "createSurface FAILED: reactHost is null")
+            return
+        }
+        val moduleName = "ShortKitCarouselOverlay_$carouselOverlayName"
+
+        // Pass pending props as initial props so the JS component has data on first render.
+        // If called from prepareSurface() (no item yet), pendingProps is null — the surface
+        // is created but NOT started. It will be started in configure() with real data.
+        val initialProps = pendingProps
+        pendingProps = null
+
+        val newSurface = reactHost.createSurface(context, moduleName, initialProps)
+        surface = newSurface
+
+        newSurface.view?.let { surfaceView ->
+            surfaceView.layoutParams = LayoutParams(
+                LayoutParams.MATCH_PARENT,
+                LayoutParams.MATCH_PARENT
+            )
+            addView(surfaceView)
+        }
+
+        // Only start if we have item data — avoids rendering a blank frame.
+        if (initialProps != null) {
+            newSurface.start()
+        }
+
+        // Use parent dimensions if host hasn't been laid out yet
+        val parentView = parent as? android.view.View
+        val w = if (width > 0) width else parentView?.width ?: 0
+        val h = if (height > 0) height else parentView?.height ?: 0
+        if (w > 0 && h > 0) {
+            measureAndLayoutSurfaceView(w, h)
+        }
+    }
+
+    // ------------------------------------------------------------------
+    // Cleanup
+    // ------------------------------------------------------------------
+
+    override fun onDetachedFromWindow() {
+        super.onDetachedFromWindow()
+        pendingWriteJob?.cancel()
+        pendingWriteJob = null
+        if (surface?.isRunning == true) {
+            surface?.stop()
+        }
+    }
+}

package/android/src/main/java/com/shortkit/reactnative/ReactLoadingHost.kt

@@ -0,0 +1,40 @@
+package com.shortkit.reactnative
+
+import android.content.Context
+import android.widget.FrameLayout
+import com.facebook.react.ReactApplication
+import com.facebook.react.interfaces.fabric.ReactSurface
+
+/**
+ * A [FrameLayout] that hosts a React Native Fabric surface for the custom
+ * loading component. Used as the loading view provider for the ShortKit SDK.
+ *
+ * Android equivalent of `react_native_sdk/ios/ReactLoadingHost.swift`.
+ */
+class ReactLoadingHost(context: Context) : FrameLayout(context) {
+
+    private var surface: ReactSurface? = null
+
+    override fun onAttachedToWindow() {
+        super.onAttachedToWindow()
+        if (surface == null) {
+            val reactHost = (context.applicationContext as? ReactApplication)?.reactHost ?: return
+            val newSurface = reactHost.createSurface(context, "ShortKitLoading", null)
+            newSurface.view?.let { surfaceView ->
+                surfaceView.layoutParams = LayoutParams(
+                    LayoutParams.MATCH_PARENT,
+                    LayoutParams.MATCH_PARENT
+                )
+                addView(surfaceView)
+            }
+            newSurface.start()
+            surface = newSurface
+        }
+    }
+
+    override fun onDetachedFromWindow() {
+        super.onDetachedFromWindow()
+        surface?.stop()
+        surface = null
+    }
+}