@pandacss/generator 0.27.3 → 0.29.0

package/dist/index.d.mts

@@ -1,15 +1,15 @@
 import * as _pandacss_types from '@pandacss/types';
-import { ConfigResultWithHooks, ArtifactId, CssArtifactType } from '@pandacss/types';
+import { LoadConfigResult, ArtifactId, CssArtifactType } from '@pandacss/types';
 import { Context, Stylesheet, StyleDecoder } from '@pandacss/core';
 
 declare class Generator extends Context {
-    constructor(conf: ConfigResultWithHooks);
+    constructor(conf: LoadConfigResult);
     getArtifacts: (ids?: ArtifactId[] | undefined) => _pandacss_types.Artifact[];
     appendCssOfType: (type: CssArtifactType, sheet: Stylesheet) => void;
     appendLayerParams: (sheet: Stylesheet) => void;
     appendBaselineCss: (sheet: Stylesheet) => void;
     appendParserCss: (sheet: Stylesheet) => void;
-    getParserCss: (decoder: StyleDecoder, filePath?: string) => string;
+    getParserCss: (decoder: StyleDecoder) => string;
     getCss: (stylesheet?: Stylesheet) => string;
 }
 

package/dist/index.d.ts

@@ -1,15 +1,15 @@
 import * as _pandacss_types from '@pandacss/types';
-import { ConfigResultWithHooks, ArtifactId, CssArtifactType } from '@pandacss/types';
+import { LoadConfigResult, ArtifactId, CssArtifactType } from '@pandacss/types';
 import { Context, Stylesheet, StyleDecoder } from '@pandacss/core';
 
 declare class Generator extends Context {
-    constructor(conf: ConfigResultWithHooks);
+    constructor(conf: LoadConfigResult);
     getArtifacts: (ids?: ArtifactId[] | undefined) => _pandacss_types.Artifact[];
     appendCssOfType: (type: CssArtifactType, sheet: Stylesheet) => void;
     appendLayerParams: (sheet: Stylesheet) => void;
     appendBaselineCss: (sheet: Stylesheet) => void;
     appendParserCss: (sheet: Stylesheet) => void;
-    getParserCss: (decoder: StyleDecoder, filePath?: string) => string;
+    getParserCss: (decoder: StyleDecoder) => string;
     getCss: (stylesheet?: Stylesheet) => string;
 }
 

package/dist/index.js

@@ -418,7 +418,7 @@ var astish_mjs_default = {
 
 // src/artifacts/generated/helpers.mjs.json
 var helpers_mjs_default = {
-  content: '// src/assert.ts\nfunction isObject(value) {\n  return typeof value === "object" && value != null && !Array.isArray(value);\n}\n\n// src/compact.ts\nfunction compact(value) {\n  return Object.fromEntries(Object.entries(value ?? {}).filter(([_, value2]) => value2 !== void 0));\n}\n\n// src/condition.ts\nvar isBaseCondition = (v) => v === "base";\nfunction filterBaseConditions(c) {\n  return c.slice().filter((v) => !isBaseCondition(v));\n}\n\n// src/css-important.ts\nvar importantRegex = /\\s*!(important)?/i;\nfunction isImportant(value) {\n  return typeof value === "string" ? importantRegex.test(value) : false;\n}\nfunction withoutImportant(value) {\n  return typeof value === "string" ? value.replace(importantRegex, "").trim() : value;\n}\nfunction withoutSpace(str) {\n  return typeof str === "string" ? str.replaceAll(" ", "_") : str;\n}\n\n// src/hash.ts\nfunction toChar(code) {\n  return String.fromCharCode(code + (code > 25 ? 39 : 97));\n}\nfunction toName(code) {\n  let name = "";\n  let x;\n  for (x = Math.abs(code); x > 52; x = x / 52 | 0)\n    name = toChar(x % 52) + name;\n  return toChar(x % 52) + name;\n}\nfunction toPhash(h, x) {\n  let i = x.length;\n  while (i)\n    h = h * 33 ^ x.charCodeAt(--i);\n  return h;\n}\nfunction toHash(value) {\n  return toName(toPhash(5381, value) >>> 0);\n}\n\n// src/merge-props.ts\nfunction mergeProps(...sources) {\n  const objects = sources.filter(Boolean);\n  return objects.reduce((prev, obj) => {\n    Object.keys(obj).forEach((key) => {\n      const prevValue = prev[key];\n      const value = obj[key];\n      if (isObject(prevValue) && isObject(value)) {\n        prev[key] = mergeProps(prevValue, value);\n      } else {\n        prev[key] = value;\n      }\n    });\n    return prev;\n  }, {});\n}\n\n// src/memo.ts\nvar memo = (fn) => {\n  const cache = /* @__PURE__ */ new Map();\n  const get = (...args) => {\n    const key = JSON.stringify(args);\n    if (cache.has(key)) {\n      return cache.get(key);\n    }\n    const result = fn(...args);\n    cache.set(key, result);\n    return result;\n  };\n  return get;\n};\n\n// src/walk-object.ts\nvar isNotNullish = (element) => element != null;\nfunction walkObject(target, predicate, options = {}) {\n  const { stop, getKey } = options;\n  function inner(value, path = []) {\n    if (isObject(value) || Array.isArray(value)) {\n      const result = {};\n      for (const [prop, child] of Object.entries(value)) {\n        const key = getKey?.(prop) ?? prop;\n        const childPath = [...path, key];\n        if (stop?.(value, childPath)) {\n          return predicate(value, path);\n        }\n        const next = inner(child, childPath);\n        if (isNotNullish(next)) {\n          result[key] = next;\n        }\n      }\n      return result;\n    }\n    return predicate(value, path);\n  }\n  return inner(target);\n}\nfunction mapObject(obj, fn) {\n  if (Array.isArray(obj))\n    return obj.map((value) => fn(value));\n  if (!isObject(obj))\n    return fn(obj);\n  return walkObject(obj, (value) => fn(value));\n}\n\n// src/normalize-style-object.ts\nfunction toResponsiveObject(values, breakpoints) {\n  return values.reduce((acc, current, index) => {\n    const key = breakpoints[index];\n    if (current != null) {\n      acc[key] = current;\n    }\n    return acc;\n  }, {});\n}\nfunction normalizeShorthand(styles, context) {\n  const { hasShorthand, resolveShorthand } = context.utility;\n  return walkObject(styles, (v) => v, {\n    getKey: (prop) => {\n      return hasShorthand ? resolveShorthand(prop) : prop;\n    }\n  });\n}\nfunction normalizeStyleObject(styles, context, shorthand = true) {\n  const { utility, conditions } = context;\n  const { hasShorthand, resolveShorthand } = utility;\n  return walkObject(\n    styles,\n    (value) => {\n      return Array.isArray(value) ? toResponsiveObject(value, conditions.breakpoints.keys) : value;\n    },\n    {\n      stop: (value) => Array.isArray(value),\n      getKey: shorthand ? (prop) => hasShorthand ? resolveShorthand(prop) : prop : void 0\n    }\n  );\n}\n\n// src/classname.ts\nvar fallbackCondition = {\n  shift: (v) => v,\n  finalize: (v) => v,\n  breakpoints: { keys: [] }\n};\nvar sanitize = (value) => typeof value === "string" ? value.replaceAll(/[\\n\\s]+/g, " ") : value;\nfunction createCss(context) {\n  const { utility, hash, conditions: conds = fallbackCondition } = context;\n  const formatClassName = (str) => [utility.prefix, str].filter(Boolean).join("-");\n  const hashFn = (conditions, className) => {\n    let result;\n    if (hash) {\n      const baseArray = [...conds.finalize(conditions), className];\n      result = formatClassName(toHash(baseArray.join(":")));\n    } else {\n      const baseArray = [...conds.finalize(conditions), formatClassName(className)];\n      result = baseArray.join(":");\n    }\n    return result;\n  };\n  return memo((styleObject = {}) => {\n    const normalizedObject = normalizeStyleObject(styleObject, context);\n    const classNames = /* @__PURE__ */ new Set();\n    walkObject(normalizedObject, (value, paths) => {\n      const important = isImportant(value);\n      if (value == null)\n        return;\n      const [prop, ...allConditions] = conds.shift(paths);\n      const conditions = filterBaseConditions(allConditions);\n      const transformed = utility.transform(prop, withoutImportant(sanitize(value)));\n      let className = hashFn(conditions, transformed.className);\n      if (important)\n        className = `${className}!`;\n      classNames.add(className);\n    });\n    return Array.from(classNames).join(" ");\n  });\n}\nfunction compactStyles(...styles) {\n  return styles.filter((style) => isObject(style) && Object.keys(compact(style)).length > 0);\n}\nfunction createMergeCss(context) {\n  function resolve(styles) {\n    const allStyles = compactStyles(...styles);\n    if (allStyles.length === 1)\n      return allStyles;\n    return allStyles.map((style) => normalizeShorthand(style, context));\n  }\n  function mergeCss(...styles) {\n    return mergeProps(...resolve(styles));\n  }\n  function assignCss(...styles) {\n    return Object.assign({}, ...resolve(styles));\n  }\n  return { mergeCss: memo(mergeCss), assignCss };\n}\n\n// src/hypenate-property.ts\nvar wordRegex = /([A-Z])/g;\nvar msRegex = /^ms-/;\nvar hypenateProperty = memo((property) => {\n  if (property.startsWith("--"))\n    return property;\n  return property.replace(wordRegex, "-$1").replace(msRegex, "-ms-").toLowerCase();\n});\n\n// src/slot.ts\nvar getSlotRecipes = (recipe = {}) => {\n  const init = (slot) => ({\n    className: [recipe.className, slot].filter(Boolean).join("__"),\n    base: recipe.base?.[slot] ?? {},\n    variants: {},\n    defaultVariants: recipe.defaultVariants ?? {},\n    compoundVariants: recipe.compoundVariants ? getSlotCompoundVariant(recipe.compoundVariants, slot) : []\n  });\n  const slots = recipe.slots ?? [];\n  const recipeParts = slots.map((slot) => [slot, init(slot)]);\n  for (const [variantsKey, variantsSpec] of Object.entries(recipe.variants ?? {})) {\n    for (const [variantKey, variantSpec] of Object.entries(variantsSpec)) {\n      recipeParts.forEach(([slot, slotRecipe]) => {\n        slotRecipe.variants[variantsKey] ??= {};\n        slotRecipe.variants[variantsKey][variantKey] = variantSpec[slot] ?? {};\n      });\n    }\n  }\n  return Object.fromEntries(recipeParts);\n};\nvar getSlotCompoundVariant = (compoundVariants, slotName) => compoundVariants.filter((compoundVariant) => compoundVariant.css[slotName]).map((compoundVariant) => ({ ...compoundVariant, css: compoundVariant.css[slotName] }));\n\n// src/split-props.ts\nfunction splitProps(props, ...keys) {\n  const descriptors = Object.getOwnPropertyDescriptors(props);\n  const dKeys = Object.keys(descriptors);\n  const split = (k) => {\n    const clone = {};\n    for (let i = 0; i < k.length; i++) {\n      const key = k[i];\n      if (descriptors[key]) {\n        Object.defineProperty(clone, key, descriptors[key]);\n        delete descriptors[key];\n      }\n    }\n    return clone;\n  };\n  const fn = (key) => split(Array.isArray(key) ? key : dKeys.filter(key));\n  return keys.map(fn).concat(split(dKeys));\n}\n\n// src/uniq.ts\nvar uniq = (...items) => items.filter(Boolean).reduce((acc, item) => Array.from(/* @__PURE__ */ new Set([...acc, ...item])), []);\nexport {\n  compact,\n  createCss,\n  createMergeCss,\n  filterBaseConditions,\n  getSlotCompoundVariant,\n  getSlotRecipes,\n  hypenateProperty,\n  isBaseCondition,\n  isObject,\n  mapObject,\n  memo,\n  mergeProps,\n  splitProps,\n  toHash,\n  uniq,\n  walkObject,\n  withoutSpace\n};\n'
+  content: '// src/assert.ts\nfunction isObject(value) {\n  return typeof value === "object" && value != null && !Array.isArray(value);\n}\n\n// src/compact.ts\nfunction compact(value) {\n  return Object.fromEntries(Object.entries(value ?? {}).filter(([_, value2]) => value2 !== void 0));\n}\n\n// src/condition.ts\nvar isBaseCondition = (v) => v === "base";\nfunction filterBaseConditions(c) {\n  return c.slice().filter((v) => !isBaseCondition(v));\n}\n\n// src/important.ts\nvar importantRegex = /\\s*!(important)?/i;\nfunction isImportant(value) {\n  return typeof value === "string" ? importantRegex.test(value) : false;\n}\nfunction withoutImportant(value) {\n  return typeof value === "string" ? value.replace(importantRegex, "").trim() : value;\n}\nfunction withoutSpace(str) {\n  return typeof str === "string" ? str.replaceAll(" ", "_") : str;\n}\n\n// src/hash.ts\nfunction toChar(code) {\n  return String.fromCharCode(code + (code > 25 ? 39 : 97));\n}\nfunction toName(code) {\n  let name = "";\n  let x;\n  for (x = Math.abs(code); x > 52; x = x / 52 | 0)\n    name = toChar(x % 52) + name;\n  return toChar(x % 52) + name;\n}\nfunction toPhash(h, x) {\n  let i = x.length;\n  while (i)\n    h = h * 33 ^ x.charCodeAt(--i);\n  return h;\n}\nfunction toHash(value) {\n  return toName(toPhash(5381, value) >>> 0);\n}\n\n// src/merge-props.ts\nfunction mergeProps(...sources) {\n  const objects = sources.filter(Boolean);\n  return objects.reduce((prev, obj) => {\n    Object.keys(obj).forEach((key) => {\n      const prevValue = prev[key];\n      const value = obj[key];\n      if (isObject(prevValue) && isObject(value)) {\n        prev[key] = mergeProps(prevValue, value);\n      } else {\n        prev[key] = value;\n      }\n    });\n    return prev;\n  }, {});\n}\n\n// src/memo.ts\nvar memo = (fn) => {\n  const cache = /* @__PURE__ */ new Map();\n  const get = (...args) => {\n    const key = JSON.stringify(args);\n    if (cache.has(key)) {\n      return cache.get(key);\n    }\n    const result = fn(...args);\n    cache.set(key, result);\n    return result;\n  };\n  return get;\n};\n\n// src/walk-object.ts\nvar isNotNullish = (element) => element != null;\nfunction walkObject(target, predicate, options = {}) {\n  const { stop, getKey } = options;\n  function inner(value, path = []) {\n    if (isObject(value) || Array.isArray(value)) {\n      const result = {};\n      for (const [prop, child] of Object.entries(value)) {\n        const key = getKey?.(prop) ?? prop;\n        const childPath = [...path, key];\n        if (stop?.(value, childPath)) {\n          return predicate(value, path);\n        }\n        const next = inner(child, childPath);\n        if (isNotNullish(next)) {\n          result[key] = next;\n        }\n      }\n      return result;\n    }\n    return predicate(value, path);\n  }\n  return inner(target);\n}\nfunction mapObject(obj, fn) {\n  if (Array.isArray(obj))\n    return obj.map((value) => fn(value));\n  if (!isObject(obj))\n    return fn(obj);\n  return walkObject(obj, (value) => fn(value));\n}\n\n// src/normalize-style-object.ts\nfunction toResponsiveObject(values, breakpoints) {\n  return values.reduce((acc, current, index) => {\n    const key = breakpoints[index];\n    if (current != null) {\n      acc[key] = current;\n    }\n    return acc;\n  }, {});\n}\nfunction normalizeShorthand(styles, context) {\n  const { hasShorthand, resolveShorthand } = context.utility;\n  return walkObject(styles, (v) => v, {\n    getKey: (prop) => {\n      return hasShorthand ? resolveShorthand(prop) : prop;\n    }\n  });\n}\nfunction normalizeStyleObject(styles, context, shorthand = true) {\n  const { utility, conditions } = context;\n  const { hasShorthand, resolveShorthand } = utility;\n  return walkObject(\n    styles,\n    (value) => {\n      return Array.isArray(value) ? toResponsiveObject(value, conditions.breakpoints.keys) : value;\n    },\n    {\n      stop: (value) => Array.isArray(value),\n      getKey: shorthand ? (prop) => hasShorthand ? resolveShorthand(prop) : prop : void 0\n    }\n  );\n}\n\n// src/classname.ts\nvar fallbackCondition = {\n  shift: (v) => v,\n  finalize: (v) => v,\n  breakpoints: { keys: [] }\n};\nvar sanitize = (value) => typeof value === "string" ? value.replaceAll(/[\\n\\s]+/g, " ") : value;\nfunction createCss(context) {\n  const { utility, hash, conditions: conds = fallbackCondition } = context;\n  const formatClassName = (str) => [utility.prefix, str].filter(Boolean).join("-");\n  const hashFn = (conditions, className) => {\n    let result;\n    if (hash) {\n      const baseArray = [...conds.finalize(conditions), className];\n      result = formatClassName(toHash(baseArray.join(":")));\n    } else {\n      const baseArray = [...conds.finalize(conditions), formatClassName(className)];\n      result = baseArray.join(":");\n    }\n    return result;\n  };\n  return memo((styleObject = {}) => {\n    const normalizedObject = normalizeStyleObject(styleObject, context);\n    const classNames = /* @__PURE__ */ new Set();\n    walkObject(normalizedObject, (value, paths) => {\n      const important = isImportant(value);\n      if (value == null)\n        return;\n      const [prop, ...allConditions] = conds.shift(paths);\n      const conditions = filterBaseConditions(allConditions);\n      const transformed = utility.transform(prop, withoutImportant(sanitize(value)));\n      let className = hashFn(conditions, transformed.className);\n      if (important)\n        className = `${className}!`;\n      classNames.add(className);\n    });\n    return Array.from(classNames).join(" ");\n  });\n}\nfunction compactStyles(...styles) {\n  return styles.filter((style) => isObject(style) && Object.keys(compact(style)).length > 0);\n}\nfunction createMergeCss(context) {\n  function resolve(styles) {\n    const allStyles = compactStyles(...styles);\n    if (allStyles.length === 1)\n      return allStyles;\n    return allStyles.map((style) => normalizeShorthand(style, context));\n  }\n  function mergeCss(...styles) {\n    return mergeProps(...resolve(styles));\n  }\n  function assignCss(...styles) {\n    return Object.assign({}, ...resolve(styles));\n  }\n  return { mergeCss: memo(mergeCss), assignCss };\n}\n\n// src/hypenate-property.ts\nvar wordRegex = /([A-Z])/g;\nvar msRegex = /^ms-/;\nvar hypenateProperty = memo((property) => {\n  if (property.startsWith("--"))\n    return property;\n  return property.replace(wordRegex, "-$1").replace(msRegex, "-ms-").toLowerCase();\n});\n\n// src/is-css-function.ts\nvar fns = ["min", "max", "clamp", "calc"];\nvar fnRegExp = new RegExp(`^(${fns.join("|")})\\\\(.*\\\\)`);\nvar isCssFunction = (v) => typeof v === "string" && fnRegExp.test(v);\n\n// src/is-css-unit.ts\nvar lengthUnits = "cm,mm,Q,in,pc,pt,px,em,ex,ch,rem,lh,rlh,vw,vh,vmin,vmax,vb,vi,svw,svh,lvw,lvh,dvw,dvh,cqw,cqh,cqi,cqb,cqmin,cqmax,%";\nvar lengthUnitsPattern = `(?:${lengthUnits.split(",").join("|")})`;\nvar lengthRegExp = new RegExp(`^[+-]?[0-9]*.?[0-9]+(?:[eE][+-]?[0-9]+)?${lengthUnitsPattern}$`);\nvar isCssUnit = (v) => typeof v === "string" && lengthRegExp.test(v);\n\n// src/is-css-var.ts\nvar isCssVar = (v) => typeof v === "string" && /^var\\(--.+\\)$/.test(v);\n\n// src/pattern-fns.ts\nvar patternFns = {\n  map: mapObject,\n  isCssFunction,\n  isCssVar,\n  isCssUnit\n};\nvar getPatternStyles = (pattern, styles) => {\n  if (!pattern.defaultValues)\n    return styles;\n  const defaults = typeof pattern.defaultValues === "function" ? pattern.defaultValues(styles) : pattern.defaultValues;\n  return Object.assign({}, defaults, compact(styles));\n};\n\n// src/slot.ts\nvar getSlotRecipes = (recipe = {}) => {\n  const init = (slot) => ({\n    className: [recipe.className, slot].filter(Boolean).join("__"),\n    base: recipe.base?.[slot] ?? {},\n    variants: {},\n    defaultVariants: recipe.defaultVariants ?? {},\n    compoundVariants: recipe.compoundVariants ? getSlotCompoundVariant(recipe.compoundVariants, slot) : []\n  });\n  const slots = recipe.slots ?? [];\n  const recipeParts = slots.map((slot) => [slot, init(slot)]);\n  for (const [variantsKey, variantsSpec] of Object.entries(recipe.variants ?? {})) {\n    for (const [variantKey, variantSpec] of Object.entries(variantsSpec)) {\n      recipeParts.forEach(([slot, slotRecipe]) => {\n        slotRecipe.variants[variantsKey] ??= {};\n        slotRecipe.variants[variantsKey][variantKey] = variantSpec[slot] ?? {};\n      });\n    }\n  }\n  return Object.fromEntries(recipeParts);\n};\nvar getSlotCompoundVariant = (compoundVariants, slotName) => compoundVariants.filter((compoundVariant) => compoundVariant.css[slotName]).map((compoundVariant) => ({ ...compoundVariant, css: compoundVariant.css[slotName] }));\n\n// src/split-props.ts\nfunction splitProps(props, ...keys) {\n  const descriptors = Object.getOwnPropertyDescriptors(props);\n  const dKeys = Object.keys(descriptors);\n  const split = (k) => {\n    const clone = {};\n    for (let i = 0; i < k.length; i++) {\n      const key = k[i];\n      if (descriptors[key]) {\n        Object.defineProperty(clone, key, descriptors[key]);\n        delete descriptors[key];\n      }\n    }\n    return clone;\n  };\n  const fn = (key) => split(Array.isArray(key) ? key : dKeys.filter(key));\n  return keys.map(fn).concat(split(dKeys));\n}\n\n// src/uniq.ts\nvar uniq = (...items) => items.filter(Boolean).reduce((acc, item) => Array.from(/* @__PURE__ */ new Set([...acc, ...item])), []);\nexport {\n  compact,\n  createCss,\n  createMergeCss,\n  filterBaseConditions,\n  getPatternStyles,\n  getSlotCompoundVariant,\n  getSlotRecipes,\n  hypenateProperty,\n  isBaseCondition,\n  isObject,\n  mapObject,\n  memo,\n  mergeProps,\n  patternFns,\n  splitProps,\n  toHash,\n  uniq,\n  walkObject,\n  withoutSpace\n};\n'
 };
 
 // src/artifacts/generated/normalize-html.mjs.json
@@ -474,7 +474,7 @@ function generateIsValidProp(ctx) {
     content = ctx.file.import("memo", "../helpers") + "\n" + content;
   }
   content = ctx.file.import("splitProps", "../helpers") + "\n" + content;
-  content += `export const splitCssProps = /* @__PURE__ */ (props) =>  splitProps(props, isCssProperty)`;
+  content += `export const splitCssProps = (props) =>  splitProps(props, isCssProperty)`;
   return {
     js: content,
     dts: import_outdent8.outdent`
@@ -545,13 +545,13 @@ function generatePattern(ctx, filters) {
   const details = ctx.patterns.filterDetails(filters);
   return details.map((pattern) => {
     const { baseName, config, dashName, upperName, styleFnName, blocklistType } = pattern;
-    const { properties, transform, strict, description } = config;
-    const transformFn = (0, import_javascript_stringify.stringify)({ transform }) ?? "";
-    const helperImports = ["mapObject"];
-    if (transformFn.includes("__spreadValues")) {
+    const { properties, transform, strict, description, defaultValues } = config;
+    const patternConfigFn = (0, import_javascript_stringify.stringify)((0, import_shared.compact)({ transform, defaultValues })) ?? "";
+    const helperImports = ["getPatternStyles, patternFns"];
+    if (patternConfigFn.includes("__spreadValues")) {
       helperImports.push("__spreadValues");
     }
-    if (transformFn.includes("__objRest")) {
+    if (patternConfigFn.includes("__objRest")) {
       helperImports.push("__objRest");
     }
     return {
@@ -599,10 +599,14 @@ function generatePattern(ctx, filters) {
     ${ctx.file.import(helperImports.join(", "), "../helpers")}
     ${ctx.file.import("css", "../css/index")}
 
-    const ${baseName}Config = ${transformFn.replace(`{transform`, `{
-transform`)}
+    const ${baseName}Config = ${patternConfigFn.replace(`{transform`, `{
+transform`).replace(`,defaultValues`, `,
+defaultValues`)}
 
-    export const ${styleFnName} = (styles = {}) => ${baseName}Config.transform(styles, { map: mapObject })
+    export const ${styleFnName} = (styles = {}) => {
+      const _styles = getPatternStyles(${baseName}Config, styles)
+      return ${baseName}Config.transform(_styles, patternFns)
+    }
 
     export const ${baseName} = (styles) => css(${styleFnName}(styles))
     ${baseName}.raw = ${styleFnName}
@@ -2728,7 +2732,7 @@ var parts_d_ts_default = {
 
 // src/artifacts/generated/pattern.d.ts.json
 var pattern_d_ts_default = {
-  content: "import type { CssProperty, SystemStyleObject } from './system-types'\nimport type { TokenCategory } from '../tokens'\n\ntype Primitive = string | number | boolean | null | undefined\ntype LiteralUnion<T, K extends Primitive = string> = T | (K & Record<never, never>)\n\nexport type PatternProperty =\n  | { type: 'property'; value: CssProperty }\n  | { type: 'enum'; value: string[] }\n  | { type: 'token'; value: TokenCategory; property?: CssProperty }\n  | { type: 'string' | 'boolean' | 'number' }\n\nexport interface PatternHelpers {\n  map: (value: any, fn: (value: string) => string | undefined) => any\n}\n\nexport interface PatternProperties {\n  [key: string]: PatternProperty\n}\n\ntype Props<T> = Record<LiteralUnion<keyof T>, any>\n\nexport interface PatternConfig<T extends PatternProperties = PatternProperties> {\n  /**\n   * The description of the pattern. This will be used in the JSDoc comment.\n   */\n  description?: string\n  /**\n   * The JSX element rendered by the pattern\n   * @default 'div'\n   */\n  jsxElement?: string\n  /**\n   * The properties of the pattern.\n   */\n  properties?: T\n  /**\n   * The css object this pattern will generate.\n   */\n  transform?: (props: Props<T>, helpers: PatternHelpers) => SystemStyleObject\n  /**\n   * The jsx element name this pattern will generate.\n   */\n  jsxName?: string\n  /**\n   * The jsx elements to track for this pattern. Can be string or Regexp.\n   *\n   * @default capitalize(pattern.name)\n   * @example ['Button', 'Link', /Button$/]\n   */\n  jsx?: Array<string | RegExp>\n  /**\n   * Whether to only generate types for the specified properties.\n   * This will disallow css properties\n   */\n  strict?: boolean\n  /**\n   * @experimental\n   * Disallow certain css properties for this pattern\n   */\n  blocklist?: LiteralUnion<CssProperty>[]\n}\n"
+  content: "import type { CssProperty, SystemStyleObject } from './system-types'\nimport type { TokenCategory } from '../tokens'\n\ntype Primitive = string | number | boolean | null | undefined\ntype LiteralUnion<T, K extends Primitive = string> = T | (K & Record<never, never>)\n\nexport type PatternProperty =\n  | { type: 'property'; value: CssProperty }\n  | { type: 'enum'; value: string[] }\n  | { type: 'token'; value: TokenCategory; property?: CssProperty }\n  | { type: 'string' | 'boolean' | 'number' }\n\nexport interface PatternHelpers {\n  map: (value: any, fn: (value: string) => string | undefined) => any\n  isCssUnit: (value: any) => boolean\n  isCssVar: (value: any) => boolean\n  isCssFunction: (value: any) => boolean\n}\n\nexport interface PatternProperties {\n  [key: string]: PatternProperty\n}\n\ntype InferProps<T> = Record<LiteralUnion<keyof T>, any>\n\nexport type PatternDefaultValue<T> = Partial<InferProps<T>>\n\nexport type PatternDefaultValueFn<T> = (props: InferProps<T>) => PatternDefaultValue<T>\n\nexport interface PatternConfig<T extends PatternProperties = PatternProperties> {\n  /**\n   * The description of the pattern. This will be used in the JSDoc comment.\n   */\n  description?: string\n  /**\n   * The JSX element rendered by the pattern\n   * @default 'div'\n   */\n  jsxElement?: string\n  /**\n   * The properties of the pattern.\n   */\n  properties?: T\n  /**\n   * The default values of the pattern.\n   */\n  defaultValues?: PatternDefaultValue<T> | PatternDefaultValueFn<T>\n  /**\n   * The css object this pattern will generate.\n   */\n  transform?: (props: InferProps<T>, helpers: PatternHelpers) => SystemStyleObject\n  /**\n   * The jsx element name this pattern will generate.\n   */\n  jsxName?: string\n  /**\n   * The jsx elements to track for this pattern. Can be string or Regexp.\n   *\n   * @default capitalize(pattern.name)\n   * @example ['Button', 'Link', /Button$/]\n   */\n  jsx?: Array<string | RegExp>\n  /**\n   * Whether to only generate types for the specified properties.\n   * This will disallow css properties\n   */\n  strict?: boolean\n  /**\n   * @experimental\n   * Disallow certain css properties for this pattern\n   */\n  blocklist?: LiteralUnion<CssProperty>[]\n}\n"
 };
 
 // src/artifacts/generated/recipe.d.ts.json
@@ -3007,6 +3011,7 @@ var categories = [
   "spacing",
   "radii",
   "borders",
+  "borderWidths",
   "durations",
   "easings",
   "animations",
@@ -3445,7 +3450,7 @@ var getMatchingArtifacts = (ctx, filters) => {
   return entries.filter(([artifactId]) => ids.includes(artifactId)).map(([_artifactId, fn]) => fn(ctx, filters));
 };
 var transformArtifact = (ctx, artifact) => {
-  const files = (artifact?.files ?? []).filter(Boolean).map((item) => {
+  const files = (artifact?.files ?? []).filter((item) => !!item?.code).map((item) => {
     if (ctx.file.isTypeFile(item.file)) {
       return { ...item, code: `/* eslint-disable */
 ${item.code}` };
@@ -3508,7 +3513,6 @@ var generateGlobalCss = (ctx, sheet) => {
     }
   });
   sheet.processGlobalCss(globalCss);
-  void ctx.hooks.callHook("generator:css", "global.css", "");
 };
 
 // src/artifacts/css/keyframe-css.ts
@@ -3519,14 +3523,16 @@ function generateKeyframeCss(ctx, sheet) {
   for (const [name, definition] of Object.entries(keyframes)) {
     result[`@keyframes ${name}`] = definition;
   }
-  const css2 = (0, import_core2.stringify)(sheet.serialize(result));
+  let css2 = (0, import_core2.stringify)(sheet.serialize(result));
+  if (ctx.hooks["cssgen:done"]) {
+    css2 = ctx.hooks["cssgen:done"]({ artifact: "keyframes", content: css2 }) ?? css2;
+  }
   sheet.layers.tokens.append(css2);
-  void ctx.hooks.callHook("generator:css", "keyframes.css", "");
 }
 
 // src/artifacts/css/parser-css.ts
 var import_logger = require("@pandacss/logger");
-var generateParserCss = (ctx, decoder, filePath) => {
+var generateParserCss = (ctx, decoder) => {
   if (!decoder)
     return "";
   const sheet = ctx.createSheet();
@@ -3534,7 +3540,6 @@ var generateParserCss = (ctx, decoder, filePath) => {
   sheet.processDecoder(decoder);
   try {
     const css2 = sheet.toCss({ minify, optimize });
-    ctx.hooks.callHook("parser:css", filePath ?? "", css2);
     return css2;
   } catch (err) {
     import_logger.logger.error("serializer:css", "Failed to serialize CSS: " + err);
@@ -3549,7 +3554,7 @@ function generateResetCss(ctx, sheet) {
   const { preflight } = ctx.config;
   const scope = (0, import_shared4.isObject)(preflight) ? preflight.scope : void 0;
   const selector = scope ? `${scope} ` : "";
-  const output = css`
+  let output = css`
   ${selector}* {
     margin: 0;
     padding: 0;
@@ -3762,9 +3767,15 @@ function generateResetCss(ctx, sheet) {
   ${selector}:-moz-focusring {
     outline: auto;
   }
+
+  ${selector}[hidden] {
+    display: none !important;
+  }
 `;
+  if (ctx.hooks["cssgen:done"]) {
+    output = ctx.hooks["cssgen:done"]({ artifact: "reset", content: output }) ?? output;
+  }
   sheet.layers.reset.append(output);
-  void ctx.hooks.callHook("generator:css", "reset.css", "");
 }
 
 // src/artifacts/css/static-css.ts
@@ -3773,9 +3784,11 @@ var generateStaticCss = (ctx, sheet) => {
   const engine = staticCss.process(ctx.config.staticCss ?? {}, sheet);
   if (!sheet) {
     const { optimize = true, minify } = config;
-    const output = engine.sheet.toCss({ optimize, minify });
-    void ctx.hooks.callHook("generator:css", "static.css", output);
-    return output;
+    let css2 = engine.sheet.toCss({ optimize, minify });
+    if (ctx.hooks["cssgen:done"]) {
+      css2 = ctx.hooks["cssgen:done"]({ artifact: "static", content: css2 }) ?? css2;
+    }
+    return css2;
   }
 };
 
@@ -3813,8 +3826,10 @@ function generateTokenCss(ctx, sheet) {
   }
   let css2 = results.join("\n\n");
   css2 = "\n\n" + cleanupSelectors(css2, root);
+  if (ctx.hooks["cssgen:done"]) {
+    css2 = ctx.hooks["cssgen:done"]({ artifact: "tokens", content: css2 }) ?? css2;
+  }
   sheet.layers.tokens.append(css2);
-  void ctx.hooks.callHook("generator:css", "tokens.css", "");
 }
 function getDeepestRule(root, selectors) {
   const rule = import_postcss.default.rule({ selector: "" });
@@ -3892,15 +3907,19 @@ var Generator = class extends import_core4.Context {
     const decoder = this.decoder.collect(this.encoder);
     sheet.processDecoder(decoder);
   };
-  getParserCss = (decoder, filePath) => {
-    return generateParserCss(this, decoder, filePath);
+  getParserCss = (decoder) => {
+    return generateParserCss(this, decoder);
   };
   getCss = (stylesheet) => {
     const sheet = stylesheet ?? this.createSheet();
-    return sheet.toCss({
+    let css2 = sheet.toCss({
       optimize: true,
       minify: this.config.minify
     });
+    if (this.hooks["cssgen:done"]) {
+      css2 = this.hooks["cssgen:done"]({ artifact: "styles.css", content: css2 }) ?? css2;
+    }
+    return css2;
   };
 };
 // Annotate the CommonJS export names for ESM import in node:

package/dist/index.mjs

@@ -382,7 +382,7 @@ var astish_mjs_default = {
 
 // src/artifacts/generated/helpers.mjs.json
 var helpers_mjs_default = {
-  content: '// src/assert.ts\nfunction isObject(value) {\n  return typeof value === "object" && value != null && !Array.isArray(value);\n}\n\n// src/compact.ts\nfunction compact(value) {\n  return Object.fromEntries(Object.entries(value ?? {}).filter(([_, value2]) => value2 !== void 0));\n}\n\n// src/condition.ts\nvar isBaseCondition = (v) => v === "base";\nfunction filterBaseConditions(c) {\n  return c.slice().filter((v) => !isBaseCondition(v));\n}\n\n// src/css-important.ts\nvar importantRegex = /\\s*!(important)?/i;\nfunction isImportant(value) {\n  return typeof value === "string" ? importantRegex.test(value) : false;\n}\nfunction withoutImportant(value) {\n  return typeof value === "string" ? value.replace(importantRegex, "").trim() : value;\n}\nfunction withoutSpace(str) {\n  return typeof str === "string" ? str.replaceAll(" ", "_") : str;\n}\n\n// src/hash.ts\nfunction toChar(code) {\n  return String.fromCharCode(code + (code > 25 ? 39 : 97));\n}\nfunction toName(code) {\n  let name = "";\n  let x;\n  for (x = Math.abs(code); x > 52; x = x / 52 | 0)\n    name = toChar(x % 52) + name;\n  return toChar(x % 52) + name;\n}\nfunction toPhash(h, x) {\n  let i = x.length;\n  while (i)\n    h = h * 33 ^ x.charCodeAt(--i);\n  return h;\n}\nfunction toHash(value) {\n  return toName(toPhash(5381, value) >>> 0);\n}\n\n// src/merge-props.ts\nfunction mergeProps(...sources) {\n  const objects = sources.filter(Boolean);\n  return objects.reduce((prev, obj) => {\n    Object.keys(obj).forEach((key) => {\n      const prevValue = prev[key];\n      const value = obj[key];\n      if (isObject(prevValue) && isObject(value)) {\n        prev[key] = mergeProps(prevValue, value);\n      } else {\n        prev[key] = value;\n      }\n    });\n    return prev;\n  }, {});\n}\n\n// src/memo.ts\nvar memo = (fn) => {\n  const cache = /* @__PURE__ */ new Map();\n  const get = (...args) => {\n    const key = JSON.stringify(args);\n    if (cache.has(key)) {\n      return cache.get(key);\n    }\n    const result = fn(...args);\n    cache.set(key, result);\n    return result;\n  };\n  return get;\n};\n\n// src/walk-object.ts\nvar isNotNullish = (element) => element != null;\nfunction walkObject(target, predicate, options = {}) {\n  const { stop, getKey } = options;\n  function inner(value, path = []) {\n    if (isObject(value) || Array.isArray(value)) {\n      const result = {};\n      for (const [prop, child] of Object.entries(value)) {\n        const key = getKey?.(prop) ?? prop;\n        const childPath = [...path, key];\n        if (stop?.(value, childPath)) {\n          return predicate(value, path);\n        }\n        const next = inner(child, childPath);\n        if (isNotNullish(next)) {\n          result[key] = next;\n        }\n      }\n      return result;\n    }\n    return predicate(value, path);\n  }\n  return inner(target);\n}\nfunction mapObject(obj, fn) {\n  if (Array.isArray(obj))\n    return obj.map((value) => fn(value));\n  if (!isObject(obj))\n    return fn(obj);\n  return walkObject(obj, (value) => fn(value));\n}\n\n// src/normalize-style-object.ts\nfunction toResponsiveObject(values, breakpoints) {\n  return values.reduce((acc, current, index) => {\n    const key = breakpoints[index];\n    if (current != null) {\n      acc[key] = current;\n    }\n    return acc;\n  }, {});\n}\nfunction normalizeShorthand(styles, context) {\n  const { hasShorthand, resolveShorthand } = context.utility;\n  return walkObject(styles, (v) => v, {\n    getKey: (prop) => {\n      return hasShorthand ? resolveShorthand(prop) : prop;\n    }\n  });\n}\nfunction normalizeStyleObject(styles, context, shorthand = true) {\n  const { utility, conditions } = context;\n  const { hasShorthand, resolveShorthand } = utility;\n  return walkObject(\n    styles,\n    (value) => {\n      return Array.isArray(value) ? toResponsiveObject(value, conditions.breakpoints.keys) : value;\n    },\n    {\n      stop: (value) => Array.isArray(value),\n      getKey: shorthand ? (prop) => hasShorthand ? resolveShorthand(prop) : prop : void 0\n    }\n  );\n}\n\n// src/classname.ts\nvar fallbackCondition = {\n  shift: (v) => v,\n  finalize: (v) => v,\n  breakpoints: { keys: [] }\n};\nvar sanitize = (value) => typeof value === "string" ? value.replaceAll(/[\\n\\s]+/g, " ") : value;\nfunction createCss(context) {\n  const { utility, hash, conditions: conds = fallbackCondition } = context;\n  const formatClassName = (str) => [utility.prefix, str].filter(Boolean).join("-");\n  const hashFn = (conditions, className) => {\n    let result;\n    if (hash) {\n      const baseArray = [...conds.finalize(conditions), className];\n      result = formatClassName(toHash(baseArray.join(":")));\n    } else {\n      const baseArray = [...conds.finalize(conditions), formatClassName(className)];\n      result = baseArray.join(":");\n    }\n    return result;\n  };\n  return memo((styleObject = {}) => {\n    const normalizedObject = normalizeStyleObject(styleObject, context);\n    const classNames = /* @__PURE__ */ new Set();\n    walkObject(normalizedObject, (value, paths) => {\n      const important = isImportant(value);\n      if (value == null)\n        return;\n      const [prop, ...allConditions] = conds.shift(paths);\n      const conditions = filterBaseConditions(allConditions);\n      const transformed = utility.transform(prop, withoutImportant(sanitize(value)));\n      let className = hashFn(conditions, transformed.className);\n      if (important)\n        className = `${className}!`;\n      classNames.add(className);\n    });\n    return Array.from(classNames).join(" ");\n  });\n}\nfunction compactStyles(...styles) {\n  return styles.filter((style) => isObject(style) && Object.keys(compact(style)).length > 0);\n}\nfunction createMergeCss(context) {\n  function resolve(styles) {\n    const allStyles = compactStyles(...styles);\n    if (allStyles.length === 1)\n      return allStyles;\n    return allStyles.map((style) => normalizeShorthand(style, context));\n  }\n  function mergeCss(...styles) {\n    return mergeProps(...resolve(styles));\n  }\n  function assignCss(...styles) {\n    return Object.assign({}, ...resolve(styles));\n  }\n  return { mergeCss: memo(mergeCss), assignCss };\n}\n\n// src/hypenate-property.ts\nvar wordRegex = /([A-Z])/g;\nvar msRegex = /^ms-/;\nvar hypenateProperty = memo((property) => {\n  if (property.startsWith("--"))\n    return property;\n  return property.replace(wordRegex, "-$1").replace(msRegex, "-ms-").toLowerCase();\n});\n\n// src/slot.ts\nvar getSlotRecipes = (recipe = {}) => {\n  const init = (slot) => ({\n    className: [recipe.className, slot].filter(Boolean).join("__"),\n    base: recipe.base?.[slot] ?? {},\n    variants: {},\n    defaultVariants: recipe.defaultVariants ?? {},\n    compoundVariants: recipe.compoundVariants ? getSlotCompoundVariant(recipe.compoundVariants, slot) : []\n  });\n  const slots = recipe.slots ?? [];\n  const recipeParts = slots.map((slot) => [slot, init(slot)]);\n  for (const [variantsKey, variantsSpec] of Object.entries(recipe.variants ?? {})) {\n    for (const [variantKey, variantSpec] of Object.entries(variantsSpec)) {\n      recipeParts.forEach(([slot, slotRecipe]) => {\n        slotRecipe.variants[variantsKey] ??= {};\n        slotRecipe.variants[variantsKey][variantKey] = variantSpec[slot] ?? {};\n      });\n    }\n  }\n  return Object.fromEntries(recipeParts);\n};\nvar getSlotCompoundVariant = (compoundVariants, slotName) => compoundVariants.filter((compoundVariant) => compoundVariant.css[slotName]).map((compoundVariant) => ({ ...compoundVariant, css: compoundVariant.css[slotName] }));\n\n// src/split-props.ts\nfunction splitProps(props, ...keys) {\n  const descriptors = Object.getOwnPropertyDescriptors(props);\n  const dKeys = Object.keys(descriptors);\n  const split = (k) => {\n    const clone = {};\n    for (let i = 0; i < k.length; i++) {\n      const key = k[i];\n      if (descriptors[key]) {\n        Object.defineProperty(clone, key, descriptors[key]);\n        delete descriptors[key];\n      }\n    }\n    return clone;\n  };\n  const fn = (key) => split(Array.isArray(key) ? key : dKeys.filter(key));\n  return keys.map(fn).concat(split(dKeys));\n}\n\n// src/uniq.ts\nvar uniq = (...items) => items.filter(Boolean).reduce((acc, item) => Array.from(/* @__PURE__ */ new Set([...acc, ...item])), []);\nexport {\n  compact,\n  createCss,\n  createMergeCss,\n  filterBaseConditions,\n  getSlotCompoundVariant,\n  getSlotRecipes,\n  hypenateProperty,\n  isBaseCondition,\n  isObject,\n  mapObject,\n  memo,\n  mergeProps,\n  splitProps,\n  toHash,\n  uniq,\n  walkObject,\n  withoutSpace\n};\n'
+  content: '// src/assert.ts\nfunction isObject(value) {\n  return typeof value === "object" && value != null && !Array.isArray(value);\n}\n\n// src/compact.ts\nfunction compact(value) {\n  return Object.fromEntries(Object.entries(value ?? {}).filter(([_, value2]) => value2 !== void 0));\n}\n\n// src/condition.ts\nvar isBaseCondition = (v) => v === "base";\nfunction filterBaseConditions(c) {\n  return c.slice().filter((v) => !isBaseCondition(v));\n}\n\n// src/important.ts\nvar importantRegex = /\\s*!(important)?/i;\nfunction isImportant(value) {\n  return typeof value === "string" ? importantRegex.test(value) : false;\n}\nfunction withoutImportant(value) {\n  return typeof value === "string" ? value.replace(importantRegex, "").trim() : value;\n}\nfunction withoutSpace(str) {\n  return typeof str === "string" ? str.replaceAll(" ", "_") : str;\n}\n\n// src/hash.ts\nfunction toChar(code) {\n  return String.fromCharCode(code + (code > 25 ? 39 : 97));\n}\nfunction toName(code) {\n  let name = "";\n  let x;\n  for (x = Math.abs(code); x > 52; x = x / 52 | 0)\n    name = toChar(x % 52) + name;\n  return toChar(x % 52) + name;\n}\nfunction toPhash(h, x) {\n  let i = x.length;\n  while (i)\n    h = h * 33 ^ x.charCodeAt(--i);\n  return h;\n}\nfunction toHash(value) {\n  return toName(toPhash(5381, value) >>> 0);\n}\n\n// src/merge-props.ts\nfunction mergeProps(...sources) {\n  const objects = sources.filter(Boolean);\n  return objects.reduce((prev, obj) => {\n    Object.keys(obj).forEach((key) => {\n      const prevValue = prev[key];\n      const value = obj[key];\n      if (isObject(prevValue) && isObject(value)) {\n        prev[key] = mergeProps(prevValue, value);\n      } else {\n        prev[key] = value;\n      }\n    });\n    return prev;\n  }, {});\n}\n\n// src/memo.ts\nvar memo = (fn) => {\n  const cache = /* @__PURE__ */ new Map();\n  const get = (...args) => {\n    const key = JSON.stringify(args);\n    if (cache.has(key)) {\n      return cache.get(key);\n    }\n    const result = fn(...args);\n    cache.set(key, result);\n    return result;\n  };\n  return get;\n};\n\n// src/walk-object.ts\nvar isNotNullish = (element) => element != null;\nfunction walkObject(target, predicate, options = {}) {\n  const { stop, getKey } = options;\n  function inner(value, path = []) {\n    if (isObject(value) || Array.isArray(value)) {\n      const result = {};\n      for (const [prop, child] of Object.entries(value)) {\n        const key = getKey?.(prop) ?? prop;\n        const childPath = [...path, key];\n        if (stop?.(value, childPath)) {\n          return predicate(value, path);\n        }\n        const next = inner(child, childPath);\n        if (isNotNullish(next)) {\n          result[key] = next;\n        }\n      }\n      return result;\n    }\n    return predicate(value, path);\n  }\n  return inner(target);\n}\nfunction mapObject(obj, fn) {\n  if (Array.isArray(obj))\n    return obj.map((value) => fn(value));\n  if (!isObject(obj))\n    return fn(obj);\n  return walkObject(obj, (value) => fn(value));\n}\n\n// src/normalize-style-object.ts\nfunction toResponsiveObject(values, breakpoints) {\n  return values.reduce((acc, current, index) => {\n    const key = breakpoints[index];\n    if (current != null) {\n      acc[key] = current;\n    }\n    return acc;\n  }, {});\n}\nfunction normalizeShorthand(styles, context) {\n  const { hasShorthand, resolveShorthand } = context.utility;\n  return walkObject(styles, (v) => v, {\n    getKey: (prop) => {\n      return hasShorthand ? resolveShorthand(prop) : prop;\n    }\n  });\n}\nfunction normalizeStyleObject(styles, context, shorthand = true) {\n  const { utility, conditions } = context;\n  const { hasShorthand, resolveShorthand } = utility;\n  return walkObject(\n    styles,\n    (value) => {\n      return Array.isArray(value) ? toResponsiveObject(value, conditions.breakpoints.keys) : value;\n    },\n    {\n      stop: (value) => Array.isArray(value),\n      getKey: shorthand ? (prop) => hasShorthand ? resolveShorthand(prop) : prop : void 0\n    }\n  );\n}\n\n// src/classname.ts\nvar fallbackCondition = {\n  shift: (v) => v,\n  finalize: (v) => v,\n  breakpoints: { keys: [] }\n};\nvar sanitize = (value) => typeof value === "string" ? value.replaceAll(/[\\n\\s]+/g, " ") : value;\nfunction createCss(context) {\n  const { utility, hash, conditions: conds = fallbackCondition } = context;\n  const formatClassName = (str) => [utility.prefix, str].filter(Boolean).join("-");\n  const hashFn = (conditions, className) => {\n    let result;\n    if (hash) {\n      const baseArray = [...conds.finalize(conditions), className];\n      result = formatClassName(toHash(baseArray.join(":")));\n    } else {\n      const baseArray = [...conds.finalize(conditions), formatClassName(className)];\n      result = baseArray.join(":");\n    }\n    return result;\n  };\n  return memo((styleObject = {}) => {\n    const normalizedObject = normalizeStyleObject(styleObject, context);\n    const classNames = /* @__PURE__ */ new Set();\n    walkObject(normalizedObject, (value, paths) => {\n      const important = isImportant(value);\n      if (value == null)\n        return;\n      const [prop, ...allConditions] = conds.shift(paths);\n      const conditions = filterBaseConditions(allConditions);\n      const transformed = utility.transform(prop, withoutImportant(sanitize(value)));\n      let className = hashFn(conditions, transformed.className);\n      if (important)\n        className = `${className}!`;\n      classNames.add(className);\n    });\n    return Array.from(classNames).join(" ");\n  });\n}\nfunction compactStyles(...styles) {\n  return styles.filter((style) => isObject(style) && Object.keys(compact(style)).length > 0);\n}\nfunction createMergeCss(context) {\n  function resolve(styles) {\n    const allStyles = compactStyles(...styles);\n    if (allStyles.length === 1)\n      return allStyles;\n    return allStyles.map((style) => normalizeShorthand(style, context));\n  }\n  function mergeCss(...styles) {\n    return mergeProps(...resolve(styles));\n  }\n  function assignCss(...styles) {\n    return Object.assign({}, ...resolve(styles));\n  }\n  return { mergeCss: memo(mergeCss), assignCss };\n}\n\n// src/hypenate-property.ts\nvar wordRegex = /([A-Z])/g;\nvar msRegex = /^ms-/;\nvar hypenateProperty = memo((property) => {\n  if (property.startsWith("--"))\n    return property;\n  return property.replace(wordRegex, "-$1").replace(msRegex, "-ms-").toLowerCase();\n});\n\n// src/is-css-function.ts\nvar fns = ["min", "max", "clamp", "calc"];\nvar fnRegExp = new RegExp(`^(${fns.join("|")})\\\\(.*\\\\)`);\nvar isCssFunction = (v) => typeof v === "string" && fnRegExp.test(v);\n\n// src/is-css-unit.ts\nvar lengthUnits = "cm,mm,Q,in,pc,pt,px,em,ex,ch,rem,lh,rlh,vw,vh,vmin,vmax,vb,vi,svw,svh,lvw,lvh,dvw,dvh,cqw,cqh,cqi,cqb,cqmin,cqmax,%";\nvar lengthUnitsPattern = `(?:${lengthUnits.split(",").join("|")})`;\nvar lengthRegExp = new RegExp(`^[+-]?[0-9]*.?[0-9]+(?:[eE][+-]?[0-9]+)?${lengthUnitsPattern}$`);\nvar isCssUnit = (v) => typeof v === "string" && lengthRegExp.test(v);\n\n// src/is-css-var.ts\nvar isCssVar = (v) => typeof v === "string" && /^var\\(--.+\\)$/.test(v);\n\n// src/pattern-fns.ts\nvar patternFns = {\n  map: mapObject,\n  isCssFunction,\n  isCssVar,\n  isCssUnit\n};\nvar getPatternStyles = (pattern, styles) => {\n  if (!pattern.defaultValues)\n    return styles;\n  const defaults = typeof pattern.defaultValues === "function" ? pattern.defaultValues(styles) : pattern.defaultValues;\n  return Object.assign({}, defaults, compact(styles));\n};\n\n// src/slot.ts\nvar getSlotRecipes = (recipe = {}) => {\n  const init = (slot) => ({\n    className: [recipe.className, slot].filter(Boolean).join("__"),\n    base: recipe.base?.[slot] ?? {},\n    variants: {},\n    defaultVariants: recipe.defaultVariants ?? {},\n    compoundVariants: recipe.compoundVariants ? getSlotCompoundVariant(recipe.compoundVariants, slot) : []\n  });\n  const slots = recipe.slots ?? [];\n  const recipeParts = slots.map((slot) => [slot, init(slot)]);\n  for (const [variantsKey, variantsSpec] of Object.entries(recipe.variants ?? {})) {\n    for (const [variantKey, variantSpec] of Object.entries(variantsSpec)) {\n      recipeParts.forEach(([slot, slotRecipe]) => {\n        slotRecipe.variants[variantsKey] ??= {};\n        slotRecipe.variants[variantsKey][variantKey] = variantSpec[slot] ?? {};\n      });\n    }\n  }\n  return Object.fromEntries(recipeParts);\n};\nvar getSlotCompoundVariant = (compoundVariants, slotName) => compoundVariants.filter((compoundVariant) => compoundVariant.css[slotName]).map((compoundVariant) => ({ ...compoundVariant, css: compoundVariant.css[slotName] }));\n\n// src/split-props.ts\nfunction splitProps(props, ...keys) {\n  const descriptors = Object.getOwnPropertyDescriptors(props);\n  const dKeys = Object.keys(descriptors);\n  const split = (k) => {\n    const clone = {};\n    for (let i = 0; i < k.length; i++) {\n      const key = k[i];\n      if (descriptors[key]) {\n        Object.defineProperty(clone, key, descriptors[key]);\n        delete descriptors[key];\n      }\n    }\n    return clone;\n  };\n  const fn = (key) => split(Array.isArray(key) ? key : dKeys.filter(key));\n  return keys.map(fn).concat(split(dKeys));\n}\n\n// src/uniq.ts\nvar uniq = (...items) => items.filter(Boolean).reduce((acc, item) => Array.from(/* @__PURE__ */ new Set([...acc, ...item])), []);\nexport {\n  compact,\n  createCss,\n  createMergeCss,\n  filterBaseConditions,\n  getPatternStyles,\n  getSlotCompoundVariant,\n  getSlotRecipes,\n  hypenateProperty,\n  isBaseCondition,\n  isObject,\n  mapObject,\n  memo,\n  mergeProps,\n  patternFns,\n  splitProps,\n  toHash,\n  uniq,\n  walkObject,\n  withoutSpace\n};\n'
 };
 
 // src/artifacts/generated/normalize-html.mjs.json
@@ -438,7 +438,7 @@ function generateIsValidProp(ctx) {
     content = ctx.file.import("memo", "../helpers") + "\n" + content;
   }
   content = ctx.file.import("splitProps", "../helpers") + "\n" + content;
-  content += `export const splitCssProps = /* @__PURE__ */ (props) =>  splitProps(props, isCssProperty)`;
+  content += `export const splitCssProps = (props) =>  splitProps(props, isCssProperty)`;
   return {
     js: content,
     dts: outdent8`
@@ -499,7 +499,7 @@ function generatedJsxHelpers(ctx) {
 }
 
 // src/artifacts/js/pattern.ts
-import { unionType } from "@pandacss/shared";
+import { compact, unionType } from "@pandacss/shared";
 import { stringify } from "javascript-stringify";
 import { outdent as outdent10 } from "outdent";
 import { match as match3 } from "ts-pattern";
@@ -509,13 +509,13 @@ function generatePattern(ctx, filters) {
   const details = ctx.patterns.filterDetails(filters);
   return details.map((pattern) => {
     const { baseName, config, dashName, upperName, styleFnName, blocklistType } = pattern;
-    const { properties, transform, strict, description } = config;
-    const transformFn = stringify({ transform }) ?? "";
-    const helperImports = ["mapObject"];
-    if (transformFn.includes("__spreadValues")) {
+    const { properties, transform, strict, description, defaultValues } = config;
+    const patternConfigFn = stringify(compact({ transform, defaultValues })) ?? "";
+    const helperImports = ["getPatternStyles, patternFns"];
+    if (patternConfigFn.includes("__spreadValues")) {
       helperImports.push("__spreadValues");
     }
-    if (transformFn.includes("__objRest")) {
+    if (patternConfigFn.includes("__objRest")) {
       helperImports.push("__objRest");
     }
     return {
@@ -563,10 +563,14 @@ function generatePattern(ctx, filters) {
     ${ctx.file.import(helperImports.join(", "), "../helpers")}
     ${ctx.file.import("css", "../css/index")}
 
-    const ${baseName}Config = ${transformFn.replace(`{transform`, `{
-transform`)}
+    const ${baseName}Config = ${patternConfigFn.replace(`{transform`, `{
+transform`).replace(`,defaultValues`, `,
+defaultValues`)}
 
-    export const ${styleFnName} = (styles = {}) => ${baseName}Config.transform(styles, { map: mapObject })
+    export const ${styleFnName} = (styles = {}) => {
+      const _styles = getPatternStyles(${baseName}Config, styles)
+      return ${baseName}Config.transform(_styles, patternFns)
+    }
 
     export const ${baseName} = (styles) => css(${styleFnName}(styles))
     ${baseName}.raw = ${styleFnName}
@@ -2692,7 +2696,7 @@ var parts_d_ts_default = {
 
 // src/artifacts/generated/pattern.d.ts.json
 var pattern_d_ts_default = {
-  content: "import type { CssProperty, SystemStyleObject } from './system-types'\nimport type { TokenCategory } from '../tokens'\n\ntype Primitive = string | number | boolean | null | undefined\ntype LiteralUnion<T, K extends Primitive = string> = T | (K & Record<never, never>)\n\nexport type PatternProperty =\n  | { type: 'property'; value: CssProperty }\n  | { type: 'enum'; value: string[] }\n  | { type: 'token'; value: TokenCategory; property?: CssProperty }\n  | { type: 'string' | 'boolean' | 'number' }\n\nexport interface PatternHelpers {\n  map: (value: any, fn: (value: string) => string | undefined) => any\n}\n\nexport interface PatternProperties {\n  [key: string]: PatternProperty\n}\n\ntype Props<T> = Record<LiteralUnion<keyof T>, any>\n\nexport interface PatternConfig<T extends PatternProperties = PatternProperties> {\n  /**\n   * The description of the pattern. This will be used in the JSDoc comment.\n   */\n  description?: string\n  /**\n   * The JSX element rendered by the pattern\n   * @default 'div'\n   */\n  jsxElement?: string\n  /**\n   * The properties of the pattern.\n   */\n  properties?: T\n  /**\n   * The css object this pattern will generate.\n   */\n  transform?: (props: Props<T>, helpers: PatternHelpers) => SystemStyleObject\n  /**\n   * The jsx element name this pattern will generate.\n   */\n  jsxName?: string\n  /**\n   * The jsx elements to track for this pattern. Can be string or Regexp.\n   *\n   * @default capitalize(pattern.name)\n   * @example ['Button', 'Link', /Button$/]\n   */\n  jsx?: Array<string | RegExp>\n  /**\n   * Whether to only generate types for the specified properties.\n   * This will disallow css properties\n   */\n  strict?: boolean\n  /**\n   * @experimental\n   * Disallow certain css properties for this pattern\n   */\n  blocklist?: LiteralUnion<CssProperty>[]\n}\n"
+  content: "import type { CssProperty, SystemStyleObject } from './system-types'\nimport type { TokenCategory } from '../tokens'\n\ntype Primitive = string | number | boolean | null | undefined\ntype LiteralUnion<T, K extends Primitive = string> = T | (K & Record<never, never>)\n\nexport type PatternProperty =\n  | { type: 'property'; value: CssProperty }\n  | { type: 'enum'; value: string[] }\n  | { type: 'token'; value: TokenCategory; property?: CssProperty }\n  | { type: 'string' | 'boolean' | 'number' }\n\nexport interface PatternHelpers {\n  map: (value: any, fn: (value: string) => string | undefined) => any\n  isCssUnit: (value: any) => boolean\n  isCssVar: (value: any) => boolean\n  isCssFunction: (value: any) => boolean\n}\n\nexport interface PatternProperties {\n  [key: string]: PatternProperty\n}\n\ntype InferProps<T> = Record<LiteralUnion<keyof T>, any>\n\nexport type PatternDefaultValue<T> = Partial<InferProps<T>>\n\nexport type PatternDefaultValueFn<T> = (props: InferProps<T>) => PatternDefaultValue<T>\n\nexport interface PatternConfig<T extends PatternProperties = PatternProperties> {\n  /**\n   * The description of the pattern. This will be used in the JSDoc comment.\n   */\n  description?: string\n  /**\n   * The JSX element rendered by the pattern\n   * @default 'div'\n   */\n  jsxElement?: string\n  /**\n   * The properties of the pattern.\n   */\n  properties?: T\n  /**\n   * The default values of the pattern.\n   */\n  defaultValues?: PatternDefaultValue<T> | PatternDefaultValueFn<T>\n  /**\n   * The css object this pattern will generate.\n   */\n  transform?: (props: InferProps<T>, helpers: PatternHelpers) => SystemStyleObject\n  /**\n   * The jsx element name this pattern will generate.\n   */\n  jsxName?: string\n  /**\n   * The jsx elements to track for this pattern. Can be string or Regexp.\n   *\n   * @default capitalize(pattern.name)\n   * @example ['Button', 'Link', /Button$/]\n   */\n  jsx?: Array<string | RegExp>\n  /**\n   * Whether to only generate types for the specified properties.\n   * This will disallow css properties\n   */\n  strict?: boolean\n  /**\n   * @experimental\n   * Disallow certain css properties for this pattern\n   */\n  blocklist?: LiteralUnion<CssProperty>[]\n}\n"
 };
 
 // src/artifacts/generated/recipe.d.ts.json
@@ -2971,6 +2975,7 @@ var categories = [
   "spacing",
   "radii",
   "borders",
+  "borderWidths",
   "durations",
   "easings",
   "animations",
@@ -3409,7 +3414,7 @@ var getMatchingArtifacts = (ctx, filters) => {
   return entries.filter(([artifactId]) => ids.includes(artifactId)).map(([_artifactId, fn]) => fn(ctx, filters));
 };
 var transformArtifact = (ctx, artifact) => {
-  const files = (artifact?.files ?? []).filter(Boolean).map((item) => {
+  const files = (artifact?.files ?? []).filter((item) => !!item?.code).map((item) => {
     if (ctx.file.isTypeFile(item.file)) {
       return { ...item, code: `/* eslint-disable */
 ${item.code}` };
@@ -3472,7 +3477,6 @@ var generateGlobalCss = (ctx, sheet) => {
     }
   });
   sheet.processGlobalCss(globalCss);
-  void ctx.hooks.callHook("generator:css", "global.css", "");
 };
 
 // src/artifacts/css/keyframe-css.ts
@@ -3483,14 +3487,16 @@ function generateKeyframeCss(ctx, sheet) {
   for (const [name, definition] of Object.entries(keyframes)) {
     result[`@keyframes ${name}`] = definition;
   }
-  const css2 = stringify3(sheet.serialize(result));
+  let css2 = stringify3(sheet.serialize(result));
+  if (ctx.hooks["cssgen:done"]) {
+    css2 = ctx.hooks["cssgen:done"]({ artifact: "keyframes", content: css2 }) ?? css2;
+  }
   sheet.layers.tokens.append(css2);
-  void ctx.hooks.callHook("generator:css", "keyframes.css", "");
 }
 
 // src/artifacts/css/parser-css.ts
 import { logger } from "@pandacss/logger";
-var generateParserCss = (ctx, decoder, filePath) => {
+var generateParserCss = (ctx, decoder) => {
   if (!decoder)
     return "";
   const sheet = ctx.createSheet();
@@ -3498,7 +3504,6 @@ var generateParserCss = (ctx, decoder, filePath) => {
   sheet.processDecoder(decoder);
   try {
     const css2 = sheet.toCss({ minify, optimize });
-    ctx.hooks.callHook("parser:css", filePath ?? "", css2);
     return css2;
   } catch (err) {
     logger.error("serializer:css", "Failed to serialize CSS: " + err);
@@ -3513,7 +3518,7 @@ function generateResetCss(ctx, sheet) {
   const { preflight } = ctx.config;
   const scope = isObject(preflight) ? preflight.scope : void 0;
   const selector = scope ? `${scope} ` : "";
-  const output = css`
+  let output = css`
   ${selector}* {
     margin: 0;
     padding: 0;
@@ -3726,9 +3731,15 @@ function generateResetCss(ctx, sheet) {
   ${selector}:-moz-focusring {
     outline: auto;
   }
+
+  ${selector}[hidden] {
+    display: none !important;
+  }
 `;
+  if (ctx.hooks["cssgen:done"]) {
+    output = ctx.hooks["cssgen:done"]({ artifact: "reset", content: output }) ?? output;
+  }
   sheet.layers.reset.append(output);
-  void ctx.hooks.callHook("generator:css", "reset.css", "");
 }
 
 // src/artifacts/css/static-css.ts
@@ -3737,9 +3748,11 @@ var generateStaticCss = (ctx, sheet) => {
   const engine = staticCss.process(ctx.config.staticCss ?? {}, sheet);
   if (!sheet) {
     const { optimize = true, minify } = config;
-    const output = engine.sheet.toCss({ optimize, minify });
-    void ctx.hooks.callHook("generator:css", "static.css", output);
-    return output;
+    let css2 = engine.sheet.toCss({ optimize, minify });
+    if (ctx.hooks["cssgen:done"]) {
+      css2 = ctx.hooks["cssgen:done"]({ artifact: "static", content: css2 }) ?? css2;
+    }
+    return css2;
   }
 };
 
@@ -3777,8 +3790,10 @@ function generateTokenCss(ctx, sheet) {
   }
   let css2 = results.join("\n\n");
   css2 = "\n\n" + cleanupSelectors(css2, root);
+  if (ctx.hooks["cssgen:done"]) {
+    css2 = ctx.hooks["cssgen:done"]({ artifact: "tokens", content: css2 }) ?? css2;
+  }
   sheet.layers.tokens.append(css2);
-  void ctx.hooks.callHook("generator:css", "tokens.css", "");
 }
 function getDeepestRule(root, selectors) {
   const rule = postcss.rule({ selector: "" });
@@ -3856,15 +3871,19 @@ var Generator = class extends Context2 {
     const decoder = this.decoder.collect(this.encoder);
     sheet.processDecoder(decoder);
   };
-  getParserCss = (decoder, filePath) => {
-    return generateParserCss(this, decoder, filePath);
+  getParserCss = (decoder) => {
+    return generateParserCss(this, decoder);
   };
   getCss = (stylesheet) => {
     const sheet = stylesheet ?? this.createSheet();
-    return sheet.toCss({
+    let css2 = sheet.toCss({
       optimize: true,
       minify: this.config.minify
     });
+    if (this.hooks["cssgen:done"]) {
+      css2 = this.hooks["cssgen:done"]({ artifact: "styles.css", content: css2 }) ?? css2;
+    }
+    return css2;
   };
 };
 export {

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@pandacss/generator",
-  "version": "0.27.3",
+  "version": "0.29.0",
   "description": "The css generator for css panda",
   "main": "dist/index.js",
   "module": "dist/index.mjs",
@@ -37,16 +37,15 @@
     "pluralize": "8.0.0",
     "postcss": "^8.4.31",
     "ts-pattern": "5.0.5",
-    "@pandacss/core": "0.27.3",
-    "@pandacss/is-valid-prop": "^0.27.3",
-    "@pandacss/logger": "0.27.3",
-    "@pandacss/shared": "0.27.3",
-    "@pandacss/token-dictionary": "0.27.3",
-    "@pandacss/types": "0.27.3"
+    "@pandacss/core": "0.29.0",
+    "@pandacss/is-valid-prop": "^0.29.0",
+    "@pandacss/logger": "0.29.0",
+    "@pandacss/shared": "0.29.0",
+    "@pandacss/token-dictionary": "0.29.0",
+    "@pandacss/types": "0.29.0"
   },
   "devDependencies": {
-    "@types/pluralize": "0.0.33",
-    "hookable": "5.5.3"
+    "@types/pluralize": "0.0.33"
   },
   "scripts": {
     "build": "tsup src/index.ts --format=esm,cjs --dts",