Fix SideNavCollapseButton properties preview with collapsible fixture

[Alif416]

Summary

Add a playground fixture to SideNavCollapseButton's documentation to enable the component to render visibly in the Properties preview tab.

Problem

The SideNavCollapseButton Properties preview was rendering empty because the component requires either:

• A collapsible prop (controlled collapse state), OR
• A SideNav context (which reads collapse state automatically)

Without either of these, the component correctly returns null, making the preview invisible.

Solution

Added a playground object with default collapsible state to SideNavCollapseButton.doc.mjs. This provides a minimal fixture that:

• Supplies a controlled collapsible prop with isCollapsed: false
• Allows the component to render and be interactive in the preview
• Demonstrates toggle behavior when users interact with the button

Acceptance Criteria

• ✅ Button is visible on first load
• ✅ Activating it toggles the collapse state
• ✅ No changes to component API or behavior
• ✅ Focused to the doc preview coverage only

Fixes #5901

[vercel]

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

Project	Deployment	Actions	Updated
astryx	Ready	Preview	Sep 3, 2026 8:38am UTC

[meta-cla]

Hi @Alif416!

Thank you for your pull request and welcome to our community.

Action Required

In order to merge any pull request (code, docs, etc.), we require contributors to sign our Contributor License Agreement, and we don't seem to have one on file for you.

Process

In order for us to review and merge your suggested changes, please sign at https://code.facebook.com/cla. If you are contributing on behalf of someone else (eg your employer), the individual CLA may not be sufficient and your employer may need to sign the corporate CLA.

Once the CLA is signed, our tooling will perform checks and validations. Afterwards, the pull request will be tagged with CLA signed. The tagging process may take up to 1 hour after signing. Please give it that time before contacting us about it.

If you have received this in error or have any questions, please contact us at cla@meta.com. Thanks!

[meta-cla]

Thank you for signing our Contributor License Agreement. We can now accept your code for this (and any) Meta Open Source project. Thanks!

[cixzhang]

Thanks, this looks good!

[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

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

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

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}