rn-css 1.6.18 → 1.6.19-1

package/CHANGELOG.md

@@ -0,0 +1,16 @@
+# Changelog
+
+## Version 1.6
+
+ * Creation of RemContext to control rem units value
+ * Important performance fix (500% faster!)
+
+## Version 1.5
+
+ * Add Theming features with the same [API](https://styled-components.com/docs/advanced) as `styled-components` lib.
+ * Remove support for deprecated components: *ListView*, *SwipeableListView*, *TabBarIOS*, *ToolbarAndroid* and *ViewPagerAndroid*
+ * Fix font-weight to accept numeric values
+
+## Version 1.4
+
+ * Change the type of `rnCSS` from `string` to `${string};` to ensure that it will end with a semicolon

package/README.md

@@ -347,6 +347,22 @@ To match the API of styled-components, we offer the same abilities for theming [
 
 This relies on the [SharedValue](#shared-value) context. This means that you cannot use the Shared Value system **and** this theming système. Pick the one that best suits your needs.
 
+### Custom theme type for typescript
+
+When you use the theme prop in your components, it is initially typed as `unknown`. But you can make it follow your custom type by extending the type declaration of **rn-css**. You will need to create a file `rncss.d.ts` in the `src` of your project root and add the following lines:
+
+```ts
+import 'rn-css';
+
+declare module 'rn-css' {
+  type MyTheme = {
+    // Describe your theme here.
+    // Alternatively, you can use: `type MyTheme = typeof theme` if you have a fixed `theme` object.
+  }
+  export interface DefaultTheme extends MyTheme {}
+}
+```
+
 ---
 
 ## Coming later:

package/dist/index.d.ts

@@ -2,14 +2,14 @@ import React from 'react';
 import * as RN from 'react-native';
 import './polyfill';
 export { cssToRNStyle } from './cssToRN';
-export { SharedValue, FontSizeContext, RemContext } from './styleComponent';
+export { SharedValue, FontSizeContext, RemContext, DefaultTheme } from './styleComponent';
 export * from './useTheme';
 declare const styled: {
     <T>(Component: React.ComponentType<T>): {
         <S>(chunks: TemplateStringsArray, ...functs: ((string | number | boolean | null | undefined) | ((arg: S & T & {
             rnCSS?: string | undefined;
             shared: unknown;
-            theme: unknown;
+            theme: import("./styleComponent").DefaultTheme;
         }) => string | number | boolean | null | undefined))[]): React.ForwardRefExoticComponent<T & S & {
             rnCSS?: `${string};` | undefined;
             onMouseEnter?: ((event: React.MouseEvent<Element, MouseEvent>) => void) | undefined;
@@ -23,7 +23,7 @@ declare const styled: {
         attrs<S_1>(opts: Partial<S_1 & T> | ((props: S_1 & T) => Partial<S_1 & T>)): (chunks: TemplateStringsArray, ...functs: ((string | number | boolean | null | undefined) | ((arg: S_1 & T & {
             rnCSS?: string | undefined;
             shared: unknown;
-            theme: unknown;
+            theme: import("./styleComponent").DefaultTheme;
         }) => string | number | boolean | null | undefined))[]) => React.ForwardRefExoticComponent<(T | S_1) & {
             rnCSS?: `${string};` | undefined;
             onMouseEnter?: ((event: React.MouseEvent<Element, MouseEvent>) => void) | undefined;
@@ -39,7 +39,7 @@ declare const styled: {
         <S_2>(chunks: TemplateStringsArray, ...functs: ((string | number | boolean | null | undefined) | ((arg: S_2 & RN.ActivityIndicatorProps & {
             rnCSS?: string | undefined;
             shared: unknown;
-            theme: unknown;
+            theme: import("./styleComponent").DefaultTheme;
         }) => string | number | boolean | null | undefined))[]): React.ForwardRefExoticComponent<RN.ActivityIndicatorProps & S_2 & {
             rnCSS?: `${string};` | undefined;
             onMouseEnter?: ((event: React.MouseEvent<Element, MouseEvent>) => void) | undefined;
@@ -53,7 +53,7 @@ declare const styled: {
         attrs<S_3>(opts: Partial<S_3 & RN.ActivityIndicatorProps> | ((props: S_3 & RN.ActivityIndicatorProps) => Partial<S_3 & RN.ActivityIndicatorProps>)): (chunks: TemplateStringsArray, ...functs: ((string | number | boolean | null | undefined) | ((arg: S_3 & RN.ActivityIndicatorProps & {
             rnCSS?: string | undefined;
             shared: unknown;
-            theme: unknown;
+            theme: import("./styleComponent").DefaultTheme;
         }) => string | number | boolean | null | undefined))[]) => React.ForwardRefExoticComponent<(RN.ActivityIndicatorProps | S_3) & {
             rnCSS?: `${string};` | undefined;
             onMouseEnter?: ((event: React.MouseEvent<Element, MouseEvent>) => void) | undefined;
@@ -69,7 +69,7 @@ declare const styled: {
         <S_4>(chunks: TemplateStringsArray, ...functs: ((string | number | boolean | null | undefined) | ((arg: S_4 & RN.ButtonProps & {
             rnCSS?: string | undefined;
             shared: unknown;
-            theme: unknown;
+            theme: import("./styleComponent").DefaultTheme;
         }) => string | number | boolean | null | undefined))[]): React.ForwardRefExoticComponent<RN.ButtonProps & S_4 & {
             rnCSS?: `${string};` | undefined;
             onMouseEnter?: ((event: React.MouseEvent<Element, MouseEvent>) => void) | undefined;
@@ -83,7 +83,7 @@ declare const styled: {
         attrs<S_5>(opts: Partial<S_5 & RN.ButtonProps> | ((props: S_5 & RN.ButtonProps) => Partial<S_5 & RN.ButtonProps>)): (chunks: TemplateStringsArray, ...functs: ((string | number | boolean | null | undefined) | ((arg: S_5 & RN.ButtonProps & {
             rnCSS?: string | undefined;
             shared: unknown;
-            theme: unknown;
+            theme: import("./styleComponent").DefaultTheme;
         }) => string | number | boolean | null | undefined))[]) => React.ForwardRefExoticComponent<(RN.ButtonProps | S_5) & {
             rnCSS?: `${string};` | undefined;
             onMouseEnter?: ((event: React.MouseEvent<Element, MouseEvent>) => void) | undefined;
@@ -99,7 +99,7 @@ declare const styled: {
         <S_6>(chunks: TemplateStringsArray, ...functs: ((string | number | boolean | null | undefined) | ((arg: S_6 & RN.DrawerLayoutAndroidProps & {
             rnCSS?: string | undefined;
             shared: unknown;
-            theme: unknown;
+            theme: import("./styleComponent").DefaultTheme;
         }) => string | number | boolean | null | undefined))[]): React.ForwardRefExoticComponent<RN.DrawerLayoutAndroidProps & S_6 & {
             rnCSS?: `${string};` | undefined;
             onMouseEnter?: ((event: React.MouseEvent<Element, MouseEvent>) => void) | undefined;
@@ -113,7 +113,7 @@ declare const styled: {
         attrs<S_7>(opts: Partial<S_7 & RN.DrawerLayoutAndroidProps> | ((props: S_7 & RN.DrawerLayoutAndroidProps) => Partial<S_7 & RN.DrawerLayoutAndroidProps>)): (chunks: TemplateStringsArray, ...functs: ((string | number | boolean | null | undefined) | ((arg: S_7 & RN.DrawerLayoutAndroidProps & {
             rnCSS?: string | undefined;
             shared: unknown;
-            theme: unknown;
+            theme: import("./styleComponent").DefaultTheme;
         }) => string | number | boolean | null | undefined))[]) => React.ForwardRefExoticComponent<(RN.DrawerLayoutAndroidProps | S_7) & {
             rnCSS?: `${string};` | undefined;
             onMouseEnter?: ((event: React.MouseEvent<Element, MouseEvent>) => void) | undefined;
@@ -129,7 +129,7 @@ declare const styled: {
         <S_8>(chunks: TemplateStringsArray, ...functs: ((string | number | boolean | null | undefined) | ((arg: S_8 & RN.ImageProps & {
             rnCSS?: string | undefined;
             shared: unknown;
-            theme: unknown;
+            theme: import("./styleComponent").DefaultTheme;
         }) => string | number | boolean | null | undefined))[]): React.ForwardRefExoticComponent<RN.ImageProps & S_8 & {
             rnCSS?: `${string};` | undefined;
             onMouseEnter?: ((event: React.MouseEvent<Element, MouseEvent>) => void) | undefined;
@@ -143,7 +143,7 @@ declare const styled: {
         attrs<S_9>(opts: Partial<S_9 & RN.ImageProps> | ((props: S_9 & RN.ImageProps) => Partial<S_9 & RN.ImageProps>)): (chunks: TemplateStringsArray, ...functs: ((string | number | boolean | null | undefined) | ((arg: S_9 & RN.ImageProps & {
             rnCSS?: string | undefined;
             shared: unknown;
-            theme: unknown;
+            theme: import("./styleComponent").DefaultTheme;
         }) => string | number | boolean | null | undefined))[]) => React.ForwardRefExoticComponent<(RN.ImageProps | S_9) & {
             rnCSS?: `${string};` | undefined;
             onMouseEnter?: ((event: React.MouseEvent<Element, MouseEvent>) => void) | undefined;
@@ -159,7 +159,7 @@ declare const styled: {
         <S_10>(chunks: TemplateStringsArray, ...functs: ((string | number | boolean | null | undefined) | ((arg: S_10 & RN.ImageBackgroundProps & {
             rnCSS?: string | undefined;
             shared: unknown;
-            theme: unknown;
+            theme: import("./styleComponent").DefaultTheme;
         }) => string | number | boolean | null | undefined))[]): React.ForwardRefExoticComponent<RN.ImageBackgroundProps & S_10 & {
             rnCSS?: `${string};` | undefined;
             onMouseEnter?: ((event: React.MouseEvent<Element, MouseEvent>) => void) | undefined;
@@ -173,7 +173,7 @@ declare const styled: {
         attrs<S_11>(opts: Partial<S_11 & RN.ImageBackgroundProps> | ((props: S_11 & RN.ImageBackgroundProps) => Partial<S_11 & RN.ImageBackgroundProps>)): (chunks: TemplateStringsArray, ...functs: ((string | number | boolean | null | undefined) | ((arg: S_11 & RN.ImageBackgroundProps & {
             rnCSS?: string | undefined;
             shared: unknown;
-            theme: unknown;
+            theme: import("./styleComponent").DefaultTheme;
         }) => string | number | boolean | null | undefined))[]) => React.ForwardRefExoticComponent<(RN.ImageBackgroundProps | S_11) & {
             rnCSS?: `${string};` | undefined;
             onMouseEnter?: ((event: React.MouseEvent<Element, MouseEvent>) => void) | undefined;
@@ -189,7 +189,7 @@ declare const styled: {
         <S_12>(chunks: TemplateStringsArray, ...functs: ((string | number | boolean | null | undefined) | ((arg: S_12 & RN.KeyboardAvoidingViewProps & {
             rnCSS?: string | undefined;
             shared: unknown;
-            theme: unknown;
+            theme: import("./styleComponent").DefaultTheme;
         }) => string | number | boolean | null | undefined))[]): React.ForwardRefExoticComponent<RN.KeyboardAvoidingViewProps & S_12 & {
             rnCSS?: `${string};` | undefined;
             onMouseEnter?: ((event: React.MouseEvent<Element, MouseEvent>) => void) | undefined;
@@ -203,7 +203,7 @@ declare const styled: {
         attrs<S_13>(opts: Partial<S_13 & RN.KeyboardAvoidingViewProps> | ((props: S_13 & RN.KeyboardAvoidingViewProps) => Partial<S_13 & RN.KeyboardAvoidingViewProps>)): (chunks: TemplateStringsArray, ...functs: ((string | number | boolean | null | undefined) | ((arg: S_13 & RN.KeyboardAvoidingViewProps & {
             rnCSS?: string | undefined;
             shared: unknown;
-            theme: unknown;
+            theme: import("./styleComponent").DefaultTheme;
         }) => string | number | boolean | null | undefined))[]) => React.ForwardRefExoticComponent<(RN.KeyboardAvoidingViewProps | S_13) & {
             rnCSS?: `${string};` | undefined;
             onMouseEnter?: ((event: React.MouseEvent<Element, MouseEvent>) => void) | undefined;
@@ -219,7 +219,7 @@ declare const styled: {
         <S_14>(chunks: TemplateStringsArray, ...functs: ((string | number | boolean | null | undefined) | ((arg: S_14 & RN.ModalBaseProps & RN.ModalPropsIOS & RN.ModalPropsAndroid & RN.ViewProps & {
             rnCSS?: string | undefined;
             shared: unknown;
-            theme: unknown;
+            theme: import("./styleComponent").DefaultTheme;
         }) => string | number | boolean | null | undefined))[]): React.ForwardRefExoticComponent<RN.ModalBaseProps & RN.ModalPropsIOS & RN.ModalPropsAndroid & RN.ViewProps & S_14 & {
             rnCSS?: `${string};` | undefined;
             onMouseEnter?: ((event: React.MouseEvent<Element, MouseEvent>) => void) | undefined;
@@ -233,7 +233,7 @@ declare const styled: {
         attrs<S_15>(opts: Partial<S_15 & RN.ModalBaseProps & RN.ModalPropsIOS & RN.ModalPropsAndroid & RN.ViewProps> | ((props: S_15 & RN.ModalBaseProps & RN.ModalPropsIOS & RN.ModalPropsAndroid & RN.ViewProps) => Partial<S_15 & RN.ModalBaseProps & RN.ModalPropsIOS & RN.ModalPropsAndroid & RN.ViewProps>)): (chunks: TemplateStringsArray, ...functs: ((string | number | boolean | null | undefined) | ((arg: S_15 & RN.ModalBaseProps & RN.ModalPropsIOS & RN.ModalPropsAndroid & RN.ViewProps & {
             rnCSS?: string | undefined;
             shared: unknown;
-            theme: unknown;
+            theme: import("./styleComponent").DefaultTheme;
         }) => string | number | boolean | null | undefined))[]) => React.ForwardRefExoticComponent<(RN.ModalProps | S_15) & {
             rnCSS?: `${string};` | undefined;
             onMouseEnter?: ((event: React.MouseEvent<Element, MouseEvent>) => void) | undefined;
@@ -249,7 +249,7 @@ declare const styled: {
         <S_16>(chunks: TemplateStringsArray, ...functs: ((string | number | boolean | null | undefined) | ((arg: S_16 & RN.NavigatorIOSProps & {
             rnCSS?: string | undefined;
             shared: unknown;
-            theme: unknown;
+            theme: import("./styleComponent").DefaultTheme;
         }) => string | number | boolean | null | undefined))[]): React.ForwardRefExoticComponent<RN.NavigatorIOSProps & S_16 & {
             rnCSS?: `${string};` | undefined;
             onMouseEnter?: ((event: React.MouseEvent<Element, MouseEvent>) => void) | undefined;
@@ -263,7 +263,7 @@ declare const styled: {
         attrs<S_17>(opts: Partial<S_17 & RN.NavigatorIOSProps> | ((props: S_17 & RN.NavigatorIOSProps) => Partial<S_17 & RN.NavigatorIOSProps>)): (chunks: TemplateStringsArray, ...functs: ((string | number | boolean | null | undefined) | ((arg: S_17 & RN.NavigatorIOSProps & {
             rnCSS?: string | undefined;
             shared: unknown;
-            theme: unknown;
+            theme: import("./styleComponent").DefaultTheme;
         }) => string | number | boolean | null | undefined))[]) => React.ForwardRefExoticComponent<(RN.NavigatorIOSProps | S_17) & {
             rnCSS?: `${string};` | undefined;
             onMouseEnter?: ((event: React.MouseEvent<Element, MouseEvent>) => void) | undefined;
@@ -279,7 +279,7 @@ declare const styled: {
         <S_18>(chunks: TemplateStringsArray, ...functs: ((string | number | boolean | null | undefined) | ((arg: S_18 & RN.ScrollViewProps & {
             rnCSS?: string | undefined;
             shared: unknown;
-            theme: unknown;
+            theme: import("./styleComponent").DefaultTheme;
         }) => string | number | boolean | null | undefined))[]): React.ForwardRefExoticComponent<RN.ScrollViewProps & S_18 & {
             rnCSS?: `${string};` | undefined;
             onMouseEnter?: ((event: React.MouseEvent<Element, MouseEvent>) => void) | undefined;
@@ -293,7 +293,7 @@ declare const styled: {
         attrs<S_19>(opts: Partial<S_19 & RN.ScrollViewProps> | ((props: S_19 & RN.ScrollViewProps) => Partial<S_19 & RN.ScrollViewProps>)): (chunks: TemplateStringsArray, ...functs: ((string | number | boolean | null | undefined) | ((arg: S_19 & RN.ScrollViewProps & {
             rnCSS?: string | undefined;
             shared: unknown;
-            theme: unknown;
+            theme: import("./styleComponent").DefaultTheme;
         }) => string | number | boolean | null | undefined))[]) => React.ForwardRefExoticComponent<(RN.ScrollViewProps | S_19) & {
             rnCSS?: `${string};` | undefined;
             onMouseEnter?: ((event: React.MouseEvent<Element, MouseEvent>) => void) | undefined;
@@ -309,7 +309,7 @@ declare const styled: {
         <S_20>(chunks: TemplateStringsArray, ...functs: ((string | number | boolean | null | undefined) | ((arg: S_20 & RN.SnapshotViewIOSProps & {
             rnCSS?: string | undefined;
             shared: unknown;
-            theme: unknown;
+            theme: import("./styleComponent").DefaultTheme;
         }) => string | number | boolean | null | undefined))[]): React.ForwardRefExoticComponent<RN.SnapshotViewIOSProps & S_20 & {
             rnCSS?: `${string};` | undefined;
             onMouseEnter?: ((event: React.MouseEvent<Element, MouseEvent>) => void) | undefined;
@@ -323,7 +323,7 @@ declare const styled: {
         attrs<S_21>(opts: Partial<S_21 & RN.SnapshotViewIOSProps> | ((props: S_21 & RN.SnapshotViewIOSProps) => Partial<S_21 & RN.SnapshotViewIOSProps>)): (chunks: TemplateStringsArray, ...functs: ((string | number | boolean | null | undefined) | ((arg: S_21 & RN.SnapshotViewIOSProps & {
             rnCSS?: string | undefined;
             shared: unknown;
-            theme: unknown;
+            theme: import("./styleComponent").DefaultTheme;
         }) => string | number | boolean | null | undefined))[]) => React.ForwardRefExoticComponent<(RN.SnapshotViewIOSProps | S_21) & {
             rnCSS?: `${string};` | undefined;
             onMouseEnter?: ((event: React.MouseEvent<Element, MouseEvent>) => void) | undefined;
@@ -339,7 +339,7 @@ declare const styled: {
         <S_22>(chunks: TemplateStringsArray, ...functs: ((string | number | boolean | null | undefined) | ((arg: S_22 & RN.SwitchProps & {
             rnCSS?: string | undefined;
             shared: unknown;
-            theme: unknown;
+            theme: import("./styleComponent").DefaultTheme;
         }) => string | number | boolean | null | undefined))[]): React.ForwardRefExoticComponent<RN.SwitchProps & S_22 & {
             rnCSS?: `${string};` | undefined;
             onMouseEnter?: ((event: React.MouseEvent<Element, MouseEvent>) => void) | undefined;
@@ -353,7 +353,7 @@ declare const styled: {
         attrs<S_23>(opts: Partial<S_23 & RN.SwitchProps> | ((props: S_23 & RN.SwitchProps) => Partial<S_23 & RN.SwitchProps>)): (chunks: TemplateStringsArray, ...functs: ((string | number | boolean | null | undefined) | ((arg: S_23 & RN.SwitchProps & {
             rnCSS?: string | undefined;
             shared: unknown;
-            theme: unknown;
+            theme: import("./styleComponent").DefaultTheme;
         }) => string | number | boolean | null | undefined))[]) => React.ForwardRefExoticComponent<(RN.SwitchProps | S_23) & {
             rnCSS?: `${string};` | undefined;
             onMouseEnter?: ((event: React.MouseEvent<Element, MouseEvent>) => void) | undefined;
@@ -369,7 +369,7 @@ declare const styled: {
         <S_24>(chunks: TemplateStringsArray, ...functs: ((string | number | boolean | null | undefined) | ((arg: S_24 & RN.RecyclerViewBackedScrollViewProps & {
             rnCSS?: string | undefined;
             shared: unknown;
-            theme: unknown;
+            theme: import("./styleComponent").DefaultTheme;
         }) => string | number | boolean | null | undefined))[]): React.ForwardRefExoticComponent<RN.RecyclerViewBackedScrollViewProps & S_24 & {
             rnCSS?: `${string};` | undefined;
             onMouseEnter?: ((event: React.MouseEvent<Element, MouseEvent>) => void) | undefined;
@@ -383,7 +383,7 @@ declare const styled: {
         attrs<S_25>(opts: Partial<S_25 & RN.RecyclerViewBackedScrollViewProps> | ((props: S_25 & RN.RecyclerViewBackedScrollViewProps) => Partial<S_25 & RN.RecyclerViewBackedScrollViewProps>)): (chunks: TemplateStringsArray, ...functs: ((string | number | boolean | null | undefined) | ((arg: S_25 & RN.RecyclerViewBackedScrollViewProps & {
             rnCSS?: string | undefined;
             shared: unknown;
-            theme: unknown;
+            theme: import("./styleComponent").DefaultTheme;
         }) => string | number | boolean | null | undefined))[]) => React.ForwardRefExoticComponent<(RN.RecyclerViewBackedScrollViewProps | S_25) & {
             rnCSS?: `${string};` | undefined;
             onMouseEnter?: ((event: React.MouseEvent<Element, MouseEvent>) => void) | undefined;
@@ -399,7 +399,7 @@ declare const styled: {
         <S_26>(chunks: TemplateStringsArray, ...functs: ((string | number | boolean | null | undefined) | ((arg: S_26 & RN.RefreshControlProps & {
             rnCSS?: string | undefined;
             shared: unknown;
-            theme: unknown;
+            theme: import("./styleComponent").DefaultTheme;
         }) => string | number | boolean | null | undefined))[]): React.ForwardRefExoticComponent<RN.RefreshControlProps & S_26 & {
             rnCSS?: `${string};` | undefined;
             onMouseEnter?: ((event: React.MouseEvent<Element, MouseEvent>) => void) | undefined;
@@ -413,7 +413,7 @@ declare const styled: {
         attrs<S_27>(opts: Partial<S_27 & RN.RefreshControlProps> | ((props: S_27 & RN.RefreshControlProps) => Partial<S_27 & RN.RefreshControlProps>)): (chunks: TemplateStringsArray, ...functs: ((string | number | boolean | null | undefined) | ((arg: S_27 & RN.RefreshControlProps & {
             rnCSS?: string | undefined;
             shared: unknown;
-            theme: unknown;
+            theme: import("./styleComponent").DefaultTheme;
         }) => string | number | boolean | null | undefined))[]) => React.ForwardRefExoticComponent<(RN.RefreshControlProps | S_27) & {
             rnCSS?: `${string};` | undefined;
             onMouseEnter?: ((event: React.MouseEvent<Element, MouseEvent>) => void) | undefined;
@@ -429,7 +429,7 @@ declare const styled: {
         <S_28>(chunks: TemplateStringsArray, ...functs: ((string | number | boolean | null | undefined) | ((arg: S_28 & RN.ViewProps & {
             rnCSS?: string | undefined;
             shared: unknown;
-            theme: unknown;
+            theme: import("./styleComponent").DefaultTheme;
         }) => string | number | boolean | null | undefined))[]): React.ForwardRefExoticComponent<RN.ViewProps & S_28 & {
             rnCSS?: `${string};` | undefined;
             onMouseEnter?: ((event: React.MouseEvent<Element, MouseEvent>) => void) | undefined;
@@ -443,7 +443,7 @@ declare const styled: {
         attrs<S_29>(opts: Partial<S_29 & RN.ViewProps> | ((props: S_29 & RN.ViewProps) => Partial<S_29 & RN.ViewProps>)): (chunks: TemplateStringsArray, ...functs: ((string | number | boolean | null | undefined) | ((arg: S_29 & RN.ViewProps & {
             rnCSS?: string | undefined;
             shared: unknown;
-            theme: unknown;
+            theme: import("./styleComponent").DefaultTheme;
         }) => string | number | boolean | null | undefined))[]) => React.ForwardRefExoticComponent<(RN.ViewProps | S_29) & {
             rnCSS?: `${string};` | undefined;
             onMouseEnter?: ((event: React.MouseEvent<Element, MouseEvent>) => void) | undefined;
@@ -459,7 +459,7 @@ declare const styled: {
         <S_30>(chunks: TemplateStringsArray, ...functs: ((string | number | boolean | null | undefined) | ((arg: S_30 & RN.StatusBarProps & {
             rnCSS?: string | undefined;
             shared: unknown;
-            theme: unknown;
+            theme: import("./styleComponent").DefaultTheme;
         }) => string | number | boolean | null | undefined))[]): React.ForwardRefExoticComponent<RN.StatusBarProps & S_30 & {
             rnCSS?: `${string};` | undefined;
             onMouseEnter?: ((event: React.MouseEvent<Element, MouseEvent>) => void) | undefined;
@@ -473,7 +473,7 @@ declare const styled: {
         attrs<S_31>(opts: Partial<S_31 & RN.StatusBarProps> | ((props: S_31 & RN.StatusBarProps) => Partial<S_31 & RN.StatusBarProps>)): (chunks: TemplateStringsArray, ...functs: ((string | number | boolean | null | undefined) | ((arg: S_31 & RN.StatusBarProps & {
             rnCSS?: string | undefined;
             shared: unknown;
-            theme: unknown;
+            theme: import("./styleComponent").DefaultTheme;
         }) => string | number | boolean | null | undefined))[]) => React.ForwardRefExoticComponent<(RN.StatusBarProps | S_31) & {
             rnCSS?: `${string};` | undefined;
             onMouseEnter?: ((event: React.MouseEvent<Element, MouseEvent>) => void) | undefined;
@@ -489,7 +489,7 @@ declare const styled: {
         <S_32>(chunks: TemplateStringsArray, ...functs: ((string | number | boolean | null | undefined) | ((arg: S_32 & RN.TextProps & {
             rnCSS?: string | undefined;
             shared: unknown;
-            theme: unknown;
+            theme: import("./styleComponent").DefaultTheme;
         }) => string | number | boolean | null | undefined))[]): React.ForwardRefExoticComponent<RN.TextProps & S_32 & {
             rnCSS?: `${string};` | undefined;
             onMouseEnter?: ((event: React.MouseEvent<Element, MouseEvent>) => void) | undefined;
@@ -503,7 +503,7 @@ declare const styled: {
         attrs<S_33>(opts: Partial<S_33 & RN.TextProps> | ((props: S_33 & RN.TextProps) => Partial<S_33 & RN.TextProps>)): (chunks: TemplateStringsArray, ...functs: ((string | number | boolean | null | undefined) | ((arg: S_33 & RN.TextProps & {
             rnCSS?: string | undefined;
             shared: unknown;
-            theme: unknown;
+            theme: import("./styleComponent").DefaultTheme;
         }) => string | number | boolean | null | undefined))[]) => React.ForwardRefExoticComponent<(RN.TextProps | S_33) & {
             rnCSS?: `${string};` | undefined;
             onMouseEnter?: ((event: React.MouseEvent<Element, MouseEvent>) => void) | undefined;
@@ -519,7 +519,7 @@ declare const styled: {
         <S_34>(chunks: TemplateStringsArray, ...functs: ((string | number | boolean | null | undefined) | ((arg: S_34 & RN.TextInputProps & {
             rnCSS?: string | undefined;
             shared: unknown;
-            theme: unknown;
+            theme: import("./styleComponent").DefaultTheme;
         }) => string | number | boolean | null | undefined))[]): React.ForwardRefExoticComponent<RN.TextInputProps & S_34 & {
             rnCSS?: `${string};` | undefined;
             onMouseEnter?: ((event: React.MouseEvent<Element, MouseEvent>) => void) | undefined;
@@ -533,7 +533,7 @@ declare const styled: {
         attrs<S_35>(opts: Partial<S_35 & RN.TextInputProps> | ((props: S_35 & RN.TextInputProps) => Partial<S_35 & RN.TextInputProps>)): (chunks: TemplateStringsArray, ...functs: ((string | number | boolean | null | undefined) | ((arg: S_35 & RN.TextInputProps & {
             rnCSS?: string | undefined;
             shared: unknown;
-            theme: unknown;
+            theme: import("./styleComponent").DefaultTheme;
         }) => string | number | boolean | null | undefined))[]) => React.ForwardRefExoticComponent<(RN.TextInputProps | S_35) & {
             rnCSS?: `${string};` | undefined;
             onMouseEnter?: ((event: React.MouseEvent<Element, MouseEvent>) => void) | undefined;
@@ -549,7 +549,7 @@ declare const styled: {
         <S_36>(chunks: TemplateStringsArray, ...functs: ((string | number | boolean | null | undefined) | ((arg: S_36 & RN.TouchableHighlightProps & {
             rnCSS?: string | undefined;
             shared: unknown;
-            theme: unknown;
+            theme: import("./styleComponent").DefaultTheme;
         }) => string | number | boolean | null | undefined))[]): React.ForwardRefExoticComponent<RN.TouchableHighlightProps & S_36 & {
             rnCSS?: `${string};` | undefined;
             onMouseEnter?: ((event: React.MouseEvent<Element, MouseEvent>) => void) | undefined;
@@ -563,7 +563,7 @@ declare const styled: {
         attrs<S_37>(opts: Partial<S_37 & RN.TouchableHighlightProps> | ((props: S_37 & RN.TouchableHighlightProps) => Partial<S_37 & RN.TouchableHighlightProps>)): (chunks: TemplateStringsArray, ...functs: ((string | number | boolean | null | undefined) | ((arg: S_37 & RN.TouchableHighlightProps & {
             rnCSS?: string | undefined;
             shared: unknown;
-            theme: unknown;
+            theme: import("./styleComponent").DefaultTheme;
         }) => string | number | boolean | null | undefined))[]) => React.ForwardRefExoticComponent<(RN.TouchableHighlightProps | S_37) & {
             rnCSS?: `${string};` | undefined;
             onMouseEnter?: ((event: React.MouseEvent<Element, MouseEvent>) => void) | undefined;
@@ -579,7 +579,7 @@ declare const styled: {
         <S_38>(chunks: TemplateStringsArray, ...functs: ((string | number | boolean | null | undefined) | ((arg: S_38 & RN.TouchableNativeFeedbackProps & {
             rnCSS?: string | undefined;
             shared: unknown;
-            theme: unknown;
+            theme: import("./styleComponent").DefaultTheme;
         }) => string | number | boolean | null | undefined))[]): React.ForwardRefExoticComponent<RN.TouchableNativeFeedbackProps & S_38 & {
             rnCSS?: `${string};` | undefined;
             onMouseEnter?: ((event: React.MouseEvent<Element, MouseEvent>) => void) | undefined;
@@ -593,7 +593,7 @@ declare const styled: {
         attrs<S_39>(opts: Partial<S_39 & RN.TouchableNativeFeedbackProps> | ((props: S_39 & RN.TouchableNativeFeedbackProps) => Partial<S_39 & RN.TouchableNativeFeedbackProps>)): (chunks: TemplateStringsArray, ...functs: ((string | number | boolean | null | undefined) | ((arg: S_39 & RN.TouchableNativeFeedbackProps & {
             rnCSS?: string | undefined;
             shared: unknown;
-            theme: unknown;
+            theme: import("./styleComponent").DefaultTheme;
         }) => string | number | boolean | null | undefined))[]) => React.ForwardRefExoticComponent<(RN.TouchableNativeFeedbackProps | S_39) & {
             rnCSS?: `${string};` | undefined;
             onMouseEnter?: ((event: React.MouseEvent<Element, MouseEvent>) => void) | undefined;
@@ -609,7 +609,7 @@ declare const styled: {
         <S_40>(chunks: TemplateStringsArray, ...functs: ((string | number | boolean | null | undefined) | ((arg: S_40 & RN.TouchableOpacityProps & {
             rnCSS?: string | undefined;
             shared: unknown;
-            theme: unknown;
+            theme: import("./styleComponent").DefaultTheme;
         }) => string | number | boolean | null | undefined))[]): React.ForwardRefExoticComponent<RN.TouchableOpacityProps & S_40 & {
             rnCSS?: `${string};` | undefined;
             onMouseEnter?: ((event: React.MouseEvent<Element, MouseEvent>) => void) | undefined;
@@ -623,7 +623,7 @@ declare const styled: {
         attrs<S_41>(opts: Partial<S_41 & RN.TouchableOpacityProps> | ((props: S_41 & RN.TouchableOpacityProps) => Partial<S_41 & RN.TouchableOpacityProps>)): (chunks: TemplateStringsArray, ...functs: ((string | number | boolean | null | undefined) | ((arg: S_41 & RN.TouchableOpacityProps & {
             rnCSS?: string | undefined;
             shared: unknown;
-            theme: unknown;
+            theme: import("./styleComponent").DefaultTheme;
         }) => string | number | boolean | null | undefined))[]) => React.ForwardRefExoticComponent<(RN.TouchableOpacityProps | S_41) & {
             rnCSS?: `${string};` | undefined;
             onMouseEnter?: ((event: React.MouseEvent<Element, MouseEvent>) => void) | undefined;
@@ -639,7 +639,7 @@ declare const styled: {
         <S_42>(chunks: TemplateStringsArray, ...functs: ((string | number | boolean | null | undefined) | ((arg: S_42 & RN.TouchableWithoutFeedbackProps & {
             rnCSS?: string | undefined;
             shared: unknown;
-            theme: unknown;
+            theme: import("./styleComponent").DefaultTheme;
         }) => string | number | boolean | null | undefined))[]): React.ForwardRefExoticComponent<RN.TouchableWithoutFeedbackProps & S_42 & {
             rnCSS?: `${string};` | undefined;
             onMouseEnter?: ((event: React.MouseEvent<Element, MouseEvent>) => void) | undefined;
@@ -653,7 +653,7 @@ declare const styled: {
         attrs<S_43>(opts: Partial<S_43 & RN.TouchableWithoutFeedbackProps> | ((props: S_43 & RN.TouchableWithoutFeedbackProps) => Partial<S_43 & RN.TouchableWithoutFeedbackProps>)): (chunks: TemplateStringsArray, ...functs: ((string | number | boolean | null | undefined) | ((arg: S_43 & RN.TouchableWithoutFeedbackProps & {
             rnCSS?: string | undefined;
             shared: unknown;
-            theme: unknown;
+            theme: import("./styleComponent").DefaultTheme;
         }) => string | number | boolean | null | undefined))[]) => React.ForwardRefExoticComponent<(RN.TouchableWithoutFeedbackProps | S_43) & {
             rnCSS?: `${string};` | undefined;
             onMouseEnter?: ((event: React.MouseEvent<Element, MouseEvent>) => void) | undefined;
@@ -669,7 +669,7 @@ declare const styled: {
         <S_28>(chunks: TemplateStringsArray, ...functs: ((string | number | boolean | null | undefined) | ((arg: S_28 & RN.ViewProps & {
             rnCSS?: string | undefined;
             shared: unknown;
-            theme: unknown;
+            theme: import("./styleComponent").DefaultTheme;
         }) => string | number | boolean | null | undefined))[]): React.ForwardRefExoticComponent<RN.ViewProps & S_28 & {
             rnCSS?: `${string};` | undefined;
             onMouseEnter?: ((event: React.MouseEvent<Element, MouseEvent>) => void) | undefined;
@@ -683,7 +683,7 @@ declare const styled: {
         attrs<S_29>(opts: Partial<S_29 & RN.ViewProps> | ((props: S_29 & RN.ViewProps) => Partial<S_29 & RN.ViewProps>)): (chunks: TemplateStringsArray, ...functs: ((string | number | boolean | null | undefined) | ((arg: S_29 & RN.ViewProps & {
             rnCSS?: string | undefined;
             shared: unknown;
-            theme: unknown;
+            theme: import("./styleComponent").DefaultTheme;
         }) => string | number | boolean | null | undefined))[]) => React.ForwardRefExoticComponent<(RN.ViewProps | S_29) & {
             rnCSS?: `${string};` | undefined;
             onMouseEnter?: ((event: React.MouseEvent<Element, MouseEvent>) => void) | undefined;
@@ -699,7 +699,7 @@ declare const styled: {
         <S_44>(chunks: TemplateStringsArray, ...functs: ((string | number | boolean | null | undefined) | ((arg: S_44 & {
             rnCSS?: string | undefined;
             shared: unknown;
-            theme: unknown;
+            theme: import("./styleComponent").DefaultTheme;
         }) => string | number | boolean | null | undefined))[]): <Type>(props: S_44 & RN.FlatListProps<Type> & {
             rnCSS?: `${string};` | undefined;
             onMouseEnter?: ((event: React.MouseEvent<Element, MouseEvent>) => void) | undefined;
@@ -711,7 +711,7 @@ declare const styled: {
         attrs<S_45>(opts: Partial<S_45 & RN.FlatListProps<any>> | ((props: S_45 & RN.FlatListProps<any>) => Partial<S_45 & RN.FlatListProps<any>>)): (chunks: TemplateStringsArray, ...functs: ((string | number | boolean | null | undefined) | ((arg: S_45 & RN.FlatListProps<any> & {
             rnCSS?: string | undefined;
             shared: unknown;
-            theme: unknown;
+            theme: import("./styleComponent").DefaultTheme;
         }) => string | number | boolean | null | undefined))[]) => <Props>(componentProps: S_45 & RN.FlatListProps<Props> & {
             rnCSS?: `${string};` | undefined;
             onMouseEnter?: ((event: React.MouseEvent<Element, MouseEvent>) => void) | undefined;
@@ -725,7 +725,7 @@ declare const styled: {
         <S_46>(chunks: TemplateStringsArray, ...functs: ((string | number | boolean | null | undefined) | ((arg: S_46 & {
             rnCSS?: string | undefined;
             shared: unknown;
-            theme: unknown;
+            theme: import("./styleComponent").DefaultTheme;
         }) => string | number | boolean | null | undefined))[]): <Type_1>(props: S_46 & RN.SectionListProps<Type_1, RN.DefaultSectionT> & {
             rnCSS?: `${string};` | undefined;
             onMouseEnter?: ((event: React.MouseEvent<Element, MouseEvent>) => void) | undefined;
@@ -737,7 +737,7 @@ declare const styled: {
         attrs<S_47>(opts: Partial<S_47 & RN.SectionListProps<any, RN.DefaultSectionT>> | ((props: S_47 & RN.SectionListProps<any, RN.DefaultSectionT>) => Partial<S_47 & RN.SectionListProps<any, RN.DefaultSectionT>>)): (chunks: TemplateStringsArray, ...functs: ((string | number | boolean | null | undefined) | ((arg: S_47 & RN.SectionListProps<any, RN.DefaultSectionT> & {
             rnCSS?: string | undefined;
             shared: unknown;
-            theme: unknown;
+            theme: import("./styleComponent").DefaultTheme;
         }) => string | number | boolean | null | undefined))[]) => <Props_1>(componentProps: S_47 & RN.SectionListProps<Props_1, RN.DefaultSectionT> & {
             rnCSS?: `${string};` | undefined;
             onMouseEnter?: ((event: React.MouseEvent<Element, MouseEvent>) => void) | undefined;
@@ -751,7 +751,7 @@ declare const styled: {
         <S_48>(chunks: TemplateStringsArray, ...functs: ((string | number | boolean | null | undefined) | ((arg: S_48 & {
             rnCSS?: string | undefined;
             shared: unknown;
-            theme: unknown;
+            theme: import("./styleComponent").DefaultTheme;
         }) => string | number | boolean | null | undefined))[]): <Type_2>(props: S_48 & RN.VirtualizedListProps<Type_2> & {
             rnCSS?: `${string};` | undefined;
             onMouseEnter?: ((event: React.MouseEvent<Element, MouseEvent>) => void) | undefined;
@@ -763,7 +763,7 @@ declare const styled: {
         attrs<S_49>(opts: Partial<S_49 & RN.VirtualizedListProps<any>> | ((props: S_49 & RN.VirtualizedListProps<any>) => Partial<S_49 & RN.VirtualizedListProps<any>>)): (chunks: TemplateStringsArray, ...functs: ((string | number | boolean | null | undefined) | ((arg: S_49 & RN.VirtualizedListProps<any> & {
             rnCSS?: string | undefined;
             shared: unknown;
-            theme: unknown;
+            theme: import("./styleComponent").DefaultTheme;
         }) => string | number | boolean | null | undefined))[]) => <Props_2>(componentProps: S_49 & RN.VirtualizedListProps<Props_2> & {
             rnCSS?: `${string};` | undefined;
             onMouseEnter?: ((event: React.MouseEvent<Element, MouseEvent>) => void) | undefined;

package/dist/styleComponent.d.ts

@@ -5,11 +5,13 @@ export declare const defaultUnits: Units;
 export declare const RemContext: React.Context<number>;
 export declare const FontSizeContext: React.Context<number>;
 export declare const SharedValue: React.Context<unknown>;
+export interface DefaultTheme {
+}
 declare type Primitive = number | string | null | undefined | boolean;
 declare type Functs<T> = (arg: T & {
     rnCSS?: string;
     shared: unknown;
-    theme: unknown;
+    theme: DefaultTheme;
 }) => Primitive;
 declare type OptionalProps = {
     rnCSS?: `${string};`;

package/dist/useTheme.d.ts

@@ -1,7 +1,8 @@
 import React from 'react';
+import { DefaultTheme } from './styleComponent';
 /** Provider for the theme. */
 export declare const ThemeProvider: ({ theme, children }: {
-    theme: unknown;
+    theme: DefaultTheme;
     children: React.ReactNode;
 }) => JSX.Element;
 /**

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "rn-css",
-  "version": "1.6.18",
+  "version": "1.6.19-1",
   "scripts": {
     "test": "jest",
     "prepare": "tsc",
@@ -49,7 +49,7 @@
     "react-native-typescript-transformer": "^1.2.13",
     "react-native-web": "^0.17.7",
     "react-test-renderer": "17.0.2",
-    "release-it": "^14.11.8",
+    "release-it": "^15.6.0",
     "ts-jest": "^27.1.1",
     "ts-loader": "^9.2.6",
     "typescript": "^4.5.4",

package/src/index.tsx

@@ -3,7 +3,7 @@ import * as RN from 'react-native'
 import './polyfill'
 import styledComponent, { styledFlatList, styledSectionList, styledVirtualizedList } from './styleComponent'
 export { cssToRNStyle } from './cssToRN'
-export { SharedValue, FontSizeContext, RemContext } from './styleComponent'
+export { SharedValue, FontSizeContext, RemContext, DefaultTheme } from './styleComponent'
 export * from './useTheme'
 
 const styled = <T, >(Component: React.ComponentType<T>) => styledComponent<T>(Component)

package/src/styleComponent.tsx

@@ -15,8 +15,11 @@ export const FontSizeContext = React.createContext(defaultUnits.em)
 // We use this to share value within the component (Theme, Translation, whatever)
 export const SharedValue = React.createContext<unknown>(undefined)
 
+// eslint-disable-next-line @typescript-eslint/no-empty-interface
+export interface DefaultTheme {}
+
 type Primitive = number | string | null | undefined | boolean
-type Functs<T> = (arg: T & { rnCSS?: string; shared: unknown, theme: unknown }) => Primitive
+type Functs<T> = (arg: T & { rnCSS?: string; shared: unknown, theme: DefaultTheme }) => Primitive
 type OptionalProps = {
   rnCSS?: `${string};`;
   onMouseEnter?: (event: MouseEvent) => void;
@@ -26,7 +29,7 @@ type OptionalProps = {
   style?: StyleProp<any>;
 }
 function buildCSSString<T extends { rnCSS?: string }> (chunks: TemplateStringsArray, functs: (Primitive | Functs<T>)[], props: T, shared: unknown) {
-  let computedString = chunks.map((chunk, i) => ([chunk, (functs[i] instanceof Function) ? (functs[i] as Functs<T>)({ shared, theme: shared, ...props }) : functs[i]])).flat().join('')
+  let computedString = chunks.map((chunk, i) => ([chunk, (functs[i] instanceof Function) ? (functs[i] as Functs<T>)({ shared, theme: (shared as DefaultTheme), ...props }) : functs[i]])).flat().join('')
   if (props.rnCSS) computedString += props.rnCSS.replace(/=/gm, ':') + ';'
   return computedString
 }

package/src/useTheme.tsx

@@ -1,8 +1,8 @@
 import React from 'react'
-import { SharedValue } from './styleComponent'
+import { DefaultTheme, SharedValue } from './styleComponent'
 
 /** Provider for the theme. */
-export const ThemeProvider = ({ theme, children }: { theme: unknown; children: React.ReactNode }) => {
+export const ThemeProvider = ({ theme, children }: { theme: DefaultTheme; children: React.ReactNode }) => {
   return <SharedValue.Provider value={theme}>
     {children}
   </SharedValue.Provider>