carbon
carbon copied to clipboard
Profile cant receive mb
Description
I am doing a selector, which includes a checkbox and a profile. Cant align profile with checkbox. Neither using a box with profile inside.
Reproduction
https://stackblitz.com/edit/parsium-carbon-starter-jh1lf5?file=src%2FApp.tsx
Steps to reproduce
No response
JIRA ticket numbers (Sage only)
No response
Suggested solution
Integrate components Checkbox in Profile.
Carbon version
latest
Design tokens version
4.29.0
Relevant browsers
Chrome
Relevant OSs
MacOS
Additional context
No response
Confidentiality
- [X] I confirm there is no confidential or commercially sensitive information included.
Hi @emgosa yeah, this is an issue with the type interface on Profile, which should extend MarginProps. Margins are still applied, but unfortunately there is still a type error.
Thanks for sending over that template - I'd recommend using a different pattern though to achieve alignment. Instead of passing the Portrait component as a node via the label prop on Checkbox I'd keep the components separate and just use the same string value that you pass to name on Profile as the aria-label prop on Checkbox . After adding some flex attributes to the Box above in the DOM, they can align quite nicely (sandbox here: https://stackblitz.com/edit/parsium-carbon-starter-ikzxfr?file=src%2FApp.tsx)
FE-6392
:tada: This issue has been resolved in version 128.3.1 :tada:
The release is available on:
Your semantic-release bot :package::rocket: