Expose overlay config to platform story Composables

Author: bnorm

storyboard-easel/src/jvmMain/kotlin/dev/bnorm/storyboard/easel/DesktopStory.kt

@@ -18,6 +18,7 @@ import dev.bnorm.storyboard.easel.export.ExportProgressPopup
 import dev.bnorm.storyboard.easel.export.StoryboardPdfExporter
 import dev.bnorm.storyboard.easel.notes.StoryNotes
 import dev.bnorm.storyboard.easel.overlay.OverlayNavigation
+import dev.bnorm.storyboard.easel.overlay.StoryOverlayScope
 import kotlinx.coroutines.launch
 
 @OptIn(ExperimentalStoryStateApi::class)
@@ -35,7 +36,12 @@ fun ApplicationScope.DesktopStory(storyboard: Storyboard) {
  */
 @Composable
 @ExperimentalStoryStateApi
-fun ApplicationScope.DesktopStory(storyState: StoryState) {
+fun ApplicationScope.DesktopStory(
+    storyState: StoryState,
+    overlay: @Composable StoryOverlayScope.() -> Unit = {
+        OverlayNavigation(storyState)
+    },
+) {
     val notes = remember { StoryNotes() }
     val desktopState = rememberDesktopState(storyState.storyboard)
 
@@ -89,7 +95,7 @@ fun ApplicationScope.DesktopStory(storyState: StoryState) {
             overlay = {
                 // Only display overlay navigation when *not* fullscreen.
                 if (desktopState.storyboard.placement != WindowPlacement.Fullscreen) {
-                    OverlayNavigation(storyState)
+                    overlay()
                 }
             },
             modifier = Modifier.fillMaxSize()

storyboard-easel/src/wasmJsMain/kotlin/dev/bnorm/storyboard/easel/WebStory.kt

@@ -11,6 +11,7 @@ import dev.bnorm.storyboard.core.ExperimentalStoryStateApi
 import dev.bnorm.storyboard.core.StoryState
 import dev.bnorm.storyboard.core.Storyboard
 import dev.bnorm.storyboard.easel.overlay.OverlayNavigation
+import dev.bnorm.storyboard.easel.overlay.StoryOverlayScope
 import kotlinx.browser.window
 import org.w3c.dom.url.URL
 import org.w3c.dom.url.URLSearchParams
@@ -35,7 +36,20 @@ fun WebStory(storyboard: Storyboard) {
             it.updateStoryboard(storyboard)
         }
     }
-    val overview = remember(storyboard) {
+
+    WebStory(storyState)
+}
+
+@Composable
+fun WebStory(
+    storyState: StoryState,
+    overlay: @Composable StoryOverlayScope.() -> Unit = {
+        OverlayNavigation(storyState)
+    },
+) {
+    // TODO should we be exposing overview as a param?
+    //  - we don't support this on desktop...
+    val overview = remember(storyState) {
         val params = URLSearchParams(window.location.search.toJsString())
 
         StoryOverview.of(storyState).apply {
@@ -52,7 +66,7 @@ fun WebStory(storyboard: Storyboard) {
         overview = overview,
         overlay = {
             // TODO if this is a mobile device, prefer touch navigation
-            OverlayNavigation(storyState)
+            overlay()
         },
         modifier = Modifier.fillMaxSize()
             .background(MaterialTheme.colors.background),