Core concepts
Hooks and components
The React API: the provider, styled(), useTw() and friends.
AstraWindProvider
Your theme variables, fonts and style tokens. See Theme variables.
"light", "dark" or "system" (default).
Warn once per class that can't apply. Defaults to __DEV__.
TextRoot
Sets inherited text styles for a subtree, like styles on <body>. Use it at the root; it's also where portalled overlays should mount.
<TextRoot className="font-sans text-base text-foreground">…</TextRoot>
useTw()
Resolves a className inside a component, for props that take a style or a color:
const tw = useTw()
<RefreshControl tintColor={tw("text-sky-500").color as string} />
<Animated.View style={[tw("rounded-xl bg-white p-4"), animatedStyle]} />
useCurrentColor()
Returns the inherited text color, like currentColor, e.g. to tint a native control.
IconStyle
Sets the default icon size, color and stroke width for icons below it, the native stand-in for [&_svg]:size-4:
<IconStyle size={16} color="#71717a">…</IconStyle>
clearStyleCache()
Clears cached styles, e.g. after hot-reloading a theme.