chakra-ui/panda @pandacss/compiler@2.0.0-beta.10

on GitHub

Minor Changes

• 05e085d: With a single-level designSystem, panda codegen reuses the library's styled-system instead of copying it.
  Your app only generates the delta (extra tokens, recipes, patterns). Missing library exports fail with
  design_system_export_missing instead of a silent bundler error.

  export default defineConfig({
    designSystem: '@acme/ds',
  })

• d2bea8a: css() and JSX style props can resolve simple pure helpers — local or imported arrow functions, function
  declarations, and IIFEs. token() comparisons inside those helpers resolve too.

  const pad = (n: number) => ({ padding: `${n}px` })
  css(pad(4)) // extracted

• f8027f3: Fix CSS cascade order, token pruning, and conditional JSX spreads where a later static prop overrides a
  spread. Design-system tree-shaking now runs before every CSS read/write path, not only cssgen / writeCss.

  getSplitCss() is a breaking shape change for direct callers:

  // before
  const files = compiler.getSplitCss()
  
  // after
  const { files, diagnostics } = compiler.getSplitCss()

• ebe9f5b: Add getKeyframeCss() to emit theme @keyframes without token vars or other layers.

• 52e84e6: Add native cascade-layer polyfill via polyfill / --polyfill (no PostCSS plugin required).

• a79c917: Opt into optimize.treeshakeDesignSystem to hydrate only the design-system modules your app imports, instead
  of the whole build-info artifact.

• 2714583: Add viewTransition() for the View Transitions API. Pass slot styles, get a stable vt_* bag class, and
  Panda emits the matching ::view-transition-* rules. Import from styled-system/css. You still set unique
  view-transition-name values at runtime — Panda only owns the shared CSS. Design-system build info carries the bags
  so apps hydrate them without re-extracting.

  import { viewTransition } from 'styled-system/css'
  
  const slide = viewTransition({
    group: { animationDuration: '0.4s' },
    old: { opacity: 0 },
    new: { opacity: 1 },
  })

  // React / Next
  import { ViewTransition } from 'react'
  
  ;<ViewTransition name="hero" share={slide}>
    <img src="…" alt="…" />
  </ViewTransition>

  <!-- Astro -->
  <img class="{slide}" transition:name="hero" src="…" alt="…" />

  // Solid / Nuxt — framework starts the transition; you attach name + bag class
  <img class={slide} style={{ viewTransitionName: 'hero' }} src="…" alt="…" />

Patch Changes

• 05e085d: Fix panda lib / panda buildinfo writing panda: "*" when the design system has no @pandacss/dev peer.
  That range couldn't hydrate (manifest requires Panda *). Both commands now fall back to the running Panda major (for
  example ^2.0.0). Pass --panda to set the range yourself.

• 05e085d: Stop panda lib from writing unpublishable peer ranges into panda.lib.json. A catalog: or workspace:*
@pandacss/dev range now falls back to the running Panda's major instead of being stamped verbatim. Pass
  --panda <range> to set one explicitly.

• 05e085d: panda lib publishes machine artifacts under ./panda/*, with manifest files paths relative to the lib
  outdir. Recipe/pattern runtime overlays only kick in when the design system owns that category.

• 5c060e7: Apply custom utility transform functions everywhere styles are authored.

  Custom-utility transforms (and their shorthands) now run inside cva/sva, styled recipes, globalCss, and
  composition styles (textStyles/layerStyles/animationStyles) — including conditional values — matching css()
  and config recipes. This fixes preset-base's shadowColor/textShadowColor and any user utility that maps a value to
  a custom property.

• Updated dependencies [05e085d]

• Updated dependencies [05e085d]

• Updated dependencies [f8027f3]

• Updated dependencies [ebe9f5b]

• Updated dependencies [05e085d]

• Updated dependencies [52e84e6]

• Updated dependencies [05e085d]

• Updated dependencies [a79c917]

• Updated dependencies [2714583]

  • @pandacss/compiler-shared@2.0.0-beta.10
  • @pandacss/config@2.0.0-beta.10
  • @pandacss/types@2.0.0-beta.10