@expo/ui 55.0.0-preview.6 → 55.0.0

package/android/src/main/java/expo/modules/ui/convertibles/Alignment.kt

@@ -0,0 +1,112 @@
+package expo.modules.ui.convertibles
+
+import androidx.compose.ui.Alignment
+import expo.modules.kotlin.types.Enumerable
+
+/**
+ * Generic alignment type that for modifier.clip()
+ */
+enum class AlignmentType(val value: String) : Enumerable {
+  TOP_START("topStart"),
+  TOP_CENTER("topCenter"),
+  TOP_END("topEnd"),
+  CENTER_START("centerStart"),
+  CENTER("center"),
+  CENTER_END("centerEnd"),
+  BOTTOM_START("bottomStart"),
+  BOTTOM_CENTER("bottomCenter"),
+  BOTTOM_END("bottomEnd"),
+  TOP("top"),
+  CENTER_VERTICALLY("centerVertically"),
+  BOTTOM("bottom"),
+  START("start"),
+  CENTER_HORIZONTALLY("centerHorizontally"),
+  END("end");
+
+  fun toAlignment(): Alignment? {
+    return when (this) {
+      TOP_START -> Alignment.TopStart
+      TOP_CENTER -> Alignment.TopCenter
+      TOP_END -> Alignment.TopEnd
+      CENTER_START -> Alignment.CenterStart
+      CENTER -> Alignment.Center
+      CENTER_END -> Alignment.CenterEnd
+      BOTTOM_START -> Alignment.BottomStart
+      BOTTOM_CENTER -> Alignment.BottomCenter
+      BOTTOM_END -> Alignment.BottomEnd
+      else -> null
+    }
+  }
+
+  fun toVerticalAlignment(): Alignment.Vertical? {
+    return when (this) {
+      TOP -> Alignment.Top
+      CENTER_VERTICALLY -> Alignment.CenterVertically
+      BOTTOM -> Alignment.Bottom
+      else -> null
+    }
+  }
+
+  fun toHorizontalAlignment(): Alignment.Horizontal? {
+    return when (this) {
+      START -> Alignment.Start
+      CENTER_HORIZONTALLY -> Alignment.CenterHorizontally
+      END -> Alignment.End
+      else -> null
+    }
+  }
+}
+
+enum class HorizontalAlignment(val value: String) : Enumerable {
+  START("start"),
+  END("end"),
+  CENTER("center");
+
+  fun toComposeAlignment(): Alignment.Horizontal {
+    return when (this) {
+      START -> Alignment.Start
+      END -> Alignment.End
+      CENTER -> Alignment.CenterHorizontally
+    }
+  }
+}
+
+enum class VerticalAlignment(val value: String) : Enumerable {
+  TOP("top"),
+  BOTTOM("bottom"),
+  CENTER("center");
+
+  fun toComposeAlignment(): Alignment.Vertical {
+    return when (this) {
+      TOP -> Alignment.Top
+      BOTTOM -> Alignment.Bottom
+      CENTER -> Alignment.CenterVertically
+    }
+  }
+}
+
+enum class ContentAlignment(val value: String) : Enumerable {
+  TOP_START("topStart"),
+  TOP_CENTER("topCenter"),
+  TOP_END("topEnd"),
+  CENTER_START("centerStart"),
+  CENTER("center"),
+  CENTER_END("centerEnd"),
+  BOTTOM_START("bottomStart"),
+  BOTTOM_CENTER("bottomCenter"),
+  BOTTOM_END("bottomEnd");
+
+  fun toComposeAlignment(): Alignment {
+    return when (this) {
+      TOP_START -> Alignment.TopStart
+      TOP_CENTER -> Alignment.TopCenter
+      TOP_END -> Alignment.TopEnd
+      CENTER_START -> Alignment.CenterStart
+      CENTER -> Alignment.Center
+      CENTER_END -> Alignment.CenterEnd
+      BOTTOM_START -> Alignment.BottomStart
+      BOTTOM_CENTER -> Alignment.BottomCenter
+      BOTTOM_END -> Alignment.BottomEnd
+    }
+  }
+}

package/android/src/main/java/expo/modules/ui/convertibles/Arrangement.kt

@@ -0,0 +1,72 @@
+package expo.modules.ui.convertibles
+
+import androidx.compose.foundation.layout.Arrangement
+import androidx.compose.ui.unit.dp
+import expo.modules.kotlin.records.Field
+import expo.modules.kotlin.records.Record
+import expo.modules.kotlin.types.Either
+import expo.modules.kotlin.types.Enumerable
+
+typealias HorizontalArrangement = Either<HorizontalArrangementDefault, HorizontalArrangementCustom>
+
+enum class HorizontalArrangementDefault(val value: String) : Enumerable {
+  START("start"),
+  END("end"),
+  CENTER("center"),
+  SPACE_BETWEEN("spaceBetween"),
+  SPACE_AROUND("spaceAround"),
+  SPACE_EVENLY("spaceEvenly");
+
+  fun toComposeArrangement(): Arrangement.Horizontal {
+    return when (this) {
+      START -> Arrangement.Start
+      END -> Arrangement.End
+      CENTER -> Arrangement.Center
+      SPACE_BETWEEN -> Arrangement.SpaceBetween
+      SPACE_AROUND -> Arrangement.SpaceAround
+      SPACE_EVENLY -> Arrangement.SpaceEvenly
+    }
+  }
+}
+
+data class HorizontalArrangementCustom(
+  @Field val spacedBy: Int? = null
+) : Record
+
+fun HorizontalArrangement.toComposeArrangement(): Arrangement.Horizontal =
+  when {
+    `is`(HorizontalArrangementDefault::class) -> first().toComposeArrangement()
+    else -> second().spacedBy?.let { Arrangement.spacedBy(it.dp) } ?: Arrangement.Start
+  }
+
+typealias VerticalArrangement = Either<VerticalArrangementDefault, VerticalArrangementCustom>
+
+enum class VerticalArrangementDefault(val value: String) : Enumerable {
+  TOP("top"),
+  BOTTOM("bottom"),
+  CENTER("center"),
+  SPACE_BETWEEN("spaceBetween"),
+  SPACE_AROUND("spaceAround"),
+  SPACE_EVENLY("spaceEvenly");
+
+  fun toComposeArrangement(): Arrangement.Vertical {
+    return when (this) {
+      TOP -> Arrangement.Top
+      BOTTOM -> Arrangement.Bottom
+      CENTER -> Arrangement.Center
+      SPACE_BETWEEN -> Arrangement.SpaceBetween
+      SPACE_AROUND -> Arrangement.SpaceAround
+      SPACE_EVENLY -> Arrangement.SpaceEvenly
+    }
+  }
+}
+
+data class VerticalArrangementCustom(
+  @Field val spacedBy: Int? = null
+) : Record
+
+fun VerticalArrangement.toComposeArrangement(): Arrangement.Vertical =
+  when {
+    `is`(VerticalArrangementDefault::class) -> first().toComposeArrangement()
+    else -> second().spacedBy?.let { Arrangement.spacedBy(it.dp) } ?: Arrangement.Top
+  }

package/android/src/main/java/expo/modules/ui/icon/IconView.kt

@@ -0,0 +1,159 @@
+package expo.modules.ui.icon
+
+import android.content.Context
+import android.graphics.Color
+import android.graphics.drawable.BitmapDrawable
+import android.graphics.drawable.Drawable
+import android.net.Uri
+import androidx.compose.foundation.layout.size
+import androidx.compose.material3.Icon
+import androidx.compose.runtime.Composable
+import androidx.compose.runtime.LaunchedEffect
+import androidx.compose.runtime.MutableState
+import androidx.compose.runtime.getValue
+import androidx.compose.runtime.mutableStateOf
+import androidx.compose.runtime.remember
+import androidx.compose.runtime.setValue
+import androidx.compose.ui.Modifier
+import androidx.compose.ui.geometry.Size
+import androidx.compose.ui.graphics.asImageBitmap
+import androidx.compose.ui.graphics.drawscope.DrawScope
+import androidx.compose.ui.graphics.drawscope.drawIntoCanvas
+import androidx.compose.ui.graphics.nativeCanvas
+import androidx.compose.ui.graphics.painter.BitmapPainter
+import androidx.compose.ui.graphics.painter.Painter
+import androidx.compose.ui.graphics.vector.ImageVector
+import androidx.compose.ui.graphics.vector.rememberVectorPainter
+import androidx.compose.ui.unit.dp
+import expo.modules.kotlin.AppContext
+import expo.modules.kotlin.records.Field
+import expo.modules.kotlin.records.Record
+import expo.modules.kotlin.views.ComposableScope
+import expo.modules.kotlin.views.ComposeProps
+import expo.modules.kotlin.views.ExpoComposeView
+import expo.modules.ui.ExpoUIModule
+import expo.modules.ui.ModifierList
+import expo.modules.ui.ModifierRegistry
+import expo.modules.ui.compose
+
+data class Source(
+  @Field val uri: String,
+  @Field val width: Int = 0,
+  @Field val height: Int = 0,
+  @Field val scale: Double = 1.0
+) : Record
+
+data class IconProps(
+  val source: MutableState<Source?> = mutableStateOf(null),
+  val tintColor: MutableState<Color?> = mutableStateOf(null),
+  val size: MutableState<Int?> = mutableStateOf(null),
+  val contentDescription: MutableState<String?> = mutableStateOf(null),
+  val modifiers: MutableState<ModifierList> = mutableStateOf(emptyList())
+) : ComposeProps
+
+class IconView(context: Context, appContext: AppContext) :
+  ExpoComposeView<IconProps>(context, appContext) {
+
+  override val props = IconProps()
+
+  private val iconLoader by lazy {
+    val module = appContext.registry.getModule<ExpoUIModule>()
+    val okHttpClient = requireNotNull(module?.okHttpClient) { "ExpoUIModule.okHttpClient is not initialized" }
+    VectorIconLoader(
+      context = context,
+      okHttpClient = okHttpClient
+    )
+  }
+
+  @Composable
+  override fun ComposableScope.Content() {
+    val (source) = props.source
+    val (tint) = props.tintColor
+    val (iconSize) = props.size
+    val (contentDescription) = props.contentDescription
+    val (modifiers) = props.modifiers
+
+    var imageVector by remember { mutableStateOf<ImageVector?>(null) }
+    var drawable by remember { mutableStateOf<Drawable?>(null) }
+
+    // Load icon from URI asynchronously
+    LaunchedEffect(source) {
+      imageVector = null
+      drawable = null
+
+      val uriString = source?.let { resolveUri(it) }
+      if (uriString != null) {
+        // loadFromUri is already a suspend function that handles dispatchers
+        val result = iconLoader.loadFromUri(uriString)
+        imageVector = result.imageVector
+        drawable = result.drawable
+      }
+    }
+
+    // Convert to Painter (prioritize ImageVector over Drawable)
+    val painter = imageVector?.let { rememberVectorPainter(it) }
+      ?: rememberDrawableAsPainter(drawable)
+
+    // Render icon if painter available
+    if (painter != null) {
+      Icon(
+        painter = painter,
+        contentDescription = contentDescription,
+        tint = tint?.compose ?: androidx.compose.ui.graphics.Color.Unspecified,
+        modifier = Modifier
+          .then(iconSize?.let { Modifier.size(it.dp) } ?: Modifier)
+          .then(ModifierRegistry.applyModifiers(modifiers, appContext, this@Content, globalEventDispatcher))
+      )
+    }
+  }
+
+  /**
+   * Resolve Source to URI string, handling resource IDs and local resources.
+   */
+  private fun resolveUri(source: Source): String? {
+    val stringUri = source.uri
+    return try {
+      val uri = Uri.parse(stringUri)
+
+      // If no scheme, try to resolve as local resource
+      if (uri.scheme == null) {
+        ResourceIdHelper.getResourceUri(context, stringUri)?.toString()
+      } else {
+        stringUri
+      }
+    } catch (e: Exception) {
+      // Fallback to resource ID helper
+      ResourceIdHelper.getResourceUri(context, stringUri)?.toString()
+    }
+  }
+
+  @Composable
+  private fun rememberDrawableAsPainter(drawable: Drawable?): Painter? {
+    return remember(drawable) {
+      when (drawable) {
+        null -> null
+        is BitmapDrawable -> BitmapPainter(drawable.bitmap.asImageBitmap())
+        else -> DrawablePainter(drawable.mutate())
+      }
+    }
+  }
+
+  private class DrawablePainter(
+    private val drawable: Drawable
+  ) : Painter() {
+    override val intrinsicSize: Size
+      get() = Size(
+        drawable.intrinsicWidth.toFloat().takeIf { it > 0 } ?: Size.Unspecified.width,
+        drawable.intrinsicHeight.toFloat().takeIf { it > 0 } ?: Size.Unspecified.height
+      )
+
+    override fun DrawScope.onDraw() {
+      drawIntoCanvas { canvas ->
+        with(drawable) {
+          setBounds(0, 0, size.width.toInt(), size.height.toInt())
+          draw(canvas.nativeCanvas)
+        }
+      }
+    }
+  }
+}

package/android/src/main/java/expo/modules/ui/icon/ResourceIdHelper.kt

@@ -0,0 +1,47 @@
+package expo.modules.ui.icon
+
+import android.annotation.SuppressLint
+import android.content.Context
+import android.net.Uri
+import com.facebook.react.views.imagehelper.ResourceDrawableIdHelper
+import java.util.Locale
+
+internal object ResourceIdHelper {
+  private val idMap = mutableMapOf<String, Int>()
+
+  @SuppressLint("DiscouragedApi")
+  private fun getResourceRawId(context: Context, name: String): Int {
+    if (name.isEmpty()) {
+      return -1
+    }
+
+    val normalizedName = name.lowercase(Locale.ROOT).replace("-", "_")
+    synchronized(this) {
+      val id = idMap[normalizedName]
+      if (id != null) {
+        return id
+      }
+
+      return context
+        .resources
+        .getIdentifier(normalizedName, "raw", context.packageName)
+        .also {
+          idMap[normalizedName] = it
+        }
+    }
+  }
+
+  fun getResourceUri(context: Context, name: String): Uri? {
+    val drawableUri = ResourceDrawableIdHelper.getResourceDrawableUri(context, name)
+    if (drawableUri != Uri.EMPTY) {
+      return drawableUri
+    }
+
+    val resId = getResourceRawId(context, name)
+    return if (resId > 0) {
+      Uri.Builder().scheme("res").path(resId.toString()).build()
+    } else {
+      null
+    }
+  }
+}