Skip to content

fix: snackbar: added lastfocusableElement prop #970

New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

Sign up for GitHub

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Closed
rmotwani-c-eightfold wants to merge 8 commits into from
Closed

fix: snackbar: added lastfocusableElement prop #970

Show file tree
Hide file tree
Changes from all commits
Commits
Show all changes
8 commits
Select commit Hold shift + click to select a range
f6087ae
fix: snackbar: added lastfocusableElement prop
rmotwani-c-eightfold Mar 25, 2025
e28edbd
Merge branch 'main' into rmotwani/incorrect-focus-order
rmotwani-c-eightfold Mar 25, 2025
133d735
fix: snackbar: added prop correction
rmotwani-c-eightfold Mar 26, 2025
f0d4473
Merge branch 'main' into rmotwani/incorrect-focus-order
rmotwani-c-eightfold Apr 3, 2025
8f0f648
fix: snackbar: removed map for focusable elements
rmotwani-c-eightfold Apr 7, 2025
377d154
Merge branch 'rmotwani/incorrect-focus-order' of github.com:rmotwani-…
rmotwani-c-eightfold Apr 7, 2025
bfc3285
Merge branch 'main' into rmotwani/incorrect-focus-order
rmotwani-c-eightfold May 2, 2025
02d3db7
Merge branch 'main' into rmotwani/incorrect-focus-order
rmotwani-c-eightfold May 20, 2025
File filter

Filter by extension

Filter by extension
Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
3 changes: 2 additions & 1 deletion src/components/InfoBar/InfoBar.tsx
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -86,7 +86,8 @@ export const InfoBar: FC<InfoBarsProps> = React.forwardRef(

useEffect(() => {
setTimeout(() => {
if (closeButtonRef.current && moveFocusToCloseButton) {
if (closeButtonRef.current) {
if (closeButtonRef.current && moveFocusToCloseButton)
closeButtonRef.current.focus();
}
}, 1000);
Expand Down
11 changes: 7 additions & 4 deletions src/components/Snackbar/snack.ts
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -11,7 +11,7 @@ import { InfoBarType } from '../InfoBar';

const DEFAULT_POSITION: SnackbarPosition = 'top-center';

let focusedElementRef: HTMLElement | null = null;
let elementToFocus: HTMLElement | null = null;

export const SNACK_EVENTS: Record<string, string> = {
SERVE: 'serveSnack',
Expand All @@ -33,7 +33,9 @@ export const serve = (props: SnackbarProps): VoidFunction => {
document.dispatchEvent(serveSnackEvent);
}

focusedElementRef = document.activeElement as HTMLElement;
if (props.lastFocusableElement) {
elementToFocus = props.lastFocusableElement;
}

if (!props.closable || props.actionButtonProps) {
setTimeout(() => {
Expand All @@ -50,11 +52,12 @@ export const eat = (snackId: string): void => {
cancelable: false,
detail: snackId,
});

if (canUseDocElement()) {
document.dispatchEvent(removeSnackEvent);
}
if (focusedElementRef) {
focusedElementRef.focus();
if (elementToFocus) {
elementToFocus.focus();
}
};

Expand Down