Skip to content

fix: do not wrap checkbox labels with ReactNode in text - #838

Merged
hcopp merged 5 commits into
masterfrom
hunter/checkbox-fonts
Aug 25, 2026
Merged

hcopp merged 5 commits into
masterfrom
hunter/checkbox-fonts

Conversation

@hcopp

@hcopp hcopp commented Aug 10, 2026

Copy link
Copy Markdown
Contributor

What changed? Why?

This PR fixes <Checkbox ...><Text font="label2">My checkbox label</Text></Checkbox> and other instances where teams pass in custom ReactNodes into checkbox. Previously it would appear to have incorrect vertical text alignment.

Root cause (required for bugfixes)

Control picked 'children' from TextProps which supports ReactNode but it didn't handle the case of users passing in a custom reactnode differently than string. As a result, we received misaligned text in these instances.

UI changes

iOS Old iOS New
Web Old Web New

Testing

How has it been tested?

  • Unit tests
  • Interaction tests
  • Pseudo State tests
  • Manual - Web
  • Manual - Android (Emulator / Device)
  • Manual - iOS (Emulator / Device)

Testing instructions

Illustrations/Icons Checklist

Required if this PR changes files under packages/illustrations/** or packages/icons/**

  • verified visreg changes with Terran (include link to visreg run/approval)
  • all illustration/icons names have been reviewed by Dom and/or Terran

Change management

type=routine
risk=low
impact=sev5

automerge=false

@hcopp hcopp self-assigned this Aug 10, 2026
@cb-heimdall

cb-heimdall commented Aug 10, 2026 •

Copy link
Copy Markdown
Collaborator

✅ Heimdall Review Status

Requirement Status More Info
Reviews ✅ 1/1
Denominator calculation
Show calculation
1 if user is bot 0
1 if user is external 0
2 if repo is sensitive 0
From .codeflow.yml 1
Additional review requirements
Show calculation
Max 0
0
From CODEOWNERS 1
Global minimum 0
Max 1
1
1 if commit is unverified 0
Sum 1
CODEOWNERS ✅ See below

✅ CODEOWNERS

Code Owner Status Calculation
ui-systems-eng-team ✅ 1/1
Denominator calculation
Additional CODEOWNERS Requirement
Show calculation
Sum 0
0
From CODEOWNERS 1
Sum 1

@hcopp
hcopp marked this pull request as ready for review August 25, 2026 15:07
@github-actions

github-actions Bot commented Aug 25, 2026 •

Copy link
Copy Markdown
Contributor

onChange={(event) => setIsCondensed(event.currentTarget.checked)}
>
Spacing variant: {spacingVariant}
{`Spacing variant: ${spacingVariant}`}

Copy link
Copy Markdown
Contributor

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

nit: why do we need the template literal here

Copy link
Copy Markdown
Contributor Author

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

It was labeled as a react node without this change

Copy link
Copy Markdown
Contributor Author

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

@adrienzheng-cb does that make you concerned to make this change as a whole?

@hcopp
hcopp merged commit 1ad871b into master Aug 25, 2026
36 of 39 checks passed
@hcopp
hcopp deleted the hunter/checkbox-fonts branch August 25, 2026 18:14
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Development

Successfully merging this pull request may close these issues.

3 participants