elit 3.6.9 → 3.7.0

package/dist/index.mjs

@@ -8608,8 +8608,12 @@ function buildComposeChunkedRowArguments(style2, modifier, columnGap, styleResol
   }
   return args.join(", ");
 }
-function buildComposeChunkedTrackModifier(baseModifier, row) {
+function buildComposeChunkedTrackModifier(baseModifier, row, options = {}) {
+  const fillWidth = options.fillWidth ?? true;
   let modifier = baseModifier;
+  if (row.trackWeight !== void 0) {
+    modifier = appendComposeModifierCall(modifier, `weight(${formatFloat(row.trackWeight)}f, fill = true)`);
+  }
   if (row.height !== void 0) {
     modifier = appendComposeModifierCall(modifier, `height(${formatFloat(row.height)}.dp)`);
   } else if (row.minHeight !== void 0 || row.maxHeight !== void 0) {
@@ -8622,7 +8626,7 @@ function buildComposeChunkedTrackModifier(baseModifier, row) {
     }
     modifier = appendComposeModifierCall(modifier, `heightIn(${heightInArgs.join(", ")})`);
   }
-  return row.trackWeight !== void 0 ? appendComposeModifierCall(modifier, `weight(${formatFloat(row.trackWeight)}f, fill = true)`) : modifier;
+  return fillWidth ? appendComposeModifierCall(modifier, "fillMaxWidth()") : modifier;
 }
 function buildComposeChunkedColumnArrangement(layout) {
   const contentAlignment = resolveEffectiveChunkedContentAlignment(layout);
@@ -10371,7 +10375,7 @@ function renderComposeChunkedLayout(node, layout, level, context, modifier, hint
   const usesSingleRowGridStackAlignment = layout.kind === "grid" && layout.rows.length === 1 && effectiveContentAlignment !== void 0 && effectiveContentAlignment !== "start";
   if (layout.kind === "grid" && layout.rows.length === 1 && !usesSingleRowGridStackAlignment) {
     const [row] = layout.rows;
-    const lines2 = [`${indent4(level)}Row(${buildComposeChunkedRowArguments(style2, buildComposeChunkedTrackModifier(modifier, row), layout.columnGap, context.styleResolveOptions)}) {`];
+    const lines2 = [`${indent4(level)}Row(${buildComposeChunkedRowArguments(style2, buildComposeChunkedTrackModifier(modifier, row, { fillWidth: false }), layout.columnGap, context.styleResolveOptions)}) {`];
     const totalWeight = row.weights ? row.weights.reduce((sum, entry) => sum + (entry ?? 0), 0) : void 0;
     row.items.forEach((child, index) => {
       const weight = row.weights?.[index];
@@ -10403,7 +10407,7 @@ function renderComposeChunkedLayout(node, layout, level, context, modifier, hint
   const lines = [`${indent4(level)}Column(modifier = ${modifier}${outerGap ? `, verticalArrangement = ${outerGap}` : ""}) {`];
   for (const row of layout.rows) {
     const totalWeight = row.weights ? row.weights.reduce((sum, entry) => sum + (entry ?? 0), 0) : void 0;
-    lines.push(`${indent4(level + 1)}Row(${buildComposeChunkedRowArguments(style2, buildComposeChunkedTrackModifier("Modifier.fillMaxWidth()", row), layout.columnGap, context.styleResolveOptions)}) {`);
+    lines.push(`${indent4(level + 1)}Row(${buildComposeChunkedRowArguments(style2, buildComposeChunkedTrackModifier("Modifier", row), layout.columnGap, context.styleResolveOptions)}) {`);
     row.items.forEach((child, index) => {
       const weight = row.weights?.[index];
       const columnSize = row.columnSizes?.[index];
@@ -10841,7 +10845,7 @@ function renderComposeContainerNode(node, level, context, hints, modifier, baseL
   }
   const lines = [
     ...baseLines,
-    `${indent7(level)}Box {`,
+    `${indent7(level)}Box(modifier = Modifier.matchParentSize()) {`,
     ...renderComposeContainerBody(flowNode, level + 1, context, modifier, hints, renderComposeNode)
   ];
   absoluteChildren.forEach((child) => {
@@ -10858,6 +10862,18 @@ function renderComposeContainerNode(node, level, context, hints, modifier, baseL
   lines.push(`${indent7(level)}}`);
   return lines;
 }
+function renderComposeUnsupportedFallback(node, level, context, modifier, baseLines, label2) {
+  context.helperFlags.add("unsupportedPlaceholder");
+  const sourceTag = node.sourceTag ?? node.component.toLowerCase();
+  const args = [`label = ${quoteKotlinString(label2)}`, `sourceTag = ${quoteKotlinString(sourceTag)}`];
+  if (modifier !== "Modifier") {
+    args.push(`modifier = ${modifier}`);
+  }
+  return [
+    ...baseLines,
+    `${indent7(level)}ElitUnsupported(${args.join(", ")})`
+  ];
+}
 function renderComposeNode(node, level, context, hints = {}) {
   if (node.kind === "text") {
     return renderTextComposable(node, level, context);
@@ -10930,8 +10946,11 @@ function renderComposeNode(node, level, context, hints = {}) {
     ];
   }
   if (node.component === "WebView") {
+    const source2 = resolveNativeSurfaceSource(node);
+    if (!source2) {
+      return renderComposeUnsupportedFallback(node, level, context, modifier, baseLines, "WebView");
+    }
     context.helperFlags.add("webViewSurface");
-    const source2 = resolveNativeSurfaceSource(node) ?? "";
     const label3 = resolveNativeAccessibilityLabel(node) ?? "Web content";
     return [
       ...baseLines,
@@ -10939,8 +10958,11 @@ function renderComposeNode(node, level, context, hints = {}) {
     ];
   }
   if (node.component === "Media") {
+    const source2 = resolveNativeSurfaceSource(node);
+    if (!source2) {
+      return renderComposeUnsupportedFallback(node, level, context, modifier, baseLines, "Media");
+    }
     context.helperFlags.add("mediaSurface");
-    const source2 = resolveNativeSurfaceSource(node) ?? "";
     const label3 = resolveNativeMediaLabel(node);
     const style2 = getStyleObject(node, context.resolvedStyles, context.styleResolveOptions);
     const objectFit = resolveNativeObjectFitStyle(style2);
@@ -10957,19 +10979,44 @@ function renderComposeNode(node, level, context, hints = {}) {
     const poster = resolveNativeVideoPoster(node);
     const controls = shouldNativeShowVideoControls(node);
     const playsInline = shouldNativePlayInline(node);
+    const videoArgs = [
+      `source = ${quoteKotlinString(source2)}`,
+      `label = ${quoteKotlinString(label3)}`,
+      `autoPlay = ${autoPlay ? "true" : "false"}`,
+      `loop = ${loop ? "true" : "false"}`,
+      `muted = ${muted ? "true" : "false"}`,
+      `controls = ${controls ? "true" : "false"}`,
+      `poster = ${poster ? quoteKotlinString(poster) : "null"}`,
+      `playsInline = ${playsInline ? "true" : "false"}`
+    ];
+    if (objectFit !== "cover") {
+      videoArgs.push(`posterFit = ${quoteKotlinString(objectFit)}`);
+    }
+    if (objectPosition !== "center") {
+      videoArgs.push(`posterPosition = ${quoteKotlinString(objectPosition)}`);
+    }
+    videoArgs.push(`modifier = ${modifier}`);
     return [
       ...baseLines,
-      `${indent7(level)}ElitVideoSurface(source = ${quoteKotlinString(source2)}, label = ${quoteKotlinString(label3)}, autoPlay = ${autoPlay ? "true" : "false"}, loop = ${loop ? "true" : "false"}, muted = ${muted ? "true" : "false"}, controls = ${controls ? "true" : "false"}, playsInline = ${playsInline ? "true" : "false"}${poster ? `, poster = ${quoteKotlinString(poster)}` : ""}${objectFit !== "cover" ? `, posterFit = ${quoteKotlinString(objectFit)}` : ""}${objectPosition !== "center" ? `, posterPosition = ${quoteKotlinString(objectPosition)}` : ""}, modifier = ${modifier})`
+      `${indent7(level)}ElitVideoSurface(${videoArgs.join(", ")})`
     ];
   }
+  if (node.component === "Math") {
+    return renderComposeUnsupportedFallback(node, level, context, modifier, baseLines, "Math");
+  }
   if (node.component === "Cell") {
     const style2 = getStyleObject(node, context.resolvedStyles, context.styleResolveOptions);
+    const hasExplicitWidth = hasExplicitNativeWidthStyle(style2);
     const cellHints = {
       ...hints,
-      ...!hasExplicitNativeWidthStyle(style2) ? { fillWidth: true } : {},
+      ...!hasExplicitWidth ? { fillWidth: true } : {},
       ...!hasExplicitNativeHeightStyle(style2) && hints.fillHeight ? { fillHeight: true } : {}
     };
-    return renderComposeContainerNode(node, level, context, cellHints, modifier, baseLines);
+    let cellModifier = modifier;
+    if (hints.parentFlexLayout === "Row" && !hasExplicitWidth) {
+      cellModifier = cellModifier === "Modifier" ? "Modifier.weight(1f, fill = true)" : cellModifier.replace(/^Modifier\./, "Modifier.weight(1f, fill = true).");
+    }
+    return renderComposeContainerNode(node, level, context, cellHints, cellModifier, baseLines);
   }
   if (node.children.length > 0 || node.component === "Screen") {
     return renderComposeContainerNode(node, level, context, hints, modifier, baseLines);
@@ -10986,11 +11033,13 @@ function buildAndroidComposeHelpers(context) {
   if (context.helperFlags.has("bridge")) {
     helpers.push("");
     helpers.push("private object ElitNativeBridge {");
+    helpers.push("    var onAction: ((String, String?, String?) -> Unit)? = null");
+    helpers.push("    var onNavigate: ((String) -> Unit)? = null");
     helpers.push("    fun dispatch(action: String? = null, route: String? = null, payloadJson: String? = null) {");
     helpers.push('        android.util.Log.d("ElitNativeBridge", listOfNotNull(action, route, payloadJson).joinToString(" | "))');
     helpers.push("    }");
     helpers.push("");
-    helpers.push("    fun controlEventPayload(event: String, sourceTag: String, inputType: String? = null, value: String? = null, values: List<String>? = null, checked: Boolean? = null, detailJson: String? = null): String {");
+    helpers.push("    fun controlEventPayload(event: String, sourceTag: String, inputType: String? = null, value: String? = null, values: Iterable<String>? = null, checked: Boolean? = null, detailJson: String? = null): String {");
     helpers.push("        val parts = mutableListOf<String>()");
     helpers.push('        parts += ""event":"$event""');
     helpers.push('        parts += ""sourceTag":"$sourceTag""');
@@ -11014,33 +11063,50 @@ function buildAndroidComposeHelpers(context) {
     helpers.push("}");
   }
   if (context.helperFlags.has("backgroundImage") || context.helperFlags.has("imagePlaceholder")) {
+    helpers.push("");
+    helpers.push("private fun elitLoadBackgroundBitmap(view: android.widget.ImageView, source: String, repeatMode: String, backgroundSize: String, backgroundPosition: String) {");
+    helpers.push("    if (source.isBlank()) return");
+    helpers.push('    val tileModeX = if (repeatMode == "repeat-y") android.graphics.Shader.TileMode.CLAMP else android.graphics.Shader.TileMode.REPEAT');
+    helpers.push('    val tileModeY = if (repeatMode == "repeat-x") android.graphics.Shader.TileMode.CLAMP else android.graphics.Shader.TileMode.REPEAT');
+    helpers.push("    view.scaleType = android.widget.ImageView.ScaleType.CENTER_CROP");
+    helpers.push('    if (repeatMode == "no-repeat" || repeatMode == "round") {');
+    helpers.push("        view.setImageURI(android.net.Uri.parse(source))");
+    helpers.push("    } else {");
+    helpers.push("        val bitmap = android.graphics.BitmapFactory.decodeStream(android.net.Uri.parse(source).let { runCatching { view.context.contentResolver.openInputStream(it) }.getOrNull() })");
+    helpers.push("        if (bitmap != null) view.setImageDrawable(android.graphics.drawable.BitmapDrawable(view.resources, bitmap).apply { tileModeX = tileModeX; tileModeY = tileModeY })");
+    helpers.push("    }");
+    helpers.push("}");
     helpers.push("");
     helpers.push("@Composable");
     helpers.push('private fun ElitBackgroundImage(source: String, backgroundSize: String = "cover", backgroundPosition: String = "center", backgroundRepeat: String = "no-repeat", modifier: Modifier = Modifier) {');
     helpers.push("    androidx.compose.ui.viewinterop.AndroidView(");
     helpers.push("        factory = { context -> android.widget.ImageView(context).apply {");
-    helpers.push("            scaleType = android.widget.ImageView.ScaleType.CENTER_CROP");
-    helpers.push("            if (source.isNotBlank()) setImageURI(android.net.Uri.parse(source))");
+    helpers.push("            elitLoadBackgroundBitmap(this, source, backgroundRepeat, backgroundSize, backgroundPosition)");
     helpers.push("        } },");
     helpers.push("        modifier = modifier,");
     helpers.push("    )");
     helpers.push("}");
     helpers.push("");
     helpers.push("@Composable");
-    helpers.push('private fun ElitImageSurface(source: String, label: String, alt: String? = null, modifier: Modifier = Modifier, objectFit: String = "cover", objectPosition: String = "center") {');
+    helpers.push('private fun ElitImageSurface(source: String, label: String, contentDescription: String?, objectFit: String = "cover", objectPosition: String = "center", modifier: Modifier = Modifier) {');
     helpers.push("    if (source.isBlank()) {");
     helpers.push("        Box(modifier = modifier, contentAlignment = Alignment.Center) {");
-    helpers.push("            Text(text = alt ?: label)");
+    helpers.push("            Text(text = contentDescription ?: label)");
     helpers.push("        }");
     helpers.push("        return");
     helpers.push("    }");
-    helpers.push("    ElitBackgroundImage(source = source, backgroundSize = objectFit, backgroundPosition = objectPosition, modifier = modifier)");
+    helpers.push("    androidx.compose.ui.viewinterop.AndroidView(");
+    helpers.push("        factory = { context -> android.widget.ImageView(context).apply {");
+    helpers.push('            elitLoadBackgroundBitmap(this, source, "no-repeat", objectFit, objectPosition)');
+    helpers.push("        } },");
+    helpers.push("        modifier = modifier,");
+    helpers.push("    )");
     helpers.push("}");
   }
   if (context.helperFlags.has("webViewSurface")) {
     helpers.push("");
     helpers.push("@Composable");
-    helpers.push("private fun ElitWebViewSurface(source: String, label: String, modifier: Modifier = Modifier) {");
+    helpers.push("private fun ElitWebViewSurface(source: String, label: String?, modifier: Modifier = Modifier) {");
     helpers.push("    androidx.compose.ui.viewinterop.AndroidView(");
     helpers.push("        factory = { context -> android.webkit.WebView(context).apply {");
     helpers.push("            contentDescription = label");
@@ -11052,18 +11118,58 @@ function buildAndroidComposeHelpers(context) {
     helpers.push("}");
   }
   if (context.helperFlags.has("mediaSurface")) {
+    helpers.push("");
+    helpers.push("private fun elitVideoPosterScaleType(posterFit: String, posterPosition: String): android.widget.ImageView.ScaleType = when (posterFit.trim().lowercase()) {");
+    helpers.push('    "contain", "scale-down" -> when (posterPosition.trim().lowercase()) {');
+    helpers.push('        "top", "leading", "top-leading", "bottom-leading" -> android.widget.ImageView.ScaleType.FIT_START');
+    helpers.push('        "bottom", "trailing", "bottom-trailing" -> android.widget.ImageView.ScaleType.FIT_END');
+    helpers.push("        else -> android.widget.ImageView.ScaleType.FIT_CENTER");
+    helpers.push("    }");
+    helpers.push("    else -> android.widget.ImageView.ScaleType.CENTER_CROP");
+    helpers.push("}");
     helpers.push("");
     helpers.push("@Composable");
-    helpers.push('private fun ElitVideoSurface(source: String, label: String, autoPlay: Boolean, loop: Boolean, muted: Boolean, controls: Boolean, playsInline: Boolean, poster: String? = null, posterFit: String = "cover", posterPosition: String = "center", modifier: Modifier = Modifier) {');
+    helpers.push('private fun ElitVideoSurface(source: String, label: String, autoPlay: Boolean, loop: Boolean, muted: Boolean, controls: Boolean, poster: String?, playsInline: Boolean, posterFit: String = "cover", posterPosition: String = "center", modifier: Modifier = Modifier) {');
+    helpers.push("    // Android VideoView already renders inline; playsInline is retained for parity with iOS generation.");
     helpers.push("    Box(modifier = modifier, contentAlignment = Alignment.Center) {");
-    helpers.push('        Text(text = if (autoPlay) "Playing $label" else label)');
+    helpers.push("        androidx.compose.ui.viewinterop.AndroidView(");
+    helpers.push("            factory = { context ->");
+    helpers.push("                android.widget.ImageView(context).apply {");
+    helpers.push("                    val posterView = this");
+    helpers.push("                    posterView.contentDescription = label");
+    helpers.push("                    posterView.scaleType = elitVideoPosterScaleType(posterFit, posterPosition)");
+    helpers.push("                    if (poster != null) posterView.setImageURI(android.net.Uri.parse(poster))");
+    helpers.push("                }");
+    helpers.push("            },");
+    helpers.push("        )");
+    helpers.push("        if (controls) {");
+    helpers.push("            // Hand off to platform chrome; ElitVideoSurface exposes controls for parity only.");
+    helpers.push("        }");
     helpers.push("    }");
     helpers.push("}");
     helpers.push("");
     helpers.push("@Composable");
     helpers.push("private fun ElitAudioSurface(source: String, label: String, autoPlay: Boolean, loop: Boolean, muted: Boolean, modifier: Modifier = Modifier) {");
-    helpers.push("    Button(onClick = {}, modifier = modifier) {");
-    helpers.push("        Text(text = label)");
+    helpers.push("    androidx.compose.ui.viewinterop.AndroidView(");
+    helpers.push("        factory = { context ->");
+    helpers.push("            android.media.MediaPlayer().apply {");
+    helpers.push("                val mediaPlayer = this");
+    helpers.push("                mediaPlayer.isLooping = loop");
+    helpers.push("                mediaPlayer.setVolume(if (muted) 0f else 1f, if (muted) 0f else 1f)");
+    helpers.push("                if (source.isNotBlank()) setDataSource(source)");
+    helpers.push("                if (autoPlay) start()");
+    helpers.push("            }");
+    helpers.push("        },");
+    helpers.push("        modifier = modifier,");
+    helpers.push("    )");
+    helpers.push("}");
+  }
+  if (context.helperFlags.has("unsupportedPlaceholder")) {
+    helpers.push("");
+    helpers.push("@Composable");
+    helpers.push("private fun ElitUnsupported(label: String, sourceTag: String, modifier: Modifier = Modifier) {");
+    helpers.push("    Box(modifier = modifier, contentAlignment = Alignment.Center) {");
+    helpers.push('        Text(text = "$label ($sourceTag)")');
     helpers.push("    }");
     helpers.push("}");
   }
@@ -11094,11 +11200,27 @@ function renderAndroidCompose(input2, options = {}) {
     resolvedStyles: styleData.resolvedStyles,
     styleContexts: styleData.styleContexts
   };
-  const bodyLines = tree.roots.length === 1 ? renderComposeNode(tree.roots[0], 1, context, { availableWidth: styleResolveOptions.viewportWidth, availableHeight: styleResolveOptions.viewportHeight }) : [
-    "    Column(modifier = Modifier.fillMaxSize()) {",
-    ...renderComposeChildren(tree.roots, 2, context, renderComposeNode, "Column", void 0, { availableWidth: styleResolveOptions.viewportWidth, availableHeight: styleResolveOptions.viewportHeight }),
-    "    }"
-  ];
+  const singleRoot = tree.roots.length === 1 ? tree.roots[0] : null;
+  const isSingleScreenRoot = singleRoot !== null && singleRoot.kind === "element" && singleRoot.component === "Screen";
+  if (isSingleScreenRoot) {
+    context.helperFlags.add("screenRoot");
+  }
+  let bodyLines;
+  if (isSingleScreenRoot) {
+    bodyLines = [
+      "    Column(modifier = Modifier.fillMaxSize().verticalScroll(rememberScrollState())) {",
+      ...renderComposeNode(tree.roots[0], 2, context, { availableWidth: styleResolveOptions.viewportWidth, availableHeight: styleResolveOptions.viewportHeight }),
+      "    }"
+    ];
+  } else if (tree.roots.length === 1) {
+    bodyLines = renderComposeNode(tree.roots[0], 1, context, { availableWidth: styleResolveOptions.viewportWidth, availableHeight: styleResolveOptions.viewportHeight });
+  } else {
+    bodyLines = [
+      "    Column(modifier = Modifier.fillMaxSize()) {",
+      ...renderComposeChildren(tree.roots, 2, context, renderComposeNode, "Column", void 0, { availableWidth: styleResolveOptions.viewportWidth, availableHeight: styleResolveOptions.viewportHeight }),
+      "    }"
+    ];
+  }
   const lines = [];
   if (resolvedOptions.includePackage) {
     lines.push(`package ${resolvedOptions.packageName}`);
@@ -11998,6 +12120,18 @@ function renderSwiftUIContainerNode(node, level, context, hints, baseLines) {
   ];
   return [...baseLines, ...appendSwiftUIOverlays(contentLines, overlays, level)];
 }
+function renderSwiftUnsupportedFallback(node, level, context, baseLines, modifiers, label2) {
+  context.helperFlags.add("unsupportedPlaceholder");
+  const sourceTag = node.sourceTag ?? node.component.toLowerCase();
+  return appendSwiftUIModifiers(
+    [
+      ...baseLines,
+      `${indent11(level)}elitUnsupportedPlaceholder(label: ${quoteSwiftString(label2)}, sourceTag: ${quoteSwiftString(sourceTag)})`
+    ],
+    modifiers,
+    level
+  );
+}
 function renderSwiftUINode(node, level, context, hints = {}) {
   if (node.kind === "text") {
     return renderTextView(node, level, context);
@@ -12031,10 +12165,21 @@ function renderSwiftUINode(node, level, context, hints = {}) {
     const imageStyle = getStyleObject(node, context.resolvedStyles, context.styleResolveOptions);
     const objectFit = resolveNativeObjectFitStyle(imageStyle);
     const objectPosition = resolveNativeObjectPositionStyle(imageStyle);
+    const imageArgs = [
+      `source: ${quoteSwiftString(source2)}`,
+      `label: ${quoteSwiftString(fallbackLabel)}`,
+      `alt: ${alt ? quoteSwiftString(alt) : "nil"}`
+    ];
+    if (objectFit !== "cover") {
+      imageArgs.push(`objectFit: ${quoteSwiftString(objectFit)}`);
+    }
+    if (objectPosition !== "center") {
+      imageArgs.push(`objectPosition: ${quoteSwiftString(objectPosition)}`);
+    }
     return appendSwiftUIModifiers(
       [
         ...baseLines,
-        `${indent11(level)}elitImageSurface(source: ${quoteSwiftString(source2)}, label: ${quoteSwiftString(fallbackLabel)}, alt: ${alt ? quoteSwiftString(alt) : "nil"}, objectFit: ${quoteSwiftString(objectFit)}, objectPosition: ${quoteSwiftString(objectPosition)})`
+        `${indent11(level)}elitImageSurface(${imageArgs.join(", ")})`
       ],
       modifiers,
       level
@@ -12069,33 +12214,38 @@ function renderSwiftUINode(node, level, context, hints = {}) {
     return [...baseLines, ...appendSwiftUIModifiers(canvas2.lines, canvas2.modifiers, level)];
   }
   if (node.component === "WebView") {
+    const source2 = resolveNativeSurfaceSource(node);
+    if (!source2) {
+      return renderSwiftUnsupportedFallback(node, level, context, baseLines, modifiers, "WebView");
+    }
     context.helperFlags.add("webViewSurface");
-    const source2 = resolveNativeSurfaceSource(node) ?? "";
     const label3 = resolveNativeAccessibilityLabel(node) ?? "Web content";
     return appendSwiftUIModifiers(
       [
         ...baseLines,
-        `${indent11(level)}elitWebViewSurface(source: ${quoteSwiftString(source2)}, label: ${quoteSwiftString(label3)})`
+        `${indent11(level)}ElitWebViewSurface(source: ${quoteSwiftString(source2)}, label: ${quoteSwiftString(label3)})`
       ],
       modifiers,
       level
     );
   }
   if (node.component === "Media") {
+    const source2 = resolveNativeSurfaceSource(node);
+    if (!source2) {
+      return renderSwiftUnsupportedFallback(node, level, context, baseLines, modifiers, "Media");
+    }
     context.helperFlags.add("mediaSurface");
-    const source2 = resolveNativeSurfaceSource(node) ?? "";
     const label3 = resolveNativeMediaLabel(node);
     const style2 = getStyleObject(node, context.resolvedStyles, context.styleResolveOptions);
     const objectFit = resolveNativeObjectFitStyle(style2);
     const objectPosition = resolveNativeObjectPositionStyle(style2);
     const autoPlay = toNativeBoolean(node.props.autoPlay ?? node.props.autoplay);
-    const loop = toNativeBoolean(node.props.loop);
     const muted = isNativeMuted(node);
     if (node.sourceTag === "audio") {
       return appendSwiftUIModifiers(
         [
           ...baseLines,
-          `${indent11(level)}ElitAudioSurface(source: ${quoteSwiftString(source2)}, label: ${quoteSwiftString(label3)}, autoPlay: ${autoPlay ? "true" : "false"}, loop: ${loop ? "true" : "false"}, muted: ${muted ? "true" : "false"})`
+          `${indent11(level)}ElitAudioSurface(source: ${quoteSwiftString(source2)}, label: ${quoteSwiftString(label3)}, autoPlay: ${autoPlay ? "true" : "false"}, muted: ${muted ? "true" : "false"})`
         ],
         modifiers,
         level
@@ -12104,15 +12254,33 @@ function renderSwiftUINode(node, level, context, hints = {}) {
     const poster = resolveNativeVideoPoster(node);
     const controls = shouldNativeShowVideoControls(node);
     const playsInline = shouldNativePlayInline(node);
+    const videoArgs = [
+      `source: ${quoteSwiftString(source2)}`,
+      `label: ${quoteSwiftString(label3)}`,
+      `autoPlay: ${autoPlay ? "true" : "false"}`,
+      `muted: ${muted ? "true" : "false"}`,
+      `controls: ${controls ? "true" : "false"}`,
+      `poster: ${poster ? quoteSwiftString(poster) : "nil"}`,
+      `playsInline: ${playsInline ? "true" : "false"}`
+    ];
+    if (objectFit !== "cover") {
+      videoArgs.push(`posterFit: ${quoteSwiftString(objectFit)}`);
+    }
+    if (objectPosition !== "center") {
+      videoArgs.push(`posterPosition: ${quoteSwiftString(objectPosition)}`);
+    }
     return appendSwiftUIModifiers(
       [
         ...baseLines,
-        `${indent11(level)}ElitVideoSurface(source: ${quoteSwiftString(source2)}, label: ${quoteSwiftString(label3)}, autoPlay: ${autoPlay ? "true" : "false"}, loop: ${loop ? "true" : "false"}, muted: ${muted ? "true" : "false"}, controls: ${controls ? "true" : "false"}, playsInline: ${playsInline ? "true" : "false"}${poster ? `, poster: ${quoteSwiftString(poster)}` : ""}, posterFit: ${quoteSwiftString(objectFit)}, posterPosition: ${quoteSwiftString(objectPosition)})`
+        `${indent11(level)}ElitVideoSurface(${videoArgs.join(", ")})`
       ],
       modifiers,
       level
     );
   }
+  if (node.component === "Math") {
+    return renderSwiftUnsupportedFallback(node, level, context, baseLines, modifiers, "Math");
+  }
   if (node.component === "Cell") {
     const style2 = getStyleObject(node, context.resolvedStyles, context.styleResolveOptions);
     const cellHints = {
@@ -12138,6 +12306,8 @@ function buildSwiftUIHelpers(context) {
   if (context.helperFlags.has("bridge")) {
     helpers.push("");
     helpers.push("private enum ElitNativeBridge {");
+    helpers.push("    static var onAction: ((String, String?, String?) -> Void)?");
+    helpers.push("    static var onNavigate: ((String) -> Void)?");
     helpers.push("    static func dispatch(action: String? = nil, route: String? = nil, payloadJson: String? = nil) {");
     helpers.push('        print("ElitNativeBridge", action ?? "", route ?? "", payloadJson ?? "")');
     helpers.push("    }");
@@ -12162,6 +12332,13 @@ function buildSwiftUIHelpers(context) {
     helpers.push("}");
   }
   if (context.helperFlags.has("backgroundImage") || context.helperFlags.has("imagePlaceholder")) {
+    helpers.push("");
+    helpers.push("@ViewBuilder");
+    helpers.push('private func elitBackgroundImage(_ image: Image, backgroundSize: String = "cover", backgroundPosition: String = "center", backgroundRepeat: String = "no-repeat") -> some View {');
+    helpers.push("    image");
+    helpers.push("        .resizable()");
+    helpers.push("        .scaledToFill()");
+    helpers.push("}");
     helpers.push("");
     helpers.push("@ViewBuilder");
     helpers.push('private func elitBackgroundImageSurface(source: String, objectFit: String = "cover", objectPosition: String = "center") -> some View {');
@@ -12169,9 +12346,7 @@ function buildSwiftUIHelpers(context) {
     helpers.push("        AsyncImage(url: url) { phase in");
     helpers.push("            switch phase {");
     helpers.push("            case .success(let image):");
-    helpers.push("                image");
-    helpers.push("                    .resizable()");
-    helpers.push("                    .scaledToFill()");
+    helpers.push('                elitBackgroundImage(image, backgroundSize: objectFit, backgroundPosition: objectPosition, backgroundRepeat: "no-repeat")');
     helpers.push("            default:");
     helpers.push("                Color.clear");
     helpers.push("            }");
@@ -12182,7 +12357,7 @@ function buildSwiftUIHelpers(context) {
     helpers.push("}");
     helpers.push("");
     helpers.push("@ViewBuilder");
-    helpers.push('private func elitImageSurface(source: String, label: String, alt: String? = nil, objectFit: String = "cover", objectPosition: String = "center") -> some View {');
+    helpers.push('private func elitImageSurface(source: String, label: String, alt: String?, objectFit: String = "cover", objectPosition: String = "center") -> some View {');
     helpers.push("    if source.isEmpty {");
     helpers.push("        Text(alt ?? label)");
     helpers.push("            .frame(maxWidth: .infinity, maxHeight: .infinity, alignment: .center)");
@@ -12193,31 +12368,131 @@ function buildSwiftUIHelpers(context) {
   }
   if (context.helperFlags.has("webViewSurface")) {
     helpers.push("");
-    helpers.push("@ViewBuilder");
-    helpers.push("private func elitWebViewSurface(source: String, label: String) -> some View {");
-    helpers.push("    VStack(alignment: .leading, spacing: 8) {");
-    helpers.push("        Text(label)");
-    helpers.push("        Text(source)");
-    helpers.push("            .font(.caption)");
-    helpers.push("            .foregroundStyle(.secondary)");
+    helpers.push("struct ElitWebViewSurface: UIViewRepresentable {");
+    helpers.push("    let source: String");
+    helpers.push("    let label: String?");
+    helpers.push("");
+    helpers.push("    func makeUIView(context: Context) -> WKWebView {");
+    helpers.push("        let webView = WKWebView()");
+    helpers.push("        webView.accessibilityLabel = label");
+    helpers.push("        if let url = URL(string: source), !source.isEmpty { webView.load(URLRequest(url: url)) }");
+    helpers.push("        return webView");
     helpers.push("    }");
+    helpers.push("");
+    helpers.push("    func updateUIView(_ uiView: WKWebView, context: Context) {}");
     helpers.push("}");
   }
   if (context.helperFlags.has("mediaSurface")) {
+    helpers.push("");
+    helpers.push("private func elitPosterAlignment(_ posterPosition: String) -> Alignment {");
+    helpers.push("    switch posterPosition.lowercased() {");
+    helpers.push('    case "top", "leading", "top-leading":');
+    helpers.push("        return .topLeading");
+    helpers.push('    case "bottom", "trailing", "bottom-trailing":');
+    helpers.push("        return .bottomTrailing");
+    helpers.push('    case "center":');
+    helpers.push("        return .center");
+    helpers.push("    default:");
+    helpers.push("        return .center");
+    helpers.push("    }");
+    helpers.push("}");
     helpers.push("");
     helpers.push("@ViewBuilder");
-    helpers.push('private func ElitVideoSurface(source: String, label: String, autoPlay: Bool, loop: Bool, muted: Bool, controls: Bool, playsInline: Bool, poster: String? = nil, posterFit: String = "cover", posterPosition: String = "center") -> some View {');
-    helpers.push("    VStack(alignment: .leading, spacing: 8) {");
-    helpers.push("        if let poster, !poster.isEmpty {");
-    helpers.push("            elitBackgroundImageSurface(source: poster, objectFit: posterFit, objectPosition: posterPosition)");
+    helpers.push("private func elitPosterImage(_ image: Image, posterFit: String, posterPosition: String) -> some View {");
+    helpers.push("    let resizable = image.resizable()");
+    helpers.push("    switch posterFit.lowercased() {");
+    helpers.push('    case "contain":');
+    helpers.push("        return AnyView(resizable.scaledToFit().frame(maxWidth: .infinity, maxHeight: .infinity, alignment: elitPosterAlignment(posterPosition)))");
+    helpers.push('    case "fill", "cover":');
+    helpers.push("        return AnyView(resizable.scaledToFill().frame(maxWidth: .infinity, maxHeight: .infinity, alignment: elitPosterAlignment(posterPosition)))");
+    helpers.push("    default:");
+    helpers.push("        return AnyView(resizable.scaledToFill())");
+    helpers.push("    }");
+    helpers.push("}");
+    helpers.push("");
+    helpers.push("struct ElitVideoPlayerController: UIViewControllerRepresentable {");
+    helpers.push("    let source: String");
+    helpers.push("    let autoPlay: Bool");
+    helpers.push("    let muted: Bool");
+    helpers.push("    let controls: Bool");
+    helpers.push("    let playsInline: Bool");
+    helpers.push("");
+    helpers.push("    func makeUIViewController(context: Context) -> AVPlayerViewController {");
+    helpers.push("        let controller = AVPlayerViewController()");
+    helpers.push("        if let url = URL(string: source) {");
+    helpers.push("            let player = AVPlayer(url: url)");
+    helpers.push("            let resolvedPlayer = player");
+    helpers.push("            resolvedPlayer.isMuted = muted");
+    helpers.push("            controller.player = resolvedPlayer");
+    helpers.push("            if autoPlay { resolvedPlayer.play() }");
     helpers.push("        }");
-    helpers.push("        Text(label)");
+    helpers.push("        controller.showsPlaybackControls = controls");
+    helpers.push("        controller.entersFullScreenWhenPlaybackBegins = !playsInline");
+    helpers.push("        return controller");
     helpers.push("    }");
+    helpers.push("");
+    helpers.push("    func updateUIViewController(_ controller: AVPlayerViewController, context: Context) {}");
     helpers.push("}");
+    helpers.push("");
+    helpers.push("struct ElitVideoSurface: View {");
+    helpers.push("    let source: String");
+    helpers.push("    let label: String");
+    helpers.push("    let autoPlay: Bool");
+    helpers.push("    let muted: Bool");
+    helpers.push("    let controls: Bool");
+    helpers.push("    let poster: String?");
+    helpers.push("    let playsInline: Bool");
+    helpers.push("    let posterFit: String");
+    helpers.push("    let posterPosition: String");
+    helpers.push("");
+    helpers.push("    var body: some View {");
+    helpers.push("        ZStack {");
+    helpers.push("            if let poster, !poster.isEmpty, let posterURL = URL(string: poster) {");
+    helpers.push("                AsyncImage(url: posterURL) { phase in");
+    helpers.push("                    switch phase {");
+    helpers.push("                    case .success(let image):");
+    helpers.push("                        elitPosterImage(image, posterFit: posterFit, posterPosition: posterPosition)");
+    helpers.push("                    default:");
+    helpers.push("                        Color.clear");
+    helpers.push("                    }");
+    helpers.push("                }");
+    helpers.push("            }");
+    helpers.push("            ElitVideoPlayerController(source: source, autoPlay: autoPlay, muted: muted, controls: controls, playsInline: playsInline)");
+    helpers.push("                .accessibilityLabel(label)");
+    helpers.push("        }");
+    helpers.push("    }");
+    helpers.push("}");
+    helpers.push("");
+    helpers.push("struct ElitAudioSurface: View {");
+    helpers.push("    let source: String");
+    helpers.push("    let label: String");
+    helpers.push("    let autoPlay: Bool");
+    helpers.push("    let muted: Bool");
+    helpers.push("");
+    helpers.push("    var body: some View {");
+    helpers.push("        VStack {");
+    helpers.push("            if let url = URL(string: source), !source.isEmpty {");
+    helpers.push("                AVPlayer(url: url).let { resolvedPlayer in");
+    helpers.push("                    resolvedPlayer.isMuted = muted");
+    helpers.push("                    if autoPlay { resolvedPlayer.play() }");
+    helpers.push("                }");
+    helpers.push("            }");
+    helpers.push('            Label(label, systemImage: "waveform")');
+    helpers.push("                .accessibilityLabel(label)");
+    helpers.push("        }");
+    helpers.push("    }");
+    helpers.push("}");
+  }
+  if (context.helperFlags.has("unsupportedPlaceholder")) {
     helpers.push("");
     helpers.push("@ViewBuilder");
-    helpers.push("private func ElitAudioSurface(source: String, label: String, autoPlay: Bool, loop: Bool, muted: Bool) -> some View {");
-    helpers.push('    Label(label, systemImage: "waveform")');
+    helpers.push("private func elitUnsupportedPlaceholder(label: String, sourceTag: String) -> some View {");
+    helpers.push("    VStack(spacing: 8) {");
+    helpers.push("        Text(label)");
+    helpers.push("        Text(sourceTag)");
+    helpers.push("            .font(.caption)");
+    helpers.push("            .foregroundStyle(.secondary)");
+    helpers.push("    }");
     helpers.push("}");
   }
   return helpers;
@@ -12245,17 +12520,30 @@ function renderSwiftUI(input2, options = {}) {
     resolvedStyles: styleData.resolvedStyles,
     styleContexts: styleData.styleContexts
   };
-  const bodyLines = tree.roots.length === 1 ? renderSwiftUINode(tree.roots[0], 2, context, { availableWidth: styleResolveOptions.viewportWidth, availableHeight: styleResolveOptions.viewportHeight }) : [
+  const singleRoot = tree.roots.length === 1 ? tree.roots[0] : null;
+  const isSingleScreenRoot = singleRoot !== null && singleRoot.kind === "element" && singleRoot.component === "Screen";
+  const innerLines = tree.roots.length === 1 ? renderSwiftUINode(tree.roots[0], 2, context, { availableWidth: styleResolveOptions.viewportWidth, availableHeight: styleResolveOptions.viewportHeight }) : [
     "        VStack(alignment: .leading, spacing: 0) {",
     ...renderSwiftUIChildren(tree.roots, 3, context, renderSwiftUINode, "VStack", void 0, { availableWidth: styleResolveOptions.viewportWidth, availableHeight: styleResolveOptions.viewportHeight }),
     "        }"
   ];
+  const bodyLines = isSingleScreenRoot ? [
+    "        ScrollView {",
+    ...innerLines.map((line) => "    " + line),
+    "        }"
+  ] : innerLines;
   const lines = [];
   if (resolvedOptions.includeImports) {
     lines.push("import SwiftUI");
     if (context.helperFlags.has("backgroundImage") || context.helperFlags.has("imagePlaceholder") || context.helperFlags.has("openUrlHandler")) {
       lines.push("import Foundation");
     }
+    if (context.helperFlags.has("webViewSurface")) {
+      lines.push("import WebKit");
+    }
+    if (context.helperFlags.has("mediaSurface")) {
+      lines.push("import AVKit");
+    }
     lines.push("");
   }
   lines.push(`struct ${resolvedOptions.structName}: View {`);