TapCursorMixin

A tap/mousedown on a list item makes that item current

Overview

Purpose: A tap/mousedown on a list item makes that item current.

This mixin works at the beginning of the Elix render pipeline:

eventsmethods → setState → render → update DOM

Expects the component to provide:

  • currentIndex state member tracking which item is current. You can supply this via ItemsCursorMixin.

Provides the component with:

  • touch/mouse handling such that a tapped/clicked item will become the current item.

Usage

import ItemsCursorMixin from "elix/src/base/ItemsCursorMixin.js";
import TapCursorMixin from "elix/src/base/TapCursorMixin.js";

class MyElement extends TapCursorMixin(HTMLElement) {}