feat(plugin-detail,app-shell): the default record page is one page at two widths — resident columns on a wide page, the tabs in a drawer - #26758

Fixes #26678

Clause-②: no
Metadata-protocol: none

Part of the record-page-v2 epic #26676 (child 2 of 4). The drawer top bar and in-place navigation (#26679) and the open-mode metadata (#26677) are not addressed here.

What this does

The maintainer's ruling 1 on the epic, verbatim: 「抽屉和整页是同一张页在两个宽度。」 The synthesized default record page (no authored page, or a slotted page that keeps the default tab strip) is now laid out by the width of the view it occupies, never the viewport:

One header (title, actions, highlights, stage path) serves every tier. ?tab= keeps working in the tabbed tier and is ignored by the columns. An authored record page (kind: 'full') and an authored slots.tabs strip are drawn as authored at every width.

Design: the columns are derived, never authored

No metadata key, page template or node type is added, and packages/spec is untouched. The page description stays the tabbed one buildDefaultPageSchema writes, which is also what Studio's page-create seeds and what a slotted page fills. A columns node would have been a new type inside the spec's closed record: / page: namespaces: refused at Studio's save, and a type an author or an AI could write that the spec could not judge. So the column layout is read off the synthesized page by each tab's stable value (details → details; activity, history → timeline after the discussion footer; every related tab, approvals, attachments → related; the aside region folds into the related column, one rail, not two). A strip the partition cannot read (an unknown value, a visibleWhen item) answers null and keeps its tabs. A test enumerates every value buildDefaultTabs emits under all three relatedLayouts, so a new synthesized tab without a column goes red there.

showReferenceRail / hideReferenceRail are BuildPageOptions (TypeScript options of the synthesizer), not spec keys, and their meaning is unchanged: in the tabbed tier the rail is today's hidden xl:flex aside; in the column tiers the same aside content sits in the related column.

Files

• ui/packages/plugin-detail/src/synth/recordPageColumns.ts (new): recordPageTierFor, recordPageColumnOfTab, buildDefaultPageColumns, the 1280 / 1024 floors.
• ui/packages/plugin-detail/src/useRecordPageTier.ts (new): measures the container (layout effect plus ResizeObserver), re-renders only on a tier flip, answers null until the first reading so the host never mounts the tab tree only to replace it.
• ui/packages/plugin-detail/src/RecordPageColumns.tsx (new): the column tiers; frame mirrors the tabbed page frame so the header does not move between tiers; the two-column rail toggle (aria-expanded, aria-controls, Escape closes back to the toggle); folded empty related lists collapse out of the column's gap.
• ui/packages/plugin-detail/src/relatedListCompact.ts (new) + RelatedList.tsx: inside the related column a list keeps its identity column only and lets its header wrap. Without it the 20rem column cut each table off at its edge and truncated titles to one letter. Anywhere else a related list is unchanged.
• ui/packages/app-shell/src/views/RecordDetailView.tsx: measures its own root, renders RecordPageColumns in the column tiers (tabbed path untouched), moves the provenance footer into the columns there, and treats History and the feed as on screen at open in a column tier (the audit read no longer waits for a tab click that cannot happen).
• ui/packages/plugin-detail/src/index.tsx, useDetailTranslation.ts (detail.related default, byte-identical to the en pack).
• Docs: ui/packages/plugin-detail/README.md (new section, reference-rail condition 3 note), ui/content/docs/guide/slotted-pages.md.
• ui/e2e/live/detail-related-list.spec.ts, ui/e2e/live/record-history-display.spec.ts: both click a tab on a full record page under Desktop Chrome's 1280 px viewport, which leaves the record view at the two-column floor once the console sidebar takes its share; each now pins a 1200 px viewport to stay in the tabbed tier they test.
• .changeset/26678-record-page-two-widths.md (patch, Metadata-protocol: none).

Screenshots

HotCRM (1f3f8880, platform 18.2.0 backend) with this branch's console on a Vite dev server. Premise correction: a HotCRM lead renders its authored lead_detail page (kind: 'full', isDefault: true), which the ruling leaves untouched, so it cannot show the tiers. The shots use a contact and a task, objects with no authored record page. Container width = the record view's measured width; the console sidebar takes 256 px of the viewport.

Contact, container 1440 px: three columns
Contact, container 1100 px: two columns
Contact, container 1100 px: related rail open
Contact, container 844 px: tabs
Task in the drawer (Task Board, embedded): tabbed tier
The same task as a full page, container 1440 px: same header, same sections

Evidence branch claude/issue-26678-evidence-20261027 at 5c2f4343db70bd213abef0895804cb66f02df5d5 (never merged).

Reading worth a look: with the console sidebar open, a 1440 px screen gives the record view 1184 px, so it lands in the two-column tier. Three columns need about 1536 px of screen with the sidebar open, or a collapsed sidebar. The floors are the card's (1280 / 1024 of container).

Tests

Readings at 177cf60f6f (branch head after merging origin/main 4373103165, an unrelated auth change); the README snippet fix ecfa2c5574 re-ran pnpm --dir ui run check:doc-snippets (803 of 803 blocks judged, 0 failed), the derived 33 families (all exit 0) and check:new-line-citations (0 new) at ecfa2c5574 — this line edited by the seat on the dev's report, the body is otherwise the dev's:

• pnpm --dir ui exec vitest run packages/plugin-detail/src/synth/__tests__/recordPageColumns.test.ts packages/plugin-detail/src/__tests__/RecordPageColumns.test.tsx packages/plugin-detail/src/__tests__/RelatedList.compactColumn-26678.test.tsx packages/app-shell/src/views/RecordDetailView.recordPageTiers-26678.test.tsx: 4 files, 25 tests passed.
• RecordDetailView.recordPageTiers-26678: 1440 px is three columns, no tablist, related lists in the related column, the sys_audit_log read at open; 1100 px is two columns, the toggle, lists mounted only on open; 900 px and embedded at 1440 px are the tab strip, with no audit read at 900; ?tab=related selects the tab at 900 and is ignored at 1440.
• Full packages/plugin-detail/: 316 files passed, 1 skipped; 2917 tests passed, 18 skipped.
• packages/app-shell/src/views/RecordDetailView.* (72 files, 489 tests) plus the 121 other app-shell test files that import the record view, plugin-detail or DETAIL_DEFAULT_TRANSLATIONS (1312 tests): all passed. Declared narrowing: the remaining app-shell files are CI's Test UI.
• pnpm --filter @object-ui/plugin-detail run type-check, pnpm --filter @object-ui/app-shell run type-check: exit 0 (on the pre-merge head; the merge touched only ui/packages/auth).
• Existing tab tests (?tab=, related-tab order, hideRelatedTab, referenceRailRoute-9816) pass unchanged: jsdom measures 0 px, which is the tabbed tier.

Ablations (one-shot, through scripts/ablation-replace.mjs, restore proven by blob equal to HEAD and empty git diff HEAD; the tests resolve @object-ui/* to source through ui/vitest.config.mts, so no dist was involved):

1. recordPageTierFor answering tabs at 1280 px and up: 3 tests red (the tier boundary, the 1440 px mount, the ?tab= case). Restored.
2. The column-tier clause of the History read gate removed: the 1440 px "History is read at open" test red. Restored.

Local gate subset (derived by node scripts/pm/dispatch-gates.mjs --commands --repo objectstack-ai/objectstack over this branch's 17 changed paths): all 33 node / pnpm check:* families exit 0. pnpm check:new-line-citations (ui): 0 new citations. ESLint on every changed ui file: 0 errors. The 34th family, pnpm --dir ui exec vitest run scripts/, exits 1 here for two host reasons, neither a reading of this change, so it is NOT MEASURED locally and CI's run is the reading: select-affected-tests-wiring (2 tests) runs a bash script using mapfile, which macOS's stock bash 3.2 lacks (exit 127); check-i18n-dead-keys (2 tests: "POSITIVE: every property-access-read key names LoadingScreen.tsx as a hit", "keeps every key it makes reachable OUT of both tiers") timed out at the 15 s budget scanning the real tree on this machine (16 s and 656 s). The other 176 files and 5062 tests pass. detail.related, the one key this change reads anew, was already read by the tab strip's label map.

Verification ran in declared unlocked mode: os-verify-lock: VERDICT command-exit 0 · UNLOCKED (declared) · no usable flock on this host, so the shared verify lock was NEVER taken and NOTHING was serialized.

Acceptance notes

• The two-column toggle sits on its own row, right-aligned directly under the record header, not inside the page:header action row: putting it there would need a host slot in @object-ui/components' header.
• Whether the rail is open is ephemeral view state (closed on every open), not a stored preference.
• The related card's footer link reads "View All" (existing detail.viewAll text), not 「查看全部 N 条 →」; the count is in the card header.
• At 20rem the compact card's row-actions column header is clipped at the card edge (the data-table's own minimum widths). Cosmetic, left as is.
• In the three-column tier every related list is mounted at open, so each issues its read at open (the tab strip deferred them to the tab click). The two-column rail keeps them deferred until opened.
• The two live specs above were not run (no showcase backend in this container). NOT MEASURED: live e2e, reason: no running showcase backend.
• DetailTabs.tsx (named in the card) draws the legacy DetailView strip; the synthesized page's strip is page:tabs (PageTabsRenderer in @object-ui/components), so it is not part of this change.

Generated by Claude Code