fix(docsite): seed Grid/Stack family Properties previews with playground defaults

[HelloOjasMutreja]

Problem

Six components in the Grid/Stack layout family rendered an empty Properties-tab preview:

• Grid, Stack, HStack, VStack: no playground.defaults, so the preview had no children.
• GridSpan, StackItem: no child content, and no parent context (Grid / HStack) to participate in.

Each is an atomic, independently closable slice of #2008, filed by the nightly vibe-test bot as #5892, #5893, #5894, #5898, #5899, #5900.

Fix

Followed the established pattern from prior merged fixes of this exact class (#4138, #2815, #3183, #3175):

• Grid, Stack, HStack, VStack: added playground.defaults.children, a few Card elements, matching the convention in Card.doc.mjs/OverflowList.doc.mjs.
• GridSpan, StackItem: these are sub-components that render nothing meaningful in isolation (a grid item with no grid, a flex item with no flex row). Gave each its own playground (overriding the one it would otherwise inherit from its parent doc) using playground.wrapper to render it inside a real Grid/HStack, so the span/fill behavior is actually visible.

Testing

• Added regression tests to component-preview-state.test.ts (Grid, Stack, HStack, VStack, matching the exact style of the existing OverflowList/DropdownMenu tests) and component-detail-resolve-elements.test.ts (GridSpan, StackItem, verifying their playground.wrapper config resolves to a real component).
• Full apps/docsite test suite: 443 passing (17 pre-existing failures unrelated to this change, confirmed identical on a clean baseline).
• tsc --noEmit: 27 pre-existing errors, identical count with and without this diff.
• Verified against the real docsite dev server (pnpm generate && next dev), not just the source or unit tests: navigated to all six Properties-tab pages and visually confirmed each renders a real, non-empty preview (Grid shows three cards in a 3-column layout, Stack/HStack/VStack each show three cards in their respective direction, GridSpan shows "Spans 2 columns" inside a real Grid, StackItem shows a full-width "Fills the row" card inside a real HStack). No screenshots attached; my environment for this session doesn't have a straightforward way to export the browser tool's captures as attachable image files, so this is a direct description of what was checked rather than a substitute for it.

Fixes #5892, #5893, #5894, #5898, #5899, #5900

[vercel]

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

Project	Deployment	Actions	Updated
astryx	Ready	Preview	Sep 3, 2026 4:35pm 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

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

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

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

Metric	Before	After	Delta
Bundle Size (ESM)	N/A	N/A	N/A
Lines of Code	N/A	388	-
Complexity	N/A	High (29)	-

Bundle Size Summary

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

Accessibility Audit

Status: No accessibility violations detected.

---

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

[cixzhang]

Thanks, the six previews now render correctly. One thing before merge: the tests duplicate the new fixture values instead of reading the docs. I reverted all six playground configs and every changed test still passed (36/36), so the empty-preview bug can return undetected. Could you assert the extracted playground configs, especially both wrappers, in data-extraction.test.ts?

[Reviewed by Robohands]

[HelloOjasMutreja]

Good catch, confirmed the exact gap: my tests exercised the playground mechanism with hand-typed fixture values, not the actual persisted .doc.mjs config. Added assertions against componentRegistry (built from the real doc source via pnpm generate) for all six components, including both wrappers (GridSpan into Grid, StackItem into HStack).

Verified these actually catch a revert before pushing: reverted the three .doc.mjs files, regenerated, confirmed all six new tests fail with the expected "received undefined" errors, then restored the real changes and confirmed they pass again.

[cixzhang]

Thanks, this now protects the real generated registry: removing any of the six preview configs fails the new tests, and all six Properties previews render correctly.

[Reviewed by Robohands]