🐼 Panda v0.54.0

[anubra266]

To upgrade to v0.54.0:

pnpm up "@pandacss/*"
#or
yarn up '@pandacss/*'

What's Changed

Fixed

• Fix issue where borderWidth token reference adds an extra px to the generated css value
• Fix TS generated pattern dts code when strict: true is set
• Fix issue where text (or layer) styles that use conditions don't render correctly
• Revert tinyglobally to fast-glob change to fix issues with glob matching

Added

• Add more aria attributes to conditions for better accessibility and styling hooks:
  • [aria-disabled=true] was added to disabled, peerDisabled, and groupDisabled conditions
  • [aria-readonly=true] was added to the readOnly condition
  • [aria-invalid=true] was added to invalid and groupInvalid conditions

Changed

• Improve algorithm for deterministic property order:

  • Longhand (padding, margin, inset)
  • Shorthand of longhands (padding-inline, margin-inline)
  • Shorthand of shorthands (padding-inline-start, margin-inline-start)

  css({
    p: '4',
    pr: '2',
    px: '10',
  })

  Will result in the following css regardless of the order of the properties:

  .p-4 {
    padding: 4px;
  }
  
  .px-10 {
    padding-left: 10px;
    padding-right: 10px;
  }
  
  .pr-2 {
    padding-right: 2px;
  }

• Reduce the size of the generated Token type by referencing category tokens

  Before:

  export type Token = 'colors.green.400' | 'colors.red.400'
  
  export type ColorToken = 'green.400' | 'red.400'

  After:

  export type Token = `colors.${ColorToken}`
  
  export type ColorToken = 'green.400' | 'red.400'