Components
AdaptiveSearchHeader
PARTIAL RENDER — same caveat as LargeTitleHeader.
On iOS this drives the native navigation bar's search field via <Stack.Screen options={…}>, which the Storybook stub turns into a no-op. Below is the Material header the component renders itself; the iOS behaviour needs a simulator.
searchBar is required — this component exists for the search case.
This example is composed with Storybook args. Open the interactive workbench to change its props and inspect the generated API controls.
Import
import { AdaptiveSearchHeader } from '@simal/ui/nativewindui';Props
| Prop | Values | Default | Description |
|---|---|---|---|
iosTitle | — | "Section title" | iOS title. Android takes its title from the search field itself, which is why this prop is platform-prefixed. |
searchBar | — | — | Configures the field: placeholder, onChangeText, onCancelPress. Its presence is what makes this a search header rather than a plain one. |
iosBackVisible | boolean | true | Shows the iOS back chevron. Ignored on Android, which uses the native up affordance. |
shadowVisible | boolean | false | Hairline under the header. Turn it off when the screen below already has its own top border. |
Examples
With Right View
<AdaptiveSearchHeader
iosTitle="Section title"
searchBar={{ placeholder: 'Search…' }}
rightView={() => (
<Button size="icon" variant="plain">
<Icon name="line.3.horizontal" />
</Button>
)}
/>