@expo/ui 0.2.0-alpha.0 → 0.2.0-alpha.2

package/build/swift-ui/types.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"types.js","sourceRoot":"","sources":["../../src/swift-ui/types.ts"],"names":[],"mappings":"","sourcesContent":["/**\n * Common frame properties that can be applied to any view.\n */\nexport interface FrameProps {\n  /**\n   * The width of the frame.\n   */\n  width?: number;\n  /**\n   * The height of the frame.\n   */\n  height?: number;\n\n  /**\n   * The minimum width of the frame.\n   */\n  minWidth?: number;\n  /**\n   * The ideal width of the frame.\n   */\n  idealWidth?: number;\n  /**\n   * The maximum width of the frame.\n   */\n  maxWidth?: number;\n  /**\n   * The minimum height of the frame.\n   */\n  minHeight?: number;\n  /**\n   * The ideal height of the frame.\n   */\n  idealHeight?: number;\n  /**\n   * The maximum height of the frame.\n   */\n  maxHeight?: number;\n\n  /**\n   * The alignment of the content within the frame.\n   */\n  alignment?:\n    | 'center'\n    | 'leading'\n    | 'trailing'\n    | 'top'\n    | 'bottom'\n    | 'topLeading'\n    | 'topTrailing'\n    | 'bottomLeading'\n    | 'bottomTrailing';\n}\n\n/**\n * Common padding properties that can be applied to any view.\n */\nexport interface PaddingProps {\n  /**\n   * The padding on the top.\n   */\n  top?: number;\n  /**\n   * The padding on the leading edge (left in LTR, right in RTL).\n   */\n  leading?: number;\n  /**\n   * The padding on the bottom.\n   */\n  bottom?: number;\n  /**\n   * The padding on the trailing edge (right in LTR, left in RTL).\n   */\n  trailing?: number;\n}\n\n/**\n * Common props that can be applied to any view.\n */\nexport interface CommonViewModifierProps {\n  /**\n   * @deprecated Use `fixedSize()` modifier instead. This prop will be removed in a future version.\n   * @example\n   * ```tsx\n   * // Old way (deprecated)\n   * <Text fixedSize={true}>Hello</Text>\n   *\n   * // New way (recommended)\n   * <Text modifiers={[fixedSize(true)]}>Hello</Text>\n   * ```\n   */\n  fixedSize?: boolean;\n\n  /**\n   * @deprecated Use `frame()` modifier instead. This prop will be removed in a future version.\n   * @example\n   * ```tsx\n   * // Old way (deprecated)\n   * <Text frame={{ width: 100, height: 50 }}>Hello</Text>\n   *\n   * // New way (recommended)\n   * <Text modifiers={[frame({ width: 100, height: 50 })]}>Hello</Text>\n   * ```\n   */\n  frame?: FrameProps;\n\n  /**\n   * @deprecated Use `padding()` modifier instead. This prop will be removed in a future version.\n   * @example\n   * ```tsx\n   * // Old way (deprecated)\n   * <Text padding={{ all: 16 }}>Hello</Text>\n   *\n   * // New way (recommended)\n   * <Text modifiers={[padding({ all: 16 })]}>Hello</Text>\n   * ```\n   */\n  padding?: PaddingProps;\n\n  /**\n   * Used to locate this view in end-to-end tests.\n   */\n  testID?: string;\n\n  /**\n   * Array of view modifiers to apply to this view.\n   * Modifiers are applied in the order they appear in the array.\n   *\n   * @example\n   * ```tsx\n   * import { background, cornerRadius, shadow, frame, padding, fixedSize } from 'expo-ui/swift-ui/modifiers';\n   *\n   * <Text modifiers={[\n   *   background('#FF0000'),\n   *   cornerRadius(10),\n   *   padding({ all: 16 }),\n   *   frame({ width: 200 }),\n   *   shadow({ radius: 5, x: 0, y: 2 })\n   * ]}>\n   *   Hello World\n   * </Text>\n   * ```\n   */\n  modifiers?: import('./modifiers').ViewModifier[];\n}\n"]}

package/build/types.d.ts

@@ -1,7 +1,10 @@
+import type { SharedObject } from 'expo';
 /**
  * @hidden
  */
 export type ViewEvent<Name extends string, Data> = Record<Name, Data extends object ? ((event: {
     nativeEvent: Data;
 }) => void) | undefined : (() => void) | undefined>;
+export declare class ExpoModifier extends SharedObject {
+}
 //# sourceMappingURL=types.d.ts.map

package/build/types.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"types.d.ts","sourceRoot":"","sources":["../src/types.ts"],"names":[],"mappings":"AAAA;;GAEG;AACH,MAAM,MAAM,SAAS,CAAC,IAAI,SAAS,MAAM,EAAE,IAAI,IAAI,MAAM,CACvD,IAAI,EACJ,IAAI,SAAS,MAAM,GACf,CAAC,CAAC,KAAK,EAAE;IAAE,WAAW,EAAE,IAAI,CAAA;CAAE,KAAK,IAAI,CAAC,GAAG,SAAS,GACpD,CAAC,MAAM,IAAI,CAAC,GAAG,SAAS,CAC7B,CAAC"}
+{"version":3,"file":"types.d.ts","sourceRoot":"","sources":["../src/types.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,YAAY,EAAE,MAAM,MAAM,CAAC;AAEzC;;GAEG;AACH,MAAM,MAAM,SAAS,CAAC,IAAI,SAAS,MAAM,EAAE,IAAI,IAAI,MAAM,CACvD,IAAI,EACJ,IAAI,SAAS,MAAM,GACf,CAAC,CAAC,KAAK,EAAE;IAAE,WAAW,EAAE,IAAI,CAAA;CAAE,KAAK,IAAI,CAAC,GAAG,SAAS,GACpD,CAAC,MAAM,IAAI,CAAC,GAAG,SAAS,CAC7B,CAAC;AAEF,MAAM,CAAC,OAAO,OAAO,YAAa,SAAQ,YAAY;CAAG"}

package/build/types.js.map

@@ -1 +1 @@
-{"version":3,"file":"types.js","sourceRoot":"","sources":["../src/types.ts"],"names":[],"mappings":"","sourcesContent":["/**\n * @hidden\n */\nexport type ViewEvent<Name extends string, Data> = Record<\n  Name,\n  Data extends object\n    ? ((event: { nativeEvent: Data }) => void) | undefined\n    : (() => void) | undefined\n>;\n"]}
+{"version":3,"file":"types.js","sourceRoot":"","sources":["../src/types.ts"],"names":[],"mappings":"","sourcesContent":["import type { SharedObject } from 'expo';\n\n/**\n * @hidden\n */\nexport type ViewEvent<Name extends string, Data> = Record<\n  Name,\n  Data extends object\n    ? ((event: { nativeEvent: Data }) => void) | undefined\n    : (() => void) | undefined\n>;\n\nexport declare class ExpoModifier extends SharedObject {}\n"]}

package/expo-module.config.json

@@ -9,7 +9,7 @@
     "publication": {
       "groupId": "expo.modules.ui",
       "artifactId": "expo.modules.ui",
-      "version": "0.2.0-alpha.0",
+      "version": "0.2.0-alpha.2",
       "repository": "local-maven-repo"
     }
   }

package/ios/BottomSheetView.swift

@@ -3,7 +3,13 @@
 import SwiftUI
 import ExpoModulesCore
 
-final class BottomSheetProps: ExpoSwiftUI.ViewProps {
+final class BottomSheetProps: ExpoSwiftUI.ViewProps, CommonViewModifierProps {
+  @Field var fixedSize: Bool?
+  @Field var frame: FrameOptions?
+  @Field var padding: PaddingOptions?
+  @Field var testID: String?
+  @Field var modifiers: ModifierArray?
+
   @Field var isOpened: Bool = false
   var onIsOpenedChange = EventDispatcher()
 }
@@ -73,6 +79,7 @@ struct BottomSheetView: ExpoSwiftUI.View {
             }
             .presentationDetents([.height(self.height)])
         }
+        .modifier(CommonViewModifiers(props: props))
         .onChange(of: isOpened, perform: { newIsOpened in
           if props.isOpened == newIsOpened {
             return
@@ -92,6 +99,7 @@ struct BottomSheetView: ExpoSwiftUI.View {
         .sheet(isPresented: $isOpened) {
           Children()
         }
+        .modifier(CommonViewModifiers(props: props))
         .onChange(of: isOpened, perform: { newIsOpened in
           if props.isOpened == newIsOpened {
             return

package/ios/Button/Button.swift

@@ -27,6 +27,7 @@ struct Button: ExpoSwiftUI.View {
       })
     .disabled(props.disabled)
     .tint(props.color)
+    .modifier(CommonViewModifiers(props: props))
     // TODO: Maybe there is a way to do a switch statement similarly to the `if` extension?
     .if(props.variant == .bordered, {
       $0.buttonStyle(.bordered)

package/ios/Button/ButtonProps.swift

@@ -34,8 +34,13 @@ internal enum ButtonVariant: String, Enumerable {
   case glassProminent
 }
 
-final class ButtonProps: ExpoSwiftUI.ViewProps, Observable {
-  required init() {}
+final class ButtonProps: ExpoSwiftUI.ViewProps, CommonViewModifierProps, Observable {
+  @Field var fixedSize: Bool?
+  @Field var frame: FrameOptions?
+  @Field var padding: PaddingOptions?
+  @Field var testID: String?
+  @Field var modifiers: ModifierArray?
+
   @Field var text: String?
   @Field var systemImage: String?
   @Field var color: Color?

package/ios/ColorPickerView.swift

@@ -3,7 +3,13 @@
 import SwiftUI
 import ExpoModulesCore
 
-final class ColorPickerProps: ExpoSwiftUI.ViewProps {
+final class ColorPickerProps: ExpoSwiftUI.ViewProps, CommonViewModifierProps {
+  @Field var fixedSize: Bool?
+  @Field var frame: FrameOptions?
+  @Field var padding: PaddingOptions?
+  @Field var testID: String?
+  @Field var modifiers: ModifierArray?
+
   @Field var selection: Color = .clear
   @Field var label: String?
   @Field var supportsOpacity: Bool = true
@@ -18,6 +24,7 @@ struct ColorPickerView: ExpoSwiftUI.View {
   var body: some View {
 #if !os(tvOS)
     ColorPicker(props.label ?? "", selection: $selection, supportsOpacity: props.supportsOpacity)
+      .modifier(CommonViewModifiers(props: props))
       .onAppear {
         selection = props.selection
         previousHex = colorToHex(props.selection)

package/ios/ContentUnavailableView.swift

@@ -7,10 +7,12 @@ internal final class ContentUnavailableViewProps: ExpoSwiftUI.ViewProps, CommonV
   @Field var fixedSize: Bool?
   @Field var frame: FrameOptions?
   @Field var padding: PaddingOptions?
+  @Field var testID: String?
+  @Field var modifiers: ModifierArray?
+
   @Field var title: String = ""
   @Field var systemImage: String = ""
   @Field var description: String = ""
-  @Field var testID: String?
 }
 
 struct ContentUnavailableView: ExpoSwiftUI.View {

package/ios/ContextMenu/ContextMenu.swift

@@ -110,6 +110,7 @@ struct ContextMenuPreview: ExpoSwiftUI.View {
 
   var body: some View {
     Children()
+      .modifier(CommonViewModifiers(props: props))
   }
 }
 
@@ -118,6 +119,7 @@ struct ContextMenuActivationElement: ExpoSwiftUI.View {
 
   var body: some View {
     Children()
+      .modifier(CommonViewModifiers(props: props))
   }
 }
 
@@ -134,6 +136,7 @@ struct ContextMenu: ExpoSwiftUI.View {
         activationElement: activationElement,
         props: props
       )
+      .modifier(CommonViewModifiers(props: props))
     } else {
       let preview = props.children?
         .compactMap { $0.childView as? ContextMenuPreview }
@@ -148,12 +151,14 @@ struct ContextMenu: ExpoSwiftUI.View {
           preview: preview,
           props: props
         )
+        .modifier(CommonViewModifiers(props: props))
       } else {
         LongPressContextMenu(
           elements: props.elements,
           activationElement: activationElement,
           props: props
         )
+        .modifier(CommonViewModifiers(props: props))
       }
     }
   }

package/ios/ContextMenu/ContextMenuRecords.swift

@@ -20,7 +20,13 @@ internal final class ContextMenuElement: Record, Identifiable {
   @Field var contextMenuElementID: String?
 }
 
-internal final class ContextMenuProps: ExpoSwiftUI.ViewProps {
+internal final class ContextMenuProps: ExpoSwiftUI.ViewProps, CommonViewModifierProps {
+  @Field var fixedSize: Bool?
+  @Field var frame: FrameOptions?
+  @Field var padding: PaddingOptions?
+  @Field var testID: String?
+  @Field var modifiers: ModifierArray?
+
   @Field var elements: [ContextMenuElement]
   var onContextMenuButtonPressed = EventDispatcher()
   var onContextMenuPickerOptionSelected = EventDispatcher()
@@ -28,8 +34,18 @@ internal final class ContextMenuProps: ExpoSwiftUI.ViewProps {
   @Field var activationMethod: ActivationMethod? = .singlePress
 }
 
-internal final class ContextMenuPreviewProps: ExpoSwiftUI.ViewProps {
+internal final class ContextMenuPreviewProps: ExpoSwiftUI.ViewProps, CommonViewModifierProps {
+  @Field var fixedSize: Bool?
+  @Field var frame: FrameOptions?
+  @Field var padding: PaddingOptions?
+  @Field var testID: String?
+  @Field var modifiers: ModifierArray?
 }
 
-internal final class ContextMenuActivationElementProps: ExpoSwiftUI.ViewProps {
+internal final class ContextMenuActivationElementProps: ExpoSwiftUI.ViewProps, CommonViewModifierProps {
+  @Field var fixedSize: Bool?
+  @Field var frame: FrameOptions?
+  @Field var padding: PaddingOptions?
+  @Field var testID: String?
+  @Field var modifiers: ModifierArray?
 }

package/ios/DateTimePickerView.swift

@@ -1,7 +1,13 @@
 import ExpoModulesCore
 import SwiftUI
 
-final class DateTimePickerProps: ExpoSwiftUI.ViewProps {
+final class DateTimePickerProps: ExpoSwiftUI.ViewProps, CommonViewModifierProps {
+  @Field var fixedSize: Bool?
+  @Field var frame: FrameOptions?
+  @Field var padding: PaddingOptions?
+  @Field var testID: String?
+  @Field var modifiers: ModifierArray?
+
   @Field var title: String?
   @Field var initialDate: Date?
   @Field var variant: PickerStyle = .automatic
@@ -25,6 +31,7 @@ struct DateTimePickerView: ExpoSwiftUI.View {
     let displayedComponents = props.displayedComponents.toDatePickerComponent()
 
     DatePicker(props.title ?? "", selection: $date, displayedComponents: displayedComponents)
+      .modifier(CommonViewModifiers(props: props))
       .onAppear {
         date = props.initialDate ?? Date()
       }

package/ios/DisclosureGroupView.swift

@@ -7,9 +7,11 @@ internal final class DisclosureGroupViewProps: ExpoSwiftUI.ViewProps, CommonView
   @Field var fixedSize: Bool?
   @Field var frame: FrameOptions?
   @Field var padding: PaddingOptions?
+  @Field var testID: String?
+  @Field var modifiers: ModifierArray?
+
   @Field var label: String
   @Field var isExpanded: Bool = true
-  @Field var testID: String?
   var onStateChange = EventDispatcher()
 }
 
@@ -24,6 +26,7 @@ internal struct DisclosureGroupView: ExpoSwiftUI.View {
     DisclosureGroup(props.label, isExpanded: $isExpanded) {
       Children()
     }
+    .modifier(CommonViewModifiers(props: props))
     .onAppear {
       isExpanded = props.isExpanded
     }
@@ -34,7 +37,6 @@ internal struct DisclosureGroupView: ExpoSwiftUI.View {
     .onChange(of: props.isExpanded) { newValue in
       isExpanded = newValue
     }
-    .modifier(CommonViewModifiers(props: props))
 #endif
   }
 }

package/ios/ExpoUIModule.swift

@@ -6,44 +6,41 @@ public final class ExpoUIModule: Module {
   public func definition() -> ModuleDefinition {
     Name("ExpoUI")
 
-    View(Button.self)
-    View(PickerView.self)
-    View(SwitchView.self)
-    View(SectionView.self)
     View(BottomSheetView.self)
-    View(SliderView.self)
+    View(Button.self)
+    View(ColorPickerView.self)
+    View(DateTimePickerView.self)
+    View(DisclosureGroupView.self)
+    View(ExpoUI.ContentUnavailableView.self)
     View(ExpoUI.ContextMenu.self)
     View(ExpoUI.ContextMenuActivationElement.self)
     View(ExpoUI.ContextMenuPreview.self)
-    View(ColorPickerView.self)
-    View(DateTimePickerView.self)
-    View(TextFieldView.self) {
-      AsyncFunction("setText") { (view: TextFieldView, text: String) in
-        view.setText(text)
-      }
-    }
+    View(FormView.self)
+    View(GaugeView.self)
+    View(GroupView.self)
+    View(HStackView.self)
+    View(HostView.self)
+    View(ImageView.self)
+    View(LabelView.self)
+    View(ListView.self)
+    View(PickerView.self)
+    View(ProgressView.self)
+    View(SectionView.self)
     View(SecureFieldView.self) {
       AsyncFunction("setText") { (view: SecureFieldView, text: String) in
         view.setText(text)
       }
     }
-    View(ProgressView.self)
-    View(GaugeView.self)
-    View(ListView.self)
-    View(LabelView.self)
     View(ShareLinkView.self)
-    View(HostView.self)
-
-    // Preview components in the "primitives" exports
-    View(FormView.self)
-    View(HStackView.self)
-    View(VStackView.self)
-    View(SectionPrimitiveView.self)
-    View(TextView.self)
-    View(ImageView.self)
+    View(SliderView.self)
     View(SpacerView.self)
-    View(GroupView.self)
-    View(DisclosureGroupView.self)
-    View(ExpoUI.ContentUnavailableView.self)
+    View(SwitchView.self)
+    View(TextView.self)
+    View(TextFieldView.self) {
+      AsyncFunction("setText") { (view: TextFieldView, text: String) in
+        view.setText(text)
+      }
+    }
+    View(VStackView.self)
   }
 }

package/ios/FormView.swift

@@ -7,8 +7,10 @@ internal final class FormViewProps: ExpoSwiftUI.ViewProps, CommonViewModifierPro
   @Field var fixedSize: Bool?
   @Field var frame: FrameOptions?
   @Field var padding: PaddingOptions?
-  @Field var scrollEnabled: Bool = true
   @Field var testID: String?
+  @Field var modifiers: ModifierArray?
+
+  @Field var scrollEnabled: Bool = true
 }
 
 internal struct FormView: ExpoSwiftUI.View {

package/ios/Gauge/Gauge.swift

@@ -21,6 +21,7 @@ struct GaugeView: ExpoSwiftUI.View {
       } maximumValueLabel: {
         optionalLabelFor(props.max)
       }
+      .modifier(CommonViewModifiers(props: props))
       .if(props.type == .default) { $0.gaugeStyle(.automatic) }
       .if(props.type == .circular) { $0.gaugeStyle(.accessoryCircular) }
       .if(props.type == .circularCapacity) { $0.gaugeStyle(.accessoryCircularCapacity) }

package/ios/Gauge/GaugeProps.swift

@@ -17,7 +17,13 @@ internal enum GaugeStyle: String, Enumerable {
   case linearCapacity
 }
 
-final class GaugeProps: ExpoSwiftUI.ViewProps {
+final class GaugeProps: ExpoSwiftUI.ViewProps, CommonViewModifierProps {
+  @Field var fixedSize: Bool?
+  @Field var frame: FrameOptions?
+  @Field var padding: PaddingOptions?
+  @Field var testID: String?
+  @Field var modifiers: ModifierArray?
+
   @Field var label: String?
   @Field var labelColor: Color?
   @Field var current: ValueOptions

package/ios/GroupView.swift

@@ -7,8 +7,10 @@ internal final class GroupViewProps: ExpoSwiftUI.ViewProps, CommonViewModifierPr
   @Field var fixedSize: Bool?
   @Field var frame: FrameOptions?
   @Field var padding: PaddingOptions?
-  @Field var useTapGesture: Bool?
   @Field var testID: String?
+  @Field var modifiers: ModifierArray?
+
+  @Field var useTapGesture: Bool?
   var onTap = EventDispatcher()
 }
 

package/ios/HStackView.swift

@@ -30,11 +30,13 @@ internal final class HStackViewProps: ExpoSwiftUI.ViewProps, CommonViewModifierP
   @Field var fixedSize: Bool?
   @Field var frame: FrameOptions?
   @Field var padding: PaddingOptions?
+  @Field var testID: String?
+  @Field var modifiers: ModifierArray?
+
   @Field var spacing: Double?
   @Field var useTapGesture: Bool?
   @Field var alignment: VerticalAlignmentOptions?
   @Field var backgroundColor: Color?
-  @Field var testID: String?
   var onTap = EventDispatcher()
 }
 

package/ios/HostView.swift

@@ -23,7 +23,7 @@ internal final class HostViewProps: ExpoSwiftUI.ViewProps {
   var onLayoutContent = EventDispatcher()
 }
 
-internal struct HostView: ExpoSwiftUI.View, ExpoSwiftUI.WithHostingView {
+struct HostView: ExpoSwiftUI.View, ExpoSwiftUI.WithHostingView {
   @ObservedObject var props: HostViewProps
 
   var body: some View {

package/ios/ImageView.swift

@@ -7,11 +7,13 @@ internal final class ImageViewProps: ExpoSwiftUI.ViewProps, CommonViewModifierPr
   @Field var fixedSize: Bool?
   @Field var frame: FrameOptions?
   @Field var padding: PaddingOptions?
+  @Field var testID: String?
+  @Field var modifiers: ModifierArray?
+
   @Field var systemName: String = ""
   @Field var size: Double?
   @Field var color: Color?
   @Field var useTapGesture: Bool?
-  @Field var testID: String?
   var onTap = EventDispatcher()
 }
 

package/ios/Label.swift

@@ -3,7 +3,13 @@
 import ExpoModulesCore
 import SwiftUI
 
-final class LabelViewProps: ExpoSwiftUI.ViewProps {
+final class LabelViewProps: ExpoSwiftUI.ViewProps, CommonViewModifierProps {
+  @Field var fixedSize: Bool?
+  @Field var frame: FrameOptions?
+  @Field var padding: PaddingOptions?
+  @Field var testID: String?
+  @Field var modifiers: ModifierArray?
+
   @Field var title: String?
   @Field var systemImage: String?
   @Field var color: Color?
@@ -17,6 +23,7 @@ struct LabelView: ExpoSwiftUI.View {
       title: { Text(props.title ?? "") },
       icon: { Image(systemName: props.systemImage ?? "").foregroundStyle(props.color ?? Color.accentColor) }
     )
-    .fixedSize()
+    .modifier(CommonViewModifiers(props: props))
+    .applyFixedSize(props.fixedSize ?? true)
   }
 }

package/ios/List.swift

@@ -3,7 +3,13 @@
 import ExpoModulesCore
 import SwiftUI
 
-final class ListProps: ExpoSwiftUI.ViewProps {
+final class ListProps: ExpoSwiftUI.ViewProps, CommonViewModifierProps {
+  @Field var fixedSize: Bool?
+  @Field var frame: FrameOptions?
+  @Field var padding: PaddingOptions?
+  @Field var testID: String?
+  @Field var modifiers: ModifierArray?
+
   @Field var listStyle: String = "automatic"
   @Field var moveEnabled: Bool = false
   @Field var deleteEnabled: Bool = false
@@ -34,6 +40,7 @@ struct ListView: ExpoSwiftUI.View {
       .moveDisabled(!props.moveEnabled)
     }
       .modifier(ListStyleModifer(style: props.listStyle))
+      .modifier(CommonViewModifiers(props: props))
       .onAppear {
         editModeEnabled = props.editModeEnabled ? .active : .inactive
       }
@@ -43,7 +50,6 @@ struct ListView: ExpoSwiftUI.View {
         }
       }
       .onChange(of: selection) { selection in
-        print(selection)
         handleSelectionChange(selection: selection)
       }
       .modifier(ScrollDisabledModifier(scrollEnabled: props.scrollEnabled))

package/ios/Modifiers/CommonViewModifiers.swift

@@ -3,15 +3,17 @@
 import ExpoModulesCore
 import SwiftUI
 
-internal protocol CommonViewModifierProps {
+internal protocol CommonViewModifierProps: ObservableObject {
   var fixedSize: Bool? { get }
   var frame: FrameOptions? { get }
   var padding: PaddingOptions? { get }
   var testID: String? { get }
+  var modifiers: ModifierArray? { get }
+  var globalEventDispatcher: EventDispatcher { get }
 }
 
-internal struct CommonViewModifiers: ViewModifier {
-  let props: CommonViewModifierProps
+internal struct CommonViewModifiers<Props: CommonViewModifierProps>: ViewModifier {
+  @ObservedObject var props: Props
   var defaultFrameAlignment = Alignment.center
 
   func body(content: Content) -> some View {
@@ -20,5 +22,6 @@ internal struct CommonViewModifiers: ViewModifier {
       .applyFrame(props.frame, defaultAlignment: defaultFrameAlignment)
       .applyPadding(props.padding)
       .applyAccessibilityIdentifier(props.testID)
+      .applyModifiers(props.modifiers, globalEventDispatcher: props.globalEventDispatcher)
   }
 }

package/ios/Modifiers/View+ModifierArray.swift

@@ -0,0 +1,27 @@
+// Copyright 2015-present 650 Industries. All rights reserved.
+
+import ExpoModulesCore
+import SwiftUI
+
+internal typealias ModifierType = [String: Any]
+internal typealias ModifierArray = [ModifierType]
+
+internal extension View {
+  /**
+   * Applies an array of modifiers to a view using the ViewModifierRegistry.
+   */
+  @ViewBuilder
+  func applyModifiers(_ modifiers: ModifierArray?, globalEventDispatcher: EventDispatcher) -> some View {
+    if let modifiers = modifiers {
+      modifiers.reduce(AnyView(self)) { currentView, modifierConfig in
+        guard let type = modifierConfig["$type"] as? String else {
+          return currentView
+        }
+
+        return ViewModifierRegistry.shared.applyModifier(type, to: currentView, globalEventDispatcher: globalEventDispatcher, params: modifierConfig)
+      }
+    } else {
+      self
+    }
+  }
+}