@expo/ui 57.0.20 → 57.0.22

package/src/jetpack-compose/modifiers/index.ts

@@ -79,10 +79,24 @@ export const fillMaxWidth = (fraction?: number) => createModifier('fillMaxWidth'
 export const fillMaxHeight = (fraction?: number) => createModifier('fillMaxHeight', { fraction });
 
 /**
- * Sets the exact width of the view.
- * @param value - Width in dp.
+ * Intrinsic width values for the `width` modifier. `Min` is the smallest width at which the content
+ * still draws correctly, and `Max` is the width the content needs when nothing limits it.
  */
-export const width = (value: number) => createModifier('width', { width: value });
+export const IntrinsicSize = { Min: 'min', Max: 'max' } as const;
+// eslint-disable-next-line @typescript-eslint/no-redeclare -- value and type share the name, like an enum
+export type IntrinsicSize = (typeof IntrinsicSize)[keyof typeof IntrinsicSize];
+
+/**
+ * Sets the width of the view to an exact value, or to the minimum or maximum intrinsic width of its
+ * content. The incoming constraints can still make the view narrower or wider than that width.
+ * @param value - Width in dp, or an `IntrinsicSize`. `IntrinsicSize.Min` uses the minimum intrinsic
+ * width, the smallest width at which the content still draws correctly (for a text, its widest word).
+ * `IntrinsicSize.Max` uses the maximum intrinsic width, the width the content needs when nothing
+ * limits it (for a text, a single line).
+ * @see [Compose `width(IntrinsicSize)` modifier](https://developer.android.com/reference/kotlin/androidx/compose/foundation/layout/width.modifier#(androidx.compose.ui.Modifier).width(androidx.compose.foundation.layout.IntrinsicSize))
+ * @see [Intrinsic measurements in Compose layouts](https://developer.android.com/develop/ui/compose/layouts/intrinsic-measurements)
+ */
+export const width = (value: number | IntrinsicSize) => createModifier('width', { width: value });
 
 /**
  * Sets the exact height of the view.
@@ -443,10 +457,25 @@ export const onGloballyPositioned = (
  */
 export const testID = (tag: string) => createModifier('testID', { testID: tag });
 
+/**
+ * Options for the `semantics` modifier.
+ */
+export type SemanticsConfig = {
+  /**
+   * An autofill hint, such as `'email'` or `'password'`.
+   */
+  contentType?: string;
+  /**
+   * What accessibility services such as TalkBack announce for the element. Useful when the visible
+   * content does not read well aloud, as with an abbreviation or a glyph.
+   */
+  contentDescription?: string;
+};
+
 /**
  * Applies semantic properties. Wraps `Modifier.semantics { ... }`.
  */
-export const semantics = (params: { contentType?: string }) => createModifier('semantics', params);
+export const semantics = (params: SemanticsConfig) => createModifier('semantics', params);
 
 // =============================================================================
 // Clip Modifier & Shapes

package/src/swift-ui/ArrangementView/index.tsx

@@ -0,0 +1,70 @@
+import { requireNativeView } from 'expo';
+
+import { Slot } from '../SlotView';
+import { createViewModifierEventListener } from '../modifiers/utils';
+import { type CommonViewModifierProps } from '../types';
+
+export interface ArrangementViewProps extends CommonViewModifierProps {
+  /**
+   * The views to arrange. Provide `ArrangementView.Primary` and `ArrangementView.Secondary`.
+   */
+  children: React.ReactNode;
+}
+
+const ArrangementViewNativeView: React.ComponentType<ArrangementViewProps> = requireNativeView(
+  'ExpoUI',
+  'ArrangementViewView'
+);
+
+/**
+ * The primary view of the arrangement.
+ */
+function ArrangementViewPrimary(props: { children: React.ReactNode }) {
+  return <Slot name="primary">{props.children}</Slot>;
+}
+
+/**
+ * The secondary view of the arrangement.
+ */
+function ArrangementViewSecondary(props: { children: React.ReactNode }) {
+  return <Slot name="secondary">{props.children}</Slot>;
+}
+
+ArrangementView.Primary = ArrangementViewPrimary;
+ArrangementView.Secondary = ArrangementViewSecondary;
+
+/**
+ * ArrangementView uses the native [ArrangementView](https://developer.apple.com/documentation/swiftui/arrangementview) view.
+ *
+ * A view that arranges primary and secondary content using an adaptive layout that responds to
+ * the environment.
+ *
+ * > **Note:** Below iOS 27.1, the children render without a container.
+ * @example
+ * ```tsx
+ * <Host style={{ flex: 1 }}>
+ *   <ArrangementView modifiers={[arrangementViewStyle('split')]}>
+ *     <ArrangementView.Primary>
+ *       <NowPlaying />
+ *     </ArrangementView.Primary>
+ *     <ArrangementView.Secondary>
+ *       <Lyrics />
+ *     </ArrangementView.Secondary>
+ *   </ArrangementView>
+ * </Host>
+ * ```
+ * @platform ios 27.1+
+ * @platform tvos 27.1+
+ */
+export function ArrangementView(props: ArrangementViewProps) {
+  const { modifiers, children, ...restProps } = props;
+
+  return (
+    <ArrangementViewNativeView
+      modifiers={modifiers}
+      {...(modifiers ? createViewModifierEventListener(modifiers) : undefined)}
+      {...restProps}>
+      {children}
+    </ArrangementViewNativeView>
+  );
+}

package/src/swift-ui/index.tsx

@@ -28,6 +28,7 @@ export * from './Menu';
 export * from './NavigationDestination';
 export * from './NavigationLink';
 export * from './NavigationSplitView';
+export * from './ArrangementView';
 export * from './NavigationStack';
 export * from './Picker';
 export * from './ProgressView';

package/src/swift-ui/modifiers/animation/index.ts

@@ -5,6 +5,7 @@ import type {
   ChainableAnimationType,
   InterpolatingSpringAnimationParams,
   SpringAnimationParams,
+  SpringPresetAnimationParams,
   TimingAnimationParams,
 } from './types';
 
@@ -16,6 +17,8 @@ import type {
  * - `spring` accepts [`SpringAnimationParams`](#springanimationparams).
  * - `interpolatingSpring` accepts
  * [`InterpolatingSpringAnimationParams`](#interpolatingspringanimationparams).
+ * - Spring presets (`smooth`, `snappy`, `bouncy`) accept
+ * [`SpringPresetAnimationParams`](#springpresetanimationparams).
  * - Chaining returns [`ChainableAnimationType`](#chainableanimationtype).
  *
  * @example
@@ -80,23 +83,33 @@ export const Animation = {
       duration: params?.duration,
       bounce: params?.bounce,
     }),
+  smooth: (params?: SpringPresetAnimationParams) =>
+    ChainableAnimation({
+      type: 'smooth',
+      duration: params?.duration,
+      extraBounce: params?.extraBounce,
+    }),
+  snappy: (params?: SpringPresetAnimationParams) =>
+    ChainableAnimation({
+      type: 'snappy',
+      duration: params?.duration,
+      extraBounce: params?.extraBounce,
+    }),
+  bouncy: (params?: SpringPresetAnimationParams) =>
+    ChainableAnimation({
+      type: 'bouncy',
+      duration: params?.duration,
+      extraBounce: params?.extraBounce,
+    }),
 
   default: ChainableAnimation({ type: 'default' }),
 };
 
 function ChainableAnimation(animation: AnimationObject): ChainableAnimationType {
-  let _animation: AnimationObject = animation;
-
   return {
-    delay: (delay) => {
-      _animation = { ..._animation, delay };
-      return ChainableAnimation(_animation);
-    },
-    repeat: (params) => {
-      _animation = { ..._animation, ...params };
-      return ChainableAnimation(_animation);
-    },
-    [VALUE_SYMBOL]: () => _animation,
+    delay: (delay) => ChainableAnimation({ ...animation, delay }),
+    repeat: (params) => ChainableAnimation({ ...animation, ...params }),
+    [VALUE_SYMBOL]: () => animation,
   };
 }
 

package/src/swift-ui/modifiers/animation/types.ts

@@ -12,6 +12,9 @@ export type AnimationObject = {
     | 'linear'
     | 'spring'
     | 'interpolatingSpring'
+    | 'smooth'
+    | 'snappy'
+    | 'bouncy'
     | 'default';
   duration?: number;
   response?: number;
@@ -22,6 +25,7 @@ export type AnimationObject = {
   stiffness?: number;
   damping?: number;
   initialVelocity?: number;
+  extraBounce?: number;
   delay?: number;
   repeatCount?: number;
   autoreverses?: boolean;
@@ -84,6 +88,20 @@ export type InterpolatingSpringAnimationParams = {
   bounce?: number;
 };
 
+export type SpringPresetAnimationParams = {
+  /**
+   * The perceptual duration, which defines the pace of the spring (in seconds). This is
+   * approximately equal to the settling duration, but for very bouncy springs, it is the period of
+   * oscillation of the spring.
+   */
+  duration?: number;
+  /**
+   * Bounce added to the base bounce of the preset: 0 for `smooth`, 0.15 for `snappy`, and 0.3 for
+   * `bouncy`. Keep the total below 1: at 1 and above, the spring oscillates without settling.
+   */
+  extraBounce?: number;
+};
+
 export type ChainableAnimationType = {
   /** Adds a delay before the animation starts (in seconds). */
   delay: (delay: number) => ChainableAnimationType;

package/src/swift-ui/modifiers/arrangementModifiers.ts

@@ -0,0 +1,142 @@
+import { createModifier } from './createModifier';
+
+/**
+ * A style that configures an `ArrangementView` with an arrangement.
+ * - `'automatic'`: The default style, which resolves to `'split'`.
+ * - `'split'`: An arrangement view style that places the primary and secondary views side by side along one or more axes.
+ * - `'overlay'`: An arrangement view style that layers the primary view over the secondary view in z-order.
+ */
+export type ArrangementViewStyle = 'automatic' | 'split' | 'overlay';
+
+/**
+ * Sets the style for arrangement views within this view.
+ * @param style - The style to apply.
+ * @param options - The `axes` the arrangement supports. With `'split'`, creates a split arrangement
+ * that supports the given axes. With `'overlay'`, creates an overlay arrangement that supports
+ * laying out its views along the given axes.
+ * @platform ios 27.1+
+ * @platform tvos 27.1+
+ * @see Official [SwiftUI documentation](https://developer.apple.com/documentation/swiftui/view/arrangementviewstyle(_:)).
+ */
+export function arrangementViewStyle(style: 'automatic'): ReturnType<typeof createModifier>;
+export function arrangementViewStyle(
+  style: 'split' | 'overlay',
+  options?: { axes?: 'horizontal' | 'vertical' | 'both' }
+): ReturnType<typeof createModifier>;
+export function arrangementViewStyle(
+  style: ArrangementViewStyle,
+  options?: { axes?: 'horizontal' | 'vertical' | 'both' }
+) {
+  return createModifier('arrangementViewStyle', { style, axes: options?.axes });
+}
+
+/**
+ * The minimum, ideal, and maximum ratios for `splitArrangementLayoutRatio`.
+ */
+export type SplitArrangementLayoutRatioParams = {
+  minHorizontal?: number;
+  idealHorizontal?: number;
+  maxHorizontal?: number;
+  minVertical?: number;
+  idealVertical?: number;
+  maxVertical?: number;
+};
+
+/**
+ * Sets the preferred size ratio for the content of `ArrangementView.Primary` or
+ * `ArrangementView.Secondary` in a split arrangement.
+ * @platform ios 27.1+
+ * @platform tvos 27.1+
+ * @see Official [SwiftUI documentation](https://developer.apple.com/documentation/swiftui/view/splitarrangementlayoutratio(_:)).
+ */
+export function splitArrangementLayoutRatio(ratio: number): ReturnType<typeof createModifier>;
+/**
+ * Sets the size ratio for the content of `ArrangementView.Primary` or `ArrangementView.Secondary`
+ * in a split arrangement.
+ * @platform ios 27.1+
+ * @platform tvos 27.1+
+ * @see Official [SwiftUI documentation](https://developer.apple.com/documentation/swiftui/view/splitarrangementlayoutratio(minhorizontal:idealhorizontal:maxhorizontal:minvertical:idealvertical:maxvertical:)).
+ */
+export function splitArrangementLayoutRatio(
+  ratios: SplitArrangementLayoutRatioParams
+): ReturnType<typeof createModifier>;
+export function splitArrangementLayoutRatio(
+  ratioOrParams: number | SplitArrangementLayoutRatioParams
+) {
+  return createModifier(
+    'splitArrangementLayoutRatio',
+    typeof ratioOrParams === 'number' ? { ratio: ratioOrParams } : ratioOrParams
+  );
+}
+
+/**
+ * The minimum, ideal, and maximum sizes for `splitArrangementLayoutSize`.
+ */
+export type SplitArrangementLayoutSizeParams = {
+  minWidth?: number;
+  idealWidth?: number;
+  maxWidth?: number;
+  minHeight?: number;
+  idealHeight?: number;
+  maxHeight?: number;
+};
+
+/**
+ * Sets the size constraints for the content of `ArrangementView.Primary` or
+ * `ArrangementView.Secondary` in a split arrangement.
+ * @platform ios 27.1+
+ * @platform tvos 27.1+
+ * @see Official [SwiftUI documentation](https://developer.apple.com/documentation/swiftui/view/splitarrangementlayoutsize(minwidth:idealwidth:maxwidth:minheight:idealheight:maxheight:)).
+ */
+export const splitArrangementLayoutSize = (constraints: SplitArrangementLayoutSizeParams) =>
+  createModifier('splitArrangementLayoutSize', constraints);
+
+/**
+ * The split axes on which `splitArrangementFixedLayoutSize` prefers the ideal size of the view.
+ */
+export type SplitArrangementFixedLayoutSizeParams = {
+  /**
+   * Whether to prefer a fixed width for the view in a horizontal split.
+   * @default true
+   */
+  horizontal?: boolean;
+  /**
+   * Whether to prefer a fixed height for the view in a vertical split.
+   * @default true
+   */
+  vertical?: boolean;
+};
+
+/**
+ * Sets the preferred size constraint for the content of `ArrangementView.Primary` or
+ * `ArrangementView.Secondary` in a split arrangement to the ideal size of the view within its
+ * container. The arrangement view prefers this size, but may resize to a smaller size depending on
+ * the priority of the view.
+ * @platform ios 27.1+
+ * @platform tvos 27.1+
+ * @see Official [SwiftUI documentation](https://developer.apple.com/documentation/swiftui/view/splitarrangementfixedlayoutsize(horizontal:vertical:)).
+ */
+export const splitArrangementFixedLayoutSize = (options?: SplitArrangementFixedLayoutSizeParams) =>
+  createModifier('splitArrangementFixedLayoutSize', options);
+
+/**
+ * Sets the horizontal edge that a view in an overlay arrangement occupies when the arrangement
+ * transitions to a horizontal layout.
+ * @platform ios 27.1+
+ * @platform tvos 27.1+
+ * @see Official [SwiftUI documentation](https://developer.apple.com/documentation/swiftui/view/overlayarrangementedge(_:)).
+ */
+export function overlayArrangementEdge(
+  edge: 'leading' | 'trailing'
+): ReturnType<typeof createModifier>;
+/**
+ * Sets the vertical edge that a view in an overlay arrangement occupies when the arrangement
+ * transitions to a vertical layout.
+ * @platform ios 27.1+
+ * @platform tvos 27.1+
+ * @see Official [SwiftUI documentation](https://developer.apple.com/documentation/swiftui/view/overlayarrangementedge(_:)-4tjwn).
+ */
+export function overlayArrangementEdge(edge: 'top' | 'bottom'): ReturnType<typeof createModifier>;
+export function overlayArrangementEdge(edge: 'top' | 'bottom' | 'leading' | 'trailing') {
+  return createModifier('overlayArrangementEdge', { edge });
+}

package/src/swift-ui/modifiers/containerBackground.ts

@@ -6,8 +6,8 @@ export type ContainerBackgroundPlacement = 'widget' | 'navigation' | 'navigation
 /**
  * Sets the container background of the enclosing container.
  *
- * > **Note:** `navigation` and `navigationSplitView` require iOS 18. On iOS 17 they fall back to
- * > the `widget` placement.
+ * > **Note:** `navigation` and `navigationSplitView` require iOS 18. The `widget` placement works
+ * > only in `expo-widgets` widgets, where the other placements fall back to it on iOS 17.
  *
  * @param style - Any [`ShapeStyle`](#shapestyle): a color, a hierarchical style, a material, or a gradient.
  * @param container - The type of container to apply the background to.

package/src/swift-ui/modifiers/index.ts

@@ -786,6 +786,16 @@ export const scrollDismissesKeyboard = (
 export const scrollDisabled = (disabled: boolean = true) =>
   createModifier('scrollDisabled', { disabled });
 
+/**
+ * Sets the preferred color scheme for the nearest enclosing presentation, such as a `BottomSheet`,
+ * including its background. The value overrides the device's light or dark appearance for that
+ * presentation.
+ * @param colorScheme - The preferred color scheme, or `null` to indicate no preference.
+ * @see Official [SwiftUI documentation](https://developer.apple.com/documentation/swiftui/view/preferredcolorscheme(_:)).
+ */
+export const preferredColorScheme = (colorScheme: 'light' | 'dark' | null) =>
+  createModifier('preferredColorScheme', { colorScheme });
+
 /**
  * Disables or enables clipping of a scrollable view's content to its bounds.
  * Content drawn outside those bounds, such as a shadow or a view scaled up past the edge, is
@@ -1712,6 +1722,41 @@ export const resizable = (
  */
 export const navigationTitle = (title: string) => createModifier('navigationTitle', { title });
 
+/**
+ * Title display modes for the `navigationBarTitleDisplayMode` modifier.
+ * @platform ios
+ */
+export type NavigationBarTitleDisplayMode = 'automatic' | 'inline' | 'large';
+
+/**
+ * Configures the title display mode for a navigation bar.
+ * @param displayMode - The style to use for displaying the navigation bar title.
+ * @platform ios
+ * @see Official [SwiftUI documentation](https://developer.apple.com/documentation/swiftui/view/navigationbartitledisplaymode(_:)).
+ */
+export const navigationBarTitleDisplayMode = (displayMode: NavigationBarTitleDisplayMode) =>
+  createModifier('navigationBarTitleDisplayMode', { displayMode });
+
+/**
+ * Title display modes for the `toolbarTitleDisplayMode` modifier. On tvOS, `large` and
+ * `inlineLarge` have no effect. On macOS, `large` has no effect.
+ * @platform ios 17.0+
+ * @platform tvos 17.0+
+ * @platform macos 14.0+
+ */
+export type ToolbarTitleDisplayMode = 'automatic' | 'inline' | 'inlineLarge' | 'large';
+
+/**
+ * Configures the title display mode for a toolbar.
+ * @param mode - The style to use for displaying the toolbar title.
+ * @platform ios 17.0+
+ * @platform tvos 17.0+
+ * @platform macos 14.0+
+ * @see Official [SwiftUI documentation](https://developer.apple.com/documentation/swiftui/view/toolbartitledisplaymode(_:)).
+ */
+export const toolbarTitleDisplayMode = (mode: ToolbarTitleDisplayMode) =>
+  createModifier('toolbarTitleDisplayMode', { mode });
+
 // =============================================================================
 // Type Definitions
 // =============================================================================
@@ -1799,6 +1844,7 @@ export type BuiltInModifier =
   | ReturnType<typeof containerRelativeFrame>
   | ReturnType<typeof scrollContentBackground>
   | ReturnType<typeof scrollDisabled>
+  | ReturnType<typeof preferredColorScheme>
   | ReturnType<typeof scrollClipDisabled>
   | ReturnType<typeof scrollIndicators>
   | ReturnType<typeof scrollEdgeEffectStyle>
@@ -1857,7 +1903,9 @@ export type BuiltInModifier =
   | ReturnType<typeof widgetURL>
   | ReturnType<typeof activityBackgroundTint>
   | ReturnType<typeof containerBackground>
-  | ReturnType<typeof navigationTitle>;
+  | ReturnType<typeof navigationTitle>
+  | ReturnType<typeof navigationBarTitleDisplayMode>
+  | ReturnType<typeof toolbarTitleDisplayMode>;
 
 /**
  * Main ViewModifier type that supports both built-in and 3rd party modifiers.
@@ -1901,6 +1949,7 @@ export * from './pickerStyle';
 export * from './menuOrder';
 export * from './tabViewModifiers';
 export * from './navigationModifiers';
+export * from './arrangementModifiers';
 export * from './datePickerStyle';
 export * from './progressViewStyle';
 export * from './gaugeStyle';
@@ -1915,5 +1964,6 @@ export type {
   TimingAnimationParams,
   SpringAnimationParams,
   InterpolatingSpringAnimationParams,
+  SpringPresetAnimationParams,
   ChainableAnimationType,
 } from './animation/types';

package/src/swift-ui/modifiers/presentationModifiers.ts

@@ -57,6 +57,16 @@ export const presentationDetents = (
 export const presentationDragIndicator = (visibility: 'automatic' | 'visible' | 'hidden') =>
   createModifier('presentationDragIndicator', { visibility });
 
+/**
+ * Sets the corner radius of a sheet presentation.
+ * @param cornerRadius - The corner radius in points, or `null` to use the system default.
+ * @platform ios 16.4+
+ * @platform tvos 16.4+
+ * @see Official [SwiftUI documentation](https://developer.apple.com/documentation/swiftui/view/presentationcornerradius(_:)).
+ */
+export const presentationCornerRadius = (cornerRadius: number | null) =>
+  createModifier('presentationCornerRadius', { cornerRadius });
+
 /**
  * Presentation background interaction type.
  */

package/src/universal/State.android.ts

@@ -1,3 +1,3 @@
 export { useNativeState } from '@expo/ui/jetpack-compose';
 
-export type ObservableState<T> = { value: T };
+export type { ObservableState } from './types';

package/src/universal/State.ios.ts

@@ -1,3 +1,3 @@
 export { useNativeState } from '@expo/ui/swift-ui';
 
-export type ObservableState<T> = { value: T };
+export type { ObservableState } from './types';

package/src/universal/State.ts

@@ -1,6 +1,8 @@
 import { useRef, useState } from 'react';
 
-export type ObservableState<T> = { value: T };
+import type { ObservableState } from './types';
+
+export type { ObservableState };
 
 /**
  * Web polyfill for the native `useNativeState` hook.
@@ -13,14 +15,20 @@ export function useNativeState<T>(initialValue: T): ObservableState<T> {
 
   const stateRef = useRef<ObservableState<T> | null>(null);
   if (stateRef.current === null) {
+    const get = () => valRef.current;
+    const set = (v: T) => {
+      valRef.current = v;
+      setVal(v);
+    };
     stateRef.current = {
       get value() {
-        return valRef.current;
+        return get();
       },
       set value(v: T) {
-        valRef.current = v;
-        setVal(v);
+        set(v);
       },
+      get,
+      set,
     };
   }
   return stateRef.current;

package/src/universal/Switch/index.android.tsx

@@ -1,5 +1,11 @@
 import { Row, Switch as ComposeSwitch, Text } from '@expo/ui/jetpack-compose';
-import { testID as testIDModifier, weight } from '@expo/ui/jetpack-compose/modifiers';
+import {
+  fillMaxWidth,
+  IntrinsicSize,
+  testID as testIDModifier,
+  weight,
+  width,
+} from '@expo/ui/jetpack-compose/modifiers';
 
 import type { SwitchProps } from './types';
 
@@ -16,7 +22,10 @@ export function Switch({ value, onValueChange, label, disabled, testID, modifier
   if (label == null) return toggle;
 
   return (
-    <Row verticalAlignment="center" horizontalArrangement={{ spacedBy: 8 }}>
+    <Row
+      verticalAlignment="center"
+      horizontalArrangement={{ spacedBy: 8 }}
+      modifiers={[fillMaxWidth(), width(IntrinsicSize.Max)]}>
       <Text modifiers={[weight(1)]}>{label}</Text>
       {toggle}
     </Row>

package/src/universal/transformStyle.ios.ts

@@ -2,6 +2,7 @@ import {
   background,
   border,
   clipShape,
+  contentShape,
   disabled as disabledMod,
   font,
   foregroundStyle,
@@ -15,6 +16,7 @@ import {
   onTapGesture,
   opacity,
   padding,
+  shapes,
   type ModifierConfig,
 } from '@expo/ui/swift-ui/modifiers';
 
@@ -154,8 +156,9 @@ export function transformToModifiers(
   // type. The event, lifecycle, and behavior modifiers below are never dropped.
   mods = omitUserOverridden(mods, extraModifiers);
 
-  // Events
-  if (props.onPress) mods.push(onTapGesture(props.onPress));
+  // Events. SwiftUI only hit-tests drawn content, so the `contentShape` lets
+  // taps on empty space (for example a `Spacer` in a `Row`) reach `onPress`.
+  if (props.onPress) mods.push(contentShape(shapes.rectangle()), onTapGesture(props.onPress));
 
   // Lifecycle
   if (props.onAppear) mods.push(onAppear(props.onAppear));

package/src/universal/types.ts

@@ -111,3 +111,30 @@ export interface UniversalBaseProps {
  * @docsInline
  */
 export type UniversalAlignment = 'start' | 'center' | 'end';
+
+/**
+ * Observable state created with `useNativeState`.
+ *
+ * On Android and iOS, the value is shared with native views. A write from the JavaScript thread
+ * is applied on the UI thread asynchronously, so a read right after it may still return the
+ * previous value. Writes don't re-render the component that created the state.
+ *
+ * On web, the value is backed by React state. A write is readable immediately and re-renders the
+ * component that created the state.
+ */
+export type ObservableState<T> = {
+  /**
+   * The current value.
+   */
+  value: T;
+
+  /**
+   * Reads the current value. A React Compiler-compliant alternative to reading `.value`.
+   */
+  get(): T;
+
+  /**
+   * Writes a new value. A React Compiler-compliant alternative to assigning `.value`.
+   */
+  set(value: T): void;
+};

package/ios/AccessoryWidgetBackgroundView.swift

@@ -1,27 +0,0 @@
-import SwiftUI
-import ExpoModulesCore
-#if !os(tvOS)
-import WidgetKit
-#endif
-
-public final class AccessoryWidgetBackgroundProps: UIBaseViewProps {}
-
-public struct AccessoryWidgetBackgroundView: ExpoSwiftUI.View {
-  @ObservedObject public var props: AccessoryWidgetBackgroundProps
-
-  public init(props: AccessoryWidgetBackgroundProps) {
-    self.props = props
-  }
-
-  public var body: some View {
-#if !os(tvOS)
-    if #available(iOS 16.0, *) {
-      AccessoryWidgetBackground()
-    } else {
-      Color.clear
-    }
-#else
-    EmptyView()
-#endif
-  }
-}