@pandacss/studio 0.3.0 → 0.3.2

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

@@ -1,3 +1,4 @@
+/* eslint-disable */
 export type Token = "easings.default" | "easings.linear" | "easings.in" | "easings.out" | "easings.in-out" | "durations.fastest" | "durations.faster" | "durations.fast" | "durations.normal" | "durations.slow" | "durations.slower" | "durations.slowest" | "radii.xs" | "radii.sm" | "radii.md" | "radii.lg" | "radii.xl" | "radii.2xl" | "radii.3xl" | "radii.full" | "fontWeights.thin" | "fontWeights.extralight" | "fontWeights.light" | "fontWeights.normal" | "fontWeights.medium" | "fontWeights.semibold" | "fontWeights.bold" | "fontWeights.extrabold" | "fontWeights.black" | "lineHeights.none" | "lineHeights.tight" | "lineHeights.snug" | "lineHeights.normal" | "lineHeights.relaxed" | "lineHeights.loose" | "fonts.sans" | "fonts.serif" | "fonts.mono" | "letterSpacings.tighter" | "letterSpacings.tight" | "letterSpacings.normal" | "letterSpacings.wide" | "letterSpacings.wider" | "letterSpacings.widest" | "fontSizes.2xs" | "fontSizes.xs" | "fontSizes.sm" | "fontSizes.md" | "fontSizes.lg" | "fontSizes.xl" | "fontSizes.2xl" | "fontSizes.3xl" | "fontSizes.4xl" | "fontSizes.5xl" | "fontSizes.6xl" | "fontSizes.7xl" | "fontSizes.8xl" | "fontSizes.9xl" | "shadows.xs" | "shadows.sm" | "shadows.md" | "shadows.lg" | "shadows.xl" | "shadows.2xl" | "shadows.inner" | "blurs.sm" | "blurs.base" | "blurs.md" | "blurs.lg" | "blurs.xl" | "blurs.2xl" | "blurs.3xl" | "spacing.1" | "spacing.2" | "spacing.3" | "spacing.4" | "spacing.5" | "spacing.6" | "spacing.7" | "spacing.8" | "spacing.9" | "spacing.10" | "spacing.11" | "spacing.12" | "spacing.14" | "spacing.16" | "spacing.20" | "spacing.24" | "spacing.28" | "spacing.32" | "spacing.36" | "spacing.40" | "spacing.44" | "spacing.48" | "spacing.52" | "spacing.56" | "spacing.60" | "spacing.64" | "spacing.72" | "spacing.80" | "spacing.96" | "spacing.0.5" | "spacing.1.5" | "spacing.2.5" | "spacing.3.5" | "sizes.1" | "sizes.2" | "sizes.3" | "sizes.4" | "sizes.5" | "sizes.6" | "sizes.7" | "sizes.8" | "sizes.9" | "sizes.10" | "sizes.11" | "sizes.12" | "sizes.14" | "sizes.16" | "sizes.20" | "sizes.24" | "sizes.28" | "sizes.32" | "sizes.36" | "sizes.40" | "sizes.44" | "sizes.48" | "sizes.52" | "sizes.56" | "sizes.60" | "sizes.64" | "sizes.72" | "sizes.80" | "sizes.96" | "sizes.0.5" | "sizes.1.5" | "sizes.2.5" | "sizes.3.5" | "sizes.xs" | "sizes.sm" | "sizes.md" | "sizes.lg" | "sizes.xl" | "sizes.2xl" | "sizes.3xl" | "sizes.4xl" | "sizes.5xl" | "sizes.6xl" | "sizes.7xl" | "sizes.8xl" | "sizes.prose" | "sizes.full" | "sizes.min" | "sizes.max" | "sizes.fit" | "sizes.breakpoint-sm" | "sizes.breakpoint-md" | "sizes.breakpoint-lg" | "sizes.breakpoint-xl" | "sizes.breakpoint-2xl" | "animations.spin" | "animations.ping" | "animations.pulse" | "animations.bounce" | "colors.current" | "colors.black" | "colors.white" | "colors.transparent" | "colors.rose.50" | "colors.rose.100" | "colors.rose.200" | "colors.rose.300" | "colors.rose.400" | "colors.rose.500" | "colors.rose.600" | "colors.rose.700" | "colors.rose.800" | "colors.rose.900" | "colors.pink.50" | "colors.pink.100" | "colors.pink.200" | "colors.pink.300" | "colors.pink.400" | "colors.pink.500" | "colors.pink.600" | "colors.pink.700" | "colors.pink.800" | "colors.pink.900" | "colors.fuchsia.50" | "colors.fuchsia.100" | "colors.fuchsia.200" | "colors.fuchsia.300" | "colors.fuchsia.400" | "colors.fuchsia.500" | "colors.fuchsia.600" | "colors.fuchsia.700" | "colors.fuchsia.800" | "colors.fuchsia.900" | "colors.purple.50" | "colors.purple.100" | "colors.purple.200" | "colors.purple.300" | "colors.purple.400" | "colors.purple.500" | "colors.purple.600" | "colors.purple.700" | "colors.purple.800" | "colors.purple.900" | "colors.indigo.50" | "colors.indigo.100" | "colors.indigo.200" | "colors.indigo.300" | "colors.indigo.400" | "colors.indigo.500" | "colors.indigo.600" | "colors.indigo.700" | "colors.indigo.800" | "colors.indigo.900" | "colors.blue.50" | "colors.blue.100" | "colors.blue.200" | "colors.blue.300" | "colors.blue.400" | "colors.blue.500" | "colors.blue.600" | "colors.blue.700" | "colors.blue.800" | "colors.blue.900" | "colors.sky.50" | "colors.sky.100" | "colors.sky.200" | "colors.sky.300" | "colors.sky.400" | "colors.sky.500" | "colors.sky.600" | "colors.sky.700" | "colors.sky.800" | "colors.sky.900" | "colors.cyan.50" | "colors.cyan.100" | "colors.cyan.200" | "colors.cyan.300" | "colors.cyan.400" | "colors.cyan.500" | "colors.cyan.600" | "colors.cyan.700" | "colors.cyan.800" | "colors.cyan.900" | "colors.teal.50" | "colors.teal.100" | "colors.teal.200" | "colors.teal.300" | "colors.teal.400" | "colors.teal.500" | "colors.teal.600" | "colors.teal.700" | "colors.teal.800" | "colors.teal.900" | "colors.green.50" | "colors.green.100" | "colors.green.200" | "colors.green.300" | "colors.green.400" | "colors.green.500" | "colors.green.600" | "colors.green.700" | "colors.green.800" | "colors.green.900" | "colors.lime.50" | "colors.lime.100" | "colors.lime.200" | "colors.lime.300" | "colors.lime.400" | "colors.lime.500" | "colors.lime.600" | "colors.lime.700" | "colors.lime.800" | "colors.lime.900" | "colors.yellow.50" | "colors.yellow.100" | "colors.yellow.200" | "colors.yellow.300" | "colors.yellow.400" | "colors.yellow.500" | "colors.yellow.600" | "colors.yellow.700" | "colors.yellow.800" | "colors.yellow.900" | "colors.orange.50" | "colors.orange.100" | "colors.orange.200" | "colors.orange.300" | "colors.orange.400" | "colors.orange.500" | "colors.orange.600" | "colors.orange.700" | "colors.orange.800" | "colors.orange.900" | "colors.red.50" | "colors.red.100" | "colors.red.200" | "colors.red.300" | "colors.red.400" | "colors.red.500" | "colors.red.600" | "colors.red.700" | "colors.red.800" | "colors.red.900" | "colors.gray.50" | "colors.gray.100" | "colors.gray.200" | "colors.gray.300" | "colors.gray.400" | "colors.gray.500" | "colors.gray.600" | "colors.gray.700" | "colors.gray.800" | "colors.gray.900" | "colors.slate.50" | "colors.slate.100" | "colors.slate.200" | "colors.slate.300" | "colors.slate.400" | "colors.slate.500" | "colors.slate.600" | "colors.slate.700" | "colors.slate.800" | "colors.slate.900" | "colors.neutral.50" | "colors.neutral.100" | "colors.neutral.200" | "colors.neutral.300" | "colors.neutral.400" | "colors.neutral.500" | "colors.neutral.600" | "colors.neutral.700" | "colors.neutral.800" | "colors.neutral.900" | "colors.neutral.950" | "assets.check" | "breakpoints.sm" | "breakpoints.md" | "breakpoints.lg" | "breakpoints.xl" | "breakpoints.2xl" | "shadows.inset" | "colors.text" | "colors.bg" | "colors.card" | "colors.border" | "spacing.-1" | "spacing.-2" | "spacing.-3" | "spacing.-4" | "spacing.-5" | "spacing.-6" | "spacing.-7" | "spacing.-8" | "spacing.-9" | "spacing.-10" | "spacing.-11" | "spacing.-12" | "spacing.-14" | "spacing.-16" | "spacing.-20" | "spacing.-24" | "spacing.-28" | "spacing.-32" | "spacing.-36" | "spacing.-40" | "spacing.-44" | "spacing.-48" | "spacing.-52" | "spacing.-56" | "spacing.-60" | "spacing.-64" | "spacing.-72" | "spacing.-80" | "spacing.-96" | "spacing.-0.5" | "spacing.-1.5" | "spacing.-2.5" | "spacing.-3.5" | "colors.colorPalette.50" | "colors.colorPalette.100" | "colors.colorPalette.200" | "colors.colorPalette.300" | "colors.colorPalette.400" | "colors.colorPalette.500" | "colors.colorPalette.600" | "colors.colorPalette.700" | "colors.colorPalette.800" | "colors.colorPalette.900" | "colors.colorPalette.950"
 
 export type ColorPalette = "rose" | "pink" | "fuchsia" | "purple" | "indigo" | "blue" | "sky" | "cyan" | "teal" | "green" | "lime" | "yellow" | "orange" | "red" | "gray" | "slate" | "neutral"

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

@@ -1,3 +1,4 @@
+/* eslint-disable */
 import type { CompositionStyleObject } from './system-types'
 
 type Recursive<T> = {

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

@@ -1,3 +1,4 @@
+/* eslint-disable */
 import type { AnySelector, Selectors } from './selectors'
 
 export type Conditions = {

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

@@ -1,3 +1,4 @@
+/* eslint-disable */
 export {};
 
 export type PropertyValue<TValue> = TValue extends Array<infer AValue>

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

@@ -1,8 +1,9 @@
-import { RecipeVariantRecord, RecipeConfig } from './recipe'
-import { Parts } from './parts'
-import { PatternConfig } from './pattern'
-import { GlobalStyleObject, SystemStyleObject } from './system-types'
-import { CompositionStyles } from './composition'
+/* eslint-disable */
+import type { RecipeVariantRecord, RecipeConfig } from './recipe'
+import type { Parts } from './parts'
+import type { PatternConfig } from './pattern'
+import type { GlobalStyleObject, SystemStyleObject } from './system-types'
+import type { CompositionStyles } from './composition'
 
 declare module '@pandacss/dev' {
   export function defineRecipe<V extends RecipeVariantRecord>(config: RecipeConfig<V>): RecipeConfig

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

@@ -1 +1,2 @@
+/* eslint-disable */
 export type Pretty<T> = T extends infer U ? { [K in keyof U]: U[K] } : never

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

@@ -1,3 +1,4 @@
+/* eslint-disable */
 import './global'
-export { ConditionalValue } from './conditions'
-export { GlobalStyleObject, JsxStyleProps, SystemStyleObject } from './system-types'
+export type { ConditionalValue } from './conditions'
+export type { GlobalStyleObject, JsxStyleProps, SystemStyleObject } from './system-types'

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

@@ -1,3 +1,4 @@
+/* eslint-disable */
 import type { ComponentProps, ElementType } from 'react'
 import type { Assign, JsxStyleProps, JsxHTMLProps } from './system-types'
 import type { RecipeDefinition, RecipeSelection, RecipeVariantRecord } from './recipe'

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

@@ -1,3 +1,4 @@
+/* eslint-disable */
 export type Part = {
   selector: string
 }

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

@@ -1,3 +1,4 @@
+/* eslint-disable */
 import type { CssProperty, SystemStyleObject } from './system-types'
 import type { TokenCategory } from '../tokens'
 
@@ -14,7 +15,11 @@ export type PatternHelpers = {
   map: (value: any, fn: (value: string) => string | undefined) => any
 }
 
-export type PatternConfig<T = PatternProperty> = {
+type PatternProperties = Record<string, PatternProperty>
+
+type Props<T> = Record<LiteralUnion<keyof T>, any>
+
+export type PatternConfig<T extends PatternProperties = PatternProperties> = {
   /**
    * The description of the pattern. This will be used in the JSDoc comment.
    */
@@ -27,14 +32,11 @@ export type PatternConfig<T = PatternProperty> = {
   /**
    * The properties of the pattern.
    */
-  properties: T extends Record<string, PatternProperty> ? T : Record<string, PatternProperty>
+  properties: T
   /**
    * The css object this pattern will generate.
    */
-  transform?: (
-    props: T extends Record<infer Keys, PatternProperty> ? Record<Keys, any> : Record<string, PatternProperty>,
-    helpers: PatternHelpers,
-  ) => SystemStyleObject
+  transform?: (props: Props<T>, helpers: PatternHelpers) => SystemStyleObject
   /**
    * The jsx element name this pattern will generate.
    */

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

@@ -1,3 +1,4 @@
+/* eslint-disable */
 import type { ConditionalValue } from './conditions';
 import type { CssProperties } from './system-types'
 import type { Tokens } from '../tokens'

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 =

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 & {})>

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'

package/styled-system/jsx/absolute-center.d.ts

@@ -1,8 +0,0 @@
-import type { FunctionComponent } from 'react'
-import type { AbsoluteCenterProperties } from '../patterns/absolute-center'
-import type { HTMLPandaProps } from '../types/jsx'
-
-export type AbsoluteCenterProps = AbsoluteCenterProperties & Omit<HTMLPandaProps<'div'>, keyof AbsoluteCenterProperties >
-
-
-export declare const AbsoluteCenter: FunctionComponent<AbsoluteCenterProps>

package/styled-system/jsx/absolute-center.mjs

@@ -1,9 +0,0 @@
-import { createElement, forwardRef } from 'react'
-import { panda } from './factory.mjs'
-import { getAbsoluteCenterStyle } from '../patterns/absolute-center.mjs'
-
-export const AbsoluteCenter = forwardRef(function AbsoluteCenter(props, ref) {
-  const { axis, ...restProps } = props
-  const styleProps = getAbsoluteCenterStyle({ axis })
-  return createElement(panda.div, { ref, ...styleProps, ...restProps })
-})

package/styled-system/patterns/absolute-center.d.ts

@@ -1,14 +0,0 @@
-import type { SystemStyleObject, ConditionalValue } from '../types'
-import type { PropertyValue } from '../types/prop-type'
-import type { Properties } from '../types/csstype'
-import type { Tokens } from '../tokens'
-
-export type AbsoluteCenterProperties = {
-   axis?: ConditionalValue<"x" | "y" | "both">
-}
-
-
-type AbsoluteCenterOptions = AbsoluteCenterProperties & Omit<SystemStyleObject, keyof AbsoluteCenterProperties >
-
-
-export declare function absoluteCenter(options?: AbsoluteCenterOptions): string

package/styled-system/patterns/absolute-center.mjs

@@ -1,23 +0,0 @@
-import { mapObject } from '../helpers.mjs'
-import { css } from '../css/index.mjs'
-
-const absoluteCenterConfig = {
-  transform(props, { map }) {
-    const { axis = 'both', ...rest } = props
-    return {
-      position: 'absolute',
-      insetBlockStart: map(axis, (v) => (v === 'x' ? 'auto' : '50%')),
-      insetInlineStart: map(axis, (v) => (v === 'y' ? 'auto' : '50%')),
-      transform: map(axis, (v) =>
-        v === 'both' ? 'translate(-50%, -50%)' : v === 'x' ? 'translateX(-50%)' : 'translateY(-50%)',
-      ),
-      maxWidth: '100%',
-      maxHeight: '100%',
-      ...rest,
-    }
-  },
-}
-
-export const getAbsoluteCenterStyle = (styles = {}) => absoluteCenterConfig.transform(styles, { map: mapObject })
-
-export const absoluteCenter = (styles) => css(getAbsoluteCenterStyle(styles))