@shortkitsdk/react-native 0.2.6 → 0.2.11

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

@@ -55,7 +55,7 @@ class ShortKitPlayerNativeView(context: Context) : FrameLayout(context) {
     private fun rebuildIfNeeded() {
         if (playerView != null) return
 
-        val sdk = ShortKitModule.shared?.sdk ?: return
+        val sdk = ShortKitBridge.shared?.sdk ?: return
         val playerConfig = parsePlayerConfig(configJson)
 
         val view = ShortKitPlayerView(context).apply {
@@ -107,7 +107,7 @@ class ShortKitPlayerNativeView(context: Context) : FrameLayout(context) {
         val overlay = obj.opt("overlay") ?: return VideoOverlayMode.None
         if (overlay is JSONObject && overlay.optString("type") == "custom") {
             return VideoOverlayMode.Custom {
-                ShortKitOverlayBridge(context)
+                ReactOverlayHost(context)
             }
         }
         return VideoOverlayMode.None

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

@@ -48,7 +48,7 @@ class ShortKitWidgetNativeView(context: Context) : FrameLayout(context) {
     private fun rebuildIfNeeded() {
         if (widgetView != null) return
 
-        val sdk = ShortKitModule.shared?.sdk ?: return
+        val sdk = ShortKitBridge.shared?.sdk ?: return
         val widgetConfig = parseWidgetConfig(configJson)
 
         val view = ShortKitWidgetView(context).apply {
@@ -97,7 +97,7 @@ class ShortKitWidgetNativeView(context: Context) : FrameLayout(context) {
         val overlay = obj.opt("overlay") ?: return VideoOverlayMode.None
         if (overlay is JSONObject && overlay.optString("type") == "custom") {
             return VideoOverlayMode.Custom {
-                ShortKitOverlayBridge(context)
+                ReactOverlayHost(context)
             }
         }
         return VideoOverlayMode.None

package/ios/ReactCarouselOverlayHost.swift

@@ -0,0 +1,177 @@
+import UIKit
+import ShortKitSDK
+
+/// A UIView that conforms to `CarouselOverlay` and hosts an `RCTFabricSurface`
+/// 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 emits image URLs to JS for Image.prefetch() and pushes
+/// ImageCarouselItem data as appProperties.
+@objc public class ReactCarouselOverlayHost: UIView, @unchecked Sendable, CarouselOverlay {
+
+    // MARK: - Configuration
+
+    var surfacePresenter: AnyObject?
+    weak var bridge: ShortKitBridge?
+
+    /// Module name for the RCTFabricSurface. Set by the overlay factory
+    /// based on the feed config's carousel overlay name.
+    var carouselOverlayModuleName: String = "ShortKitCarouselOverlay"
+
+    // MARK: - Eager Surface Creation
+
+    /// Eagerly create the RN surface so it's ready before the first configure().
+    /// Called by the overlay factory right after setting surfacePresenter and moduleName.
+    /// Mirrors ReactOverlayHost.attach(player:) which does the same for video overlays.
+    func prepareSurface() {
+        createSurfaceIfNeeded()
+    }
+
+    // MARK: - CarouselOverlay
+
+    public var cachedImage: ((String) -> UIImage?)?
+    public var wantsNativeImagePrefetch: Bool { true }
+
+    // MARK: - State
+
+    private var surface: SKFabricSurfaceWrapper?
+    private var surfaceView: UIView?
+    private var pendingProps: [String: Any]?
+
+    // MARK: - Init
+
+    override init(frame: CGRect) {
+        super.init(frame: frame)
+        backgroundColor = .clear
+        isUserInteractionEnabled = true
+    }
+
+    required init?(coder: NSCoder) {
+        fatalError("init(coder:) is not supported")
+    }
+
+    deinit {
+        surface?.stop()
+    }
+
+    // MARK: - CarouselOverlay
+
+    public func configure(with item: ImageCarouselItem) {
+        createSurfaceIfNeeded()
+
+        // Replace remote URLs with local file URLs for any natively-cached images.
+        // The SDK's PrefetchManager downloads images into NSCache<NSString, UIImage>
+        // which RN can't access. Writing to temp files lets RN load instantly from disk.
+        var modifiedItem = item
+        if let cachedImage {
+            var localImages: [CarouselImage] = []
+            for image in item.images {
+                if let uiImage = cachedImage(image.url),
+                   let localURL = writeTempImage(uiImage, for: image.url) {
+                    localImages.append(CarouselImage(url: localURL, alt: image.alt))
+                } else {
+                    localImages.append(image)
+                }
+            }
+            modifiedItem = ImageCarouselItem(
+                id: item.id,
+                images: localImages,
+                caption: item.caption,
+                title: item.title,
+                description: item.description,
+                author: item.author,
+                section: item.section,
+                articleUrl: item.articleUrl
+            )
+        }
+
+        // Build props — push now if surface exists, otherwise store for later
+        if let data = try? JSONEncoder().encode(modifiedItem),
+           let json = String(data: data, encoding: .utf8) {
+            let props: [String: Any] = ["item": json]
+            if let surface {
+                surface.setProperties(props)
+            } else {
+                pendingProps = props
+            }
+        }
+    }
+
+    /// Write a UIImage to the temp directory, returning a file:// URL string.
+    /// Uses a hash of the remote URL as the filename to avoid duplicates.
+    private func writeTempImage(_ image: UIImage, for remoteURL: String) -> String? {
+        let hash = remoteURL.hash
+        let fileName = "sk-carousel-\(abs(hash)).jpg"
+        let fileURL = URL(fileURLWithPath: NSTemporaryDirectory()).appendingPathComponent(fileName)
+
+        // Skip if already written
+        if FileManager.default.fileExists(atPath: fileURL.path) {
+            return fileURL.absoluteString
+        }
+
+        guard let data = image.jpegData(compressionQuality: 0.9) else { return nil }
+        do {
+            try data.write(to: fileURL, options: .atomic)
+            return fileURL.absoluteString
+        } catch {
+            return nil
+        }
+    }
+
+    public func resetState() {
+        // Don't clear surface props — matches video overlay (ReactOverlayHost) pattern.
+        // configure() will overwrite with new props directly, letting React do an
+        // in-place re-render (old→new) instead of an unmount+remount (old→empty→new).
+        // The overlay's synchronous reset pattern handles state transitions.
+    }
+
+    // MARK: - Surface Creation
+
+    private func createSurfaceIfNeeded() {
+        guard surface == nil, let presenter = surfacePresenter else { return }
+
+        // Must always dispatch to main queue — see ReactOverlayHost for details.
+        DispatchQueue.main.async { [weak self] in
+            guard let self, self.surface == nil else { return }
+            self.installSurface(presenter: presenter)
+        }
+    }
+
+    private func installSurface(presenter: AnyObject) {
+        guard let surf = SKFabricSurfaceWrapper(
+            presenter: presenter,
+            moduleName: carouselOverlayModuleName,
+            initialProperties: [:]
+        ) else { return }
+        surf.start()
+
+        let view = surf.view
+        view.translatesAutoresizingMaskIntoConstraints = false
+        addSubview(view)
+        NSLayoutConstraint.activate([
+            view.topAnchor.constraint(equalTo: topAnchor),
+            view.leadingAnchor.constraint(equalTo: leadingAnchor),
+            view.trailingAnchor.constraint(equalTo: trailingAnchor),
+            view.bottomAnchor.constraint(equalTo: bottomAnchor),
+        ])
+        surfaceView = view
+        surface = surf
+
+        // Flush any props that arrived before surface was ready
+        if let pending = pendingProps {
+            surf.setProperties(pending)
+            pendingProps = nil
+        }
+    }
+
+    // MARK: - Layout
+
+    public override func layoutSubviews() {
+        super.layoutSubviews()
+        guard let surface else { return }
+        let size = bounds.size
+        guard size.width > 0, size.height > 0 else { return }
+        surface.setMinimumSize(size)
+        surface.setMaximumSize(size)
+    }
+}

package/ios/ReactLoadingHost.swift

@@ -0,0 +1,38 @@
+import UIKit
+
+/// UIView that hosts a React Fabric surface for the custom loading component.
+/// Used as the `loadingViewProvider` for the ShortKit SDK.
+@objc public class ReactLoadingHost: UIView {
+
+    public var surfacePresenter: AnyObject?
+
+    private var surface: SKFabricSurfaceWrapper?
+
+    public override func didMoveToWindow() {
+        super.didMoveToWindow()
+        if window != nil && surface == nil {
+            guard let presenter = surfacePresenter ?? ShortKitBridge.shared?.surfacePresenter else { return }
+            let wrapper = SKFabricSurfaceWrapper(presenter: presenter, moduleName: "ShortKitLoading", initialProperties: [:])
+            wrapper?.start()
+            if let surfaceView = wrapper?.view {
+                surfaceView.frame = bounds
+                surfaceView.autoresizingMask = [.flexibleWidth, .flexibleHeight]
+                addSubview(surfaceView)
+            }
+            surface = wrapper
+        }
+    }
+
+    public override func willMove(toWindow newWindow: UIWindow?) {
+        super.willMove(toWindow: newWindow)
+        if newWindow == nil {
+            surface?.stop()
+            surface = nil
+        }
+    }
+
+    public override func layoutSubviews() {
+        super.layoutSubviews()
+        surface?.view.frame = bounds
+    }
+}