Refactor: code order

Author: black7375

packages/css/src/css/index.ts

@@ -102,14 +102,20 @@ function hoistSelectors(input: CSSRule): HoistResult {
 }
 
 // == CSS ======================================================================
-export function cssImpl(style: ComplexCSSRule, debugId?: string) {
-  return vStyle(transform(style), debugId);
-}
+export const css = Object.assign(cssImpl, {
+  raw: cssRaw,
+  multiple: cssMultiple,
+  with: cssWith
+});
 
 function cssRaw(style: ComplexCSSRule) {
   return style;
 }
 
+export function cssImpl(style: ComplexCSSRule, debugId?: string) {
+  return vStyle(transform(style), debugId);
+}
+
 function cssWith<const T extends CSSRule>(
   callback?: (style: CSSRuleWith<T>) => ComplexCSSRule
 ) {
@@ -159,12 +165,6 @@ function cssWith<const T extends CSSRule>(
   });
 }
 
-export const css = Object.assign(cssImpl, {
-  raw: cssRaw,
-  multiple: cssMultiple,
-  with: cssWith
-});
-
 // == CSS Multiple =============================================================
 // TODO: Need to optimize
 // https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Functions/get#smart_self-overwriting_lazy_getters

packages/css/src/rules/index.ts

@@ -36,18 +36,23 @@ import {
   transformVariantSelection
 } from "./utils.js";
 
-const mergeObject = deepmerge();
+// == Rules ====================================================================
+export const rules = Object.assign(rulesImpl, {
+  multiple: rulesMultiple,
+  raw: rulesRaw
+});
 
-// Helper function to safely set properties on a CSSRule
-function setCSSProperty(
-  styles: CSSRule,
-  property: string,
-  value: string
-): void {
-  // @ts-expect-error: Intentionally bypassing type checking for dynamic property assignment
-  styles[property] = value;
+function rulesRaw<
+  Variants extends VariantGroups | undefined = undefined,
+  ToggleVariants extends VariantDefinitions | undefined = undefined,
+  Props extends ComplexPropDefinitions<PropTarget> | undefined = undefined
+>(options: PatternOptions<Variants, ToggleVariants, Props>) {
+  return options;
 }
 
+// == Rules Impl ===============================================================
+const mergeObject = deepmerge();
+
 export function rulesImpl<
   Variants extends VariantGroups | undefined = undefined,
   ToggleVariants extends VariantDefinitions | undefined = undefined,
@@ -186,7 +191,49 @@ export function rulesImpl<
   );
 }
 
-// Improved type-safe transformations that preserve pattern structure
+// Helper function to safely set properties on a CSSRule
+function setCSSProperty(
+  styles: CSSRule,
+  property: string,
+  value: string
+): void {
+  // @ts-expect-error: Intentionally bypassing type checking for dynamic property assignment
+  styles[property] = value;
+}
+
+function processPropObject<Target extends PropTarget>(
+  props: PropDefinition<Target>,
+  propVars: Record<string, PureCSSVarKey>,
+  propStyles: CSSRule,
+  debugId?: string
+) {
+  Object.entries(props).forEach(([propName, propValue]) => {
+    const debugName = getDebugName(debugId, propName);
+    const propVar = createVar(debugName);
+    propVars[propName] = getVarName(propVar);
+
+    const isBaseValue = propValue?.base !== undefined;
+    propValue?.targets.forEach((target) => {
+      setCSSProperty(
+        propStyles,
+        target,
+        isBaseValue ? fallbackVar(propVar, `${propValue.base}`) : propVar
+      );
+    });
+  });
+}
+
+function processCompoundStyle(
+  style: RecipeStyleRule,
+  debugId: string | undefined,
+  index: number
+): string {
+  return typeof style === "string"
+    ? style
+    : css(style, getDebugName(debugId, `compound_${index}`));
+}
+
+// == Rules Multiple ==========================================================
 type RuntimeFnFromPatternOptions<Options> =
   Options extends PatternOptions<
     infer Variants extends VariantGroups | undefined,
@@ -343,51 +390,6 @@ function processMultipleRules<
   return patternsMap;
 }
 
-function rulesRaw<
-  Variants extends VariantGroups | undefined = undefined,
-  ToggleVariants extends VariantDefinitions | undefined = undefined,
-  Props extends ComplexPropDefinitions<PropTarget> | undefined = undefined
->(options: PatternOptions<Variants, ToggleVariants, Props>) {
-  return options;
-}
-
-export const rules = Object.assign(rulesImpl, {
-  multiple: rulesMultiple,
-  raw: rulesRaw
-});
-
-function processPropObject<Target extends PropTarget>(
-  props: PropDefinition<Target>,
-  propVars: Record<string, PureCSSVarKey>,
-  propStyles: CSSRule,
-  debugId?: string
-) {
-  Object.entries(props).forEach(([propName, propValue]) => {
-    const debugName = getDebugName(debugId, propName);
-    const propVar = createVar(debugName);
-    propVars[propName] = getVarName(propVar);
-
-    const isBaseValue = propValue?.base !== undefined;
-    propValue?.targets.forEach((target) => {
-      setCSSProperty(
-        propStyles,
-        target,
-        isBaseValue ? fallbackVar(propVar, `${propValue.base}`) : propVar
-      );
-    });
-  });
-}
-
-function processCompoundStyle(
-  style: RecipeStyleRule,
-  debugId: string | undefined,
-  index: number
-): string {
-  return typeof style === "string"
-    ? style
-    : css(style, getDebugName(debugId, `compound_${index}`));
-}
-
 // == Tests ====================================================================
 // Ignore errors when compiling to CommonJS.
 // eslint-disable-next-line @typescript-eslint/ban-ts-comment