| author |  Julius Marminge <julius0216@outlook.com> 2026-09-22 12:22:19-07:00 |
| committer |  GitHub <noreply@github.com> 2026-09-22 12:22:19-07:00 |
| log | 4321aa24fd21c2b5360cc58e84de4ccc09c801f9 |
| tree | 50d772914eafc6586bd23ec5309adfd5aee89355 |
| parent | 0ee02ebf228769beec4b240db6254ba2bad565af |
| signature | Signed by PGP key B5690EEEBB952194 |
refactor(web): one row height for select, combobox and radio items (#13041)
Co-authored-by: Claude Fable 5 <noreply@anthropic.com>8 files changed, 12 insertions(+), 17 deletions(-)
apps
web
src
scripts
apps/web/src/components/DiffPanel.tsx+2-2
| ... | @@ -773,7 +773,7 @@ export default function DiffPanel({ | ... | @@ -773,7 +773,7 @@ export default function DiffPanel({ |
| 773 | <ComboboxEmpty>No matching refs.</ComboboxEmpty> | 773 | <ComboboxEmpty>No matching refs.</ComboboxEmpty> |
| 774 | <ComboboxList className="max-h-64 min-w-0 overflow-x-hidden"> | 774 | <ComboboxList className="max-h-64 min-w-0 overflow-x-hidden"> |
| 775 | <ComboboxItem | 775 | <ComboboxItem |
| 776 | className="h-8 w-full min-w-0 grid-cols-[1rem_minmax(0,1fr)] py-0" | 776 | className="w-full min-w-0 grid-cols-[1rem_minmax(0,1fr)]" |
| 777 | contentClassName="w-full min-w-0 overflow-hidden" | 777 | contentClassName="w-full min-w-0 overflow-hidden" |
| 778 | value={AUTOMATIC_BASE_REF} | 778 | value={AUTOMATIC_BASE_REF} |
| 779 | > | 779 | > |
| ... | @@ -786,7 +786,7 @@ export default function DiffPanel({ | ... | @@ -786,7 +786,7 @@ export default function DiffPanel({ |
| 786 | return ( | 786 | return ( |
| 787 | <ComboboxItem | 787 | <ComboboxItem |
| 788 | key={choice.id} | 788 | key={choice.id} |
| 789 | className="h-8 w-full min-w-0 grid-cols-[1rem_minmax(0,1fr)] py-0" | 789 | className="w-full min-w-0 grid-cols-[1rem_minmax(0,1fr)]" |
| 790 | contentClassName="w-full min-w-0 overflow-hidden" | 790 | contentClassName="w-full min-w-0 overflow-hidden" |
| 791 | value={item} | 791 | value={item} |
| 792 | > | 792 | > |
apps/web/src/components/LegacySidebar.tsx+2-2
| ... | @@ -2758,7 +2758,7 @@ function ProjectSortMenu({ | ... | @@ -2758,7 +2758,7 @@ function ProjectSortMenu({ |
| 2758 | > | 2758 | > |
| 2759 | {(Object.entries(SIDEBAR_SORT_LABELS) as Array<[SidebarProjectSortOrder, string]>).map( | 2759 | {(Object.entries(SIDEBAR_SORT_LABELS) as Array<[SidebarProjectSortOrder, string]>).map( |
| 2760 | ([value, label]) => ( | 2760 | ([value, label]) => ( |
| 2761 | <MenuRadioItem key={value} value={value} className="min-h-7 py-1 sm:text-xs"> | 2761 | <MenuRadioItem key={value} value={value}> |
| 2762 | {label} | 2762 | {label} |
| 2763 | </MenuRadioItem> | 2763 | </MenuRadioItem> |
| 2764 | ), | 2764 | ), |
| ... | @@ -2778,7 +2778,7 @@ function ProjectSortMenu({ | ... | @@ -2778,7 +2778,7 @@ function ProjectSortMenu({ |
| 2778 | {( | 2778 | {( |
| 2779 | Object.entries(SIDEBAR_THREAD_SORT_LABELS) as Array<[SidebarThreadSortOrder, string]> | 2779 | Object.entries(SIDEBAR_THREAD_SORT_LABELS) as Array<[SidebarThreadSortOrder, string]> |
| 2780 | ).map(([value, label]) => ( | 2780 | ).map(([value, label]) => ( |
| 2781 | <MenuRadioItem key={value} value={value} className="min-h-7 py-1 sm:text-xs"> | 2781 | <MenuRadioItem key={value} value={value}> |
| 2782 | {label} | 2782 | {label} |
| 2783 | </MenuRadioItem> | 2783 | </MenuRadioItem> |
| 2784 | ))} | 2784 | ))} |
apps/web/src/components/Sidebar.tsx+1-1
| ... | @@ -4491,7 +4491,7 @@ export default function Sidebar() { | ... | @@ -4491,7 +4491,7 @@ export default function Sidebar() { |
| 4491 | key={item.value} | 4491 | key={item.value} |
| 4492 | hideIndicator | 4492 | hideIndicator |
| 4493 | value={item} | 4493 | value={item} |
| 4494 | className="h-8 min-h-8 py-0 font-medium" | 4494 | className="font-medium" |
| 4495 | contentClassName="flex min-w-0 items-center gap-2" | 4495 | contentClassName="flex min-w-0 items-center gap-2" |
| 4496 | onContextMenu={(event) => { | 4496 | onContextMenu={(event) => { |
| 4497 | if (project) handleProjectSettings(event, project); | 4497 | if (project) handleProjectSettings(event, project); |
apps/web/src/components/chat/ChatComposer.tsx+1-1
| ... | @@ -1164,7 +1164,7 @@ const ComposerFooterModeControls = memo(function ComposerFooterModeControls(prop | ... | @@ -1164,7 +1164,7 @@ const ComposerFooterModeControls = memo(function ComposerFooterModeControls(prop |
| 1164 | const option = runtimeModeConfig[mode]; | 1164 | const option = runtimeModeConfig[mode]; |
| 1165 | const OptionIcon = option.icon; | 1165 | const OptionIcon = option.icon; |
| 1166 | return ( | 1166 | return ( |
| 1167 | <SelectItem key={mode} value={mode} hideIndicator className="min-w-64 py-2"> | 1167 | <SelectItem key={mode} value={mode} hideIndicator className="min-w-64"> |
| 1168 | <div className="flex min-w-0 items-center gap-3"> | 1168 | <div className="flex min-w-0 items-center gap-3"> |
| 1169 | <div className="grid min-w-0 flex-1 gap-0.5"> | 1169 | <div className="grid min-w-0 flex-1 gap-0.5"> |
| 1170 | <span className="inline-flex items-center gap-1.5 font-medium text-foreground"> | 1170 | <span className="inline-flex items-center gap-1.5 font-medium text-foreground"> |
apps/web/src/components/pullRequest/PullRequestCandidatePicker.tsx-1
| ... | @@ -147,7 +147,6 @@ export function PullRequestCandidatePicker<T>({ | ... | @@ -147,7 +147,6 @@ export function PullRequestCandidatePicker<T>({ |
| 147 | index={index} | 147 | index={index} |
| 148 | value={keys[index]} | 148 | value={keys[index]} |
| 149 | disabled={disabled} | 149 | disabled={disabled} |
| 150 | className="min-h-0 py-1.5 text-xs sm:min-h-0 sm:text-xs" | ||
| 151 | contentClassName="flex min-w-0 items-center gap-2" | 150 | contentClassName="flex min-w-0 items-center gap-2" |
| 152 | > | 151 | > |
| 153 | {children(candidate)} | 152 | {children(candidate)} |
apps/web/src/components/settings/KeybindingsSettings.tsx+4-8
| ... | @@ -326,7 +326,7 @@ function WhenVariableSelect({ | ... | @@ -326,7 +326,7 @@ function WhenVariableSelect({ |
| 326 | </SelectTrigger> | 326 | </SelectTrigger> |
| 327 | <SelectContent alignItemWithTrigger={false} matchTriggerWidth={false} className="max-h-72"> | 327 | <SelectContent alignItemWithTrigger={false} matchTriggerWidth={false} className="max-h-72"> |
| 328 | {options.map((option) => ( | 328 | {options.map((option) => ( |
| 329 | <SelectItem key={option} value={option} className="min-h-7 w-full py-1 text-[12px]"> | 329 | <SelectItem key={option} value={option} className="w-full"> |
| 330 | <span className="truncate">{option}</span> | 330 | <span className="truncate">{option}</span> |
| 331 | </SelectItem> | 331 | </SelectItem> |
| 332 | ))} | 332 | ))} |
| ... | @@ -530,12 +530,8 @@ function WhenExpressionNodeEditor({ | ... | @@ -530,12 +530,8 @@ function WhenExpressionNodeEditor({ |
| 530 | <SelectValue /> | 530 | <SelectValue /> |
| 531 | </SelectTrigger> | 531 | </SelectTrigger> |
| 532 | <SelectContent alignItemWithTrigger={false} matchTriggerWidth={false}> | 532 | <SelectContent alignItemWithTrigger={false} matchTriggerWidth={false}> |
| 533 | <SelectItem value="and" className="min-h-7 py-1 text-[12px]"> | 533 | <SelectItem value="and">and</SelectItem> |
| 534 | and | 534 | <SelectItem value="or">or</SelectItem> |
| 535 | </SelectItem> | ||
| 536 | <SelectItem value="or" className="min-h-7 py-1 text-[12px]"> | ||
| 537 | or | ||
| 538 | </SelectItem> | ||
| 539 | </SelectContent> | 535 | </SelectContent> |
| 540 | </Select> | 536 | </Select> |
| 541 | <Button type="button" variant="outline" size="compact" onClick={addCondition}> | 537 | <Button type="button" variant="outline" size="compact" onClick={addCondition}> |
| ... | @@ -1145,7 +1141,7 @@ function NewKeybindingCommandSelect({ | ... | @@ -1145,7 +1141,7 @@ function NewKeybindingCommandSelect({ |
| 1145 | </SelectTrigger> | 1141 | </SelectTrigger> |
| 1146 | <SelectContent alignItemWithTrigger={false} matchTriggerWidth={false} className="max-h-72"> | 1142 | <SelectContent alignItemWithTrigger={false} matchTriggerWidth={false} className="max-h-72"> |
| 1147 | {commandOptions.map((command) => ( | 1143 | {commandOptions.map((command) => ( |
| 1148 | <SelectItem key={command} value={command} className="min-h-7 w-full py-1 text-[12px]"> | 1144 | <SelectItem key={command} value={command} className="w-full"> |
| 1149 | <span className="truncate">{commandLabel(command)}</span> | 1145 | <span className="truncate">{commandLabel(command)}</span> |
| 1150 | </SelectItem> | 1146 | </SelectItem> |
| 1151 | ))} | 1147 | ))} |
apps/web/src/components/settings/ProjectDefaultsSettings.tsx+1-1
| ... | @@ -264,7 +264,7 @@ export function ProjectDefaultsSettings({ category }: { category: ProjectSetting | ... | @@ -264,7 +264,7 @@ export function ProjectDefaultsSettings({ category }: { category: ProjectSetting |
| 264 | const option = runtimeModeConfig[mode]; | 264 | const option = runtimeModeConfig[mode]; |
| 265 | const Icon = option.icon; | 265 | const Icon = option.icon; |
| 266 | return ( | 266 | return ( |
| 267 | <SelectItem key={mode} value={mode} className="min-w-64 py-2"> | 267 | <SelectItem key={mode} value={mode} className="min-w-64"> |
| 268 | <div className="grid gap-0.5"> | 268 | <div className="grid gap-0.5"> |
| 269 | <span className="inline-flex items-center gap-1.5 font-medium"> | 269 | <span className="inline-flex items-center gap-1.5 font-medium"> |
| 270 | <Icon className="size-3.5 shrink-0 text-muted-foreground" /> | 270 | <Icon className="size-3.5 shrink-0 text-muted-foreground" /> |
scripts/lint-restyle-ceiling.ts+1-1
| ... | @@ -8,7 +8,7 @@ import * as NodeURL from "node:url"; | ... | @@ -8,7 +8,7 @@ import * as NodeURL from "node:url"; |
| 8 | // components/ui exports are migrated to variants (see vite.config.ts). This gate keeps the | 8 | // components/ui exports are migrated to variants (see vite.config.ts). This gate keeps the |
| 9 | // count from growing: CI fails when findings exceed the ceiling. Lower the ceiling when you | 9 | // count from growing: CI fails when findings exceed the ceiling. Lower the ceiling when you |
| 10 | // migrate a file, and delete this script when the rule becomes an error. | 10 | // migrate a file, and delete this script when the rule becomes an error. |
| 11 | export const RESTYLE_CEILING = 737; | 11 | export const RESTYLE_CEILING = 717; |
| 12 | 12 | ||
| 13 | const RULE = "shadcn(no-restyle)"; | 13 | const RULE = "shadcn(no-restyle)"; |
| 14 | 14 |