diff --git a/libs/jsonforms-components/src/lib/Controls/FormStepper/FormStepperControl.tsx b/libs/jsonforms-components/src/lib/Controls/FormStepper/FormStepperControl.tsx index 996eca81d..24bde7216 100644 --- a/libs/jsonforms-components/src/lib/Controls/FormStepper/FormStepperControl.tsx +++ b/libs/jsonforms-components/src/lib/Controls/FormStepper/FormStepperControl.tsx @@ -254,7 +254,17 @@ export const FormStepper = (props: CategorizationStepperLayoutRendererProps): JS {categoryLabel} - setPage(index + 1)} data-testid={testId}> + setPage(index + 1)} + data-testid={testId} + onKeyDown={(e) => { + if (!readOnly && (e.key === ' ' || e.key === 'Enter')) { + e.preventDefault(); + setPage(index + 1); + } + }} + > {readOnly ? 'View' : 'Edit'} diff --git a/libs/jsonforms-components/src/lib/Controls/FormStepper/styled-components.tsx b/libs/jsonforms-components/src/lib/Controls/FormStepper/styled-components.tsx index 3ddd4a0e7..97f11a025 100644 --- a/libs/jsonforms-components/src/lib/Controls/FormStepper/styled-components.tsx +++ b/libs/jsonforms-components/src/lib/Controls/FormStepper/styled-components.tsx @@ -35,6 +35,11 @@ export const Anchor = styled.div` text-decoration: underline; outline: none; cursor: pointer; + + &:focus { + outline: 2px solid #0070c4; + background-color: #e6f7ff; + } `; export const ReviewListItem = styled.div`