A hook for step-based navigation with keyboard support.
initialCountnumbermaxCountnumber| Prop | Type | Default |
|---|---|---|
initialCount | number | - |
maxCount | number | - |
countnumbernext() => voidback() => voidisDisabledBackbooleanisDisabledNextboolean| Prop | Type | Default |
|---|---|---|
count | number |
| - |
next | () => void | - |
back | () => void | - |
isDisabledBack | boolean | - |
isDisabledNext | boolean | - |
import { useStep } from '@k8ordo/ui';const { count, back, next, isDisabledBack, isDisabledNext } = useStep({
initialCount: 1,
maxCount: 5,
});
return (
<div>
<button disabled={isDisabledBack} onClick={back}>Back</button>
<span>Step {count} / 5</span>
<button disabled={isDisabledNext} onClick={next}>Next</button>
</div>
);