@imgly/editor-react-native 1.80.0 → 1.81.0-rc.0

package/android/build.gradle

@@ -143,7 +143,7 @@ repositories {
 }
 
 dependencies {
-    api "ly.img:editor:1.80.0"
+    api "ly.img:editor:1.81.0-rc.0"
 
     implementation "androidx.activity:activity-ktx:1.9.0"
     implementation "androidx.appcompat:appcompat:1.7.1"

package/android/src/main/assets/ly.img.memories.style/content.json

@@ -0,0 +1,50 @@
+{
+  "version": "1.0.0",
+  "id": "ly.img.memories.style",
+  "assets": [
+    {
+      "id": "noir",
+      "label": { "en": "Noir" },
+      "tags": { "en": ["style", "noir"] },
+      "meta": {
+        "uri": "{{base_url}}/ly.img.memories.style/thumbnails/noir.png",
+        "thumbUri": "{{base_url}}/ly.img.memories.style/thumbnails/noir.png",
+        "kind": "image",
+        "fillType": "//ly.img.ubq/fill/image",
+        "mimeType": "image/png",
+        "width": 256,
+        "height": 256
+      }
+    },
+    {
+      "id": "hologram",
+      "label": { "en": "Hologram" },
+      "tags": { "en": ["style", "background", "video"] },
+      "meta": {
+        "uri": "{{base_url}}/ly.img.memories.style/videos/hologram.mp4",
+        "thumbUri": "{{base_url}}/ly.img.memories.style/thumbnails/hologram.png",
+        "kind": "video",
+        "fillType": "//ly.img.ubq/fill/video",
+        "mimeType": "video/mp4",
+        "width": 1080,
+        "height": 1920,
+        "duration": "10"
+      }
+    },
+    {
+      "id": "bubblegum",
+      "label": { "en": "Bubblegum" },
+      "tags": { "en": ["style", "background", "video"] },
+      "meta": {
+        "uri": "{{base_url}}/ly.img.memories.style/videos/bubblegum.mp4",
+        "thumbUri": "{{base_url}}/ly.img.memories.style/thumbnails/bubblegum.png",
+        "kind": "video",
+        "fillType": "//ly.img.ubq/fill/video",
+        "mimeType": "video/mp4",
+        "width": 1080,
+        "height": 1920,
+        "duration": "10"
+      }
+    }
+  ]
+}

package/android/src/main/kotlin/ly/img/editor/configuration/memories/MemoriesApp.kt

@@ -0,0 +1,77 @@
+package ly.img.editor.configuration.memories
+
+import androidx.activity.compose.BackHandler
+import androidx.compose.foundation.layout.padding
+import androidx.compose.material3.Scaffold
+import androidx.compose.runtime.Composable
+import androidx.compose.runtime.LaunchedEffect
+import androidx.compose.runtime.getValue
+import androidx.compose.runtime.mutableStateOf
+import androidx.compose.runtime.saveable.rememberSaveable
+import androidx.compose.runtime.setValue
+import androidx.compose.ui.Modifier
+import androidx.compose.ui.platform.LocalContext
+import androidx.lifecycle.viewmodel.compose.viewModel
+import ly.img.editor.configuration.memories.screen.ImageSelectionScreen
+
+enum class AppScreen {
+    ImageSelection,
+    VideoEditor,
+}
+
+/**
+ * The complete Memories experience: photo picker (device images and videos) →
+ * loading/analysis → cinematic slideshow editor.
+ *
+ * This is the single entry point used by every host — the standalone app, the examples app, and
+ * the showcases app — so the flow is identical everywhere.
+ *
+ * @param license CE.SDK license key, or null for evaluation mode (adds a watermark).
+ * @param onExit invoked when the user navigates back from the picker (the root of the flow) —
+ * e.g. finish the activity (standalone) or pop the back stack (demo apps).
+ */
+@Composable
+fun MemoriesApp(
+    license: String?,
+    onExit: () -> Unit,
+    modifier: Modifier = Modifier,
+    viewModel: MemoriesViewModel = viewModel(),
+) {
+    val context = LocalContext.current
+    var currentScreen by rememberSaveable { mutableStateOf(AppScreen.ImageSelection) }
+
+    LaunchedEffect(viewModel) {
+        viewModel.setContext(context)
+        // After process death the saved screen can restore to the editor while the ViewModel is
+        // recreated empty — don't land in the editor with no media; return to the picker instead.
+        if (currentScreen == AppScreen.VideoEditor && viewModel.selectedImages.value.isEmpty()) {
+            currentScreen = AppScreen.ImageSelection
+        }
+    }
+
+    when (currentScreen) {
+        AppScreen.ImageSelection -> {
+            // Back from the picker leaves the flow. ImageSelectionScreen registers its own
+            // (higher-priority) BackHandler for multi-select mode, so this only fires otherwise.
+            BackHandler { onExit() }
+            Scaffold { paddingValues ->
+                ImageSelectionScreen(
+                    viewModel = viewModel,
+                    onProceedToEditor = {
+                        viewModel.setEditorLoading(true)
+                        currentScreen = AppScreen.VideoEditor
+                    },
+                    modifier = modifier.padding(paddingValues),
+                )
+            }
+        }
+        AppScreen.VideoEditor -> {
+            MemoriesEditor(
+                license = license,
+                viewModel = viewModel,
+                onCloseEditor = { currentScreen = AppScreen.ImageSelection },
+                modifier = modifier,
+            )
+        }
+    }
+}

package/android/src/main/kotlin/ly/img/editor/configuration/memories/MemoriesConfiguration.kt

@@ -0,0 +1,38 @@
+package ly.img.editor.configuration.memories
+
+import androidx.compose.runtime.getValue
+import androidx.compose.runtime.setValue
+import ly.img.editor.BasicConfigurationBuilder
+import ly.img.editor.configuration.memories.callback.onCreateConfiguration
+import ly.img.editor.configuration.memories.callback.onExport
+import ly.img.editor.configuration.memories.component.bottomPanelConfiguration
+import ly.img.editor.configuration.memories.component.dockConfiguration
+import ly.img.editor.configuration.memories.component.navigationBarConfiguration
+import ly.img.editor.configuration.memories.component.rememberOverlay
+import ly.img.editor.configuration.memories.model.ExportStatus
+
+class MemoriesConfiguration(
+    private val viewModel: MemoriesViewModel,
+) : BasicConfigurationBuilder() {
+    /** Drives the export progress overlay; null when no export is running. */
+    var exportStatus: ExportStatus? by editorContext.mutableStateOf(key = KEY_EXPORT_STATUS, initial = null)
+
+    init {
+        onCreate = onCreateConfiguration(viewModel)
+        dock = dockConfiguration(viewModel)
+        bottomPanel = bottomPanelConfiguration(viewModel)
+        navigationBar = navigationBarConfiguration(viewModel)
+        overlay = { rememberOverlay(viewModel) }
+        onExport = { onExport() }
+        // If onCreate (or any editor step) fails, never leave the loading overlay stuck: dismiss it
+        // and surface the failure through the standard error dialog (BasicConfigurationBuilder.Overlay).
+        onError = {
+            viewModel.setEditorLoading(false)
+            error = it
+        }
+    }
+
+    private companion object {
+        const val KEY_EXPORT_STATUS = "ly.img.editor.configuration.memories.exportStatus"
+    }
+}

package/android/src/main/kotlin/ly/img/editor/configuration/memories/MemoriesEditor.kt

@@ -0,0 +1,79 @@
+package ly.img.editor.configuration.memories
+
+import androidx.activity.compose.BackHandler
+import androidx.compose.animation.core.animateFloatAsState
+import androidx.compose.foundation.layout.Box
+import androidx.compose.foundation.layout.fillMaxSize
+import androidx.compose.runtime.Composable
+import androidx.compose.runtime.DisposableEffect
+import androidx.compose.runtime.collectAsState
+import androidx.compose.runtime.getValue
+import androidx.compose.ui.Modifier
+import androidx.compose.ui.draw.alpha
+import ly.img.editor.Editor
+import ly.img.editor.configuration.memories.screen.LoadingScreen
+import ly.img.editor.core.configuration.EditorConfiguration
+import ly.img.editor.core.configuration.remember
+
+/**
+ * Hosts the slideshow [Editor] for the images staged in [viewModel], with the loading overlay
+ * shown while the scene is built and back handling for preview / image-grid overlay.
+ *
+ * @param license CE.SDK license key, or null for evaluation mode (adds a watermark).
+ */
+@Composable
+fun MemoriesEditor(
+    license: String?,
+    viewModel: MemoriesViewModel,
+    onCloseEditor: () -> Unit,
+    modifier: Modifier = Modifier,
+) {
+    val selectedImages by viewModel.selectedImages.collectAsState()
+    val isLoading by viewModel.isEditorLoading.collectAsState()
+    val showImageGrid by viewModel.showImageGrid.collectAsState()
+    val isPreviewMode by viewModel.isPreviewMode.collectAsState()
+
+    val alpha by animateFloatAsState(
+        targetValue = if (isLoading) 0f else 1f,
+        label = "editor_alpha",
+    )
+
+    // Release the editor context when the editor leaves composition (back, close, process death),
+    // so the ViewModel doesn't keep acting on a disposed editor afterwards.
+    DisposableEffect(viewModel) {
+        onDispose { viewModel.clearEditorContext() }
+    }
+
+    // Factory typed as Function0 so it binds to the generic remember(builder, block) overload.
+    val configurationBuilder: () -> MemoriesConfiguration = { MemoriesConfiguration(viewModel) }
+
+    Box(modifier = modifier.fillMaxSize().alpha(alpha)) {
+        Editor(
+            license = license,
+            configuration = { EditorConfiguration.remember(configurationBuilder) },
+            onClose = { onCloseEditor() },
+        )
+    }
+
+    if (isLoading) {
+        LoadingScreen(
+            selectedImages = selectedImages,
+            modifier = modifier.fillMaxSize(),
+        )
+    }
+
+    // Back handling (registered after the Editor, so these intercept first).
+    // In fullscreen/preview: exit preview (applies nothing).
+    BackHandler(enabled = isPreviewMode) {
+        viewModel.togglePreviewMode()
+    }
+    // Image grid overlay open: close it, discarding staged edits.
+    BackHandler(enabled = !isPreviewMode && showImageGrid) {
+        viewModel.cancelOverlay()
+    }
+    BackHandler(enabled = !isPreviewMode && !showImageGrid) {
+        onCloseEditor()
+    }
+    // Otherwise the editor handles back internally (closing sheets), falling back to onClose,
+    // which returns to the image selection screen.
+}