Sp-card destroys built in sp-checkbox

Hi, I’m using the sp-card component in Photoshop UXP. I’m using the swc-wrapper and recommended resolution version for sp-card from the list of supported SWC components.

sp-card however has a dependency to sp-checkbox, which is a built in UXP widget. So whenever you need to use sp-card, it will mess up the rendering of sp-checkbox.

Any ideas on how I can get sp-card to work with the widget version/“built in” sp-checkbox?

sp-checkbox without sp-card:
image

sp-checkbox with sp-card:
image

What if you import sp-checkbox also from SWC instead of using UXP built-in? Would that fix the problem?

Unfortunately not, that causes a conflict on startup trying to register custom element sp-checkbox (since it’s already registered)

I tried downgrading the sp-checkbox component through package.json resolution section, all the way down to version 0.5.9, but still no luck. So my guess is that the built in widget sp-checkbox is customized, and no equivalent can be resolved through NPM.

Which would mean sp-card cannot be used together with sp-checkbox, which in turn should be noted in the SWC components compatibility list.

Based on this @indranil’s post I was under impression, that when you import SWC, it overrides Spectrum UXP widget :confused:

Can you try aliasing the components during the build time ?
Would suggest to do a

yarn add @swc-uxp-wrappers/utils

and add the alias configuration inside webpack config.

Also, can you try the template that should avoid the boilerplate issues like this ?
Vanilla-js template

Due to project time constraints I switched to standard input type=“checkbox”, not as pleasant as sp-checkbox with click areas etc but it works.