Skip to content

fix(emcn): normalize MoreHorizontal and TerminalWindow geometry - #6265

Merged
waleedlatif1 merged 1 commit into
stagingfrom
fix/emcn-more-horizontal-terminal-geometry
Aug 4, 2026
Merged

fix(emcn): normalize MoreHorizontal and TerminalWindow geometry#6265
waleedlatif1 merged 1 commit into
stagingfrom
fix/emcn-more-horizontal-terminal-geometry

Conversation

@waleedlatif1

Copy link
Copy Markdown
Collaborator

The sidebar row's ... renders visibly oversized. Root cause: MoreVertical was migrated to the house geometry and MoreHorizontal was left behind.

viewBox build dot Ø span
MoreVertical -1 -2 24 24 stroke 1.55 1.78px 8.78px
MoreHorizontal (before) 0 0 12 3 fill 3.17px 14.00px
MoreHorizontal (after) -1 -2 24 24 stroke 1.55 1.78px 8.80px

(measured at size-[14px])

They are the same glyph rotated 90°, in the same overflow-menu role. Because 12×3 is far wider than tall, a square size class scales by 14/12 and the dots stretch edge-to-edge, while every neighbour on that row sits well inside (Folder 9.7px, ChevronRight 9.4px, Lock 11.2px).

Redrawn as the exact transpose of MoreVertical about (10.25, 9.75) — same radius, same stroke, same 6-unit spacing. Both now measure 8.80px, mirrored (8.8×1.8 vs 1.8×8.8).

TerminalWindow — same class, found by the sweep

RESOURCE_REGISTRY renders ten icons side by side as tabs at size-[14px]:

Library 12.05  Task 12.05  Workflow 12.05  Connections 11.20
Database 11.20  Globe 10.30            <- all stroke 0.90
TerminalWindow 14.00  FILL  viewBox 0 0 16 14   <- lone outlier

Redrawn on the 24-box keeping its character (window + title bar + three chrome dots): now 10.85px, and the strip is uniform at 10.30–12.05px / 0.90px stroke.

Call-site changes that must ship with the viewBox change

  • panel.tsx:696 passed no size inside <Button className='size-[30px]'>. Button has no [&_svg]:size-*, so the icon renders at its intrinsic size — it would have jumped 12×3 → 24×24 inside a 30px button. Now explicitly size-[14px].
  • sidebar.tsx:274 and :1615 used size-[9px]compensations for the oversized glyph (9px against a 12-wide box yields a ~9px span). Against the 24-box they would render 5.64px, so they move to size-[14px]8.78px, exactly MoreVertical.

Every other site was verified: 8 more MoreHorizontal sites already pass a square size; the two unsized ones sit inside DropdownMenuItemAction, which force-sizes [&_svg]:size-[16px]. All 6 TerminalWindow sites resolve to square sizes (3 explicit, 3 via caller classNameresource-tabs size-[14px], recently-deleted size-5, ContextMentionIcon size-[12px]/size-[14px]). No aspect-ratio (h-[N] w-[M]) sizing anywhere in either call graph, so nothing letterboxes.

How this was found

All 168 icon components were measured by rendering each at 20× and scanning the alpha channel for its true ink bounding box, rather than estimating from path coordinates. Median span is 11.45px at size-[14px]. Both redraws were rendered against their real neighbours and visually checked before committing.

Verified not bugs

  • Sim, Wordmark, Blimp — brand marks; Play — deliberately filled (PlayOutline is the stroke variant)
  • BubbleChatClose/Preview — both 0 0 14 14 filled at 12.6px, but they only ever toggle against each other
  • DocumentAttachment — 13.55px, but zero call sites (exported from the barrel, unused)
  • The remaining >12.5px icons are all standard 0 0 24 24 / 0.90 stroke — that's glyph shape, not geometry

Checks

biome clean · type-check --force 23/23 (0 cached) · no test references either icon; the 5 sidebar collection errors are pre-existing — a pristine origin/staging worktree reproduces the same 5 with zero changes applied.

MoreVertical was migrated to the house geometry; MoreHorizontal was left
on its original 0 0 12 3 fill construction. Because that box is far wider
than it is tall, a square size class scales it by 14/12 and the dots
stretch edge to edge: 3.17px dots across a 14px span, where MoreVertical
draws 1.78px dots across 8.78px. The two are the same glyph rotated 90deg
and sit in the same overflow-menu role, so the mismatch is visible on any
row carrying one.

Redraw MoreHorizontal as the exact transpose of MoreVertical about
(10.25, 9.75). Both now measure 8.80px.

TerminalWindow had the same problem in the resource registry tab strip,
where ten icons render side by side at size-[14px]: it drew 14.00px
filled against neighbours at 10.30-12.05px on a 0.90px stroke. Redraw it
on the 24-box keeping its character - a window, a title bar, three chrome
dots. Now 10.85px.

Three call sites needed updating alongside the viewBox change:

- panel.tsx passed no size and sat in a Button, which does not force-size
  its svg children, so the icon would have jumped to its new 24x24
  intrinsic size inside a 30px button.
- The two sidebar size-[9px] values were compensations for the oversized
  glyph (9px against a 12-wide box happens to yield a ~9px span). Against
  the 24-box they would render 5.64px, so they move to size-[14px], which
  lands at 8.78px - exactly MoreVertical.
@cursor

cursor Bot commented Aug 4, 2026

Copy link
Copy Markdown

PR Summary

Low Risk
Visual/icon sizing only in emcn and a few UI call sites; no auth, data, or business-logic changes.

Overview
Fixes oversized sidebar overflow icons by redrawing MoreHorizontal on the same 24-box geometry as MoreVertical (stroke 1.55, three circles) instead of the old 12×3 fill glyph that scaled too wide at square sizes.

TerminalWindow is redrawn the same way so it aligns with other resource-registry tab icons at size-[14px].

Call sites in panel.tsx and sidebar.tsx now pass size-[14px] explicitly—replacing compensating size-[9px] on the sidebar and avoiding a jump to intrinsic 24×24 in the workflow panel more button.

Reviewed by Cursor Bugbot for commit fa4549e. Configure here.

@greptile-apps

greptile-apps Bot commented Aug 4, 2026

Copy link
Copy Markdown
Contributor

Greptile Summary

The PR normalizes MoreHorizontal and TerminalWindow to the shared 24-unit stroked icon geometry and updates affected overflow-menu call sites to preserve their intended visual size.

  • Rebuilds MoreHorizontal as the geometric transpose of MoreVertical.
  • Redraws TerminalWindow using the standard square viewBox and stroke treatment.
  • Adds explicit 14px sizing where the previous icon geometry had required implicit or compensating dimensions.

Confidence Score: 5/5

The PR appears safe to merge with no concrete regressions identified in the changed icon geometry or affected call sites.

The new SVG strokes remain within their viewBoxes, MoreHorizontal matches its vertical sibling by construction, and current callers constrain both normalized icons to appropriate square dimensions.

Important Files Changed

Filename Overview
packages/emcn/src/icons/more-horizontal.tsx Replaces the oversized filled glyph with a correctly bounded stroked transpose of MoreVertical.
packages/emcn/src/icons/terminal-window.tsx Redraws the terminal window on the shared square icon geometry without clipping its strokes.
apps/sim/app/workspace/[workspaceId]/w/[workflowId]/components/panel/panel.tsx Explicitly constrains the normalized MoreHorizontal icon to 14px in the panel action button.
apps/sim/app/workspace/[workspaceId]/w/components/sidebar/sidebar.tsx Removes two obsolete 9px compensations and sizes the normalized overflow icon consistently at 14px.

Reviews (1): Last reviewed commit: "fix(emcn): normalize MoreHorizontal and ..." | Re-trigger Greptile

@vercel

vercel Bot commented Aug 4, 2026

Copy link
Copy Markdown

The latest updates on your projects. Learn more about Vercel for GitHub.

Project Deployment Actions Updated (UTC)
docs Ready Ready Preview Aug 4, 2026 9:33pm

Request Review

@waleedlatif1
waleedlatif1 merged commit b98dd8b into staging Aug 4, 2026
30 checks passed
@waleedlatif1
waleedlatif1 deleted the fix/emcn-more-horizontal-terminal-geometry branch August 4, 2026 21:37
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Labels

None yet

Projects

None yet

Development

Successfully merging this pull request may close these issues.

1 participant