Motir

Type: Bug (code) · UI / layout — the overflow-bug class (a shrinkable/unbounded inline element with no min-w-0 / max-width / truncation containment), sibling of MOTIR-448, MOTIR-1307, MOTIR-1329.

Parent: none (root sibling). The related feature is Story 5.8 ([MOTIR-1399](motir:cmqviiwvx000004l5q85qarju), "Work-item mentions & internal links") under Epic 5 ([MOTIR-263](motir:cmqfb4gxw008u2d0in0tgod0z)), which is done — so per the bug parent rule this is a parentless root bug (dotted id 12), not re-attached into a sealed epic.

Discovered in: out-of-band manual dogfooding (not during a motir run). Reported symptom: "work item link in the description overflows when the title is too long."

Root cause / fix (VERIFIED against shipped main, not the claim):

The live internal-link chip (WorkItemRefChip, Story 5.8 · Subtask 5.8.6 / [MOTIR-1404](motir:cmqvilwah000f04l5c3bjrb7c)) renders the linked item's title in an untruncated span, and its CSS has no width cap:

• JSX — components/markdown/WorkItemRefChip.tsx:91 (live) and :81 (archived) render <span className="wi-title">{title}</span>. The className is bare wi-title — no truncate / line-clamp / max-w-* utility. (.wi-type-icon gets shrink-0; the title does not.)
• CSS — components/ui/markdown-editor.css:113-141:
  • .motir-prose .wi-chip { display: inline-flex; white-space: nowrap; … } — no max-width. white-space: nowrap means the chip can never wrap to a new line.
  • .motir-prose .wi-chip .wi-title { color: var(--el-text); } — sets only colour; no overflow, no text-overflow: ellipsis, no max-width.
• Consequence: a linked item with a long title makes the inline-flex, nowrap, uncapped chip grow unbounded on a single line. It cannot wrap (nowrap) and cannot ellipsize (no overflow/ellipsis on .wi-title), so it overflows its description container horizontally — directly violating the chip's own stated design invariant: "A reference NEVER breaks the body" (WorkItemRefChip.tsx:24; design/work-items/internal-links.mock.html panels 1–2). Both the live and .is-archived variants render .wi-title, so both overflow.

This is a pure implementation defect — the long-title edge case was never constrained. The design/plan was sound (the invariant is explicitly named), so no notes.html entry is warranted.

Reproduce: Open a work item and reference another item whose title is very long — via the @ picker or a bare MOTIR-N key — in the description; save and view. The rendered chip's title runs off the right edge of the description column instead of ellipsizing / staying within the container. (A render/visual check of the real component, or a long-title chip test, reproduces it; grep confirms .wi-title carries no truncation on main.)

Fix direction (for the close-out subtask): Cap the title and let it ellipsize while the key · type icon · status dot stay fully visible. Add to .motir-prose .wi-chip .wi-title (both live and .is-archived): overflow: hidden; text-overflow: ellipsis; white-space: nowrap; plus a sensible max-width (e.g. an em-based cap, or make the title the only flexible flex child with min-width: 0 inside a chip whose own max-width is bounded to its inline container — ~100%). Keep .wi-key, .wi-type-icon (shrink-0), and .wi-dot (flex: none) unshrunk; the title is the only segment that may shrink/ellipsize. The chip must never exceed its inline container width. Write the FAILING repro first (a long-title chip test, and/or a render check), then the fix.

Resolution: (open — the close-out subtask fills this)