From 93ab9271df86312add43c1c3fe3819b8a0aabe54 Mon Sep 17 00:00:00 2001
From: Mark Lawlor <mwlawlor@gmail.com>
Date: Sun, 29 May 2022 18:41:48 +1000
Subject: [PATCH] fix: ensure StyledProps are exported

---
 src/index.ts             |  1 +
 src/styled-component.tsx |  4 ++--
 src/styled.tsx           | 21 +++++++++++++++------
 src/utils/styled.ts      | 31 ++++++++-----------------------
 4 files changed, 26 insertions(+), 31 deletions(-)

diff --git a/src/index.ts b/src/index.ts
index d275de8..aa2c8d9 100644
--- a/src/index.ts
+++ b/src/index.ts
@@ -2,6 +2,7 @@ export * from "./provider";
 export * from "./use-tailwind";
 export * from "./styled";
 export * from "./styled-component";
+export type { StyledProps } from "./utils/styled";
 export { useColorScheme } from "./context/color-scheme";
 export { useComponent, ComponentContext } from "./context/component";
 export { usePlatform } from "./context/platform";
diff --git a/src/styled-component.tsx b/src/styled-component.tsx
index a454724..bdef8b2 100644
--- a/src/styled-component.tsx
+++ b/src/styled-component.tsx
@@ -1,9 +1,9 @@
 import * as React from "react";
 import { styled } from "./styled";
-import { Component, StyledProps } from "./utils/styled";
+import { StyledProps } from "./utils/styled";
 
 export type StyledComponentProps<P> = StyledProps<P> & {
-  component: Component<P>;
+  component: React.ComponentType<P>;
 };
 
 export function StyledComponent<P>({
diff --git a/src/styled.tsx b/src/styled.tsx
index e9d7d6c..442a672 100644
--- a/src/styled.tsx
+++ b/src/styled.tsx
@@ -1,5 +1,11 @@
-import { ComponentProps, createElement, FC } from "react";
-import { Component, StyledProps, StyledPropsWithKeys } from "./utils/styled";
+import {
+  ComponentProps,
+  createElement,
+  FC,
+  ReactNode,
+  ComponentType,
+} from "react";
+import { StyledProps, StyledPropsWithKeys } from "./utils/styled";
 import { ComponentContext } from "./context/component";
 import { useInteraction } from "./use-interaction";
 import { withStyledChildren } from "./with-styled-children";
@@ -7,6 +13,7 @@ import { withStyledProps } from "./with-styled-props";
 import { useTailwind } from "./use-tailwind";
 import { withClassNames } from "./with-class-names";
 import { usePlatform } from "./context/platform";
+import { StyleProp } from "react-native";
 
 export interface StyledOptions<P> {
   props?: Array<keyof P & string>;
@@ -19,21 +26,23 @@ export interface StyledOptions<P> {
  * Normal usage
  */
 export function styled<T>(
-  Component: Component<T>,
+  Component: ComponentType<T>,
   options?: { props?: undefined; spreadProps?: undefined }
 ): FC<StyledProps<T>>;
 /**
  * With either props or valueProps
  */
 export function styled<T, K extends keyof T & string>(
-  Component: Component<T>,
+  Component: ComponentType<T>,
   options: { props?: Array<K>; spreadProps?: Array<K>; classProps?: Array<K> }
 ): FC<StyledPropsWithKeys<T, K>>;
 /**
  * Actual implementation
  */
-export function styled<T>(
-  Component: Component<T>,
+export function styled<
+  T extends { style?: StyleProp<unknown>; children?: ReactNode | undefined }
+>(
+  Component: ComponentType<T>,
   {
     props: propsToTransform,
     spreadProps,
diff --git a/src/utils/styled.ts b/src/utils/styled.ts
index 456c828..14e394b 100644
--- a/src/utils/styled.ts
+++ b/src/utils/styled.ts
@@ -1,27 +1,12 @@
-import { ComponentType, PropsWithChildren } from "react";
-import { ImageStyle, StyleProp, TextStyle, ViewStyle } from "react-native";
+export type StyledProps<P> = P & {
+  className?: string;
+  tw?: string;
+};
 
-export type Component<P> = ComponentType<P>;
-
-export type InferStyle<T> = T extends { style?: StyleProp<infer S> }
-  ? S & (ViewStyle | TextStyle | ImageStyle)
-  : never;
-
-export type StyledProps<P, T = InferStyle<P>> = PropsWithChildren<
-  P & {
-    className?: string;
-    tw?: string;
-    style?: StyleProp<T | RWNCssStyle>;
-  }
->;
-
-export type StyledPropsWithKeys<P, K extends keyof P> = PropsWithChildren<
-  P & {
-    className?: string;
-    tw?: string;
-    style?: StyleProp<InferStyle<P> | RWNCssStyle>;
-  } & { [key in K]: P[key] | string }
->;
+export type StyledPropsWithKeys<P, K extends keyof P> = P & {
+  className?: string;
+  tw?: string;
+} & { [key in K]: P[key] | string };
 
 export type RWNCssStyle = {
   $$css: true;