feat(showcase): vertical_menu joins the registry

[nhobes]

Nic caught the reconciliation gap: petal.build/components/menus serves ancient hand-authored demos while the playground's menu page carries the wave-era Northwind shell flagship as page-local dev.exs code no other surface can reach - vertical_menu is the one component the registry migration never picked up (it predates the registry).

Now: Showcase.VerticalMenu with two examples - the flagship (vertical_menu composed inside sidebar_nav: workspace switcher in the header slot, user_dropdown_menu variant="sidebar" in the footer, the shell's collapse + mobile sheet around it, with the taxonomy note as its description) and a standalone grouped menu (the component's whole API: maps in, current_page marks the reader's place). The playground page renders from the registry (orphaned page-local helper deleted), the registry guard test covers the module, and petal.build + the MCP inherit the same demos at the next release sync.

Self-contained per the registry contract (nav data in a private helper). Suites 1813/0 mix, JS green.

🤖 Generated with Claude Code

[greptile-apps]

Greptile Summary

This PR moves the vertical-menu demonstrations from page-local playground markup into the shared showcase registry.

• Adds flagship sidebar-shell and standalone grouped-menu examples.
• Updates the playground menu page to render registry examples.
• Registers the new showcase module and documents the addition.

Confidence Score: 4/5

The PR appears safe to merge, with a non-blocking instance-isolation issue in the reusable flagship example.

The registry migration and render contracts are otherwise consistent, but mounting the flagship example twice produces duplicate sidebar target IDs and cross-controls both instances.

Files Needing Attention: lib/petal_components/showcase/vertical_menu.ex

Important Files Changed

Filename	Overview
lib/petal_components/showcase/vertical_menu.ex	Adds two self-contained vertical-menu examples; the flagship's fixed sidebar target ID can collide when the reusable example is mounted twice.
dev.exs	Replaces the page-local menu demonstration with iteration over the new registry examples.
lib/petal_components/showcase/registry.ex	Adds the vertical-menu showcase to the explicit registry.
CHANGELOG.md	Documents the vertical-menu registry migration.

Flowchart

%%{init: {'theme': 'neutral'}}%%
flowchart LR
  V[Showcase.VerticalMenu] --> R[Showcase Registry]
  R --> P[Playground menu page]
  R --> B[petal.build sync]
  R --> M[MCP showcase data]
  V --> F[Flagship sidebar example]
  V --> S[Standalone menu example]

Loading

_{Reviews (1): Last reviewed commit: "feat(showcase): vertical_menu joins the ..." | Re-trigger Greptile}

[greptile-apps]

Fixed sidebar IDs collide

Rendering the flagship example more than once emits duplicate showcase-menu-sidebar, -main, and -trigger IDs. Because the sidebar commands select these IDs document-wide, activating one mobile trigger updates both instances and leaves focus restoration and aria-controls relationships ambiguous.

Knowledge Base Used: Overlays, menus, and commands

[codecov]

Codecov Report

✅ All modified and coverable lines are covered by tests.
✅ Project coverage is 95.41%. Comparing base (066ef41) to head (cba5271).
⚠️ Report is 1 commits behind head on main.

Additional details and impacted files

@@            Coverage Diff             @@
##             main     #693      +/-   ##
==========================================
+ Coverage   95.40%   95.41%   +0.01%     
==========================================
  Files         162      163       +1     
  Lines        8045     8078      +33     
==========================================
+ Hits         7675     7708      +33     
  Misses        370      370              

☔ View full report in Codecov by Harness.
📢 Have feedback on the report? Share it here.

🚀 New features to boost your workflow:

• ❄️ Test Analytics: Detect flaky tests, report on failures, and find test suite problems.
• 📦 JS Bundle Analysis: Save yourself from yourself by tracking and limiting bundle sizes in JS merges.