You signed in with another tab or window. Reload to refresh your session.You signed out in another tab or window. Reload to refresh your session.You switched accounts on another tab or window. Reload to refresh your session.Dismiss alert
public/components/card_carousel.js is a vanilla JS carousel controller (~35 lines) loaded as a <script type="module"> inside demo_card_carousel.rs. It handles nav button clicks and scroll-based indicator/button state updates via event delegation on document.
What the current JS does
Two delegated event listeners on document:
Click — nav button handler:
document.addEventListener("click", ...)
→ finds [data-name="CardCarouselNavButton"]
→ prevents default (safe for <a> wrappers)
→ scrolls [data-name="CardCarouselTrack"] by one full width (prev or next)
Scroll (capture phase) — indicator + button state sync:
document.addEventListener("scroll", ..., true)
→ finds [data-name="CardCarouselTrack"]
→ computes current index from scrollLeft / clientWidth
→ toggles aria-current on [data-name="CardCarouselIndicator"] items
→ toggles aria-disabled on prev/next [data-name="CardCarouselNavButton"]
Goal
Replace card_carousel.js with a pure Rust module using web_sys, eliminating the JS file and the <script> tag from the demo/component.
The Rust implementation should:
Add a delegated click listener on document targeting CardCarouselNavButton → call scroll_by on the track element
Add a delegated scroll listener (capture phase) on document targeting CardCarouselTrack → update aria-current / aria-disabled attributes
Use web_sys APIs: Document, Element, EventTarget, ScrollToOptions
Context
public/components/card_carousel.jsis a vanilla JS carousel controller (~35 lines) loaded as a<script type="module">insidedemo_card_carousel.rs. It handles nav button clicks and scroll-based indicator/button state updates via event delegation ondocument.What the current JS does
Two delegated event listeners on
document:Click — nav button handler:
Scroll (capture phase) — indicator + button state sync:
Goal
Replace
card_carousel.jswith a pure Rust module usingweb_sys, eliminating the JS file and the<script>tag from the demo/component.The Rust implementation should:
clicklistener ondocumenttargetingCardCarouselNavButton→ callscroll_byon the track elementscrolllistener (capture phase) ondocumenttargetingCardCarouselTrack→ updatearia-current/aria-disabledattributesweb_sysAPIs:Document,Element,EventTarget,ScrollToOptionsMutationObserverif needed (see PR refactor(hooks): replace lock_scroll.js with Rust web_sys implementation #21 for the pattern)Files involved
public/components/card_carousel.js— deleteapp_crates/registry/src/demos/demo_card_carousel.rs— remove<script>tag, wire in Rust initpublic/registry/styles/default/demo_card_carousel.md— update registry snapshotReference
PR #21 replaced
lock_scroll.jswith Rust using the same pattern — good starting point.