Panda with ark-ui and slots

[valkko]

Is there a detailed guide on how to set up a component theme with slot, where the root element does not accept a className property? Such as the Menu component. I'd like to use the defineParts approach, to only have the styles given once, but that seems to fall apart with this component.

I was also looking at the slot recipes part of the docs here, but there also the Typescript example link is broken. I did find a similar one in the park-ui repo, but there seems to be some type mismatch to the current version of Panda:

Argument of type 'MenuRecipe' is not assignable to parameter of type 'Recipe'.
Type 'string' is not assignable to type 'Props'. (ts 2345)

This error looks to be on the props (props) => props callback expected in createStyleContext where the recipe is providing a (props) => string one.

[segunadebayo]

Ideally, you want to use sva or defineSlotRecipe. Using defineParts might cause issues if the <Menu.Content> is portalled.

The menu root is only a provider and doesn't expose a node, making defineParts not the best choice.