Overview
Purpose: Keeps the current item and selected item in sync.
This mixin works in the middle of the Elix render pipeline:
events → methods → setState → render DOM → post-render
Expects the component to provide:
currentIndex
state member, typically via ItemsCursorMixin.- optional
currentItem
state member, also typically via ItemsCursorMixin.
Provides the component with:
selectedIndex
state member kept in sync withcurrentIndex
.selectedItem
state member kept in sync withcurrentItem
.
Usage
import CursorSelectMixin from "elix/src/base/CursorSelectMixin.js";
import ItemsCursorMixin from "elix/src/base/ItemsCursorMixin.js";
import SingleSelectionAPIMixin from "elix/src/base/SingleSelectionAPIMixin.js";
class MyElement extends CursorSelectMixin(
ItemsCursorMixin(SingleSelectionAPIMixin(HTMLElement))
) {}
This mixin is designed to fit between ItemsCursorMixin and SingleSelectionAPIMixin in cases where a list-like element (e.g., ListBox) wants to publicly expose its current item as its selected item.
API
Used by classes Carousel, CarouselSlideshow, CarouselWithThumbnails, CenteredStrip, CrossfadeStage, CrossfadeStage, Explorer, ListExplorer, ListWithSearch, Modes, PlainCarousel, PlainCarouselSlideshow, PlainCarouselWithThumbnails, PlainCenteredStrip, PlainCenteredStripHighlight, PlainCenteredStripOpacity, PlainCrossfadeStage, PlainCrossfadeStage, PlainExplorer, PlainListExplorer, PlainListWithSearch, PlainModes, PlainSlideshow, PlainSlideshow, PlainSlideshowWithPlayControls, PlainSlideshowWithPlayControls, PlainSlidingPages, PlainSlidingStage, PlainTabs, PlainTabStrip, Slideshow, Slideshow, SlideshowWithPlayControls, SlideshowWithPlayControls, SlidingPages, SlidingStage, Tabs, and TabStrip.