@pandacss/studio 0.37.1 → 0.38.0

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@pandacss/studio",
-  "version": "0.37.1",
+  "version": "0.38.0",
   "description": "The automated token documentation for Panda CSS",
   "main": "dist/studio.js",
   "module": "dist/studio.mjs",
@@ -47,13 +47,13 @@
     "astro": "4.4.0",
     "react": "18.2.0",
     "react-dom": "18.2.0",
-    "vite": "5.1.3",
-    "@pandacss/config": "0.37.1",
-    "@pandacss/logger": "0.37.1",
-    "@pandacss/shared": "0.37.1",
-    "@pandacss/token-dictionary": "0.37.1",
-    "@pandacss/types": "0.37.1",
-    "@pandacss/astro-plugin-studio": "0.37.1"
+    "vite": "5.1.7",
+    "@pandacss/config": "0.38.0",
+    "@pandacss/logger": "0.38.0",
+    "@pandacss/shared": "0.38.0",
+    "@pandacss/token-dictionary": "0.38.0",
+    "@pandacss/types": "0.38.0",
+    "@pandacss/astro-plugin-studio": "0.38.0"
   },
   "devDependencies": {
     "@types/react": "18.2.55",

package/styled-system/css/sva.mjs

@@ -1,4 +1,4 @@
-import { getSlotRecipes, memo, splitProps } from '../helpers.mjs';
+import { compact, getSlotRecipes, memo, splitProps } from '../helpers.mjs';
 import { cva } from './cva.mjs';
 import { cx } from './cx.mjs';
 
@@ -6,6 +6,7 @@ const slotClass = (className, slot) => className + '__' + slot
 
 export function sva(config) {
   const slots = Object.entries(getSlotRecipes(config)).map(([slot, slotCva]) => [slot, cva(slotCva)])
+  const defaultVariants = config.defaultVariants ?? {}
 
   function svaFn(props) {
     const result = slots.map(([slot, cvaFn]) => [slot, cx(cvaFn(props), config.className && slotClass(config.className, slot))])
@@ -23,6 +24,7 @@ export function sva(config) {
   function splitVariantProps(props) {
     return splitProps(props, variantKeys);
   }
+  const getVariantProps = (variants) => ({ ...(defaultVariants || {}), ...compact(variants) })
 
   const variantMap = Object.fromEntries(
     Object.entries(variants).map(([key, value]) => [key, Object.keys(value)])
@@ -34,5 +36,6 @@ export function sva(config) {
     variantMap,
     variantKeys,
     splitVariantProps,
+    getVariantProps,
   })
 }

package/styled-system/jsx/factory.mjs

@@ -31,13 +31,13 @@ function styledFn(Dynamic, configOrCva = {}, options = {}) {
     function recipeClass() {
       const { css: cssStyles, ...propStyles } = styleProps
       const compoundVariantStyles = __cvaFn__.__getCompoundVariantCss__?.(variantProps)
-      return cx(__cvaFn__(variantProps, false), css(compoundVariantStyles, propStyles, cssStyles), combinedProps.className)
+      return cx(__cvaFn__(variantProps, false), css(compoundVariantStyles, propStyles, ...(Array.isArray(cssStyles) ? cssStyles : [cssStyles])), combinedProps.className)
     }
 
     function cvaClass() {
       const { css: cssStyles, ...propStyles } = styleProps
       const cvaStyles = __cvaFn__.raw(variantProps)
-      return cx(css(cvaStyles, propStyles, cssStyles), combinedProps.className)
+      return cx(css(cvaStyles, propStyles, ...(Array.isArray(cssStyles) ? cssStyles : [cssStyles])), combinedProps.className)
     }
 
     const classes = configOrCva.__recipe__ ? recipeClass : cvaClass

package/styled-system/types/pattern.d.ts

@@ -50,6 +50,10 @@ export interface PatternConfig<T extends PatternProperties = PatternProperties>
    * The css object this pattern will generate.
    */
   transform?: (props: InferProps<T>, helpers: PatternHelpers) => SystemStyleObject
+  /**
+   * Whether the pattern is deprecated.
+   */
+  deprecated?: boolean | string
   /**
    * The jsx element name this pattern will generate.
    */

package/styled-system/types/prop-type.d.ts

@@ -1,5 +1,5 @@
 /* eslint-disable */
-import type { Conditional } from './conditions';
+import type { ConditionalValue } from './conditions';
 import type { CssProperties } from './system-types';
 import type { Tokens } from '../tokens/index';
 
@@ -208,7 +208,7 @@ type WithColorOpacityModifier<T> = T extends string ? `${T}/${string}` : T
 type ImportantMark = "!" | "!important"
 type WhitespaceImportant = ` ${ImportantMark}`
 type Important = ImportantMark | WhitespaceImportant
-type WithImportant<T> = T extends string ? `${T}${Important}${string}` : T
+type WithImportant<T> = T extends string ? `${T}${Important}` & { __important?: true } : T;
 
 /**
  * Only relevant when using `strictTokens` or `strictPropertyValues` in your config.
@@ -226,7 +226,7 @@ type WithImportant<T> = T extends string ? `${T}${Important}${string}` : T
  * @see https://panda-css.com/docs/concepts/writing-styles#stricttokens
  * @see https://panda-css.com/docs/concepts/writing-styles#strictpropertyvalues
  */
-export type WithEscapeHatch<T> = T | `[${string}]` | (T extends string ? WithColorOpacityModifier<string> | WithImportant<T> : T)
+export type WithEscapeHatch<T> = T | `[${string}]` | WithColorOpacityModifier<T> | WithImportant<T>
 
 /**
  * Will restrict the value of properties that have predefined values to those values only.

package/styled-system/types/recipe.d.ts

@@ -64,6 +64,10 @@ export interface RecipeDefinition<T extends RecipeVariantRecord = RecipeVariantR
    * The base styles of the recipe.
    */
   base?: SystemStyleObject
+  /**
+   * Whether the recipe is deprecated.
+   */
+  deprecated?: boolean | string
   /**
    * The multi-variant styles of the recipe.
    */
@@ -123,6 +127,9 @@ export interface SlotRecipeRuntimeFn<S extends string, T extends SlotRecipeVaria
   raw: (props?: RecipeSelection<T>) => Record<S, SystemStyleObject>
   variantKeys: (keyof T)[]
   variantMap: RecipeVariantMap<T>
+  splitVariantProps<Props extends RecipeSelection<T>>(
+    props: Props,
+  ): [RecipeSelection<T>, Pretty<DistributiveOmit<Props, keyof T>>]
   getVariantProps: (props?: RecipeSelection<T>) => RecipeSelection<T>
 }
 
@@ -138,6 +145,10 @@ export interface SlotRecipeDefinition<
    * An optional class name that can be used to target slots in the DOM.
    */
   className?: string
+  /**
+   * Whether the recipe is deprecated.
+   */
+  deprecated?: boolean | string
   /**
    * The parts/slots of the recipe.
    */

package/styled-system/types/system-types.d.ts

@@ -66,7 +66,7 @@ export type CompositionStyleObject<Property extends string> = Nested<FilterStyle
  * Jsx style props
  * -----------------------------------------------------------------------------*/
 interface WithCss {
-  css?: SystemStyleObject
+  css?: SystemStyleObject | SystemStyleObject[]
 }
 type StyleProps = SystemStyleObject & WithCss