fix: enable additional lightningcss syntax lowering (#166)

Author: marklawlor

src/__tests__/compiler/@prop.test.tsx

@@ -1,7 +1,11 @@
 import { render, screen } from "@testing-library/react-native";
 import { compile } from "react-native-css/compiler";
 import { View } from "react-native-css/components";
-import { registerCSS, testID } from "react-native-css/jest";
+import {
+  compileWithAutoDebug,
+  registerCSS,
+  testID,
+} from "react-native-css/jest";
 
 test("@prop target (nested @media)", () => {
   const compiled = registerCSS(`
@@ -222,10 +226,10 @@ test("@prop value: wildcard nested target", () => {
 });
 
 test("@prop multiple", () => {
-  const compiled = compile(`
+  const compiled = compileWithAutoDebug(`
     .test { 
       color: red; 
-      background-color: blue; 
+      background-color: oklab(40.1% 0.1143 0.045); 
       @prop {
         background-color: *.myBackgroundColor;
         color: *.myColor;
@@ -241,7 +245,7 @@ test("@prop multiple", () => {
           {
             d: [
               {
-                myBackgroundColor: "#00f",
+                myBackgroundColor: "#7d2429",
                 myColor: "#f00",
               },
             ],

src/compiler/compiler.ts

@@ -3,6 +3,7 @@ import { inspect } from "node:util";
 
 import { debug } from "debug";
 import {
+  Features,
   transform as lightningcss,
   type ContainerRule,
   type MediaQuery as CSSMediaQuery,
@@ -65,6 +66,8 @@ export function compile(code: Buffer | string, options: CompilerOptions = {}) {
    */
   const { code: firstPass } = lightningcss({
     code: typeof code === "string" ? new TextEncoder().encode(code) : code,
+    include: Features.DoublePositionGradients | Features.ColorFunction,
+    exclude: Features.VendorPrefixes,
     visitor: {
       Length(length) {
         if (length.unit !== "rem" || options.inlineRem === false) {
@@ -84,7 +87,7 @@ export function compile(code: Buffer | string, options: CompilerOptions = {}) {
   if (isLoggerEnabled) {
     const MAX_LOG_SIZE = 100 * 1024; // 100KB
     if (firstPass.length <= MAX_LOG_SIZE) {
-      logger(firstPass.toString());
+      console.log(firstPass.toString());
     } else {
       logger(
         `firstPass buffer too large to log in full (${firstPass.length} bytes). Preview: ` +