Repository navigation
🪞 fix: Mirror Shared Primitives for Right-to-Left Layouts - #17265
Conversation
Codex Review SummaryThis comment shows the latest Codex review activity on this pull request.
ℹ️ About Codex in GitHubYour team has set up Codex to review pull requests in this repo. Reviews are triggered when you
Codex reacts with 👀 while any review is running, comments if it has suggestions, and reacts with 👍 once all reviews finish with no findings. |
![chatgpt-codex-connector[bot]](https://avatars.githubusercontent.com/in/1144995?s=60&v=4){kind=small}
There was a problem hiding this comment.
💡 Codex Review
Here are some automated review suggestions for this pull request.
Reviewed commit: ec4b36ae74
ℹ️ About Codex in GitHub
Your team has set up Codex to review pull requests in this repo. Reviews are triggered when you
- Open a pull request for review
- Mark a draft as ready
- Comment "@codex review".
If Codex has suggestions, it will comment; otherwise it will react with 👍.
Codex can also answer questions or update the PR. Try commenting "@codex address that feedback".
There was a problem hiding this comment.
💡 Codex Review
Here are some automated review suggestions for this pull request.
Reviewed commit: 0b32f179a0
ℹ️ About Codex in GitHub
Your team has set up Codex to review pull requests in this repo. Reviews are triggered when you
- Open a pull request for review
- Mark a draft as ready
- Comment "@codex review".
If Codex has suggestions, it will comment; otherwise it will react with 👍.
Codex can also answer questions or update the PR. Try commenting "@codex address that feedback".
codegraph-librechat
Bot
added
the
🗺️ Client UI Foundation
codegraph-librechat
Bot
added
the
🗺️ UI Foundation
4577aaf to
f11d20c
Compare
There was a problem hiding this comment.
💡 Codex Review
Here are some automated review suggestions for this pull request.
Reviewed commit: f11d20c148
ℹ️ About Codex in GitHub
Your team has set up Codex to review pull requests in this repo. Reviews are triggered when you
- Open a pull request for review
- Mark a draft as ready
- Comment "@codex review".
If Codex has suggestions, it will comment; otherwise it will react with 👍.
Codex can also answer questions or update the PR. Try commenting "@codex address that feedback".
There was a problem hiding this comment.
💡 Codex Review
Here are some automated review suggestions for this pull request.
Reviewed commit: abbbe03f1b
ℹ️ About Codex in GitHub
Your team has set up Codex to review pull requests in this repo. Reviews are triggered when you
- Open a pull request for review
- Mark a draft as ready
- Comment "@codex review".
If Codex has suggestions, it will comment; otherwise it will react with 👍.
Codex can also answer questions or update the PR. Try commenting "@codex address that feedback".
There was a problem hiding this comment.
💡 Codex Review
Here are some automated review suggestions for this pull request.
Reviewed commit: 772039f319
ℹ️ About Codex in GitHub
Your team has set up Codex to review pull requests in this repo. Reviews are triggered when you
- Open a pull request for review
- Mark a draft as ready
- Comment "@codex review".
If Codex has suggestions, it will comment; otherwise it will react with 👍.
Codex can also answer questions or update the PR. Try commenting "@codex address that feedback".
772039f to
2e00262
Compare
There was a problem hiding this comment.
💡 Codex Review
Here are some automated review suggestions for this pull request.
Reviewed commit: 2e00262a2a
ℹ️ About Codex in GitHub
Your team has set up Codex to review pull requests in this repo. Reviews are triggered when you
- Open a pull request for review
- Mark a draft as ready
- Comment "@codex review".
If Codex has suggestions, it will comment; otherwise it will react with 👍.
Codex can also answer questions or update the PR. Try commenting "@codex address that feedback".
There was a problem hiding this comment.
💡 Codex Review
Here are some automated review suggestions for this pull request.
Reviewed commit: 3b3111f346
ℹ️ About Codex in GitHub
Your team has set up Codex to review pull requests in this repo. Reviews are triggered when you
- Open a pull request for review
- Mark a draft as ready
- Comment "@codex review".
If Codex has suggestions, it will comment; otherwise it will react with 👍.
Codex can also answer questions or update the PR. Try commenting "@codex address that feedback".
There was a problem hiding this comment.
💡 Codex Review
Here are some automated review suggestions for this pull request.
Reviewed commit: f3e827644a
ℹ️ About Codex in GitHub
Your team has set up Codex to review pull requests in this repo. Reviews are triggered when you
- Open a pull request for review
- Mark a draft as ready
- Comment "@codex review".
If Codex has suggestions, it will comment; otherwise it will react with 👍.
Codex can also answer questions or update the PR. Try commenting "@codex address that feedback".
Summary
Shared components in
packages/clientused physical utilities, so in a right-to-left interface the Switch thumb travelled out of its track, Progress filled from the left, the dialog close button collided with right-aligned titles, Select, Combobox and DropdownMenu check indicators overlapped their labels, search inputs put the icon on the trailing edge with text running under it, and Radio, TimePicker and tooltip sides were mapped as LTR.The primitives now use logical utilities (
ms/me,ps/pe,inset-s/inset-e,text-start, logical radii and borders). The Switch thumb travel, Progress fill, chevrons and popover/tab animations cannot be logical, so they mirror through a newdir-rtl:variant. It matches:dir(rtl), and falls back to the nearestdirattribute in Chrome/Edge before 120. Vite's CSS minifier was lowering every:dir(rtl)to a:lang(...)list in built bundles, which mirrored by UI language and flipped LTR islands;client/vite.config.tsnow excludes that lowering.utils/direction.tsresolves physical tooltip sides and Radio arrow keys against the element's own direction. SelectDropDown keepsleft/rightphysical and adds logicalstart/enddefaults. Slider follows the Radix DirectionProvider.One of six RTL pull requests (core #17264, app shell #17266 and its class sweep #17269 have merged). Call sites on dev that should adopt
dir-rtl:andstart/endare tracked in berry-13#408.Type of change
Testing
Tested environments/configuration:
lang=ar, documentdir="rtl"), plus an English pass for LTR regressionsAutomated tests:
utils/direction.spec.ts, RTL arrow-key cases inRadio.spec.tsxandTimePicker.spec.tsx, and a negated travel token case intheme/tailwind.spec.jsDataTableSearch.spec.tsx,SecretInput.spec.tsxandInputNumber.spec.tsxfor logical classesrtl-primitives.spec.ts(switch, dialog close, floating label, tooltip side) runs against the built bundle withlang="en"anddir="rtl", so a lowered:dir()fails itjestin packages/client;tsc --noEmitfor packages/client and client; ESLint and static checks passScreenshots / recordings
The after shots were taken with all six RTL pull requests merged together locally; the before shots are from
dev.Risk / compatibility
LTR output is unchanged: logical utilities resolve to the same physical sides under
dir="ltr". Callers that passside="left"/"right"to TooltipAnchor or InfoHoverCard now get the mirrored side in RTL.Checklist