Merge pull request #6933 from Sage/FE-6762

fix(form): tabbing in FireFox - focus incorrect
Sage · Sep 19, 2024 · f55c877 · f55c877
2 parents f1c66da + 684a8b6
commit f55c877
Show file tree

Hide file tree

Showing 2 changed files with 6 additions and 1 deletion.
diff --git a/src/components/dialog/dialog.component.tsx b/src/components/dialog/dialog.component.tsx
@@ -337,7 +337,11 @@ export const Dialog = forwardRef<DialogHandle, DialogProps>(
  >
  {dialogTitle()}
  {closeIcon()}
- <StyledDialogContent {...contentPadding} data-role="dialog-content">
+ <StyledDialogContent
+ {...contentPadding}
+ data-role="dialog-content"
+ tabIndex={-1}
+ >
  <StyledDialogInnerContent
  data-role="dialog-inner-content"
  ref={innerContentRef}

diff --git a/src/components/form/form.component.tsx b/src/components/form/form.component.tsx
@@ -100,6 +100,7 @@ export const Form = ({
  className={stickyFooter ? "sticky" : ""}
  stickyFooter={stickyFooter}
  isInModal={isInModal}
+ tabIndex={-1}
  >
  <FormSpacingProvider marginBottom={formSpacing[fieldSpacing]}>
  {children}