@pandacss/node 0.0.0-dev-20221126164420 → 0.0.0-dev-20221127075519

package/dist/index.d.ts

@@ -7,11 +7,11 @@ import * as _pandacss_types_dist_recipe from '@pandacss/types/dist/recipe';
 import * as _pandacss_types_dist_system_types from '@pandacss/types/dist/system-types';
 import * as ts_morph from 'ts-morph';
 import * as _pandacss_types from '@pandacss/types';
-import { PatternConfig, RecipeConfig, Config } from '@pandacss/types';
-import * as _pandacss_parser from '@pandacss/parser';
-import { Collector } from '@pandacss/parser';
+import { PatternConfig, RecipeConfig, Dict, Config } from '@pandacss/types';
 import * as _pandacss_config from '@pandacss/config';
 import { LoadConfigResult } from '@pandacss/config';
+import * as _pandacss_parser from '@pandacss/parser';
+import { Collector } from '@pandacss/parser';
 import * as _pandacss_shared from '@pandacss/shared';
 import { mapObject } from '@pandacss/shared';
 import * as _pandacss_token_dictionary from '@pandacss/token-dictionary';
@@ -92,6 +92,7 @@ declare function createContext(conf: LoadConfigResult, io?: IO): {
     getPattern: (name: string) => PatternConfig | undefined;
     execPattern: (name: string, data: Record<string, any>) => _pandacss_types.StyleObject<_pandacss_types_dist_system_types.TCondition, _pandacss_types_dist_system_types.NeverType, false>;
     patternNodes: {
+        type: "pattern";
         name: string;
         props: string[];
         baseName: string;
@@ -115,11 +116,10 @@ declare function createContext(conf: LoadConfigResult, io?: IO): {
     hash?: boolean | undefined;
     semanticTokens?: _pandacss_types.SemanticTokens<string> | undefined;
     separator?: "-" | "_" | "=" | undefined;
-    breakpoints?: _pandacss_types.Dict<any> | undefined;
+    breakpoints?: Dict<any> | undefined;
     keyframes?: _pandacss_types.CssKeyframes | undefined;
     minify?: boolean | undefined;
     utilities?: _pandacss_types.UtilityConfig | undefined;
-    globalCss?: _pandacss_types_dist_system_types.GlobalStyleObject<_pandacss_types_dist_system_types.TCondition, _pandacss_types_dist_system_types.NeverType, false> | undefined;
     logLevel?: "debug" | "info" | "warn" | "error" | "silent" | undefined;
     presets?: string[] | undefined;
     preflight?: boolean | undefined;
@@ -127,6 +127,7 @@ declare function createContext(conf: LoadConfigResult, io?: IO): {
     cssVarPrefix?: string | undefined;
     watch?: boolean | undefined;
     poll?: boolean | undefined;
+    globalCss?: _pandacss_types_dist_system_types.GlobalStyleObject<_pandacss_types_dist_system_types.TCondition, _pandacss_types_dist_system_types.NeverType, false> | undefined;
     textStyles?: _pandacss_types.TextStyles<_pandacss_types_dist_composition.TCondition> | undefined;
     layerStyles?: _pandacss_types.LayerStyles<_pandacss_types_dist_composition.TCondition> | undefined;
     strictTokens?: boolean | undefined;
@@ -208,6 +209,7 @@ declare class Builder {
         getPattern: (name: string) => _pandacss_types.PatternConfig | undefined;
         execPattern: (name: string, data: Record<string, any>) => _pandacss_types.StyleObject<_pandacss_types_dist_system_types.TCondition, _pandacss_types_dist_system_types.NeverType, false>;
         patternNodes: {
+            type: "pattern";
             name: string;
             props: string[];
             baseName: string;
@@ -235,7 +237,6 @@ declare class Builder {
         keyframes?: _pandacss_types.CssKeyframes | undefined;
         minify?: boolean | undefined;
         utilities?: _pandacss_types.UtilityConfig | undefined;
-        globalCss?: _pandacss_types_dist_system_types.GlobalStyleObject<_pandacss_types_dist_system_types.TCondition, _pandacss_types_dist_system_types.NeverType, false> | undefined;
         logLevel?: "debug" | "info" | "warn" | "error" | "silent" | undefined;
         presets?: string[] | undefined;
         preflight?: boolean | undefined;
@@ -243,6 +244,7 @@ declare class Builder {
         cssVarPrefix?: string | undefined;
         watch?: boolean | undefined;
         poll?: boolean | undefined;
+        globalCss?: _pandacss_types_dist_system_types.GlobalStyleObject<_pandacss_types_dist_system_types.TCondition, _pandacss_types_dist_system_types.NeverType, false> | undefined;
         textStyles?: _pandacss_types.TextStyles<_pandacss_types_dist_composition.TCondition> | undefined;
         layerStyles?: _pandacss_types.LayerStyles<_pandacss_types_dist_composition.TCondition> | undefined;
         strictTokens?: boolean | undefined;
@@ -322,6 +324,7 @@ declare function loadConfigAndCreateContext(options?: {
     getPattern: (name: string) => _pandacss_types.PatternConfig | undefined;
     execPattern: (name: string, data: Record<string, any>) => _pandacss_types.StyleObject<_pandacss_types_dist_system_types.TCondition, _pandacss_types_dist_system_types.NeverType, false>;
     patternNodes: {
+        type: "pattern";
         name: string;
         props: string[];
         baseName: string;
@@ -349,7 +352,6 @@ declare function loadConfigAndCreateContext(options?: {
     keyframes?: _pandacss_types.CssKeyframes | undefined;
     minify?: boolean | undefined;
     utilities?: _pandacss_types.UtilityConfig | undefined;
-    globalCss?: _pandacss_types_dist_system_types.GlobalStyleObject<_pandacss_types_dist_system_types.TCondition, _pandacss_types_dist_system_types.NeverType, false> | undefined;
     logLevel?: "debug" | "info" | "warn" | "error" | "silent" | undefined;
     presets?: string[] | undefined;
     preflight?: boolean | undefined;
@@ -357,6 +359,7 @@ declare function loadConfigAndCreateContext(options?: {
     cssVarPrefix?: string | undefined;
     watch?: boolean | undefined;
     poll?: boolean | undefined;
+    globalCss?: _pandacss_types_dist_system_types.GlobalStyleObject<_pandacss_types_dist_system_types.TCondition, _pandacss_types_dist_system_types.NeverType, false> | undefined;
     textStyles?: _pandacss_types.TextStyles<_pandacss_types_dist_composition.TCondition> | undefined;
     layerStyles?: _pandacss_types.LayerStyles<_pandacss_types_dist_composition.TCondition> | undefined;
     strictTokens?: boolean | undefined;

package/dist/index.js

@@ -1555,6 +1555,16 @@ function scaffoldCompleteMessage() {
     `\u{1F43C} ${pickRandom(randomWords)}! \u2728`
   );
 }
+function watchMessage() {
+  return import_outdent23.outdent`
+  Watching for file changes...
+  `;
+}
+function buildCompleteMessage(ctx) {
+  return import_outdent23.outdent`
+  Successfully extracted CSS from ${ctx.files.length} file(s) ✨
+  `;
+}
 
 // src/artifacts.ts
 async function emitArtifacts(ctx) {
@@ -1588,10 +1598,10 @@ var import_config = require("@pandacss/config");
 var import_look_it_up2 = require("look-it-up");
 
 // src/context.ts
-var import_parser = require("@pandacss/parser");
 var import_core3 = require("@pandacss/core");
 var import_error = require("@pandacss/error");
 var import_logger4 = require("@pandacss/logger");
+var import_parser = require("@pandacss/parser");
 var import_shared11 = require("@pandacss/shared");
 var import_token_dictionary = require("@pandacss/token-dictionary");
 var import_fast_glob = __toESM(require("fast-glob"));
@@ -1600,6 +1610,7 @@ var import_fs_extra2 = require("fs-extra");
 var import_promises = require("fs/promises");
 var import_path3 = require("path");
 var import_postcss = __toESM(require("postcss"));
+var import_ts_pattern6 = require("ts-pattern");
 var helpers = {
   map: import_shared11.mapObject
 };
@@ -1614,6 +1625,18 @@ var fileSystem = {
     return (0, import_promises.unlink)(path);
   }
 };
+function splitProps(obj, keys) {
+  const omitted = {};
+  const picked = {};
+  for (const [key, value] of Object.entries(obj)) {
+    if (keys.includes(key)) {
+      picked[key] = value;
+    } else {
+      omitted[key] = value;
+    }
+  }
+  return [picked, omitted];
+}
 function createContext(conf, io = fileSystem) {
   const { config } = conf;
   const {
@@ -1682,6 +1705,7 @@ function createContext(conf, io = fileSystem) {
     return pattern?.transform?.(data, helpers) ?? {};
   }
   const patternNodes = Object.entries(patterns).map(([name, pattern]) => ({
+    type: "pattern",
     name: pattern.jsx ?? (0, import_shared11.capitalize)(name),
     props: Object.keys(pattern.properties),
     baseName: name
@@ -1696,6 +1720,21 @@ function createContext(conf, io = fileSystem) {
     }
     return recipe;
   }
+  const recipeNodes = Object.entries(recipes).map(([name, recipe]) => ({
+    type: "recipe",
+    name: recipe.jsx ?? (0, import_shared11.capitalize)(name),
+    props: Object.keys(recipe.variants ?? {}),
+    baseName: name
+  }));
+  function getRecipeFnName(jsx) {
+    return recipeNodes.find((node) => node.name === jsx)?.baseName ?? (0, import_shared11.uncapitalize)(jsx);
+  }
+  function splitRecipeProps(name, props) {
+    const recipe = recipeNodes.find((node) => node.name === name);
+    if (!recipe)
+      return [{}, props];
+    return splitProps(props, recipe.props);
+  }
   const properties = Array.from(/* @__PURE__ */ new Set(["css", ...utility.keys(), ...conditions.keys()]));
   function isProperty(prop) {
     const regex = new RegExp("^(?:" + properties.join("|") + ")$");
@@ -1783,7 +1822,7 @@ function createContext(conf, io = fileSystem) {
     jsx: {
       factory: jsxFactory,
       isStyleProp: isProperty,
-      nodes: patternNodes
+      nodes: [...patternNodes, ...recipeNodes]
     }
   });
   function collectStyles(collector, file) {
@@ -1806,11 +1845,15 @@ function createContext(conf, io = fileSystem) {
       const { data, type, name } = result;
       const { css: css2 = {}, ...rest } = data;
       const styles = { ...css2, ...rest };
-      if (name && type === "pattern") {
-        collector.setPattern(getPatternFnName(name), { data: styles });
-      } else {
+      (0, import_ts_pattern6.match)([name, type]).with([import_ts_pattern6.P.string, "pattern"], ([name2]) => {
+        collector.setPattern(getPatternFnName(name2), { data: styles });
+      }).with([import_ts_pattern6.P.string, "recipe"], ([name2]) => {
+        const [recipeProps, atomicProps] = splitRecipeProps(name2, styles);
+        collector.setRecipe(getRecipeFnName(name2), { data: recipeProps });
+        sheet.processAtomic(atomicProps);
+      }).otherwise(() => {
         sheet.processAtomic(styles);
-      }
+      });
     });
     collector.recipe.forEach((result, name) => {
       try {
@@ -2061,6 +2104,9 @@ async function execCommand(cmd, cwd) {
   }
 }
 
+// src/generate.ts
+var import_logger8 = require("@pandacss/logger");
+
 // src/watch.ts
 var import_logger7 = require("@pandacss/logger");
 var import_chokidar = __toESM(require("chokidar"));
@@ -2142,6 +2188,7 @@ process.on("uncaughtException", (err) => {
 async function generate5(config, configPath) {
   const ctx = await loadConfigAndCreateContext({ config, configPath });
   await emitAndExtract(ctx);
+  import_logger8.logger.info(buildCompleteMessage(ctx));
   if (ctx.watch) {
     process.stdin.on("end", () => process.exit());
     await watch(ctx, {
@@ -2155,11 +2202,12 @@ async function generate5(config, configPath) {
         return writeFileChunk(ctx, file);
       }
     });
+    import_logger8.logger.info(watchMessage());
   }
 }
 
 // src/scaffold.ts
-var import_logger8 = require("@pandacss/logger");
+var import_logger9 = require("@pandacss/logger");
 var import_fs_extra4 = require("fs-extra");
 var import_look_it_up3 = require("look-it-up");
 var import_outdent24 = require("outdent");
@@ -2172,9 +2220,9 @@ async function setupConfig(cwd, { force }) {
   const cmd = pm === "npm" ? "npm run" : pm;
   const isTs = (0, import_look_it_up3.lookItUpSync)("tsconfig.json", cwd);
   const file = isTs ? "panda.config.ts" : "panda.config.mjs";
-  import_logger8.logger.info({ type: "init", msg: `creating panda config file: ${(0, import_logger8.quote)(file)}` });
+  import_logger9.logger.info({ type: "init", msg: `creating panda config file: ${(0, import_logger9.quote)(file)}` });
   if (!force && configFile) {
-    import_logger8.logger.warn("config exists", configExistsMessage(cmd));
+    import_logger9.logger.warn("config exists", configExistsMessage(cmd));
   } else {
     const content = import_outdent24.outdent`
        import { defineConfig } from "css-panda"
@@ -2197,11 +2245,11 @@ async function setupConfig(cwd, { force }) {
        })
     `;
     await (0, import_fs_extra4.writeFile)((0, import_path7.join)(cwd, file), content);
-    import_logger8.logger.log(thankYouMessage());
+    import_logger9.logger.log(thankYouMessage());
   }
 }
 async function setupPostcss(cwd) {
-  import_logger8.logger.info({ type: "init", msg: `creating postcss config file: ${(0, import_logger8.quote)("postcss.config.cjs")}` });
+  import_logger9.logger.info({ type: "init", msg: `creating postcss config file: ${(0, import_logger9.quote)("postcss.config.cjs")}` });
   const content = import_outdent24.outdent`
   module.exports = {
     plugins: {

package/dist/index.mjs

@@ -1510,6 +1510,16 @@ function scaffoldCompleteMessage() {
     `\u{1F43C} ${pickRandom(randomWords)}! \u2728`
   );
 }
+function watchMessage() {
+  return outdent23`
+  Watching for file changes...
+  `;
+}
+function buildCompleteMessage(ctx) {
+  return outdent23`
+  Successfully extracted CSS from ${ctx.files.length} file(s) ✨
+  `;
+}
 
 // src/artifacts.ts
 async function emitArtifacts(ctx) {
@@ -1543,7 +1553,6 @@ import { loadConfigFile } from "@pandacss/config";
 import { lookItUpSync as lookItUpSync2 } from "look-it-up";
 
 // src/context.ts
-import { createParser, createProject } from "@pandacss/parser";
 import {
   assignCompositions,
   Conditions,
@@ -1553,6 +1562,7 @@ import {
 } from "@pandacss/core";
 import { NotFoundError } from "@pandacss/error";
 import { logger as logger4 } from "@pandacss/logger";
+import { createParser, createProject } from "@pandacss/parser";
 import { capitalize as capitalize10, compact, mapObject, uncapitalize } from "@pandacss/shared";
 import { TokenDictionary } from "@pandacss/token-dictionary";
 import glob from "fast-glob";
@@ -1561,6 +1571,7 @@ import { emptyDir, ensureDir, existsSync } from "fs-extra";
 import { readFile, unlink, writeFile } from "fs/promises";
 import { extname, isAbsolute, join as join2, relative, resolve, sep } from "path";
 import postcss from "postcss";
+import { match as match6, P } from "ts-pattern";
 var helpers = {
   map: mapObject
 };
@@ -1575,6 +1586,18 @@ var fileSystem = {
     return unlink(path);
   }
 };
+function splitProps(obj, keys) {
+  const omitted = {};
+  const picked = {};
+  for (const [key, value] of Object.entries(obj)) {
+    if (keys.includes(key)) {
+      picked[key] = value;
+    } else {
+      omitted[key] = value;
+    }
+  }
+  return [picked, omitted];
+}
 function createContext(conf, io = fileSystem) {
   const { config } = conf;
   const {
@@ -1643,6 +1666,7 @@ function createContext(conf, io = fileSystem) {
     return pattern?.transform?.(data, helpers) ?? {};
   }
   const patternNodes = Object.entries(patterns).map(([name, pattern]) => ({
+    type: "pattern",
     name: pattern.jsx ?? capitalize10(name),
     props: Object.keys(pattern.properties),
     baseName: name
@@ -1657,6 +1681,21 @@ function createContext(conf, io = fileSystem) {
     }
     return recipe;
   }
+  const recipeNodes = Object.entries(recipes).map(([name, recipe]) => ({
+    type: "recipe",
+    name: recipe.jsx ?? capitalize10(name),
+    props: Object.keys(recipe.variants ?? {}),
+    baseName: name
+  }));
+  function getRecipeFnName(jsx) {
+    return recipeNodes.find((node) => node.name === jsx)?.baseName ?? uncapitalize(jsx);
+  }
+  function splitRecipeProps(name, props) {
+    const recipe = recipeNodes.find((node) => node.name === name);
+    if (!recipe)
+      return [{}, props];
+    return splitProps(props, recipe.props);
+  }
   const properties = Array.from(/* @__PURE__ */ new Set(["css", ...utility.keys(), ...conditions.keys()]));
   function isProperty(prop) {
     const regex = new RegExp("^(?:" + properties.join("|") + ")$");
@@ -1744,7 +1783,7 @@ function createContext(conf, io = fileSystem) {
     jsx: {
       factory: jsxFactory,
       isStyleProp: isProperty,
-      nodes: patternNodes
+      nodes: [...patternNodes, ...recipeNodes]
     }
   });
   function collectStyles(collector, file) {
@@ -1767,11 +1806,15 @@ function createContext(conf, io = fileSystem) {
       const { data, type, name } = result;
       const { css: css2 = {}, ...rest } = data;
       const styles = { ...css2, ...rest };
-      if (name && type === "pattern") {
-        collector.setPattern(getPatternFnName(name), { data: styles });
-      } else {
+      match6([name, type]).with([P.string, "pattern"], ([name2]) => {
+        collector.setPattern(getPatternFnName(name2), { data: styles });
+      }).with([P.string, "recipe"], ([name2]) => {
+        const [recipeProps, atomicProps] = splitRecipeProps(name2, styles);
+        collector.setRecipe(getRecipeFnName(name2), { data: recipeProps });
+        sheet.processAtomic(atomicProps);
+      }).otherwise(() => {
         sheet.processAtomic(styles);
-      }
+      });
     });
     collector.recipe.forEach((result, name) => {
       try {
@@ -2022,6 +2065,9 @@ async function execCommand(cmd, cwd) {
   }
 }
 
+// src/generate.ts
+import { logger as logger8 } from "@pandacss/logger";
+
 // src/watch.ts
 import { logger as logger7 } from "@pandacss/logger";
 import chokidar from "chokidar";
@@ -2103,6 +2149,7 @@ process.on("uncaughtException", (err) => {
 async function generate5(config, configPath) {
   const ctx = await loadConfigAndCreateContext({ config, configPath });
   await emitAndExtract(ctx);
+  logger8.info(buildCompleteMessage(ctx));
   if (ctx.watch) {
     process.stdin.on("end", () => process.exit());
     await watch(ctx, {
@@ -2116,11 +2163,12 @@ async function generate5(config, configPath) {
         return writeFileChunk(ctx, file);
       }
     });
+    logger8.info(watchMessage());
   }
 }
 
 // src/scaffold.ts
-import { logger as logger8, quote as quote3 } from "@pandacss/logger";
+import { logger as logger9, quote as quote3 } from "@pandacss/logger";
 import { writeFile as writeFile2 } from "fs-extra";
 import { lookItUpSync as lookItUpSync3 } from "look-it-up";
 import { outdent as outdent24 } from "outdent";
@@ -2133,9 +2181,9 @@ async function setupConfig(cwd, { force }) {
   const cmd = pm === "npm" ? "npm run" : pm;
   const isTs = lookItUpSync3("tsconfig.json", cwd);
   const file = isTs ? "panda.config.ts" : "panda.config.mjs";
-  logger8.info({ type: "init", msg: `creating panda config file: ${quote3(file)}` });
+  logger9.info({ type: "init", msg: `creating panda config file: ${quote3(file)}` });
   if (!force && configFile) {
-    logger8.warn("config exists", configExistsMessage(cmd));
+    logger9.warn("config exists", configExistsMessage(cmd));
   } else {
     const content = outdent24`
        import { defineConfig } from "css-panda"
@@ -2158,11 +2206,11 @@ async function setupConfig(cwd, { force }) {
        })
     `;
     await writeFile2(join4(cwd, file), content);
-    logger8.log(thankYouMessage());
+    logger9.log(thankYouMessage());
   }
 }
 async function setupPostcss(cwd) {
-  logger8.info({ type: "init", msg: `creating postcss config file: ${quote3("postcss.config.cjs")}` });
+  logger9.info({ type: "init", msg: `creating postcss config file: ${quote3("postcss.config.cjs")}` });
   const content = outdent24`
   module.exports = {
     plugins: {

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@pandacss/node",
-  "version": "0.0.0-dev-20221126164420",
+  "version": "0.0.0-dev-20221127075519",
   "description": "The core css panda library",
   "main": "dist/index.js",
   "module": "dist/index.mjs",
@@ -30,15 +30,15 @@
     "telejson": "6.0.8",
     "ts-pattern": "4.0.6",
     "ts-morph": "17.0.1",
-    "@pandacss/types": "0.0.0-dev-20221126164420",
-    "@pandacss/is-valid-prop": "0.0.0-dev-20221126164420",
-    "@pandacss/error": "0.0.0-dev-20221126164420",
-    "@pandacss/parser": "0.0.0-dev-20221126164420",
-    "@pandacss/shared": "0.0.0-dev-20221126164420",
-    "@pandacss/token-dictionary": "0.0.0-dev-20221126164420",
-    "@pandacss/logger": "0.0.0-dev-20221126164420",
-    "@pandacss/core": "0.0.0-dev-20221126164420",
-    "@pandacss/config": "0.0.0-dev-20221126164420"
+    "@pandacss/types": "0.0.0-dev-20221127075519",
+    "@pandacss/is-valid-prop": "0.0.0-dev-20221127075519",
+    "@pandacss/error": "0.0.0-dev-20221127075519",
+    "@pandacss/parser": "0.0.0-dev-20221127075519",
+    "@pandacss/shared": "0.0.0-dev-20221127075519",
+    "@pandacss/token-dictionary": "0.0.0-dev-20221127075519",
+    "@pandacss/logger": "0.0.0-dev-20221127075519",
+    "@pandacss/core": "0.0.0-dev-20221127075519",
+    "@pandacss/config": "0.0.0-dev-20221127075519"
   },
   "devDependencies": {
     "@types/fs-extra": "9.0.13",
@@ -46,7 +46,7 @@
     "@types/glob-parent": "^5.1.1",
     "@types/pluralize": "0.0.29",
     "@types/lodash.merge": "4.6.7",
-    "@pandacss/fixture": "0.0.0-dev-20221126164420"
+    "@pandacss/fixture": "0.0.0-dev-20221127075519"
   },
   "scripts": {
     "build": "tsup src/index.ts --format=cjs,esm --shims --dts",