From ef27468caa714eea254f9b9c6563ba2a5483a135 Mon Sep 17 00:00:00 2001
From: alstjr7375 <alstjr7375@daum.net>
Date: Mon, 2 Sep 2024 15:54:16 +0900
Subject: [PATCH] Feat: Rules - Basic porting for CSS rules with vanilla
 extract recipe #94

---
 packages/css/src/index.ts       |  2 ++
 packages/css/src/rules/index.ts | 14 ++++++--------
 packages/css/src/rules/types.ts | 10 ++++++----
 3 files changed, 14 insertions(+), 12 deletions(-)

diff --git a/packages/css/src/index.ts b/packages/css/src/index.ts
index 0a70828..21f4d3e 100644
--- a/packages/css/src/index.ts
+++ b/packages/css/src/index.ts
@@ -30,6 +30,8 @@ export {
   keyframes,
   layer
 } from "@vanilla-extract/css";
+export { rules } from "./rules";
+export type { RulesVariants, RecipeVariants, RuntimeFn } from "./rules/types";
 
 export type { CSSProperties, ComplexCSSRule, GlobalCSSRule, CSSRule };
 export type ComplexStyleRule = ComplexCSSRule;
diff --git a/packages/css/src/rules/index.ts b/packages/css/src/rules/index.ts
index 23e12da..f96fb23 100644
--- a/packages/css/src/rules/index.ts
+++ b/packages/css/src/rules/index.ts
@@ -1,5 +1,5 @@
 import { addFunctionSerializer } from "@vanilla-extract/css/functionSerializer";
-import { style, styleVariants } from "@vanilla-extract/css";
+import { css, cssVariants } from "../index";
 
 import { createRuntimeFn } from "./createRuntimeFn";
 import type {
@@ -11,9 +11,7 @@ import type {
 } from "./types";
 import { mapValues } from "./utils";
 
-export type { RecipeVariants, RuntimeFn } from "./types";
-
-export function recipe<Variants extends VariantGroups>(
+export function rules<Variants extends VariantGroups>(
   options: PatternOptions<Variants>,
   debugId?: string
 ): RuntimeFn<Variants> {
@@ -27,16 +25,16 @@ export function recipe<Variants extends VariantGroups>(
   let defaultClassName;
 
   if (!base || typeof base === "string") {
-    const baseClassName = style({});
+    const baseClassName = css({});
     defaultClassName = base ? `${baseClassName} ${base}` : baseClassName;
   } else {
-    defaultClassName = style(base, debugId);
+    defaultClassName = css(base, debugId);
   }
 
   // @ts-expect-error - Temporarily ignoring the error as the PatternResult type is not fully defined
   const variantClassNames: PatternResult<Variants>["variantClassNames"] =
     mapValues(variants, (variantGroup, variantGroupName) =>
-      styleVariants(
+      cssVariants(
         variantGroup,
         (styleRule) =>
           typeof styleRule === "string" ? [styleRule] : styleRule,
@@ -51,7 +49,7 @@ export function recipe<Variants extends VariantGroups>(
       variants,
       typeof theStyle === "string"
         ? theStyle
-        : style(theStyle, `${debugId}_compound_${compounds.length}`)
+        : css(theStyle, `${debugId}_compound_${compounds.length}`)
     ]);
   }
 
diff --git a/packages/css/src/rules/types.ts b/packages/css/src/rules/types.ts
index 957c6fe..b1f43a3 100644
--- a/packages/css/src/rules/types.ts
+++ b/packages/css/src/rules/types.ts
@@ -1,10 +1,10 @@
-import type { ComplexStyleRule } from "@vanilla-extract/css";
+import type { ComplexCSSRule } from "@mincho-js/transform-to-vanilla";
 
 type Resolve<T> = {
   [Key in keyof T]: T[Key];
 } & {};
 
-type RecipeStyleRule = ComplexStyleRule | string;
+type RecipeStyleRule = ComplexCSSRule | string;
 
 export type VariantDefinitions = Record<string, RecipeStyleRule>;
 
@@ -54,6 +54,8 @@ export type RuntimeFn<Variants extends VariantGroups> = ((
   classNames: RecipeClassNames<Variants>;
 };
 
-export type RecipeVariants<RecipeFn extends RuntimeFn<VariantGroups>> = Resolve<
-  Parameters<RecipeFn>[0]
+export type RulesVariants<RuleFn extends RuntimeFn<VariantGroups>> = Resolve<
+  Parameters<RuleFn>[0]
 >;
+export type RecipeVariants<RecipeFn extends RuntimeFn<VariantGroups>> =
+  RulesVariants<RecipeFn>;