fix: color-mix in semanticTokens conditions

[astahmer]

Closes #2318

📝 Description

Fix the color opacity modifier syntax for semanticTokens inside of conditions

import { defineConfig } from '@pandacss/dev'

export default defineConfig({
  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}', // <-- wasn't working as expected
            _dark: '{colors.green.500/half}',
          },
        },
      },
    },
  },
})

will now correctly generate the following CSS:

@layer tokens {
  :where(:root, :host) {
    --colors-blue-500: blue;
    --colors-green-500: green;
    --opacity-half: 0.5;
    --colors-secondary: red;
  }

  .light {
    --colors-secondary: color-mix(in srgb, var(--colors-blue-500) 32%, transparent);
  }

  .dark {
    --colors-secondary: color-mix(in srgb, var(--colors-green-500) 50%, transparent);
  }
}

💣 Is this a breaking change (Yes/No):

no

[changeset-bot]

🦋 Changeset detected

Latest commit: 2b1df09

The changes in this PR will be included in the next version bump.

This PR includes changesets to release 20 packages

Name	Type
@pandacss/token-dictionary	Patch
@pandacss/generator	Patch
@pandacss/dev	Patch
@pandacss/core	Patch
@pandacss/fixture	Patch
@pandacss/node	Patch
@pandacss/studio	Patch
@pandacss/parser	Patch
@pandacss/astro-plugin-studio	Patch
@pandacss/postcss	Patch
@pandacss/config	Patch
@pandacss/extractor	Patch
@pandacss/is-valid-prop	Patch
@pandacss/logger	Patch
@pandacss/preset-atlaskit	Patch
@pandacss/preset-base	Patch
@pandacss/preset-open-props	Patch
@pandacss/preset-panda	Patch
@pandacss/shared	Patch
@pandacss/types	Patch

Not sure what this means? Click here to learn what changesets are.

Click here if you're a maintainer who wants to add another changeset to this PR

[vercel]

The latest updates on your projects. Learn more about Vercel for Git ↗︎

Name	Status	Preview	Updated (UTC)
panda-docs	✅ Ready (Inspect)	Visit Preview	Mar 6, 2024 10:16pm
panda-playground	✅ Ready (Inspect)	Visit Preview	Mar 6, 2024 10:16pm
panda-studio	✅ Ready (Inspect)	Visit Preview	Mar 6, 2024 10:16pm