@pandacss/studio 0.0.0-dev-20230911135518 → 0.0.0-dev-20230911215041

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@pandacss/studio",
-  "version": "0.0.0-dev-20230911135518",
+  "version": "0.0.0-dev-20230911215041",
   "description": "The automated token documentation for Panda CSS",
   "main": "dist/studio.js",
   "module": "dist/studio.mjs",
@@ -33,19 +33,19 @@
     "react": "18.2.0",
     "react-dom": "18.2.0",
     "vite": "4.4.9",
-    "@pandacss/types": "0.0.0-dev-20230911135518",
-    "@pandacss/config": "0.0.0-dev-20230911135518",
-    "@pandacss/shared": "0.0.0-dev-20230911135518",
-    "@pandacss/token-dictionary": "0.0.0-dev-20230911135518",
-    "@pandacss/logger": "0.0.0-dev-20230911135518",
-    "@pandacss/node": "0.0.0-dev-20230911135518"
+    "@pandacss/types": "0.0.0-dev-20230911215041",
+    "@pandacss/config": "0.0.0-dev-20230911215041",
+    "@pandacss/shared": "0.0.0-dev-20230911215041",
+    "@pandacss/token-dictionary": "0.0.0-dev-20230911215041",
+    "@pandacss/logger": "0.0.0-dev-20230911215041",
+    "@pandacss/node": "0.0.0-dev-20230911215041"
   },
   "devDependencies": {
     "@types/react": "18.2.18",
     "@types/react-dom": "18.2.7",
     "@vitejs/plugin-react": "4.0.4",
     "execa": "7.2.0",
-    "@pandacss/dev": "0.0.0-dev-20230911135518"
+    "@pandacss/dev": "0.0.0-dev-20230911215041"
   },
   "scripts": {
     "codegen": "panda",

package/styled-system/helpers.mjs

@@ -210,49 +210,24 @@ var hypenateProperty = memo((property) => {
 });
 
 // src/slot.ts
-var assign = (obj, path, value) => {
-  const last = path.pop();
-  const target = path.reduce((acc, key) => {
-    if (acc[key] == null)
-      acc[key] = {};
-    return acc[key];
-  }, obj);
-  if (last != null)
-    target[last] = value;
-};
 var getSlotRecipes = (recipe) => {
-  const parts = recipe.slots.map((slot) => [
-    slot,
-    // setup base recipe
-    {
-      // create class-base on BEM
-      className: [recipe.className ?? "", slot].join("__"),
-      base: {},
-      variants: {},
-      defaultVariants: recipe.defaultVariants ?? {},
-      compoundVariants: []
-    }
-  ]).map(([slot, cva]) => {
-    const base = recipe.base[slot];
-    if (base)
-      cva.base = base;
-    walkObject(
-      recipe.variants ?? {},
-      (variant, path) => {
-        if (!variant[slot])
-          return;
-        assign(cva, ["variants", ...path], variant[slot]);
-      },
-      {
-        stop: (_value, path) => path.includes(slot)
-      }
-    );
-    if (recipe.compoundVariants) {
-      cva.compoundVariants = getSlotCompoundVariant(recipe.compoundVariants, slot);
-    }
-    return [slot, cva];
+  const init = (slot) => ({
+    className: [recipe.className, slot].filter(Boolean).join("__"),
+    base: recipe.base?.[slot] ?? {},
+    variants: {},
+    defaultVariants: recipe.defaultVariants ?? {},
+    compoundVariants: recipe.compoundVariants ? getSlotCompoundVariant(recipe.compoundVariants, slot) : []
   });
-  return Object.fromEntries(parts);
+  const recipeParts = recipe.slots.map((slot) => [slot, init(slot)]);
+  for (const [variantsKey, variantsSpec] of Object.entries(recipe.variants ?? {})) {
+    for (const [variantKey, variantSpec] of Object.entries(variantsSpec)) {
+      recipeParts.forEach(([slot, slotRecipe]) => {
+        slotRecipe.variants[variantsKey] ??= {};
+        slotRecipe.variants[variantsKey][variantKey] = variantSpec[slot] ?? {};
+      });
+    }
+  }
+  return Object.fromEntries(recipeParts);
 };
 var getSlotCompoundVariant = (compoundVariants, slotName) => compoundVariants.filter((compoundVariant) => compoundVariant.css[slotName]).map((compoundVariant) => ({ ...compoundVariant, css: compoundVariant.css[slotName] }));