UNPKG

@workday/canvas-kit-react

Version:

The parent module that contains all Workday Canvas Kit React components

26 lines (25 loc) 1.13 kB
"use strict"; Object.defineProperty(exports, "__esModule", { value: true }); exports.useListItemActiveDescendant = void 0; const common_1 = require("@workday/canvas-kit-react/common"); const useCursorListModel_1 = require("./useCursorListModel"); /** * This elemProps hook is used for cursor navigation by using [Active * Descendant](https://www.w3.org/WAI/ARIA/apg/practices/keyboard-interface/#kbd_focus_activedescendant). * This hook should be applied to List Items, not the list (use {@link useListActiveDescendant} for the list). * This hook adds the focus class so that lists using `aria-activedescendant` get the correct * visual cue for visual users. * * ```ts * const useMyItem = composeHooks( * useListItemActiveDescendant, // adds `aria-activedescendant` support * useListItemRegister * ); ``` */ exports.useListItemActiveDescendant = (0, common_1.createElemPropsHook)(useCursorListModel_1.useCursorListModel)((model, _ref, elemProps = {}) => { const id = elemProps['data-id'] || ''; return { className: model.state.cursorId && model.state.cursorId === id ? 'focus' : '', }; });