@pandacss/studio 0.3.1 → 0.4.0

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

@@ -1,14 +1,15 @@
+/* eslint-disable */
 import type { ConditionalValue } from './conditions';
 import type { CssProperties } from './system-types'
 import type { Tokens } from '../tokens'
 
 type PropertyValueTypes  = {
-	aspectRatio: "square" | "landscape" | "portrait" | "wide" | "ultrawide" | "golden";
+	aspectRatio: "auto" | "square" | "landscape" | "portrait" | "wide" | "ultrawide" | "golden";
 	top: Tokens["spacing"];
 	left: Tokens["spacing"];
 	insetInline: Tokens["spacing"];
 	insetBlock: Tokens["spacing"];
-	inset: Tokens["spacing"];
+	inset: "auto" | Tokens["spacing"];
 	insetBlockEnd: Tokens["spacing"];
 	insetBlockStart: Tokens["spacing"];
 	insetInlineEnd: Tokens["spacing"];
@@ -45,17 +46,17 @@ type PropertyValueTypes  = {
 	paddingInline: Tokens["spacing"];
 	paddingInlineEnd: Tokens["spacing"];
 	paddingInlineStart: Tokens["spacing"];
-	marginLeft: Tokens["spacing"];
-	marginRight: Tokens["spacing"];
-	marginTop: Tokens["spacing"];
-	marginBottom: Tokens["spacing"];
-	margin: Tokens["spacing"];
-	marginBlock: Tokens["spacing"];
-	marginBlockEnd: Tokens["spacing"];
-	marginBlockStart: Tokens["spacing"];
-	marginInline: Tokens["spacing"];
-	marginInlineEnd: Tokens["spacing"];
-	marginInlineStart: Tokens["spacing"];
+	marginLeft: "auto" | Tokens["spacing"];
+	marginRight: "auto" | Tokens["spacing"];
+	marginTop: "auto" | Tokens["spacing"];
+	marginBottom: "auto" | Tokens["spacing"];
+	margin: "auto" | Tokens["spacing"];
+	marginBlock: "auto" | Tokens["spacing"];
+	marginBlockEnd: "auto" | Tokens["spacing"];
+	marginBlockStart: "auto" | Tokens["spacing"];
+	marginInline: "auto" | Tokens["spacing"];
+	marginInlineEnd: "auto" | Tokens["spacing"];
+	marginInlineStart: "auto" | Tokens["spacing"];
 	outlineColor: Tokens["colors"];
 	outline: Tokens["borders"];
 	outlineOffset: Tokens["spacing"];
@@ -63,18 +64,18 @@ type PropertyValueTypes  = {
 	divideY: string;
 	divideColor: Tokens["colors"];
 	divideStyle: CssProperties["borderStyle"];
-	width: Tokens["sizes"] | "1/2" | "1/3" | "2/3" | "1/4" | "2/4" | "3/4" | "1/5" | "2/5" | "3/5" | "4/5" | "1/6" | "2/6" | "3/6" | "4/6" | "5/6" | "1/12" | "2/12" | "3/12" | "4/12" | "5/12" | "6/12" | "7/12" | "8/12" | "9/12" | "10/12" | "11/12" | "screen";
-	inlineSize: Tokens["sizes"] | "1/2" | "1/3" | "2/3" | "1/4" | "2/4" | "3/4" | "1/5" | "2/5" | "3/5" | "4/5" | "1/6" | "2/6" | "3/6" | "4/6" | "5/6" | "1/12" | "2/12" | "3/12" | "4/12" | "5/12" | "6/12" | "7/12" | "8/12" | "9/12" | "10/12" | "11/12" | "screen";
-	minWidth: Tokens["sizes"] | "1/2" | "1/3" | "2/3" | "1/4" | "2/4" | "3/4" | "1/5" | "2/5" | "3/5" | "4/5" | "1/6" | "2/6" | "3/6" | "4/6" | "5/6" | "1/12" | "2/12" | "3/12" | "4/12" | "5/12" | "6/12" | "7/12" | "8/12" | "9/12" | "10/12" | "11/12" | "screen";
-	minInlineSize: Tokens["sizes"] | "1/2" | "1/3" | "2/3" | "1/4" | "2/4" | "3/4" | "1/5" | "2/5" | "3/5" | "4/5" | "1/6" | "2/6" | "3/6" | "4/6" | "5/6" | "1/12" | "2/12" | "3/12" | "4/12" | "5/12" | "6/12" | "7/12" | "8/12" | "9/12" | "10/12" | "11/12" | "screen";
-	maxWidth: Tokens["sizes"] | "1/2" | "1/3" | "2/3" | "1/4" | "2/4" | "3/4" | "1/5" | "2/5" | "3/5" | "4/5" | "1/6" | "2/6" | "3/6" | "4/6" | "5/6" | "1/12" | "2/12" | "3/12" | "4/12" | "5/12" | "6/12" | "7/12" | "8/12" | "9/12" | "10/12" | "11/12" | "screen";
-	maxInlineSize: Tokens["sizes"] | "1/2" | "1/3" | "2/3" | "1/4" | "2/4" | "3/4" | "1/5" | "2/5" | "3/5" | "4/5" | "1/6" | "2/6" | "3/6" | "4/6" | "5/6" | "1/12" | "2/12" | "3/12" | "4/12" | "5/12" | "6/12" | "7/12" | "8/12" | "9/12" | "10/12" | "11/12" | "screen";
-	height: Tokens["sizes"] | "svh" | "lvh" | "dvh" | "screen" | "1/2" | "1/3" | "2/3" | "1/4" | "2/4" | "3/4" | "1/5" | "2/5" | "3/5" | "4/5" | "1/6" | "2/6" | "3/6" | "4/6" | "5/6";
-	blockSize: Tokens["sizes"] | "svh" | "lvh" | "dvh" | "screen" | "1/2" | "1/3" | "2/3" | "1/4" | "2/4" | "3/4" | "1/5" | "2/5" | "3/5" | "4/5" | "1/6" | "2/6" | "3/6" | "4/6" | "5/6";
-	minHeight: Tokens["sizes"] | "svh" | "lvh" | "dvh" | "screen" | "1/2" | "1/3" | "2/3" | "1/4" | "2/4" | "3/4" | "1/5" | "2/5" | "3/5" | "4/5" | "1/6" | "2/6" | "3/6" | "4/6" | "5/6";
-	minBlockSize: Tokens["sizes"] | "svh" | "lvh" | "dvh" | "screen" | "1/2" | "1/3" | "2/3" | "1/4" | "2/4" | "3/4" | "1/5" | "2/5" | "3/5" | "4/5" | "1/6" | "2/6" | "3/6" | "4/6" | "5/6";
-	maxHeight: Tokens["sizes"] | "svh" | "lvh" | "dvh" | "screen" | "1/2" | "1/3" | "2/3" | "1/4" | "2/4" | "3/4" | "1/5" | "2/5" | "3/5" | "4/5" | "1/6" | "2/6" | "3/6" | "4/6" | "5/6";
-	maxBlockSize: Tokens["sizes"] | "svh" | "lvh" | "dvh" | "screen" | "1/2" | "1/3" | "2/3" | "1/4" | "2/4" | "3/4" | "1/5" | "2/5" | "3/5" | "4/5" | "1/6" | "2/6" | "3/6" | "4/6" | "5/6";
+	width: "auto" | Tokens["sizes"] | "1/2" | "1/3" | "2/3" | "1/4" | "2/4" | "3/4" | "1/5" | "2/5" | "3/5" | "4/5" | "1/6" | "2/6" | "3/6" | "4/6" | "5/6" | "1/12" | "2/12" | "3/12" | "4/12" | "5/12" | "6/12" | "7/12" | "8/12" | "9/12" | "10/12" | "11/12" | "screen";
+	inlineSize: "auto" | Tokens["sizes"] | "1/2" | "1/3" | "2/3" | "1/4" | "2/4" | "3/4" | "1/5" | "2/5" | "3/5" | "4/5" | "1/6" | "2/6" | "3/6" | "4/6" | "5/6" | "1/12" | "2/12" | "3/12" | "4/12" | "5/12" | "6/12" | "7/12" | "8/12" | "9/12" | "10/12" | "11/12" | "screen";
+	minWidth: "auto" | Tokens["sizes"] | "1/2" | "1/3" | "2/3" | "1/4" | "2/4" | "3/4" | "1/5" | "2/5" | "3/5" | "4/5" | "1/6" | "2/6" | "3/6" | "4/6" | "5/6" | "1/12" | "2/12" | "3/12" | "4/12" | "5/12" | "6/12" | "7/12" | "8/12" | "9/12" | "10/12" | "11/12" | "screen";
+	minInlineSize: "auto" | Tokens["sizes"] | "1/2" | "1/3" | "2/3" | "1/4" | "2/4" | "3/4" | "1/5" | "2/5" | "3/5" | "4/5" | "1/6" | "2/6" | "3/6" | "4/6" | "5/6" | "1/12" | "2/12" | "3/12" | "4/12" | "5/12" | "6/12" | "7/12" | "8/12" | "9/12" | "10/12" | "11/12" | "screen";
+	maxWidth: "auto" | Tokens["sizes"] | "1/2" | "1/3" | "2/3" | "1/4" | "2/4" | "3/4" | "1/5" | "2/5" | "3/5" | "4/5" | "1/6" | "2/6" | "3/6" | "4/6" | "5/6" | "1/12" | "2/12" | "3/12" | "4/12" | "5/12" | "6/12" | "7/12" | "8/12" | "9/12" | "10/12" | "11/12" | "screen";
+	maxInlineSize: "auto" | Tokens["sizes"] | "1/2" | "1/3" | "2/3" | "1/4" | "2/4" | "3/4" | "1/5" | "2/5" | "3/5" | "4/5" | "1/6" | "2/6" | "3/6" | "4/6" | "5/6" | "1/12" | "2/12" | "3/12" | "4/12" | "5/12" | "6/12" | "7/12" | "8/12" | "9/12" | "10/12" | "11/12" | "screen";
+	height: "auto" | Tokens["sizes"] | "svh" | "lvh" | "dvh" | "screen" | "1/2" | "1/3" | "2/3" | "1/4" | "2/4" | "3/4" | "1/5" | "2/5" | "3/5" | "4/5" | "1/6" | "2/6" | "3/6" | "4/6" | "5/6";
+	blockSize: "auto" | Tokens["sizes"] | "svh" | "lvh" | "dvh" | "screen" | "1/2" | "1/3" | "2/3" | "1/4" | "2/4" | "3/4" | "1/5" | "2/5" | "3/5" | "4/5" | "1/6" | "2/6" | "3/6" | "4/6" | "5/6";
+	minHeight: "auto" | Tokens["sizes"] | "svh" | "lvh" | "dvh" | "screen" | "1/2" | "1/3" | "2/3" | "1/4" | "2/4" | "3/4" | "1/5" | "2/5" | "3/5" | "4/5" | "1/6" | "2/6" | "3/6" | "4/6" | "5/6";
+	minBlockSize: "auto" | Tokens["sizes"] | "svh" | "lvh" | "dvh" | "screen" | "1/2" | "1/3" | "2/3" | "1/4" | "2/4" | "3/4" | "1/5" | "2/5" | "3/5" | "4/5" | "1/6" | "2/6" | "3/6" | "4/6" | "5/6";
+	maxHeight: "auto" | Tokens["sizes"] | "svh" | "lvh" | "dvh" | "screen" | "1/2" | "1/3" | "2/3" | "1/4" | "2/4" | "3/4" | "1/5" | "2/5" | "3/5" | "4/5" | "1/6" | "2/6" | "3/6" | "4/6" | "5/6";
+	maxBlockSize: "auto" | Tokens["sizes"] | "svh" | "lvh" | "dvh" | "screen" | "1/2" | "1/3" | "2/3" | "1/4" | "2/4" | "3/4" | "1/5" | "2/5" | "3/5" | "4/5" | "1/6" | "2/6" | "3/6" | "4/6" | "5/6";
 	color: Tokens["colors"];
 	fontFamily: Tokens["fonts"];
 	fontSize: Tokens["fontSizes"];

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

@@ -1,3 +1,4 @@
+/* eslint-disable */
 import type { SystemStyleObject } from './system-types'
 
 type Pretty<T> = T extends infer U ? { [K in keyof U]: U[K] } : never

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

@@ -1,3 +1,4 @@
+/* eslint-disable */
 import type { Pseudos } from './csstype'
 
 type AriaAttributes =
@@ -52,5 +53,7 @@ type DataAttributes =
 type AttributeSelector = `&${Pseudos | DataAttributes | AriaAttributes}`
 type ParentSelector = `${DataAttributes | AriaAttributes} &`
 
-export type AnySelector = `${string}&` | `&${string}`
+type AtRuleType = 'media' | 'layer' | 'container' | 'supports' | 'page'
+
+export type AnySelector = `${string}&` | `&${string}` | `@${AtRuleType}${string}`
 export type Selectors = AttributeSelector | ParentSelector

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

@@ -1,6 +1,7 @@
-import { ConditionalValue } from './conditions'
-import { PropertyValue } from './prop-type'
-import { Token } from '../tokens'
+/* eslint-disable */
+import type { ConditionalValue } from './conditions'
+import type { PropertyValue } from './prop-type'
+import type { Token } from '../tokens'
 
 export type CssVarProperties = {
   [key in `--${string}`]?: ConditionalValue<Token | (string & {}) | (number & {})>
@@ -226,7 +227,6 @@ export type SystemProperties = {
 	clip?: PropertyValue<'clip'>
 	clipPath?: PropertyValue<'clipPath'>
 	color?: PropertyValue<'color'>
-	printColorAdjust?: PropertyValue<'printColorAdjust'>
 	colorScheme?: PropertyValue<'colorScheme'>
 	columnCount?: PropertyValue<'columnCount'>
 	columnFill?: PropertyValue<'columnFill'>
@@ -244,6 +244,9 @@ export type SystemProperties = {
 	containIntrinsicHeight?: PropertyValue<'containIntrinsicHeight'>
 	containIntrinsicInlineSize?: PropertyValue<'containIntrinsicInlineSize'>
 	containIntrinsicWidth?: PropertyValue<'containIntrinsicWidth'>
+	container?: PropertyValue<'container'>
+	containerName?: PropertyValue<'containerName'>
+	containerType?: PropertyValue<'containerType'>
 	content?: PropertyValue<'content'>
 	contentVisibility?: PropertyValue<'contentVisibility'>
 	counterIncrement?: PropertyValue<'counterIncrement'>
@@ -268,6 +271,7 @@ export type SystemProperties = {
 	fontKerning?: PropertyValue<'fontKerning'>
 	fontLanguageOverride?: PropertyValue<'fontLanguageOverride'>
 	fontOpticalSizing?: PropertyValue<'fontOpticalSizing'>
+	fontPalette?: PropertyValue<'fontPalette'>
 	fontVariationSettings?: PropertyValue<'fontVariationSettings'>
 	fontSize?: PropertyValue<'fontSize'>
 	fontSizeAdjust?: PropertyValue<'fontSizeAdjust'>
@@ -279,6 +283,7 @@ export type SystemProperties = {
 	fontVariantAlternates?: PropertyValue<'fontVariantAlternates'>
 	fontVariantCaps?: PropertyValue<'fontVariantCaps'>
 	fontVariantEastAsian?: PropertyValue<'fontVariantEastAsian'>
+	fontVariantEmoji?: PropertyValue<'fontVariantEmoji'>
 	fontVariantLigatures?: PropertyValue<'fontVariantLigatures'>
 	fontVariantNumeric?: PropertyValue<'fontVariantNumeric'>
 	fontVariantPosition?: PropertyValue<'fontVariantPosition'>
@@ -422,6 +427,7 @@ export type SystemProperties = {
 	paddingLeft?: PropertyValue<'paddingLeft'>
 	paddingRight?: PropertyValue<'paddingRight'>
 	paddingTop?: PropertyValue<'paddingTop'>
+	page?: PropertyValue<'page'>
 	pageBreakAfter?: PropertyValue<'pageBreakAfter'>
 	pageBreakBefore?: PropertyValue<'pageBreakBefore'>
 	pageBreakInside?: PropertyValue<'pageBreakInside'>
@@ -433,6 +439,7 @@ export type SystemProperties = {
 	placeSelf?: PropertyValue<'placeSelf'>
 	pointerEvents?: PropertyValue<'pointerEvents'>
 	position?: PropertyValue<'position'>
+	printColorAdjust?: PropertyValue<'printColorAdjust'>
 	quotes?: PropertyValue<'quotes'>
 	resize?: PropertyValue<'resize'>
 	right?: PropertyValue<'right'>
@@ -524,6 +531,7 @@ export type SystemProperties = {
 	unicodeBidi?: PropertyValue<'unicodeBidi'>
 	userSelect?: PropertyValue<'userSelect'>
 	verticalAlign?: PropertyValue<'verticalAlign'>
+	viewTransitionName?: PropertyValue<'viewTransitionName'>
 	visibility?: PropertyValue<'visibility'>
 	whiteSpace?: PropertyValue<'whiteSpace'>
 	widows?: PropertyValue<'widows'>

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

@@ -1,3 +1,4 @@
+/* eslint-disable */
 import type { ConditionalValue, Conditions, Nested } from './conditions'
 import type { PropertiesFallback } from './csstype'
 import type { SystemProperties, CssVarProperties } from './style-props'