@pandacss/token-dictionary - npm Package Versions

[0.47.0] - 2024-10-18

Added

Add support for cursor token types. Useful for tokenizing cursor types for interactive components.

Here's an example of how to define a cursor token in your panda.config.ts file:

// panda.config.ts
export default defineConfig({
  theme: {
    extend: {
      tokens: {
        cursor: {
          button: { value: 'pointer' },
          checkbox: { value: 'default' },
        },
      },
    },
  },
})

Then you can use the cursor token in your styles or recipes.

<button className={css({ cursor: 'button' })}>Click me</button>

This makes it easy to manage cursor styles across your application.

Changed

Improve preflight css such that elements with hidden=until-found are visible. Previously, we always hide all elements with the hidden attribute

[0.46.1] - 2024-09-09

Fixed

Fix issue where using container query in static css results in empty styles.

[0.46.0] - 2024-09-09

Fixed

• Fix: use sizing tokens for flexBasis instead of spacing tokens
• Fix issue where nesting @scope rule that use the & don't expand correctly

Added

Add support native css nesting in template literal mode. Prior to this change, you need to add & to all nested selectors.

Before:

css`
  & p {
    color: red;
  }
`

After:

css`
  p {
    color: red;
  }
`

Good to know: Internally, this will still convert to p to & p, but the generated css will work as expected.