Select a recipe's slot inside another slot in the recipe definition

[RemyMachado]

I was wondering if there was a way to select a slot inside another.
Here's what I tried and I think it illustrates well what I'm trying to do:

defineSlotRecipe({
  slots: ['slot1', 'slot2'],
  base: {
    slot1: {
       '& > slot2': {
         color: '2'
      }
    },

    slot2: {
      color: '1'
    },
  }
}

I also tried using the class selector, & > .slot2 (but it's obviously not working since the slot names aren't equal to their final classname)

[astahmer]

hey, recipes have deterministic className generation based on this: ${className}__${slotName}

const button = defineRecipe({
  className: 'btn',
  slots: ['root', 'text'],
  base: {
    root: {
      bg: 'blue.500',
      _hover: {
        // v--- 🎯 this will target the `text` slot
        '& .btn__text': {
          color: 'white',
        },
      },
    },
  },
})

also, I just added a PR to do the same with sva #2348

[paveldubovitsky]

It doesn‘t work if the hash is enabled