focusPrevious

focusPrevious(list?) moves focus to the previous tabbable element before the currently active one, skipping disabled elements and wrapping back to the end when it reaches the start — the counterpart to focusNext. Called with no arguments it scans the whole document; pass an explicit array to scope the cycle to a subset. Part of pota/use/focus.

Arguments

Argument Type Description
list HTMLElement[] Optional ordered set of candidates. Defaults to every tabbable element in the document, in DOM order.

The default candidate set is input (non-hidden), button, select, textarea, a, [tabindex], and [contenteditable] elements. The list is traversed in reverse, so wrap-around lands on the last element — note that an explicit list you pass is reversed in place.

Examples

Step focus back on a key

A document-wide "previous field" action wired to a button, mirroring Shift+Tab with wrap-around.

import { render } from 'pota'
import { focusNext, focusPrevious } from 'pota/use/focus'

function App() {
	return (
		<form>
			<input placeholder="one" />
			<input placeholder="two" />
			<input placeholder="three" />
			<button
				type="button"
				on:click={() => focusPrevious()}
			>
				prev
			</button>
			<button
				type="button"
				on:click={() => focusNext()}
			>
				next
			</button>
		</form>
	)
}

render(App)