Skip to content

feat(mapgen-studio): add collapsible config objects with per-object header anatomy, sticky auto-expand-on-scroll toggle, and useConfigCollapse hook#1634

Merged
mateicanavra merged 1 commit into
mainfrom
design/config-collapse
Jun 12, 2026
Merged

feat(mapgen-studio): add collapsible config objects with per-object header anatomy, sticky auto-expand-on-scroll toggle, and useConfigCollapse hook#1634
mateicanavra merged 1 commit into
mainfrom
design/config-collapse

Conversation

@mateicanavra

Copy link
Copy Markdown
Owner

Adds collapsible config objects to the recipe panel's schema form, with a per-object header anatomy and an optional sticky auto-expand-on-scroll mode.

Collapse behavior

Config objects (stage cards, group wells, array wells, and subgroup headings) now render collapsed by default. Each object gets a chevron + title disclosure button (aria-expanded / aria-controls) and a trailing action zone for object-local controls. The focused stage root defaults to expanded when a stage is selected. Expansion state is keyed by JSON pointer, so it survives switching between focused and unfocused modes. When no collapse context is provided (template unit tests, bare SchemaForm reuse), templates fall back to the previous always-expanded markup with no chevrons.

Array template

The Add button moves from its own flex row into the new header's trailing action zone, so it remains reachable even when the array is collapsed.

useConfigCollapse hook

Owns the expansion state as an explicit-choices Map<pointer, boolean> (absence = default, not false, so a deliberate collapse of the focused root is never overwritten by the default). Exposes a ConfigCollapseContext carrying expandedPointers: ReadonlySet<string> and toggle. The resolved set is passed as data rather than a closure because rjsf's SchemaField.shouldComponentUpdate uses deepEquals, which treats all functions as equivalent — a context whose only change is a fresh closure identity never triggers a re-render; Set membership changes do.

Sticky auto-expand engine

A ListCollapse toolbar toggle (default OFF, aria-pressed) enables scroll-driven expansion. When on, a rAF-throttled scroll listener queries [data-config-header][data-config-pointer] elements in DOM order, identifies the last header at or above a 56 px focus line as the candidate, and sets the active chain to that pointer plus all its ancestor pointers (derivable from the string — no tree bookkeeping). A layout effect restores the candidate header's viewport offset after each chain change so collapsing content above the focus line never visibly jumps the reading position.

ConfigCollapseContext and template plumbing

BrowserConfigFormContext gains an optional collapse field. SchemaConfigForm accepts a collapse prop and merges it into the form context. Templates read collapse from registry.formContext and stamp data-config-section / data-config-header / data-config-pointer attributes that the sticky engine queries without a ref registry.

Tests

New template-level tests cover: collapsed objects render an accessible header with hidden content; expanding a pointer reveals content; nested groups collapse independently; the array Add button appears in the header action zone while collapsed; and templates without a collapse context render no disclosure chrome. A pure unit test covers pointerPrefixes and computeActiveChain (empty input, first-header fallback, candidate selection, ancestor cascade).

This was referenced Jun 12, 2026
@github-actions

Copy link
Copy Markdown

Railway preview (MapGen Studio): not provisioned for this PR.

Policy (Graphite stacks): previews are created only for the top-of-stack PR by default.

  • To force a preview for this PR: add label railway-preview
  • To suppress a preview: add label no-railway-preview

Debug: {"isClosed":false,"isFork":false,"suppress":false,"force":false,"isTopOfStack":false,"hasToken":true,"draft":false}

mateicanavra commented Jun 12, 2026

Copy link
Copy Markdown
Owner Author

Merge activity

  • Jun 12, 8:50 PM UTC: A user started a stack merge that includes this pull request via Graphite.
  • Jun 12, 9:51 PM UTC: Graphite rebased this pull request as part of a merge.
  • Jun 12, 9:51 PM UTC: @mateicanavra merged this pull request with Graphite.

@mateicanavra
mateicanavra changed the base branch from design/game-console-icons to graphite-base/1634 June 12, 2026 21:48
@mateicanavra
mateicanavra changed the base branch from graphite-base/1634 to main June 12, 2026 21:49
…nual expand, sticky auto-expand toggle

Also closes the Pass-4 goal ledger (console dock + icons, config collapse).

Co-Authored-By: Claude Fable 5 <noreply@anthropic.com>
@mateicanavra
mateicanavra force-pushed the design/config-collapse branch from 44a8e66 to cc5a944 Compare June 12, 2026 21:50
@mateicanavra
mateicanavra merged commit 9ec8558 into main Jun 12, 2026
This was referenced Jun 12, 2026
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