@pandacss/generator 0.0.0-dev-20240226215512 → 0.0.0-dev-20240227001356

package/dist/index.js

@@ -88,7 +88,7 @@ function generateConditions(ctx) {
     export interface Conditions {
     ${keys.map(
       (key) => `	${key === "base" ? `/** The base (=no conditions) styles to apply  */
-` : ctx.conditions.get(key) ? `/** \`${[].concat(ctx.conditions.get(key)).join(" ")}\` */
+` : ctx.conditions.get(key) ? `/** \`${[].concat(ctx.conditions.get(key) ?? "").join(" ")}\` */
 ` : ""}	${JSON.stringify(key)}: string`
     ).join("\n")}
     }
@@ -3636,8 +3636,13 @@ var import_core3 = require("@pandacss/core");
 var import_shared4 = require("@pandacss/shared");
 function generateResetCss(ctx, sheet) {
   const { preflight } = ctx.config;
-  const scope = (0, import_shared4.isObject)(preflight) ? preflight.scope : void 0;
-  const selector = scope ? `${scope} ` : "";
+  const { scope = "", level = "parent" } = (0, import_shared4.isObject)(preflight) ? preflight : {};
+  let selector = "";
+  if (scope && level === "parent") {
+    selector = `${scope} `;
+  } else if (scope && level === "element") {
+    selector = `&${scope}`;
+  }
   const scoped = {
     "*": { margin: "0px", padding: "0px", font: "inherit" },
     "*, *::before, *::after": {
@@ -3728,7 +3733,10 @@ function generateResetCss(ctx, sheet) {
       fontFamily: "var(--global-font-body, var(--font-fallback))"
     }
   };
-  if (selector) {
+  if (level === "element") {
+    const modified = (0, import_shared4.mapEntries)(scoped, (k, v) => [k, { [selector]: v }]);
+    Object.assign(reset, modified);
+  } else if (selector) {
     reset[selector] = scoped;
   } else {
     Object.assign(reset, scoped);
@@ -3773,9 +3781,13 @@ function generateTokenCss(ctx, sheet) {
       const css2 = (0, import_core4.stringify)(varsObj);
       const mapped = keys.map((key2) => conditions.get(key2)).filter(Boolean).map((condition) => {
         const lastSegment = Array.isArray(condition) ? condition.at(-1) : condition;
+        if (!lastSegment)
+          return;
         const parent = (0, import_core4.extractParentSelectors)(lastSegment);
         return parent ? `&${parent}` : lastSegment;
-      });
+      }).filter(Boolean);
+      if (!mapped.length)
+        return;
       const rule = getDeepestRule(root, mapped);
       if (!rule)
         continue;

package/dist/index.mjs

@@ -52,7 +52,7 @@ function generateConditions(ctx) {
     export interface Conditions {
     ${keys.map(
       (key) => `	${key === "base" ? `/** The base (=no conditions) styles to apply  */
-` : ctx.conditions.get(key) ? `/** \`${[].concat(ctx.conditions.get(key)).join(" ")}\` */
+` : ctx.conditions.get(key) ? `/** \`${[].concat(ctx.conditions.get(key) ?? "").join(" ")}\` */
 ` : ""}	${JSON.stringify(key)}: string`
     ).join("\n")}
     }
@@ -3597,11 +3597,16 @@ var generateParserCss = (ctx, decoder) => {
 
 // src/artifacts/css/reset-css.ts
 import "@pandacss/core";
-import { isObject } from "@pandacss/shared";
+import { isObject, mapEntries } from "@pandacss/shared";
 function generateResetCss(ctx, sheet) {
   const { preflight } = ctx.config;
-  const scope = isObject(preflight) ? preflight.scope : void 0;
-  const selector = scope ? `${scope} ` : "";
+  const { scope = "", level = "parent" } = isObject(preflight) ? preflight : {};
+  let selector = "";
+  if (scope && level === "parent") {
+    selector = `${scope} `;
+  } else if (scope && level === "element") {
+    selector = `&${scope}`;
+  }
   const scoped = {
     "*": { margin: "0px", padding: "0px", font: "inherit" },
     "*, *::before, *::after": {
@@ -3692,7 +3697,10 @@ function generateResetCss(ctx, sheet) {
       fontFamily: "var(--global-font-body, var(--font-fallback))"
     }
   };
-  if (selector) {
+  if (level === "element") {
+    const modified = mapEntries(scoped, (k, v) => [k, { [selector]: v }]);
+    Object.assign(reset, modified);
+  } else if (selector) {
     reset[selector] = scoped;
   } else {
     Object.assign(reset, scoped);
@@ -3737,9 +3745,13 @@ function generateTokenCss(ctx, sheet) {
       const css2 = stringify4(varsObj);
       const mapped = keys.map((key2) => conditions.get(key2)).filter(Boolean).map((condition) => {
         const lastSegment = Array.isArray(condition) ? condition.at(-1) : condition;
+        if (!lastSegment)
+          return;
         const parent = extractParentSelectors(lastSegment);
         return parent ? `&${parent}` : lastSegment;
-      });
+      }).filter(Boolean);
+      if (!mapped.length)
+        return;
       const rule = getDeepestRule(root, mapped);
       if (!rule)
         continue;

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@pandacss/generator",
-  "version": "0.0.0-dev-20240226215512",
+  "version": "0.0.0-dev-20240227001356",
   "description": "The css generator for css panda",
   "main": "dist/index.js",
   "module": "dist/index.mjs",
@@ -37,12 +37,12 @@
     "pluralize": "8.0.0",
     "postcss": "8.4.35",
     "ts-pattern": "5.0.8",
-    "@pandacss/core": "0.0.0-dev-20240226215512",
-    "@pandacss/is-valid-prop": "^0.0.0-dev-20240226215512",
-    "@pandacss/logger": "0.0.0-dev-20240226215512",
-    "@pandacss/shared": "0.0.0-dev-20240226215512",
-    "@pandacss/token-dictionary": "0.0.0-dev-20240226215512",
-    "@pandacss/types": "0.0.0-dev-20240226215512"
+    "@pandacss/core": "0.0.0-dev-20240227001356",
+    "@pandacss/is-valid-prop": "^0.0.0-dev-20240227001356",
+    "@pandacss/logger": "0.0.0-dev-20240227001356",
+    "@pandacss/shared": "0.0.0-dev-20240227001356",
+    "@pandacss/token-dictionary": "0.0.0-dev-20240227001356",
+    "@pandacss/types": "0.0.0-dev-20240227001356"
   },
   "devDependencies": {
     "@types/pluralize": "0.0.33"