@pandacss/is-valid-prop

The README file is missing

Changelog

[0.34.2] - 2024-03-08

Fixed

• Fix strictPropertyValues with border* properties

We had listed border\* properties as affected by strictPropertyValues but they shouldn't be restricted as their syntax is too complex to be restricted. This removes any border* properties that do not specifically end with Style like borderTopStyle.

import { css } from '../styled-system/css'

css({
  borderTop: '1px solid red', // ✅ will now be fine as it should be
  borderTopStyle: 'abc', // ✅ will still report a TS error
})

• Fix a false positive with the validation check that reported Missing token when using a color opacity modifier in config tokens or semanticTokens

import { defineConfig } from '@pandacss/dev'

export default defineConfig({
  validation: 'warn',
  conditions: {
    light: '.light &',
    dark: '.dark &',
  },
  theme: {
    tokens: {
      colors: {
        blue: { 500: { value: 'blue' } },
        green: { 500: { value: 'green' } },
      },
      opacity: {
        half: { value: 0.5 },
      },
    },
    semanticTokens: {
      colors: {
        secondary: {
          value: {
            base: 'red',
            _light: '{colors.blue.500/32}',
            _dark: '{colors.green.500/half}',
          },
        },
      },
    },
  },
})

Would incorrectly report:

• [tokens] Missing token: colors.green.500/half used in config.semanticTokens.colors.secondary
• [tokens] Missing token: colors.blue.500/32 used in config.semanticTokens.colors.secondary

Added

Allow using namespaced imports

import * as p from 'styled-system/patterns'
import * as recipes from 'styled-system/recipes'
import * as panda from 'styled-system/css'

// this will now be extracted
p.stack({ mt: '40px' })

recipes.cardStyle({ rounded: true })

panda.css({ color: 'red' })
panda.cva({ base: { color: 'blue' } })
panda.sva({ base: { root: { color: 'green' } } })