feat: react-native-css/compiler & react-native-css/jest

Author: marklawlor

package.json

@@ -27,6 +27,28 @@
         "default": "./dist/commonjs/metro/index.js"
       }
     },
+    "./compiler": {
+      "source": "./src/compiler/index.ts",
+      "import": {
+        "types": "./dist/typescript/module/src/compiler/index.d.ts",
+        "default": "./dist/module/compiler/index.js"
+      },
+      "require": {
+        "types": "./dist/typescript/commonjs/src/compiler/index.d.ts",
+        "default": "./dist/commonjs/compiler/index.js"
+      }
+    },
+    "./jest": {
+      "source": "./src/jest/index.ts",
+      "import": {
+        "types": "./dist/typescript/module/src/jest/index.d.ts",
+        "default": "./dist/module/jest/index.js"
+      },
+      "require": {
+        "types": "./dist/typescript/commonjs/src/jest/index.d.ts",
+        "default": "./dist/commonjs/jest/index.js"
+      }
+    },
     "./babel": {
       "source": "./src/babel/index.ts",
       "import": {

src/__tests__/vendor/tailwind.test.tsx

@@ -1,5 +1,6 @@
+import { render, screen } from "@testing-library/react-native";
 import { View } from "react-native-css/components/View";
-import { registerCSS, render, screen, testID } from "react-native-css/jest";
+import { registerCSS, testID } from "react-native-css/jest";
 
 /**
  * Tailwind CSS utilities

src/jest/index.ts

@@ -1,26 +1,25 @@
-/* eslint-disable @typescript-eslint/no-namespace */
-import { Dimensions } from "react-native";
+import { Appearance, Dimensions } from "react-native";
 
 import { compile, type CompilerOptions } from "../compiler";
 import { StyleCollection } from "../runtime/native/injection";
 import { colorScheme, dimensions, rem } from "../runtime/native/reactivity";
 
 declare global {
+  /* eslint-disable @typescript-eslint/no-namespace */
   namespace jest {
     interface Matchers<R> {
-      // eslint-disable-next-line @typescript-eslint/no-explicit-any
-      toHaveAnimatedStyle(style?: any): R;
+      toHaveAnimatedStyle(style?: unknown): R;
     }
   }
 }
 
-export * from "@testing-library/react-native";
 export const testID = "react-native-css";
 
 beforeEach(() => {
   StyleCollection.styles.clear();
   dimensions.set(Dimensions.get("window"));
   rem.set(14);
+  Appearance.setColorScheme(null);
   colorScheme.set(null);
 });
 

src/runtime/native/__tests__/attributes.test.tsx

@@ -1,6 +1,7 @@
+import { render, screen } from "@testing-library/react-native";
 import { Text } from "react-native-css/components/Text";
 import { View } from "react-native-css/components/View";
-import { registerCSS, render, screen, testID } from "react-native-css/jest";
+import { registerCSS, testID } from "react-native-css/jest";
 
 test(":disabled", () => {
   registerCSS(`.test:disabled { width: 10px; }`);

src/runtime/native/__tests__/calc.test.tsx

@@ -1,5 +1,6 @@
+import { render, screen } from "@testing-library/react-native";
 import { View } from "react-native-css/components/View";
-import { registerCSS, render, screen, testID } from "react-native-css/jest";
+import { registerCSS, testID } from "react-native-css/jest";
 
 describe("css", () => {
   test("calc(10px + 100px)", () => {

src/runtime/native/__tests__/colors.test.tsx

@@ -1,5 +1,6 @@
+import { render, screen } from "@testing-library/react-native";
 import { View } from "react-native-css/components/View";
-import { registerCSS, render, screen, testID } from "react-native-css/jest";
+import { registerCSS, testID } from "react-native-css/jest";
 
 describe("hsl", () => {
   test("inline", () => {

src/runtime/native/__tests__/container-queries.test.tsx

@@ -1,5 +1,6 @@
+import { fireEvent, render, screen } from "@testing-library/react-native";
 import { View } from "react-native-css/components/View";
-import { fireEvent, registerCSS, render, screen } from "react-native-css/jest";
+import { registerCSS } from "react-native-css/jest";
 
 const parentID = "parent";
 const childID = "child";

src/runtime/native/__tests__/env.test.ios.tsx

@@ -1,6 +1,7 @@
 // import { SafeAreaProvider } from "react-native-css/components/SafeAreaProvider";
+import { render, screen } from "@testing-library/react-native";
 import { View } from "react-native-css/components/View";
-import { registerCSS, render, screen, testID } from "react-native-css/jest";
+import { registerCSS, testID } from "react-native-css/jest";
 
 test.skip("safe-area-inset-*", () => {
   registerCSS(`.my-class {

src/runtime/native/__tests__/grouping.test.tsx

@@ -1,5 +1,6 @@
+import { fireEvent, render, screen } from "@testing-library/react-native";
 import { View } from "react-native-css/components/View";
-import { fireEvent, registerCSS, render, screen } from "react-native-css/jest";
+import { registerCSS } from "react-native-css/jest";
 
 // import { getAnimatedStyle } from "react-native-reanimated";
 

src/runtime/native/__tests__/media-query.test.tsx

@@ -1,13 +1,8 @@
 import { PixelRatio } from "react-native";
 
+import { act, render, screen } from "@testing-library/react-native";
 import { View } from "react-native-css/components/View";
-import {
-  act,
-  registerCSS,
-  render,
-  screen,
-  testID,
-} from "react-native-css/jest";
+import { registerCSS, testID } from "react-native-css/jest";
 
 import { colorScheme } from "../api";
 import { dimensions } from "../reactivity";