Lock focus on modal elements, TypeScript

dom-focus-lock.ts

const tabIndexGuard = (el: Element): el is HTMLElement => (el as HTMLElement).tabIndex >= 0;

// Based on https://svelte.dev/examples/modal
export const focusLock = (e: KeyboardEvent, el: HTMLElement) => {
	if (e.key === 'Tab') {
		// trap focus
		const nodes = el.querySelectorAll('*');
		const tabbable = Array.from(nodes).filter(tabIndexGuard);

		let index = tabbable.indexOf(document.activeElement as HTMLElement);
		if (index === -1 && e.shiftKey) index = 0;

		index += tabbable.length + (e.shiftKey ? -1 : 1);
		index %= tabbable.length;

		tabbable[index].focus();
		e.preventDefault();
	}
};