[Paywalls V2] TextComponentView handles overrides with TextComponentState

ui/revenuecatui/src/main/kotlin/com/revenuecat/purchases/ui/revenuecatui/components/button/ButtonComponentView.kt

@@ -97,6 +97,7 @@ private fun previewButtonComponentStyle(
                 size = Size(width = Fit, height = Fit),
                 padding = Padding(top = 8.0, bottom = 8.0, leading = 8.0, trailing = 8.0).toPaddingValues(),
                 margin = Padding(top = 0.0, bottom = 24.0, leading = 0.0, trailing = 24.0).toPaddingValues(),
+                overrides = null,
             ),
         ),
         dimension = Dimension.Vertical(alignment = HorizontalAlignment.CENTER, distribution = START),

ui/revenuecatui/src/main/kotlin/com/revenuecat/purchases/ui/revenuecatui/components/stack/StackComponentView.kt

@@ -221,6 +221,7 @@ private fun StackComponentView_Preview_ZLayer() {
                         size = Size(width = Fit, height = Fit),
                         padding = Padding(top = 8.0, bottom = 8.0, leading = 8.0, trailing = 8.0).toPaddingValues(),
                         margin = Padding(top = 0.0, bottom = 24.0, leading = 0.0, trailing = 24.0).toPaddingValues(),
+                        overrides = null,
                     ),
                     TextComponentStyle(
                         visible = true,
@@ -239,6 +240,7 @@ private fun StackComponentView_Preview_ZLayer() {
                         size = Size(width = Fit, height = Fit),
                         padding = Padding(top = 8.0, bottom = 8.0, leading = 8.0, trailing = 8.0).toPaddingValues(),
                         margin = Padding(top = 0.0, bottom = 0.0, leading = 0.0, trailing = 0.0).toPaddingValues(),
+                        overrides = null,
                     ),
                 ),
                 dimension = Dimension.ZLayer(alignment = TwoDimensionalAlignment.BOTTOM_TRAILING),
@@ -283,6 +285,7 @@ private fun previewChildren() = listOf(
         size = Size(width = Fit, height = Fit),
         padding = Padding(top = 8.0, bottom = 8.0, leading = 8.0, trailing = 8.0).toPaddingValues(),
         margin = Padding(top = 0.0, bottom = 0.0, leading = 0.0, trailing = 0.0).toPaddingValues(),
+        overrides = null,
     ),
     TextComponentStyle(
         visible = true,
@@ -301,6 +304,7 @@ private fun previewChildren() = listOf(
         size = Size(width = Fit, height = Fit),
         padding = Padding(top = 8.0, bottom = 8.0, leading = 8.0, trailing = 8.0).toPaddingValues(),
         margin = Padding(top = 0.0, bottom = 0.0, leading = 0.0, trailing = 0.0).toPaddingValues(),
+        overrides = null,
     ),
 )
 

ui/revenuecatui/src/main/kotlin/com/revenuecat/purchases/ui/revenuecatui/components/style/StyleFactory.kt

@@ -27,7 +27,6 @@ import com.revenuecat.purchases.ui.revenuecatui.components.toPresentedOverrides
 import com.revenuecat.purchases.ui.revenuecatui.errors.PaywallValidationError
 import com.revenuecat.purchases.ui.revenuecatui.helpers.NonEmptyList
 import com.revenuecat.purchases.ui.revenuecatui.helpers.Result
-import com.revenuecat.purchases.ui.revenuecatui.helpers.map
 import com.revenuecat.purchases.ui.revenuecatui.helpers.mapError
 import com.revenuecat.purchases.ui.revenuecatui.helpers.mapOrAccumulate
 import com.revenuecat.purchases.ui.revenuecatui.helpers.nonEmptyListOf
@@ -101,27 +100,23 @@ internal class StyleFactory(
             // Map all overrides to PresentedOverrides.
             ?.toPresentedOverrides { LocalizedTextPartial(from = it, using = localizationDictionary) }
             .orSuccessfullyNull()
-            // Pick a single PresentedPartial to show.
-            .map { it?.buildPresentedPartial(windowSize, isEligibleForIntroOffer, componentState) }
             .mapError { nonEmptyListOf(it) },
-    ) { text, presentedPartial ->
-        // Combine the text and PresentedPartial into a TextComponentStyle.
-        val partial = presentedPartial?.partial
-        val weight = (partial?.fontWeight ?: component.fontWeight).toFontWeight()
-
+    ) { text, presentedOverrides ->
+        val weight = component.fontWeight.toFontWeight()
         TextComponentStyle(
-            visible = partial?.visible ?: true,
-            text = presentedPartial?.text ?: text,
-            color = partial?.color ?: component.color,
-            fontSize = partial?.fontSize ?: component.fontSize,
+            visible = true,
+            text = text,
+            color = component.color,
+            fontSize = component.fontSize,
             fontWeight = weight,
-            fontFamily = (partial?.fontName ?: component.fontName)?.let { SystemFontFamily(it, weight) },
-            textAlign = (partial?.horizontalAlignment ?: component.horizontalAlignment).toTextAlign(),
-            horizontalAlignment = (partial?.horizontalAlignment ?: component.horizontalAlignment).toAlignment(),
-            backgroundColor = partial?.backgroundColor ?: component.backgroundColor,
-            size = partial?.size ?: component.size,
-            padding = (partial?.padding ?: component.padding).toPaddingValues(),
-            margin = (partial?.margin ?: component.margin).toPaddingValues(),
+            fontFamily = component.fontName?.let { SystemFontFamily(it, weight) },
+            textAlign = component.horizontalAlignment.toTextAlign(),
+            horizontalAlignment = component.horizontalAlignment.toAlignment(),
+            backgroundColor = component.backgroundColor,
+            size = component.size,
+            padding = component.padding.toPaddingValues(),
+            margin = component.margin.toPaddingValues(),
+            overrides = presentedOverrides,
         )
     }
 }

ui/revenuecatui/src/main/kotlin/com/revenuecat/purchases/ui/revenuecatui/components/style/TextComponentStyle.kt

@@ -9,6 +9,8 @@ import androidx.compose.ui.text.style.TextAlign
 import com.revenuecat.purchases.paywalls.components.properties.ColorScheme
 import com.revenuecat.purchases.paywalls.components.properties.FontSize
 import com.revenuecat.purchases.paywalls.components.properties.Size
+import com.revenuecat.purchases.ui.revenuecatui.components.LocalizedTextPartial
+import com.revenuecat.purchases.ui.revenuecatui.components.PresentedOverrides
 
 @Suppress("LongParameterList")
 @Immutable
@@ -37,4 +39,6 @@ internal class TextComponentStyle(
     val padding: PaddingValues,
     @get:JvmSynthetic
     val margin: PaddingValues,
+    @get:JvmSynthetic
+    val overrides: PresentedOverrides<LocalizedTextPartial>?,
 ) : ComponentStyle

ui/revenuecatui/src/main/kotlin/com/revenuecat/purchases/ui/revenuecatui/components/text/TextComponentState.kt

@@ -0,0 +1,132 @@
+@file:JvmSynthetic
+
+package com.revenuecat.purchases.ui.revenuecatui.components.text
+
+import androidx.compose.material3.adaptive.currentWindowAdaptiveInfo
+import androidx.compose.runtime.Composable
+import androidx.compose.runtime.Stable
+import androidx.compose.runtime.derivedStateOf
+import androidx.compose.runtime.getValue
+import androidx.compose.runtime.mutableStateOf
+import androidx.compose.runtime.remember
+import androidx.compose.runtime.setValue
+import androidx.window.core.layout.WindowWidthSizeClass
+import com.revenuecat.purchases.ui.revenuecatui.components.ComponentViewState
+import com.revenuecat.purchases.ui.revenuecatui.components.ScreenCondition
+import com.revenuecat.purchases.ui.revenuecatui.components.SystemFontFamily
+import com.revenuecat.purchases.ui.revenuecatui.components.buildPresentedPartial
+import com.revenuecat.purchases.ui.revenuecatui.components.ktx.toAlignment
+import com.revenuecat.purchases.ui.revenuecatui.components.ktx.toFontWeight
+import com.revenuecat.purchases.ui.revenuecatui.components.ktx.toPaddingValues
+import com.revenuecat.purchases.ui.revenuecatui.components.ktx.toTextAlign
+import com.revenuecat.purchases.ui.revenuecatui.components.style.TextComponentStyle
+import com.revenuecat.purchases.ui.revenuecatui.data.PaywallState
+
+@JvmSynthetic
+@Composable
+internal fun rememberUpdatedTextComponentState(
+    style: TextComponentStyle,
+    paywallState: PaywallState.Loaded.Components,
+    selected: Boolean,
+): TextComponentState =
+    rememberUpdatedTextComponentState(
+        style = style,
+        isEligibleForIntroOffer = paywallState.isEligibleForIntroOffer,
+        selected = selected,
+    )
+
+@JvmSynthetic
+@Composable
+internal fun rememberUpdatedTextComponentState(
+    style: TextComponentStyle,
+    isEligibleForIntroOffer: Boolean = false,
+    selected: Boolean = false,
+): TextComponentState {
+    val windowSize = currentWindowAdaptiveInfo().windowSizeClass.windowWidthSizeClass
+
+    return remember(style) {
+        TextComponentState(
+            initialWindowSize = windowSize,
+            initialIsEligibleForIntroOffer = isEligibleForIntroOffer,
+            initialSelected = selected,
+            style = style,
+        )
+    }.apply {
+        update(
+            windowSize = windowSize,
+            isEligibleForIntroOffer = isEligibleForIntroOffer,
+            selected = selected,
+        )
+    }
+}
+
+@Stable
+internal class TextComponentState(
+    initialWindowSize: WindowWidthSizeClass,
+    initialIsEligibleForIntroOffer: Boolean,
+    initialSelected: Boolean,
+    private val style: TextComponentStyle,
+) {
+    private var windowSize by mutableStateOf(initialWindowSize)
+    private var isEligibleForIntroOffer by mutableStateOf(initialIsEligibleForIntroOffer)
+    private var selected by mutableStateOf(initialSelected)
+    private val presentedPartial by derivedStateOf {
+        val windowCondition = ScreenCondition.from(windowSize)
+        val componentState = if (selected) ComponentViewState.SELECTED else ComponentViewState.DEFAULT
+
+        style.overrides?.buildPresentedPartial(windowCondition, isEligibleForIntroOffer, componentState)
+    }
+
+    @get:JvmSynthetic
+    val visible by derivedStateOf { presentedPartial?.partial?.visible ?: true }
+
+    @get:JvmSynthetic
+    val text by derivedStateOf { presentedPartial?.text ?: style.text }
+
+    @get:JvmSynthetic
+    val color by derivedStateOf { presentedPartial?.partial?.color ?: style.color }
+
+    @get:JvmSynthetic
+    val fontSize by derivedStateOf { presentedPartial?.partial?.fontSize ?: style.fontSize }
+
+    @get:JvmSynthetic
+    val fontWeight by derivedStateOf { presentedPartial?.partial?.fontWeight?.toFontWeight() ?: style.fontWeight }
+
+    @get:JvmSynthetic
+    val fontFamily by derivedStateOf {
+        presentedPartial?.partial?.fontName?.let { SystemFontFamily(it, fontWeight) } ?: style.fontFamily
+    }
+
+    @get:JvmSynthetic
+    val textAlign by derivedStateOf {
+        presentedPartial?.partial?.horizontalAlignment?.toTextAlign() ?: style.textAlign
+    }
+
+    @get:JvmSynthetic
+    val horizontalAlignment by derivedStateOf {
+        presentedPartial?.partial?.horizontalAlignment?.toAlignment() ?: style.horizontalAlignment
+    }
+
+    @get:JvmSynthetic
+    val backgroundColor by derivedStateOf { presentedPartial?.partial?.backgroundColor ?: style.backgroundColor }
+
+    @get:JvmSynthetic
+    val size by derivedStateOf { presentedPartial?.partial?.size ?: style.size }
+
+    @get:JvmSynthetic
+    val padding by derivedStateOf { presentedPartial?.partial?.padding?.toPaddingValues() ?: style.padding }
+
+    @get:JvmSynthetic
+    val margin by derivedStateOf { presentedPartial?.partial?.margin?.toPaddingValues() ?: style.margin }
+
+    @JvmSynthetic
+    fun update(
+        windowSize: WindowWidthSizeClass? = null,
+        isEligibleForIntroOffer: Boolean? = null,
+        selected: Boolean? = null,
+    ) {
+        if (windowSize != null) this.windowSize = windowSize
+        if (isEligibleForIntroOffer != null) this.isEligibleForIntroOffer = isEligibleForIntroOffer
+        if (selected != null) this.selected = selected
+    }
+}

ui/revenuecatui/src/main/kotlin/com/revenuecat/purchases/ui/revenuecatui/components/text/TextComponentView.kt

@@ -58,17 +58,26 @@ internal fun TextComponentView(
     style: TextComponentStyle,
     state: PaywallState.Loaded.Components,
     modifier: Modifier = Modifier,
+    selected: Boolean = false,
 ) {
+    // Get a TextComponentState that calculates the overridden properties we should use.
+    val textState = rememberUpdatedTextComponentState(
+        style = style,
+        paywallState = state,
+        selected = selected,
+    )
+
+    // Process any variables in the text.
     val context = LocalContext.current
     val variableDataProvider = remember { VariableDataProvider(context.toResourceProvider()) }
     val text = rememberProcessedText(
-        originalText = style.text,
-        variables = variableDataProvider,
         state = state,
+        textState = textState,
+        variables = variableDataProvider,
     )
 
-    val colorStyle = rememberColorStyle(scheme = style.color)
-    val backgroundColorStyle = style.backgroundColor?.let { rememberColorStyle(scheme = it) }
+    val colorStyle = rememberColorStyle(scheme = textState.color)
+    val backgroundColorStyle = textState.backgroundColor?.let { rememberColorStyle(scheme = it) }
 
     // Get the text color if it's solid.
     val color = when (colorStyle) {
@@ -83,32 +92,32 @@ internal fun TextComponentView(
         )
     }
 
-    if (style.visible) {
+    if (textState.visible) {
         Markdown(
             text = text,
             modifier = modifier
-                .size(style.size, horizontalAlignment = style.horizontalAlignment)
-                .padding(style.margin)
+                .size(textState.size, horizontalAlignment = textState.horizontalAlignment)
+                .padding(textState.margin)
                 .applyIfNotNull(backgroundColorStyle) { background(it) }
-                .padding(style.padding),
+                .padding(textState.padding),
             color = color,
-            fontSize = style.fontSize.toTextUnit(),
-            fontWeight = style.fontWeight,
-            fontFamily = style.fontFamily,
-            horizontalAlignment = style.horizontalAlignment,
-            textAlign = style.textAlign,
+            fontSize = textState.fontSize.toTextUnit(),
+            fontWeight = textState.fontWeight,
+            fontFamily = textState.fontFamily,
+            horizontalAlignment = textState.horizontalAlignment,
+            textAlign = textState.textAlign,
             style = textStyle,
         )
     }
 }
 
 @Composable
 private fun rememberProcessedText(
-    originalText: String,
-    variables: VariableDataProvider,
     state: PaywallState.Loaded.Components,
+    textState: TextComponentState,
+    variables: VariableDataProvider,
 ): String {
-    val processedText by remember(originalText) {
+    val processedText by remember(state, textState) {
         derivedStateOf {
             state.selectedPackage?.let { selectedPackage ->
                 val discount = discountPercentage(
@@ -122,11 +131,11 @@ private fun rememberProcessedText(
                 VariableProcessor.processVariables(
                     variableDataProvider = variables,
                     context = variableContext,
-                    originalString = originalText,
+                    originalString = textState.text,
                     rcPackage = selectedPackage,
                     locale = java.util.Locale.forLanguageTag(state.locale.toLanguageTag()),
                 )
-            } ?: originalText
+            } ?: textState.text
         }
     }
 
@@ -379,6 +388,7 @@ private fun previewTextComponentStyle(
         size = size,
         padding = padding.toPaddingValues(),
         margin = margin.toPaddingValues(),
+        overrides = null,
     )
 }
 

ui/revenuecatui/src/test/kotlin/com/revenuecat/purchases/ui/revenuecatui/components/button/ButtonComponentViewTests.kt

@@ -70,6 +70,7 @@ class ButtonComponentViewTests {
                             padding = Padding(top = 8.0, bottom = 8.0, leading = 8.0, trailing = 8.0).toPaddingValues(),
                             margin = Padding(top = 0.0, bottom = 24.0, leading = 0.0, trailing = 24.0)
                                 .toPaddingValues(),
+                            overrides = null,
                         ),
                     ),
                     dimension = Dimension.Vertical(alignment = CENTER, distribution = START),