@pandacss/studio 0.34.3 → 0.35.0

package/package.json

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

package/styled-system/css/sva.mjs

@@ -1,11 +1,14 @@
 import { getSlotRecipes, memo, splitProps } from '../helpers.mjs';
 import { cva } from './cva.mjs';
+import { cx } from './cx.mjs';
+
+const slotClass = (className, slot) => className + '__' + slot
 
 export function sva(config) {
   const slots = Object.entries(getSlotRecipes(config)).map(([slot, slotCva]) => [slot, cva(slotCva)])
 
   function svaFn(props) {
-    const result = slots.map(([slot, cvaFn]) => [slot, cvaFn(props)])
+    const result = slots.map(([slot, cvaFn]) => [slot, cx(cvaFn(props), config.className && slotClass(config.className, slot))])
     return Object.fromEntries(result)
   }
 

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

@@ -325,17 +325,6 @@ type StrictableProps =
   | 'backgroundAttachment'
   | 'backgroundClip'
   | 'borderCollapse'
-  | 'border'
-  | 'borderBlock'
-  | 'borderBlockEnd'
-  | 'borderBlockStart'
-  | 'borderBottom'
-  | 'borderInline'
-  | 'borderInlineEnd'
-  | 'borderInlineStart'
-  | 'borderLeft'
-  | 'borderRight'
-  | 'borderTop'
   | 'borderBlockEndStyle'
   | 'borderBlockStartStyle'
   | 'borderBlockStyle'
@@ -387,7 +376,14 @@ type StrictableProps =
   | 'wordBreak'
   | 'writingMode'
 
-type WithEscapeHatch<T> = T | `[${string}]`
+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 WithEscapeHatch<T> = T | `[${string}]` | (T extends string ? WithColorOpacityModifier<string> | WithImportant<T> : T)
 
 type FilterVagueString<Key, Value> = Value extends boolean
   ? Value

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

@@ -81,7 +81,7 @@ export type RecipeCreatorFn = <T extends RecipeVariantRecord>(config: RecipeDefi
 
 interface RecipeConfigMeta {
   /**
-   * The name of the recipe.
+   * The class name of the recipe.
    */
   className: string
   /**
@@ -133,6 +133,10 @@ export interface SlotRecipeDefinition<
   S extends string = string,
   T extends SlotRecipeVariantRecord<S> = SlotRecipeVariantRecord<S>,
 > {
+  /**
+   * An optional class name that can be used to target slots in the DOM.
+   */
+  className?: string
   /**
    * The parts/slots of the recipe.
    */