fix: text alignment and stack alignment

example/screens/testing-grounds/flex-playground/FlexPlaygroundScreen.tsx

@@ -180,6 +180,40 @@ export default function FlexPlaygroundScreen() {
           </VoltraView>
         </Card>
 
+        {/* Text Align Test */}
+        <Card>
+          <Card.Title>Text Align in Flex</Card.Title>
+          <Text style={styles.previewSubtext}>Text alignment within stretched flex children</Text>
+
+          <VoltraView style={{ width: '100%', height: 200, backgroundColor: '#1E293B', padding: 8, marginTop: 12 }}>
+            <Voltra.View
+              style={{
+                backgroundColor: '#334155',
+                padding: 8,
+                width: '100%',
+                height: '100%',
+                flexDirection: 'column',
+                alignItems: 'stretch',
+                gap: 8,
+              }}
+            >
+              <Voltra.View style={{ backgroundColor: '#1E293B', padding: 8, flex: 1 }}>
+                <Voltra.Text style={{ color: '#FFFFFF', fontSize: 14, textAlign: 'left' }}>textAlign: left</Voltra.Text>
+              </Voltra.View>
+              <Voltra.View style={{ backgroundColor: '#1E293B', padding: 8, flex: 1 }}>
+                <Voltra.Text style={{ color: '#FFFFFF', fontSize: 14, textAlign: 'center' }}>
+                  textAlign: center
+                </Voltra.Text>
+              </Voltra.View>
+              <Voltra.View style={{ backgroundColor: '#1E293B', padding: 8, flex: 1 }}>
+                <Voltra.Text style={{ color: '#FFFFFF', fontSize: 14, textAlign: 'right' }}>
+                  textAlign: right
+                </Voltra.Text>
+              </Voltra.View>
+            </Voltra.View>
+          </VoltraView>
+        </Card>
+
         <View style={styles.footer}>
           <Link href="/testing-grounds" asChild>
             <Button title="Back to Testing Grounds" variant="ghost" />

ios/ui/Style/CompositeStyle.swift

@@ -6,6 +6,7 @@ struct CompositeStyleModifier: ViewModifier {
   let layout: LayoutStyle
   let decoration: DecorationStyle
   let rendering: RenderingStyle
+  var contentAlignment: Alignment = .topLeading
 
   func body(content: Content) -> some View {
     Group {
@@ -18,7 +19,7 @@ struct CompositeStyleModifier: ViewModifier {
 
         content
           .voltraIfLet(layout.padding) { c, p in c.padding(p) }
-          .frame(maxWidth: .infinity, maxHeight: .infinity, alignment: .topLeading)
+          .frame(maxWidth: .infinity, maxHeight: .infinity, alignment: contentAlignment)
           .modifier(DecorationModifier(style: decoration))
           .modifier(RenderingModifier(style: rendering))
           .layoutValue(key: FlexItemLayoutKey.self, value: FlexItemValues(

ios/ui/Style/View+applyStyle.swift

@@ -1,5 +1,17 @@
 import SwiftUI
 
+// MARK: - TextAlignment Extension
+
+extension TextAlignment {
+  var horizontalAlignment: HorizontalAlignment {
+    switch self {
+    case .leading: return .leading
+    case .center: return .center
+    case .trailing: return .trailing
+    }
+  }
+}
+
 // MARK: - View Extension
 
 extension View {
@@ -13,10 +25,14 @@ extension View {
 
   func applyStyle(_ style: (LayoutStyle, DecorationStyle, RenderingStyle, TextStyle)) -> some View {
     let (layout, decoration, rendering, text) = style
+    let frameAlignment = Alignment(horizontal: text.alignment.horizontalAlignment, vertical: .top)
     return self
       // 1. Text Properties (Propagate font size for measurement)
       .modifier(TextStyleModifier(style: text))
       // 2. Standard Box Model
-      .modifier(CompositeStyleModifier(layout: layout, decoration: decoration, rendering: rendering))
+      .modifier(CompositeStyleModifier(
+        layout: layout, decoration: decoration, rendering: rendering,
+        contentAlignment: frameAlignment
+      ))
   }
 }

ios/ui/Views/VoltraHStack.swift

@@ -34,9 +34,14 @@ public struct VoltraHStack: VoltraView {
     let (layout, _, _, _) = StyleConverter.convert(anyStyle)
     let gap = layout.gap ?? 0
 
+    let hasFillHeight = layout.height == .fill
+
     HStack(alignment: alignment, spacing: gap) {
       element.children ?? .empty
     }
+    .voltraIf(hasFillHeight) { content in
+      content.frame(maxHeight: .infinity, alignment: Alignment(horizontal: .center, vertical: alignment))
+    }
     .applyStyle(element.style)
   }
 

ios/ui/Views/VoltraText.swift

@@ -50,14 +50,22 @@ public struct VoltraText: VoltraView {
       return baseFont
     }
 
+    let alignment: TextAlignment = {
+      // Parameter takes precedence over style
+      if let mta = params.multilineTextAlignment {
+        return JSStyleParser.textAlignment(mta)
+      }
+      return textStyle.alignment
+    }()
+
     Text(.init(textContent))
       .kerning(textStyle.letterSpacing)
       .underline(textStyle.decoration == .underline || textStyle.decoration == .underlineLineThrough)
       .strikethrough(textStyle.decoration == .lineThrough || textStyle.decoration == .underlineLineThrough)
       // These technically work on View, but good to keep close
       .font(font)
       .foregroundColor(textStyle.color)
-      .multilineTextAlignment(textStyle.alignment)
+      .multilineTextAlignment(alignment)
       .lineSpacing(textStyle.lineSpacing)
       .voltraIfLet(params.numberOfLines) { view, numberOfLines in
         view.lineLimit(Int(numberOfLines))

ios/ui/Views/VoltraVStack.swift

@@ -32,9 +32,14 @@ public struct VoltraVStack: View {
     let (layout, _, _, _) = StyleConverter.convert(anyStyle)
     let gap = layout.gap ?? 0
 
+    let hasFillWidth = layout.width == .fill
+
     VStack(alignment: alignment, spacing: gap) {
       element.children ?? .empty
     }
+    .voltraIf(hasFillWidth) { content in
+      content.frame(maxWidth: .infinity, alignment: Alignment(horizontal: alignment, vertical: .center))
+    }
     .applyStyle(element.style)
   }
 

src/styles/types.ts

@@ -62,6 +62,7 @@ export type VoltraTextStyle = VoltraViewStyle &
     | 'fontVariant'
     | 'textDecorationLine'
     | 'lineHeight'
+    | 'textAlign'
   >
 
 export type VoltraStyleProp = StyleProp<VoltraViewStyle>