# motionwind-react-native v2.0.0 beta — machine reference

This package maps the supported Motionwind subset to Reanimated. It parses at
runtime but still requires the Reanimated Babel/build setup. Unsupported native
capabilities must be represented by their diagnostics and direct API fallback.

Install for Expo:
```bash
npx expo install react-native-reanimated react-native-gesture-handler
npm install motionwind-react-native@2 nativewind motionwind-core@2
```

Configure the Reanimated plugin required by the installed version, keep it last,
then clear Metro's cache.

Provider setup:
```tsx
import { defineConfig, MotionwindProvider, mw } from "motionwind-react-native";

const config = defineConfig({
  adapter: "react-native",
  strict: true,
  reducedMotion: "user",
});

<MotionwindProvider config={config}>
  <mw.Pressable
    accessibilityRole="button"
    className="animate-tap:scale-95 animate-spring"
  >
    <mw.Text>Press me</mw.Text>
  </mw.Pressable>
</MotionwindProvider>;
```

Explicit animated component map:
- mw.View
- mw.Text
- mw.Image
- mw.ScrollView (also provides normalized scroll progress)
- mw.FlatList
- mw.Pressable
- mw.TextInput

mw.SectionList only has a plain mapping. Unknown mw names fall back to View and
must not be treated as custom native components.

Supported beta behavior:
- initial/enter state with timing and spring transitions
- tap via onPressIn/onPressOut on press-capable components
- hover/focus when the platform and component emit those handlers
- named variants and inherited active variant state
- continuous animate-scroll:* values inside mw.ScrollView
- reduced motion through provider policy and the system preference
- NativeWind passthrough classes when NativeWind is configured

Capability gaps and diagnostics:
- drag -> unsupported-native-drag; use Gesture Handler + Reanimated directly
- layout -> unsupported-native-layout; use Reanimated layout transitions
- animate-inview:* -> unsupported-native-inview; orchestrate visibility directly
- SVG/CSS filters/clip/shadow/perspective/Z -> unsupported-native-property
- exit state may parse, but mw.* does not delay component unmount

Never generate drag, in-view, layout, SVG, or web-only classes as working native
behavior. Inspect parsed.diagnostics.

Scroll example:
```tsx
<mw.ScrollView>
  <mw.View className="animate-scroll:opacity-[0,1] animate-scroll:y-[40,0]" />
</mw.ScrollView>
```

Native adaptation:
- x/y -> translateX/translateY
- rotate/skew numbers -> degree strings
- shared Motion seconds -> Reanimated milliseconds
- web-only properties are diagnosed and not added to native animated style

useMotionwind(className) returns animatedStyle, handlers, parsed, animateTo,
resetToBase, and variantProvide.

useInView(config) is only an onLayout/window-height estimate. It is not
continuous, parent-scroll-aware, or equivalent to IntersectionObserver, and its
amount option is not applied by the helper.

ParsedResult fields:
```ts
{
  nativewindClasses,
  gestures,
  transition,
  viewport,
  dragConfig,
  scroll,
  variants,
  variantState,
  hasMotion,
  diagnostics
}
```
REACT_NATIVE_CAPABILITIES:
```ts
{
  gestures: true,
  scroll: true,
  layout: false,
  drag: false,
  variants: true,
  svg: false,
  "reduced-motion": true
}
```