chakra-ui/panda @pandacss/core@0.21.0

on GitHub

Minor Changes

• 26e6051: Add an escape-hatch for arbitrary values when using config.strictTokens, by prefixing the value with [
  and suffixing with ], e.g. writing [123px] as a value will bypass the token validation.

  import { css } from '../styled-system/css'
  
  css({
    // @ts-expect-error TS will throw when using from strictTokens: true
    color: '#fff',
    // @ts-expect-error TS will throw when using from strictTokens: true
    width: '100px',
  
    // ✅ but this is now allowed:
    bgColor: '[rgb(51 155 240)]',
    fontSize: '[12px]',
  })

Patch Changes

• 788aaba: Fix an edge-case when Panda eagerly extracted and tried to generate the CSS for a JSX property that contains
  an URL.

  const App = () => {
    // here the content property is a valid CSS property, so Panda will try to generate the CSS for it
    // but since it's an URL, it would produce invalid CSS
    // we now check if the property value is an URL and skip it if needed
    return <CopyButton content="https://www.buymeacoffee.com/grizzlycodes" />
  }

• d81dcbe: - Fix an issue where recipe variants that clash with utility shorthand don't get generated due to the
  normalization that happens internally.

  • Fix issue where Preact JSX types are not merging recipes correctly

• 105f74c: Add a way to specify a recipe's staticCss options from inside a recipe config, e.g.:

  import { defineRecipe } from '@pandacss/dev'
  
  const card = defineRecipe({
    className: 'card',
    base: { color: 'white' },
    variants: {
      size: {
        small: { fontSize: '14px' },
        large: { fontSize: '18px' },
      },
    },
    staticCss: [{ size: ['*'] }],
  })

  would be the equivalent of defining it inside the main config:

  import { defineConfig } from '@pandacss/dev'
  
  export default defineConfig({
    // ...
    staticCss: {
      recipes: {
        card: {
          size: ['*'],
        },
      },
    },
  })

• Updated dependencies [26e6051]

• Updated dependencies [5b06161]

• Updated dependencies [105f74c]

  • @pandacss/shared@0.21.0
  • @pandacss/types@0.21.0
  • @pandacss/token-dictionary@0.21.0
  • @pandacss/error@0.21.0
  • @pandacss/logger@0.21.0