docs: add proper example for code snippet multi-dropdown#5762
docs: add proper example for code snippet multi-dropdown#5762Ninfa-Jeon merged 2 commits intocanonical:mainfrom
Conversation
Demo
Jenkins 
demos.haus There was a problem hiding this comment.
Pull request overview
This PR fixes a bug in the code snippet component where the architecture dropdown (amd64/i386) in the multi-dropdown example wasn't functioning. Previously, only the channel dropdown (stable/beta/edge) worked because the architecture dropdown options had empty values. The fix implements a cascading dropdown pattern where selecting an architecture shows the appropriate channel dropdown, which then displays the corresponding code panel.
Changes:
- Updated JavaScript to handle cascading dropdowns where dropdown options can point to other dropdowns instead of just code panels
- Refactored HTML examples to use unique, properly-referenced IDs that enable the cascading dropdown functionality
- Added null safety checks when accessing DOM elements
Reviewed changes
Copilot reviewed 2 out of 2 changed files in this pull request and generated 2 comments.
| File | Description |
|---|---|
templates/docs/examples/patterns/code-snippet/_script.js |
Added logic to detect and handle cascading dropdowns (when a dropdown option points to another dropdown instead of a code panel), including proper panel hiding/showing and null safety checks |
templates/docs/examples/patterns/code-snippet/_dropdown-multiple.html |
Updated all three code snippet examples with unique IDs and proper option values to implement the cascading dropdown pattern (architecture → channel → code panel) |
💡 Add Copilot custom instructions for smarter, more guided reviews. Learn how to get started.
templates/docs/examples/patterns/code-snippet/_dropdown-multiple.html
Outdated
Show resolved
Hide resolved
templates/docs/examples/patterns/code-snippet/_dropdown-multiple.html
Outdated
Show resolved
Hide resolved
0e83052 to
65afdce
Compare
There was a problem hiding this comment.
Pull request overview
Copilot reviewed 2 out of 2 changed files in this pull request and generated 1 comment.
💡 Add Copilot custom instructions for smarter, more guided reviews. Learn how to get started.
templates/docs/examples/patterns/code-snippet/_dropdown-multiple.html
Outdated
Show resolved
Hide resolved
bartaz
left a comment
There was a problem hiding this comment.
LGTM. The accessibility improvement would be a nice touch.
Done
Fixes #5761
QA
Check if PR is ready for release
If this PR contains Vanilla SCSS or macro code changes, it should contain the following changes to make sure it's ready for the release:
Feature 🎁,Breaking Change 💣,Bug 🐛,Documentation 📝,Maintenance 🔨.package.jsonshould be updated relative to the most recent release, following semver conventionScreenshots