fix: sx utils

package.json

@@ -37,6 +37,7 @@
   "homepage": "https://github.com/syfxlin/reve#readme",
   "dependencies": {
     "@vanilla-extract/css-utils": "^0.1.3",
+    "@vanilla-extract/dynamic": "^2.0.3",
     "clsx": "^2.0.0",
     "stylis": "^4.3.0"
   },

src/index.ts

@@ -4,3 +4,4 @@ export * from "./theme";
 export * from "./utils/calc";
 export * from "./utils/cx";
 export * from "./utils/sx";
+export * from "./utils/dynamic.ts";

src/utils/dynamic.ts

@@ -0,0 +1 @@
+export * from "@vanilla-extract/dynamic";

src/utils/sx.ts

@@ -1,12 +1,14 @@
 import { CSSProperties } from "react";
+import { assignInlineVars } from "@vanilla-extract/dynamic";
 
 export function sx(...values: Array<CSSProperties | Record<string, any> | boolean | null | undefined>) {
   let results: CSSProperties = {};
   for (const value of values) {
     if (value === null || value === undefined || typeof value === "boolean") {
       continue;
     }
-    results = { ...results, ...value };
+    // @ts-ignore
+    results = { ...results, ...assignInlineVars(value) };
   }
   return results;
 }