How to use Atomic Recipes in conditional styles?

[ymcheung]

Hello!

I have an Astro 5.7 project with panda-css 0.54.

Example url: https://codesandbox.io/p/devbox/condescending-nash-7hjcll?file=%2Fsrc%2Fpages%2Findex.astro%3A77%2C29

I use "&:nth-of-type(odd)" to create styles for a list. I want to use cva() in "&:nth-of-type(odd)":

---
import "../index.css";
import { css, cx } from "../../styled-system/css";
import { border } from "../styles/border";
---

...
"&:nth-of-type(odd)": {
  paddingInlineEnd: 2,
  ...border.raw({ side: "inlineEnd", inBackground: "none" }),
}
...

Panda-css did create classnames from border.raw(), but there is no styles from them.

I also tried:

"&:nth-of-type(odd)": css.raw({
  paddingInlineEnd: 2,
  ...border.raw({ side: "inlineEnd", inBackground: "none" }),
}),

Did I miss anything? Thank you!

[segunadebayo]

This is a compiler limitation at the moment, you can spread styles within a selector or at-rule.

We consider supporting this in the future.