mirror of
https://github.com/zhigang1992/nativewind.git
synced 2026-06-16 11:49:47 +08:00
fix: rendering nested child styled components
This commit is contained in:
@@ -2,8 +2,6 @@ import { createElement, FunctionComponent, ComponentClass } from "react";
|
|||||||
import { ImageStyle, StyleProp, TextStyle, ViewStyle } from "react-native";
|
import { ImageStyle, StyleProp, TextStyle, ViewStyle } from "react-native";
|
||||||
import { useTailwind } from "./use-tailwind";
|
import { useTailwind } from "./use-tailwind";
|
||||||
|
|
||||||
const isStyled = Symbol("styled");
|
|
||||||
|
|
||||||
type StyledProps<P> = P & {
|
type StyledProps<P> = P & {
|
||||||
className?: string;
|
className?: string;
|
||||||
tw?: string;
|
tw?: string;
|
||||||
@@ -36,25 +34,17 @@ export function styled<P>(
|
|||||||
}`;
|
}`;
|
||||||
}
|
}
|
||||||
|
|
||||||
Styled[isStyled] = true;
|
|
||||||
|
|
||||||
return Styled;
|
return Styled;
|
||||||
}
|
}
|
||||||
|
|
||||||
type StyledComponentProps<P> = StyledProps<P> & {
|
type StyledComponentProps<P> = StyledProps<P> & {
|
||||||
component: Component<P> & {
|
component: Component<P>;
|
||||||
[isStyled]?: boolean;
|
|
||||||
};
|
|
||||||
};
|
};
|
||||||
|
|
||||||
export function StyledComponent<P>({
|
export function StyledComponent<P>({
|
||||||
component,
|
component,
|
||||||
...options
|
...options
|
||||||
}: StyledComponentProps<P>) {
|
}: StyledComponentProps<P>) {
|
||||||
if (component[isStyled]) {
|
const Component = styled<P>(component);
|
||||||
return component;
|
return <Component {...(options as P)} />;
|
||||||
}
|
|
||||||
|
|
||||||
return styled<P>(component)(options as P);
|
|
||||||
}
|
}
|
||||||
StyledComponent[isStyled] = true;
|
|
||||||
Reference in New Issue
Block a user