@pandacss/studio 0.53.7 → 0.54.0

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (31) hide show
  1. package/package.json +7 -7
  2. package/src/components/layer-styles.tsx +10 -9
  3. package/src/components/text-styles.tsx +10 -18
  4. package/src/lib/virtual-panda.d.ts +2 -0
  5. package/styled-system/patterns/aspect-ratio.d.ts +0 -1
  6. package/styled-system/patterns/bleed.d.ts +0 -1
  7. package/styled-system/patterns/box.d.ts +0 -1
  8. package/styled-system/patterns/center.d.ts +0 -1
  9. package/styled-system/patterns/circle.d.ts +0 -1
  10. package/styled-system/patterns/container.d.ts +0 -1
  11. package/styled-system/patterns/cq.d.ts +0 -1
  12. package/styled-system/patterns/divider.d.ts +0 -1
  13. package/styled-system/patterns/flex.d.ts +0 -1
  14. package/styled-system/patterns/float.d.ts +0 -1
  15. package/styled-system/patterns/grid-item.d.ts +0 -1
  16. package/styled-system/patterns/grid.d.ts +0 -1
  17. package/styled-system/patterns/hstack.d.ts +0 -1
  18. package/styled-system/patterns/link-overlay.d.ts +0 -1
  19. package/styled-system/patterns/spacer.d.ts +0 -1
  20. package/styled-system/patterns/square.d.ts +0 -1
  21. package/styled-system/patterns/stack.d.ts +0 -1
  22. package/styled-system/patterns/visually-hidden.d.ts +0 -1
  23. package/styled-system/patterns/vstack.d.ts +0 -1
  24. package/styled-system/patterns/wrap.d.ts +0 -1
  25. package/styled-system/styles.css +318 -323
  26. package/styled-system/tokens/tokens.d.ts +1 -1
  27. package/styled-system/types/conditions.d.ts +6 -6
  28. package/styled-system/jsx/link-box.d.ts +0 -10
  29. package/styled-system/jsx/link-box.mjs +0 -14
  30. package/styled-system/patterns/link-box.d.ts +0 -21
  31. package/styled-system/patterns/link-box.mjs +0 -22
@@ -1,5 +1,5 @@
1
1
  /* eslint-disable */
2
- export type Token = "aspectRatios.square" | "aspectRatios.landscape" | "aspectRatios.portrait" | "aspectRatios.wide" | "aspectRatios.ultrawide" | "aspectRatios.golden" | "borders.none" | "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.4xl" | "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.0" | "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.0" | "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.rose.950" | "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.pink.950" | "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.fuchsia.950" | "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.purple.950" | "colors.violet.50" | "colors.violet.100" | "colors.violet.200" | "colors.violet.300" | "colors.violet.400" | "colors.violet.500" | "colors.violet.600" | "colors.violet.700" | "colors.violet.800" | "colors.violet.900" | "colors.violet.950" | "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.indigo.950" | "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.blue.950" | "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.sky.950" | "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.cyan.950" | "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.teal.950" | "colors.emerald.50" | "colors.emerald.100" | "colors.emerald.200" | "colors.emerald.300" | "colors.emerald.400" | "colors.emerald.500" | "colors.emerald.600" | "colors.emerald.700" | "colors.emerald.800" | "colors.emerald.900" | "colors.emerald.950" | "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.green.950" | "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.lime.950" | "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.yellow.950" | "colors.amber.50" | "colors.amber.100" | "colors.amber.200" | "colors.amber.300" | "colors.amber.400" | "colors.amber.500" | "colors.amber.600" | "colors.amber.700" | "colors.amber.800" | "colors.amber.900" | "colors.amber.950" | "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.orange.950" | "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.red.950" | "colors.stone.50" | "colors.stone.100" | "colors.stone.200" | "colors.stone.300" | "colors.stone.400" | "colors.stone.500" | "colors.stone.600" | "colors.stone.700" | "colors.stone.800" | "colors.stone.900" | "colors.stone.950" | "colors.zinc.50" | "colors.zinc.100" | "colors.zinc.200" | "colors.zinc.300" | "colors.zinc.400" | "colors.zinc.500" | "colors.zinc.600" | "colors.zinc.700" | "colors.zinc.800" | "colors.zinc.900" | "colors.zinc.950" | "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.gray.950" | "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.slate.950" | "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" | "colors.accent" | "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" | "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"
2
+ export type Token = `aspectRatios.${AspectRatioToken}` | `borders.${BorderToken}` | `easings.${EasingToken}` | `durations.${DurationToken}` | `radii.${RadiusToken}` | `fontWeights.${FontWeightToken}` | `lineHeights.${LineHeightToken}` | `fonts.${FontToken}` | `letterSpacings.${LetterSpacingToken}` | `fontSizes.${FontSizeToken}` | `shadows.${ShadowToken}` | `blurs.${BlurToken}` | `spacing.${SpacingToken}` | `sizes.${SizeToken}` | `animations.${AnimationToken}` | `colors.${ColorToken}` | `assets.${AssetToken}` | `breakpoints.${BreakpointToken}`
3
3
 
4
4
  export type ColorPalette = "current" | "black" | "white" | "transparent" | "rose" | "pink" | "fuchsia" | "purple" | "violet" | "indigo" | "blue" | "sky" | "cyan" | "teal" | "emerald" | "green" | "lime" | "yellow" | "amber" | "orange" | "red" | "stone" | "zinc" | "gray" | "slate" | "neutral" | "text" | "bg" | "card" | "border" | "accent"
5
5
 
@@ -10,7 +10,7 @@ export interface Conditions {
10
10
  "_focusWithin": string
11
11
  /** `&:is(:focus-visible, [data-focus-visible])` */
12
12
  "_focusVisible": string
13
- /** `&:is(:disabled, [disabled], [data-disabled])` */
13
+ /** `&:is(:disabled, [disabled], [data-disabled], [aria-disabled=true])` */
14
14
  "_disabled": string
15
15
  /** `&:is(:active, [data-active])` */
16
16
  "_active": string
@@ -18,7 +18,7 @@ export interface Conditions {
18
18
  "_visited": string
19
19
  /** `&:target` */
20
20
  "_target": string
21
- /** `&:is(:read-only, [data-read-only])` */
21
+ /** `&:is(:read-only, [data-read-only], [aria-readonly=true])` */
22
22
  "_readOnly": string
23
23
  /** `&:read-write` */
24
24
  "_readWrite": string
@@ -80,7 +80,7 @@ export interface Conditions {
80
80
  "_peerFocusWithin": string
81
81
  /** `.peer:is(:focus-visible, [data-focus-visible]) ~ &` */
82
82
  "_peerFocusVisible": string
83
- /** `.peer:is(:disabled, [disabled], [data-disabled]) ~ &` */
83
+ /** `.peer:is(:disabled, [disabled], [data-disabled], [aria-disabled=true]) ~ &` */
84
84
  "_peerDisabled": string
85
85
  /** `.peer:is(:checked, [data-checked], [aria-checked=true], [data-state="checked"]) ~ &` */
86
86
  "_peerChecked": string
@@ -100,13 +100,13 @@ export interface Conditions {
100
100
  "_groupFocusWithin": string
101
101
  /** `.group:is(:focus-visible, [data-focus-visible]) &` */
102
102
  "_groupFocusVisible": string
103
- /** `.group:is(:disabled, [disabled], [data-disabled]) &` */
103
+ /** `.group:is(:disabled, [disabled], [data-disabled], [aria-disabled=true]) &` */
104
104
  "_groupDisabled": string
105
105
  /** `.group:is(:checked, [data-checked], [aria-checked=true], [data-state="checked"]) &` */
106
106
  "_groupChecked": string
107
107
  /** `.group:is([aria-expanded=true], [data-expanded], [data-state="expanded"]) &` */
108
108
  "_groupExpanded": string
109
- /** `.group:is(:invalid, [data-invalid]) &` */
109
+ /** `.group:is(:invalid, [data-invalid], [aria-invalid=true]) &` */
110
110
  "_groupInvalid": string
111
111
  /** `&:is(:indeterminate, [data-indeterminate], [aria-checked=mixed], [data-state="indeterminate"])` */
112
112
  "_indeterminate": string
@@ -114,7 +114,7 @@ export interface Conditions {
114
114
  "_required": string
115
115
  /** `&:is(:valid, [data-valid])` */
116
116
  "_valid": string
117
- /** `&:is(:invalid, [data-invalid])` */
117
+ /** `&:is(:invalid, [data-invalid], [aria-invalid=true])` */
118
118
  "_invalid": string
119
119
  /** `&:autofill` */
120
120
  "_autofill": string
@@ -1,10 +0,0 @@
1
- /* eslint-disable */
2
- import type { FunctionComponent } from 'react'
3
- import type { LinkBoxProperties } from '../patterns/link-box';
4
- import type { HTMLPandaProps } from '../types/jsx';
5
- import type { DistributiveOmit } from '../types/system-types';
6
-
7
- export interface LinkBoxProps extends LinkBoxProperties, DistributiveOmit<HTMLPandaProps<'div'>, keyof LinkBoxProperties > {}
8
-
9
-
10
- export declare const LinkBox: FunctionComponent<LinkBoxProps>
@@ -1,14 +0,0 @@
1
- import { createElement, forwardRef } from 'react'
2
-
3
- import { splitProps } from '../helpers.mjs';
4
- import { getLinkBoxStyle } from '../patterns/link-box.mjs';
5
- import { panda } from './factory.mjs';
6
-
7
- export const LinkBox = /* @__PURE__ */ forwardRef(function LinkBox(props, ref) {
8
- const [patternProps, restProps] = splitProps(props, [])
9
-
10
- const styleProps = getLinkBoxStyle(patternProps)
11
- const mergedProps = { ref, ...styleProps, ...restProps }
12
-
13
- return createElement(panda.div, mergedProps)
14
- })
@@ -1,21 +0,0 @@
1
- /* eslint-disable */
2
- import type { SystemStyleObject, ConditionalValue } from '../types/index';
3
- import type { Properties } from '../types/csstype';
4
- import type { SystemProperties } from '../types/style-props';
5
- import type { DistributiveOmit } from '../types/system-types';
6
- import type { Tokens } from '../tokens/index';
7
-
8
- export interface LinkBoxProperties {
9
-
10
- }
11
-
12
-
13
- interface LinkBoxStyles extends LinkBoxProperties, DistributiveOmit<SystemStyleObject, keyof LinkBoxProperties > {}
14
-
15
- interface LinkBoxPatternFn {
16
- (styles?: LinkBoxStyles): string
17
- raw: (styles?: LinkBoxStyles) => SystemStyleObject
18
- }
19
-
20
-
21
- export declare const linkBox: LinkBoxPatternFn;
@@ -1,22 +0,0 @@
1
- import { getPatternStyles, patternFns } from '../helpers.mjs';
2
- import { css } from '../css/index.mjs';
3
-
4
- const linkBoxConfig = {
5
- transform(props) {
6
- return {
7
- position: "relative",
8
- "& :where(a, abbr)": {
9
- position: "relative",
10
- zIndex: "1"
11
- },
12
- ...props
13
- };
14
- }}
15
-
16
- export const getLinkBoxStyle = (styles = {}) => {
17
- const _styles = getPatternStyles(linkBoxConfig, styles)
18
- return linkBoxConfig.transform(_styles, patternFns)
19
- }
20
-
21
- export const linkBox = (styles) => css(getLinkBoxStyle(styles))
22
- linkBox.raw = getLinkBoxStyle