@pandacss/studio 0.53.7 → 1.0.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 (47) hide show
  1. package/dist/studio.mjs +3 -3
  2. package/package.json +11 -11
  3. package/panda.config.ts +4 -4
  4. package/src/components/layer-styles.tsx +10 -9
  5. package/src/components/text-styles.tsx +10 -18
  6. package/src/lib/virtual-panda.d.ts +2 -0
  7. package/styled-system/css/conditions.mjs +1 -1
  8. package/styled-system/css/css.mjs +1 -1
  9. package/styled-system/css/sva.mjs +9 -4
  10. package/styled-system/helpers.mjs +11 -22
  11. package/styled-system/jsx/create-style-context.d.ts +47 -0
  12. package/styled-system/jsx/create-style-context.mjs +92 -0
  13. package/styled-system/jsx/factory.mjs +5 -2
  14. package/styled-system/jsx/index.d.ts +1 -0
  15. package/styled-system/jsx/index.mjs +1 -0
  16. package/styled-system/jsx/is-valid-prop.mjs +1 -1
  17. package/styled-system/patterns/aspect-ratio.d.ts +0 -1
  18. package/styled-system/patterns/bleed.d.ts +0 -1
  19. package/styled-system/patterns/box.d.ts +0 -1
  20. package/styled-system/patterns/center.d.ts +0 -1
  21. package/styled-system/patterns/circle.d.ts +0 -1
  22. package/styled-system/patterns/container.d.ts +0 -1
  23. package/styled-system/patterns/cq.d.ts +0 -1
  24. package/styled-system/patterns/divider.d.ts +0 -1
  25. package/styled-system/patterns/flex.d.ts +0 -1
  26. package/styled-system/patterns/float.d.ts +0 -1
  27. package/styled-system/patterns/grid-item.d.ts +0 -1
  28. package/styled-system/patterns/grid.d.ts +0 -1
  29. package/styled-system/patterns/hstack.d.ts +0 -1
  30. package/styled-system/patterns/link-overlay.d.ts +0 -1
  31. package/styled-system/patterns/spacer.d.ts +0 -1
  32. package/styled-system/patterns/square.d.ts +0 -1
  33. package/styled-system/patterns/stack.d.ts +0 -1
  34. package/styled-system/patterns/visually-hidden.d.ts +0 -1
  35. package/styled-system/patterns/vstack.d.ts +0 -1
  36. package/styled-system/patterns/wrap.d.ts +0 -1
  37. package/styled-system/styles.css +325 -327
  38. package/styled-system/tokens/index.mjs +19 -7
  39. package/styled-system/tokens/tokens.d.ts +3 -3
  40. package/styled-system/types/conditions.d.ts +14 -10
  41. package/styled-system/types/jsx.d.ts +2 -1
  42. package/styled-system/types/prop-type.d.ts +4 -2
  43. package/styled-system/types/style-props.d.ts +7 -0
  44. package/styled-system/jsx/link-box.d.ts +0 -10
  45. package/styled-system/jsx/link-box.mjs +0 -14
  46. package/styled-system/patterns/link-box.d.ts +0 -21
  47. package/styled-system/patterns/link-box.mjs +0 -22
@@ -263,6 +263,10 @@ const tokens = {
263
263
  "value": "8rem",
264
264
  "variable": "var(--font-sizes-9xl)"
265
265
  },
266
+ "shadows.2xs": {
267
+ "value": "0 1px rgb(0 0 0 / 0.05)",
268
+ "variable": "var(--shadows-2xs)"
269
+ },
266
270
  "shadows.xs": {
267
271
  "value": "0 1px 2px 0 rgb(0 0 0 / 0.05)",
268
272
  "variable": "var(--shadows-xs)"
@@ -287,17 +291,25 @@ const tokens = {
287
291
  "value": "0 25px 50px -12px rgb(0 0 0 / 0.25)",
288
292
  "variable": "var(--shadows-2xl)"
289
293
  },
290
- "shadows.inner": {
291
- "value": "inset 0 2px 4px 0 rgb(0 0 0 / 0.05)",
292
- "variable": "var(--shadows-inner)"
294
+ "shadows.inset-2xs": {
295
+ "value": "inset 0 1px rgb(0 0 0 / 0.05)",
296
+ "variable": "var(--shadows-inset-2xs)"
293
297
  },
294
- "blurs.sm": {
298
+ "shadows.inset-xs": {
299
+ "value": "inset 0 1px 1px rgb(0 0 0 / 0.05)",
300
+ "variable": "var(--shadows-inset-xs)"
301
+ },
302
+ "shadows.inset-sm": {
303
+ "value": "inset 0 2px 4px rgb(0 0 0 / 0.05)",
304
+ "variable": "var(--shadows-inset-sm)"
305
+ },
306
+ "blurs.xs": {
295
307
  "value": "4px",
296
- "variable": "var(--blurs-sm)"
308
+ "variable": "var(--blurs-xs)"
297
309
  },
298
- "blurs.base": {
310
+ "blurs.sm": {
299
311
  "value": "8px",
300
- "variable": "var(--blurs-base)"
312
+ "variable": "var(--blurs-sm)"
301
313
  },
302
314
  "blurs.md": {
303
315
  "value": "12px",
@@ -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
 
@@ -23,9 +23,9 @@ export type LetterSpacingToken = "tighter" | "tight" | "normal" | "wide" | "wide
23
23
 
24
24
  export type FontSizeToken = "2xs" | "xs" | "sm" | "md" | "lg" | "xl" | "2xl" | "3xl" | "4xl" | "5xl" | "6xl" | "7xl" | "8xl" | "9xl"
25
25
 
26
- export type ShadowToken = "xs" | "sm" | "md" | "lg" | "xl" | "2xl" | "inner" | "inset"
26
+ export type ShadowToken = "2xs" | "xs" | "sm" | "md" | "lg" | "xl" | "2xl" | "inset-2xs" | "inset-xs" | "inset-sm" | "inset"
27
27
 
28
- export type BlurToken = "sm" | "base" | "md" | "lg" | "xl" | "2xl" | "3xl"
28
+ export type BlurToken = "xs" | "sm" | "md" | "lg" | "xl" | "2xl" | "3xl"
29
29
 
30
30
  export type SpacingToken = "0" | "1" | "2" | "3" | "4" | "5" | "6" | "7" | "8" | "9" | "10" | "11" | "12" | "14" | "16" | "20" | "24" | "28" | "32" | "36" | "40" | "44" | "48" | "52" | "56" | "60" | "64" | "72" | "80" | "96" | "0.5" | "1.5" | "2.5" | "3.5" | "-1" | "-2" | "-3" | "-4" | "-5" | "-6" | "-7" | "-8" | "-9" | "-10" | "-11" | "-12" | "-14" | "-16" | "-20" | "-24" | "-28" | "-32" | "-36" | "-40" | "-44" | "-48" | "-52" | "-56" | "-60" | "-64" | "-72" | "-80" | "-96" | "-0.5" | "-1.5" | "-2.5" | "-3.5"
31
31
 
@@ -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
@@ -46,7 +46,7 @@ export interface Conditions {
46
46
  "_firstLetter": string
47
47
  /** `&::first-line` */
48
48
  "_firstLine": string
49
- /** `&::marker` */
49
+ /** `&:is(::marker, ::-webkit-details-marker)` */
50
50
  "_marker": string
51
51
  /** `&::selection` */
52
52
  "_selection": 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
@@ -142,7 +142,7 @@ export interface Conditions {
142
142
  "_default": string
143
143
  /** `&:optional` */
144
144
  "_optional": string
145
- /** `&:is([open], [data-open], [data-state="open"])` */
145
+ /** `&:is([open], [data-open], [data-state="open"], :popover-open)` */
146
146
  "_open": string
147
147
  /** `&:is([closed], [data-closed], [data-state="closed"])` */
148
148
  "_closed": string
@@ -194,9 +194,9 @@ export interface Conditions {
194
194
  "_lessContrast": string
195
195
  /** `@media (prefers-contrast: more)` */
196
196
  "_moreContrast": string
197
- /** `[dir=ltr] &` */
197
+ /** `:where([dir=ltr], :dir(ltr)) &` */
198
198
  "_ltr": string
199
- /** `[dir=rtl] &` */
199
+ /** `:where([dir=rtl], :dir(rtl)) &` */
200
200
  "_rtl": string
201
201
  /** `&::-webkit-scrollbar` */
202
202
  "_scrollbar": string
@@ -212,6 +212,10 @@ export interface Conditions {
212
212
  "_icon": string
213
213
  /** `@starting-style` */
214
214
  "_starting": string
215
+ /** `@media (scripting: none)` */
216
+ "_noscript": string
217
+ /** `@media (inverted-colors: inverted)` */
218
+ "_invertedColors": string
215
219
  /** `@media screen and (min-width: 40rem)` */
216
220
  "sm": string
217
221
  /** `@media screen and (min-width: 40rem) and (max-width: 47.9975rem)` */
@@ -23,7 +23,8 @@ interface RecipeFn {
23
23
  interface JsxFactoryOptions<TProps extends Dict> {
24
24
  dataAttr?: boolean
25
25
  defaultProps?: TProps
26
- shouldForwardProp?(prop: string, variantKeys: string[]): boolean
26
+ shouldForwardProp?: (prop: string, variantKeys: string[]) => boolean
27
+ forwardProps?: string[]
27
28
  }
28
29
 
29
30
  export type JsxRecipeProps<T extends ElementType, P extends Dict> = JsxHTMLProps<ComponentProps<T>, P>;
@@ -70,6 +70,7 @@ export interface UtilityValues {
70
70
  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";
71
71
  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";
72
72
  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";
73
+ boxSize: "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";
73
74
  color: Tokens["colors"];
74
75
  fontFamily: Tokens["fonts"];
75
76
  fontSize: Tokens["fontSizes"];
@@ -88,8 +89,9 @@ export interface UtilityValues {
88
89
  background: Tokens["colors"];
89
90
  backgroundColor: Tokens["colors"];
90
91
  backgroundImage: Tokens["assets"];
91
- backgroundGradient: "to-t" | "to-tr" | "to-r" | "to-br" | "to-b" | "to-bl" | "to-l" | "to-tl";
92
- textGradient: "to-t" | "to-tr" | "to-r" | "to-br" | "to-b" | "to-bl" | "to-l" | "to-tl";
92
+ backgroundGradient: 'to-t' | 'to-tr' | 'to-r' | 'to-br' | 'to-b' | 'to-bl' | 'to-l' | 'to-tl';
93
+ backgroundLinear: 'to-t' | 'to-tr' | 'to-r' | 'to-br' | 'to-b' | 'to-bl' | 'to-l' | 'to-tl';
94
+ textGradient: 'to-t' | 'to-tr' | 'to-r' | 'to-br' | 'to-b' | 'to-bl' | 'to-l' | 'to-tl';
93
95
  gradientFrom: Tokens["colors"];
94
96
  gradientTo: Tokens["colors"];
95
97
  gradientVia: Tokens["colors"];
@@ -6992,6 +6992,9 @@ bgBlendMode?: ConditionalValue<CssProperties["backgroundBlendMode"] | AnyString>
6992
6992
  */
6993
6993
  bgSize?: ConditionalValue<CssProperties["backgroundSize"] | AnyString>
6994
6994
  bgGradient?: ConditionalValue<UtilityValues["backgroundGradient"] | CssVars | AnyString>
6995
+ bgLinear?: ConditionalValue<UtilityValues["backgroundLinear"] | CssVars | AnyString>
6996
+ bgRadial?: ConditionalValue<string | number | AnyString>
6997
+ bgConic?: ConditionalValue<string | number | AnyString>
6995
6998
  /**
6996
6999
  * The **`border-radius`** CSS property rounds the corners of an element's outer border edge. You can set a single radius to make circular corners, or two radii to make elliptical corners.
6997
7000
  *
@@ -7363,9 +7366,13 @@ scrollPaddingX?: ConditionalValue<UtilityValues["scrollPaddingInline"] | CssVars
7363
7366
  divideY?: ConditionalValue<string | number | AnyString>
7364
7367
  divideColor?: ConditionalValue<UtilityValues["divideColor"] | CssVars | AnyString>
7365
7368
  divideStyle?: ConditionalValue<UtilityValues["divideStyle"] | CssVars | AnyString>
7369
+ boxSize?: ConditionalValue<UtilityValues["boxSize"] | CssVars | AnyString>
7366
7370
  fontSmoothing?: ConditionalValue<UtilityValues["fontSmoothing"] | CssVars | AnyString>
7367
7371
  truncate?: ConditionalValue<UtilityValues["truncate"] | CssVars | AnyString>
7368
7372
  backgroundGradient?: ConditionalValue<UtilityValues["backgroundGradient"] | CssVars | AnyString>
7373
+ backgroundLinear?: ConditionalValue<UtilityValues["backgroundLinear"] | CssVars | AnyString>
7374
+ backgroundRadial?: ConditionalValue<string | number | AnyString>
7375
+ backgroundConic?: ConditionalValue<string | number | AnyString>
7369
7376
  textGradient?: ConditionalValue<UtilityValues["textGradient"] | CssVars | AnyString>
7370
7377
  gradientFromPosition?: ConditionalValue<string | number | AnyString>
7371
7378
  gradientToPosition?: ConditionalValue<string | number | AnyString>
@@ -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