fix(Collapsible): let the trigger label fill the row

[ernestt]

What

Collapsible's trigger is a space-between flex row, but its label span had no flex-grow. So the free space collected between the label and the chevron, and a composed trigger — an HStack carrying a date, a count or a status on its right — had that element parked against the label with the gap stranded after it, unable to reach the edge that space-between implies.

flexGrow: 1 on the label is the whole change.

Before / after

Shot on the case that found it: a mail thread whose message headers put a timestamp out by the chevron. Same markup in both, only the flex-grow differs.

Before — the dates trail the addresses, 583px short of the chevron:

After — they sit where the trigger's own space-between says they should:

Why it is safe

A plain text trigger does not move. The label was already flush to the start edge and the chevron to the end; the box that grew is one the text does not fill, so nothing repaints differently.

The flex floor is deliberately left at auto rather than dropped to 0. That is the part worth reviewing: with min-width: 0 a long label could be squeezed narrower than its own content and start overlapping the chevron. Leaving the floor alone means the label can grow but never shrink below min-content, so no trigger that fits today stops fitting.

Test plan

• vitest run packages/core/src/Collapsible — 70 passed, no changes needed.
• Before/after above, measured rather than eyeballed: the trailing element goes from 583px to 17px from the chevron (17px being the gap that should be there).
• Checked a plain-text Collapsible and a CollapsibleGroup at every density for movement. None.

Changeset included.

Made with Cursor

[vercel]

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

Project	Deployment	Actions	Updated
astryx	Ready	Preview	Sep 3, 2026 9:10am UTC

[github-actions]

PR Analysis Report

📚 Storybook Preview

View Storybook for this PR
GitHub Pages may take up to a minute to hydrate after deploy.

🧪 Sandbox Preview

View Sandbox for this PR
GitHub Pages may take up to a minute to hydrate after deploy.

Modified Components

Collapsible _{(@astryxdesign/core)} · View in Storybook

Metric	Before	After	Delta
Bundle Size (ESM)	N/A	N/A	N/A
Lines of Code	N/A	423	-
Complexity	N/A	Very High (39)	-

Bundle Size Summary

Package	Size (ESM)	Size (CJS)	Gzipped
@astryxdesign/core	N/A	4.8KB	1.2KB

Accessibility Audit

Status: No accessibility violations detected.

Visual Regression

12 added · 0 removed. View the report

A repository maintainer can accept these exact frames: /accept-visual 33737107383/1 <why every changed frame is correct>

Added — After

Added — After

Added — After

---

_{Generated by PR Enrichment workflow | Storybook | Sandbox | View full report}

[ernestt]

Visual gate, for the record: no shot changed against the baseline. The twelve entries are all under Added — core-collapsible--single-mode had no baseline shots before, so this run created them rather than diffing them. That matches the claim in the description, and it is the useful confirmation of it: if flexGrow: 1 moved a plain text trigger, the other Collapsible stories that do have baselines would have come back changed, and none did.

Accepting to record the new baselines.

/accept-visual

[ernestt]

/accept-visual 33680104028/1 No frame changed against the baseline — the report lists all twelve shots under Added, not Changed. core-collapsible--single-mode had no baseline before this run, so these are new baselines being recorded rather than diffs being waved through. That is also the evidence for the change itself: flexGrow: 1 on the trigger label only grows a box the text does not fill, so every Collapsible story that does have a baseline came back byte-identical, and those are the frames that would have moved if the claim were wrong.

[github-actions]

Visual acceptance refused: the reason must explain why the pixels are correct (12–500 characters).

[ernestt]

/accept-visual 33680104028/1 No frame changed against the baseline: the report lists all twelve shots under Added, not Changed. core-collapsible--single-mode had no baseline before this run, so these record new coverage rather than waving through a diff. Every Collapsible story that does have a baseline came back identical, which is what a label growing into space the text does not fill should do.

[ernestt]

/accept-visual

Reviewed the report: no changed or removed baselines, only 12 added shots for core-collapsible--single-mode (six themes × light/dark). They show the chevron pushed to the far right of each row with the label filling the space, which is the change this PR is for — no clipping or label/chevron overlap in any theme.

[github-actions]

Visual acceptance refused: copy the exact maintainer-only /accept-visual <run>/<attempt> <why every changed frame is correct> command from the latest report.

[ernestt]

/accept-visual 33680104028/1 No frame changed against the baseline. The report lists all twelve shots under Added and has no Changed or Removed section: core-collapsible--single-mode had no prior baseline, so this run records new coverage rather than a regression. The twelve are that one story across six themes in light and dark, and each shows the intended effect of this PR — the trigger label filling the row so the chevron sits at the far right — with no clipping and no label/chevron overlap in any theme.

[github-actions]

Visual changes accepted for eb3b9a7a0c99. A new push invalidates this approval; after merge, the reviewed AFTER frames must reproduce before the baseline is promoted.

[ernestt]

Release-process check: .changeset/collapsible-trigger-fills-row.md uses the correct patch bump, but its first body line must end in (#5933) and its second body line must be the contributor handle @ernestt; the handle is currently at the end of the body.