@expo/ui 57.0.22 → 57.0.23

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

@@ -0,0 +1,107 @@
+import { createModifier, createModifierWithEventListener } from './createModifier';
+import { getStateId, type ObservableState } from '../../State';
+
+/**
+ * The placement of a search field in a view hierarchy.
+ *
+ * - `automatic`: SwiftUI places the search field automatically.
+ * - `toolbar`: The search field appears in the toolbar. Falls back to `automatic` on tvOS.
+ * - `sidebar`: The search field appears in the sidebar of a navigation view. Falls back to
+ *   `automatic` on tvOS.
+ * - `navigationBarDrawer`: The search field appears in the navigation bar. Falls back to
+ *   `automatic` on macOS and tvOS.
+ */
+export type SearchFieldPlacement = 'automatic' | 'toolbar' | 'sidebar' | 'navigationBarDrawer';
+
+/**
+ * Marks this view as searchable, which configures the display of a search field.
+ *
+ * @param text - The text to display and edit in the search field. An `ObservableState<string>`
+ *   created with `useNativeState`.
+ * @param options.placement - The preferred placement of the search field within the containing
+ *   view hierarchy. Defaults to `automatic`.
+ * @param options.prompt - The prompt of the search field, which provides users with guidance on
+ *   what to search for.
+ * @param options.onChange - Fires on the JS thread when the user edits or clears the search field.
+ *   It does not fire for values written from JavaScript.
+ *
+ * @platform ios
+ * @platform tvos
+ * @platform macos
+ *
+ * @see Official [SwiftUI documentation](https://developer.apple.com/documentation/swiftui/view/searchable(text:placement:prompt:)-18a8f).
+ *
+ * @example
+ * ```tsx
+ * const query = useNativeState('');
+ *
+ * <Host>
+ *   <NavigationStack>
+ *     <List
+ *       modifiers={[
+ *         searchable(query, {
+ *           prompt: 'Search agents',
+ *           onChange: (text) => setFilter(text),
+ *         }),
+ *       ]}>
+ *       {rows.map((row) => (
+ *         <Text key={row.id}>{row.name}</Text>
+ *       ))}
+ *     </List>
+ *   </NavigationStack>
+ * </Host>
+ * ```
+ */
+export const searchable = (
+  text: ObservableState<string>,
+  options?: {
+    placement?: SearchFieldPlacement;
+    prompt?: string;
+    onChange?: (text: string) => void;
+  }
+) => {
+  const params = {
+    text: getStateId(text),
+    placement: options?.placement,
+    prompt: options?.prompt,
+  };
+  const onChange = options?.onChange;
+  if (onChange) {
+    return createModifierWithEventListener(
+      'searchable',
+      (event: { text?: string }) => onChange(event?.text ?? ''),
+      params
+    );
+  }
+  return createModifier('searchable', params);
+};
+
+/**
+ * The behavior of a search field in a toolbar.
+ *
+ * - `automatic`: The automatic behavior.
+ * - `minimize`: A search toolbar behavior that prefers rendering a search field as a button-like
+ *   control. Falls back to `automatic` on macOS and tvOS.
+ */
+export type SearchToolbarBehavior = 'automatic' | 'minimize';
+
+/**
+ * Configures the behavior for search in the toolbar.
+ *
+ * On iOS below 26.0, the modifier is a no-op.
+ *
+ * @param behavior - The search field behavior.
+ *
+ * @platform ios 26.0+
+ * @platform tvos 26.0+
+ * @platform macos 26.0+
+ *
+ * @see Official [SwiftUI documentation](https://developer.apple.com/documentation/swiftui/view/searchtoolbarbehavior(_:)).
+ *
+ * @example
+ * ```tsx
+ * <List modifiers={[searchable(query), searchToolbarBehavior('minimize')]}>
+ * ```
+ */
+export const searchToolbarBehavior = (behavior: SearchToolbarBehavior) =>
+  createModifier('searchToolbarBehavior', { behavior });

package/src/universal/RNHostView/index.tsx

@@ -1,11 +1,14 @@
 import { StyleSheet, View } from 'react-native';
 
-import type { RNHostViewProps } from './types';
+import { resolveMatchContents } from '../../utils/matchContents';
 import { useUniversalLifecycle } from '../hooks';
+import type { RNHostViewProps } from './types';
 
 const styles = StyleSheet.create({
-  fillParent: { width: '100%', height: '100%' },
-  matchContents: { width: 'fit-content', height: 'fit-content' },
+  fillWidth: { width: '100%' },
+  fillHeight: { height: '100%' },
+  fitWidth: { width: 'fit-content' },
+  fitHeight: { height: 'fit-content' },
   hidden: { display: 'none' },
 });
 
@@ -23,13 +26,15 @@ export function RNHostView({
   onLayout,
 }: RNHostViewProps) {
   useUniversalLifecycle(onAppear, onDisappear);
+  const { horizontal, vertical } = resolveMatchContents(matchContents);
 
   return (
     <View
       testID={testID}
       onLayout={onLayout}
       style={[
-        matchContents ? styles.matchContents : styles.fillParent,
+        horizontal ? styles.fitWidth : styles.fillWidth,
+        vertical ? styles.fitHeight : styles.fillHeight,
         style,
         hidden && styles.hidden,
       ]}>

package/src/universal/RNHostView/types.ts

@@ -8,16 +8,18 @@ import type { UniversalBaseProps } from '../types';
  */
 export interface RNHostViewProps extends UniversalBaseProps {
   /**
-   * When `true`, the host updates its size in the native view tree to match
-   * the children's size. When `false`, the host uses the size of the parent
-   * native view.
+   * When `true`, the host updates its size in the SwiftUI or Compose view tree to
+   * match the children's size. When `false`, the host uses the size of the parent
+   * SwiftUI or Compose view. Pass an object to choose per axis. For example,
+   * `{ vertical: true }` takes the width from the parent and the height from the
+   * children, so text wraps and grows vertically.
    *
    * Can only be set once on mount; changing it remounts the component.
    * @default false
    * @platform android
    * @platform ios
    */
-  matchContents?: boolean;
+  matchContents?: boolean | { vertical?: boolean; horizontal?: boolean };
 
   onLayout?: (event: LayoutChangeEvent) => void;
 

package/src/utils/matchContents.ts

@@ -0,0 +1,14 @@
+/**
+ * Resolves `RNHostView`'s `matchContents` prop to one flag per axis.
+ */
+export function resolveMatchContents(
+  matchContents: boolean | { vertical?: boolean; horizontal?: boolean } | null | undefined
+): { horizontal: boolean; vertical: boolean } {
+  if (matchContents != null && typeof matchContents === 'object') {
+    return {
+      horizontal: matchContents.horizontal ?? false,
+      vertical: matchContents.vertical ?? false,
+    };
+  }
+  return { horizontal: matchContents ?? false, vertical: matchContents ?? false };
+}

package/local-maven-repo/expo/modules/ui/expo.modules.ui/57.0.22/expo.modules.ui-57.0.22-sources.jar.md5

@@ -1 +0,0 @@
-67ccc30c75819937df5e850cb742a4ba

package/local-maven-repo/expo/modules/ui/expo.modules.ui/57.0.22/expo.modules.ui-57.0.22-sources.jar.sha1

@@ -1 +0,0 @@
-b9f56fabf01aea58b15172683c4a748b8dc3cf55

package/local-maven-repo/expo/modules/ui/expo.modules.ui/57.0.22/expo.modules.ui-57.0.22-sources.jar.sha256

@@ -1 +0,0 @@
-e1ff6f3760b8699263fd244601e146335a9f853109153f91be6c98d092a9302e

package/local-maven-repo/expo/modules/ui/expo.modules.ui/57.0.22/expo.modules.ui-57.0.22-sources.jar.sha512

@@ -1 +0,0 @@
-81d467c2d81c5fb4545160a5b5563fcf0f6eb3fbb191a507382ad6b0abde41d6c5506edc2281c1e98dee29eb2c861856f8e34d4208972a2dbf2b547c77143627

package/local-maven-repo/expo/modules/ui/expo.modules.ui/57.0.22/expo.modules.ui-57.0.22.aar.md5

@@ -1 +0,0 @@
-7220f1074490e12c04ff057048d86124

package/local-maven-repo/expo/modules/ui/expo.modules.ui/57.0.22/expo.modules.ui-57.0.22.aar.sha1

@@ -1 +0,0 @@
-d581a4836a4dd119bfc57aca7152c5f7a45911b8

package/local-maven-repo/expo/modules/ui/expo.modules.ui/57.0.22/expo.modules.ui-57.0.22.aar.sha256

@@ -1 +0,0 @@
-a869c8586462b852b75439dbfeaa7caef538db6eeff7bac5aee0026215a61a06

package/local-maven-repo/expo/modules/ui/expo.modules.ui/57.0.22/expo.modules.ui-57.0.22.aar.sha512

@@ -1 +0,0 @@
-34080b16453bc36824a34471ee76e7da22af80c63cc419ea34d8c2e1e562f72f968ce8faefd5672f33a4c899c0cdf85c2e711318d859ba4d4562b7e0a61482d8

package/local-maven-repo/expo/modules/ui/expo.modules.ui/57.0.22/expo.modules.ui-57.0.22.module.md5

@@ -1 +0,0 @@
-7fb20f1c978e1a0b3d762c0dd5323bf9

package/local-maven-repo/expo/modules/ui/expo.modules.ui/57.0.22/expo.modules.ui-57.0.22.module.sha1

@@ -1 +0,0 @@
-14b81e92a813dd3ff42d0b57bc819fe6fe45dbe9

package/local-maven-repo/expo/modules/ui/expo.modules.ui/57.0.22/expo.modules.ui-57.0.22.module.sha256

@@ -1 +0,0 @@
-4f7022f3602a1162d857c67860c42f26d80c57f0955e815776e0d69da62a6b89

package/local-maven-repo/expo/modules/ui/expo.modules.ui/57.0.22/expo.modules.ui-57.0.22.module.sha512

@@ -1 +0,0 @@
-f4323dcdf2bd04112993e148d47b98df0245f0679aedb4965f45646c987da2d513b3a312aba6ca5802a411cc07b8260c3b3a944a30da7e4b9c2d2140e9cc0b78

package/local-maven-repo/expo/modules/ui/expo.modules.ui/57.0.22/expo.modules.ui-57.0.22.pom.md5

@@ -1 +0,0 @@
-bf3cc748e5aba7f0faca9af9cae6ca11

package/local-maven-repo/expo/modules/ui/expo.modules.ui/57.0.22/expo.modules.ui-57.0.22.pom.sha1

@@ -1 +0,0 @@
-64719d73cd6c6e4410f220586d1b900553d8636f

package/local-maven-repo/expo/modules/ui/expo.modules.ui/57.0.22/expo.modules.ui-57.0.22.pom.sha256

@@ -1 +0,0 @@
-b1893b9a45c11ca23be9b083040c6c8e42e5dbf2f83388fb2ecb46ebb759ef43

package/local-maven-repo/expo/modules/ui/expo.modules.ui/57.0.22/expo.modules.ui-57.0.22.pom.sha512

@@ -1 +0,0 @@
-2e7e5260dc6cae8eb8555c1614f8e50394413bd3cc98d8c34ffb9831458a6079516da7c302bac741da5f578dac28c7772d1cf5efd111f007f15639876db47768