@jimka/typescript-ui

Appearance

@jimka/typescript-ui / core / RovingTabIndex

Class: RovingTabIndex ​

Defined in: src/typescript/lib/core/RovingTabIndex.ts:21

Manages the roving tabindex pattern for a group of sibling Component items.

Exactly one item in the group has tabindex=0 at any time; all others have tabindex=-1. Calling moveTo updates the tabindices and transfers DOM focus to the new active item.

Example ​

typescript
const group = new RovingTabIndex();
group.add(buttonA);
group.add(buttonB);
group.moveTo(1); // focus buttonB

Constructors ​

new RovingTabIndex() ​

ts
new RovingTabIndex(): RovingTabIndex

Returns ​

RovingTabIndex

Methods ​

add() ​

ts
add(component: Component): this

Defined in: src/typescript/lib/core/RovingTabIndex.ts:50

Appends a component to the group.

Parameters ​

component ​

Component

The component to add.

Returns ​

this

Remarks ​

The first item added receives tabindex=0; all subsequent items receive tabindex=-1.

getActiveIndex() ​

ts
getActiveIndex(): number

Defined in: src/typescript/lib/core/RovingTabIndex.ts:40

Returns the zero-based index of the currently active item.

Returns ​

number

The active index.

getItems() ​

ts
getItems(): Component[]

Defined in: src/typescript/lib/core/RovingTabIndex.ts:31

Returns all items currently managed by this roving group.

Returns ​

Component[]

The array of managed Component instances.

moveNext() ​

ts
moveNext(): void

Defined in: src/typescript/lib/core/RovingTabIndex.ts:120

Moves focus to the next item, wrapping from the last item back to the first.

Returns ​

void

movePrev() ​

ts
movePrev(): void

Defined in: src/typescript/lib/core/RovingTabIndex.ts:133

Moves focus to the previous item, wrapping from the first item back to the last.

Returns ​

void

moveTo() ​

ts
moveTo(index: number): void

Defined in: src/typescript/lib/core/RovingTabIndex.ts:94

Activates the item at the given index, updating tabindex on both the old and new items and transferring DOM focus.

Parameters ​

index ​

number

Zero-based index of the item to activate. Clamped to valid range.

Returns ​

void

remove() ​

ts
remove(component: Component): this

Defined in: src/typescript/lib/core/RovingTabIndex.ts:65

Removes a component from the group.

Parameters ​

component ​

Component

The component to remove.

Returns ​

this

Remarks ​

If the removed item was active, focus moves to the previous item (or index 0).