Cypress testing props in component

I am currently doing an integration test with Cypress and there is a point where I don't know how to solve in the proper way (meaning that I don't want to use the cypress selector tool in order to get a certain element within the DOM)

The situation being that I work with a 'in-house' styling library, therefore my go-to blogs and such is a bit limited. As an example of many, I have a checkbox like below:

                               <RadioButton
                                    left={{
                                        label: 'yes',
                                        value: true,
                                    }}
                                    right={{
                                        label: 'no',
                                        value: false,
                                    }}

                                />

So, as you would imagine, if I add an id to this component, cypress will find one element, which makes it impossible to afterwards ask to 'click' in one of them to test what happens when the state is changed.

Any idea on how can I approach this issue?

The <RadioButton> splits into two elements, one with "Yes" and the other with "No".

To select one or the other sub-elements, add the id to the container and use what Cypress calls Traversal commands, maybe this

cy.get('#radiobutton')  // select parent with id
  .children()           // both Yes and No sub-elements
  .eq(0)                // pick Yes
  .click()

Inspect the DOM of the web page to see exactly what shape the elements have.