Skip to content
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.

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

[TrapFocus] Rename TrapFocus to FocusTrap #34216

Merged
merged 22 commits into from Sep 26, 2022
Merged
Show file tree
Hide file tree
Changes from 9 commits
Commits
Show all changes
22 commits
Select commit Hold shift + click to select a range
91ab0c6
refactor: update TrapFocus name in docs folder.
kabernardes Sep 6, 2022
b4090e2
refactor: update TrapFocus name in mui-base/src folder.
kabernardes Sep 6, 2022
2f842ec
refactor: update TrapFocus name in test folder.
kabernardes Sep 6, 2022
355d052
refactor: update TrapFocus name on missing files.
kabernardes Sep 6, 2022
1e740e3
refactor: update lint
kabernardes Sep 6, 2022
2e50800
test: update broken test.
kabernardes Sep 7, 2022
6d6f891
refactor: update translations file
kabernardes Sep 7, 2022
ca7245e
refactor: update component name in new files.
kabernardes Sep 12, 2022
7498cca
refactor: rename focusTrap component at redirects
kabernardes Sep 13, 2022
fce1229
feat: add new redirects
kabernardes Sep 15, 2022
1c1f5e2
refactor: update TrapFocus name in docs folder.
kabernardes Sep 6, 2022
e0dc5f9
refactor: update TrapFocus name in mui-base/src folder.
kabernardes Sep 6, 2022
91872f6
refactor: update TrapFocus name in test folder.
kabernardes Sep 6, 2022
122f7e5
refactor: update TrapFocus name on missing files.
kabernardes Sep 6, 2022
ab09a85
refactor: update lint
kabernardes Sep 6, 2022
39cf759
test: update broken test.
kabernardes Sep 7, 2022
c88b791
refactor: update translations file
kabernardes Sep 7, 2022
442dd1d
refactor: update component name in new files.
kabernardes Sep 12, 2022
fee0dcb
refactor: rename focusTrap component at redirects
kabernardes Sep 13, 2022
d97bf0a
feat: add new redirects
kabernardes Sep 15, 2022
460612c
Merge branch 'rename-trap-focus-component' of https://github.com/kabe…
kabernardes Sep 15, 2022
a07a6ed
Merge branch 'master' into rename-trap-focus-component
kabernardes Sep 21, 2022
File filter

Filter by extension

Filter by extension

Conversations
Failed to load comments.
Jump to
Jump to file
Failed to load files.
Diff view
Diff view
@@ -1,8 +1,8 @@
import * as React from 'react';
import Box from '@mui/system/Box';
import TrapFocus from '@mui/base/TrapFocus';
import FocusTrap from '@mui/base/FocusTrap';

export default function BasicTrapFocus() {
export default function BasicFocusTrap() {
const [open, setOpen] = React.useState(false);

return (
Expand All @@ -11,7 +11,7 @@ export default function BasicTrapFocus() {
Open
</button>
{open && (
<TrapFocus open>
<FocusTrap open>
<Box tabIndex={-1} sx={{ mt: 1, p: 1 }}>
<label>
First name: <input type="text" />
Expand All @@ -21,7 +21,7 @@ export default function BasicTrapFocus() {
Close
</button>
</Box>
</TrapFocus>
</FocusTrap>
)}
</Box>
);
Expand Down
@@ -1,8 +1,8 @@
import * as React from 'react';
import Box from '@mui/system/Box';
import TrapFocus from '@mui/base/TrapFocus';
import FocusTrap from '@mui/base/FocusTrap';

export default function BasicTrapFocus() {
export default function BasicFocusTrap() {
const [open, setOpen] = React.useState(false);

return (
Expand All @@ -11,7 +11,7 @@ export default function BasicTrapFocus() {
Open
</button>
{open && (
<TrapFocus open>
<FocusTrap open>
<Box tabIndex={-1} sx={{ mt: 1, p: 1 }}>
<label>
First name: <input type="text" />
Expand All @@ -21,7 +21,7 @@ export default function BasicTrapFocus() {
Close
</button>
</Box>
</TrapFocus>
</FocusTrap>
)}
</Box>
);
Expand Down
Expand Up @@ -2,7 +2,7 @@
Open
</button>
{open && (
<TrapFocus open>
<FocusTrap open>
<Box tabIndex={-1} sx={{ mt: 1, p: 1 }}>
<label>
First name: <input type="text" />
Expand All @@ -12,5 +12,5 @@
Close
</button>
</Box>
</TrapFocus>
</FocusTrap>
)}
@@ -1,13 +1,13 @@
import * as React from 'react';
import Stack from '@mui/system/Stack';
import TrapFocus from '@mui/base/TrapFocus';
import FocusTrap from '@mui/base/FocusTrap';

export default function ContainedToggleTrappedFocus() {
const [open, setOpen] = React.useState(false);

return (
<React.Fragment>
<TrapFocus open={open} disableRestoreFocus disableAutoFocus>
<FocusTrap open={open} disableRestoreFocus disableAutoFocus>
<Stack alignItems="center" spacing={2}>
<button type="button" onClick={() => setOpen(!open)}>
{open ? 'Close' : 'Open'}
Expand All @@ -18,7 +18,7 @@ export default function ContainedToggleTrappedFocus() {
</label>
)}
</Stack>
</TrapFocus>
</FocusTrap>
</React.Fragment>
);
}
@@ -1,13 +1,13 @@
import * as React from 'react';
import Stack from '@mui/system/Stack';
import TrapFocus from '@mui/base/TrapFocus';
import FocusTrap from '@mui/base/FocusTrap';

export default function ContainedToggleTrappedFocus() {
const [open, setOpen] = React.useState(false);

return (
<React.Fragment>
<TrapFocus open={open} disableRestoreFocus disableAutoFocus>
<FocusTrap open={open} disableRestoreFocus disableAutoFocus>
<Stack alignItems="center" spacing={2}>
<button type="button" onClick={() => setOpen(!open)}>
{open ? 'Close' : 'Open'}
Expand All @@ -18,7 +18,7 @@ export default function ContainedToggleTrappedFocus() {
</label>
)}
</Stack>
</TrapFocus>
</FocusTrap>
</React.Fragment>
);
}
@@ -1,5 +1,5 @@
<React.Fragment>
<TrapFocus open={open} disableRestoreFocus disableAutoFocus>
<FocusTrap open={open} disableRestoreFocus disableAutoFocus>
<Stack alignItems="center" spacing={2}>
<button type="button" onClick={() => setOpen(!open)}>
{open ? 'Close' : 'Open'}
Expand All @@ -10,5 +10,5 @@
</label>
)}
</Stack>
</TrapFocus>
</FocusTrap>
</React.Fragment>
@@ -1,6 +1,6 @@
import * as React from 'react';
import Box from '@mui/system/Box';
import TrapFocus from '@mui/base/TrapFocus';
import FocusTrap from '@mui/base/FocusTrap';

export default function DisableEnforceFocus() {
const [open, setOpen] = React.useState(false);
Expand All @@ -11,7 +11,7 @@ export default function DisableEnforceFocus() {
Open
</button>
{open && (
<TrapFocus disableEnforceFocus open>
<FocusTrap disableEnforceFocus open>
<Box tabIndex={-1} sx={{ mt: 1, p: 1 }}>
<label>
First name: <input type="text" />
Expand All @@ -21,7 +21,7 @@ export default function DisableEnforceFocus() {
Close
</button>
</Box>
</TrapFocus>
</FocusTrap>
)}
</Box>
);
Expand Down
@@ -1,6 +1,6 @@
import * as React from 'react';
import Box from '@mui/system/Box';
import TrapFocus from '@mui/base/TrapFocus';
import FocusTrap from '@mui/base/FocusTrap';

export default function DisableEnforceFocus() {
const [open, setOpen] = React.useState(false);
Expand All @@ -11,7 +11,7 @@ export default function DisableEnforceFocus() {
Open
</button>
{open && (
<TrapFocus disableEnforceFocus open>
<FocusTrap disableEnforceFocus open>
<Box tabIndex={-1} sx={{ mt: 1, p: 1 }}>
<label>
First name: <input type="text" />
Expand All @@ -21,7 +21,7 @@ export default function DisableEnforceFocus() {
Close
</button>
</Box>
</TrapFocus>
</FocusTrap>
)}
</Box>
);
Expand Down
Expand Up @@ -2,7 +2,7 @@
Open
</button>
{open && (
<TrapFocus disableEnforceFocus open>
<FocusTrap disableEnforceFocus open>
<Box tabIndex={-1} sx={{ mt: 1, p: 1 }}>
<label>
First name: <input type="text" />
Expand All @@ -12,5 +12,5 @@
Close
</button>
</Box>
</TrapFocus>
</FocusTrap>
)}
@@ -1,8 +1,8 @@
import * as React from 'react';
import Box from '@mui/system/Box';
import TrapFocus from '@mui/base/TrapFocus';
import FocusTrap from '@mui/base/FocusTrap';

export default function LazyTrapFocus() {
export default function LazyFocusTrap() {
const [open, setOpen] = React.useState(false);

return (
Expand All @@ -11,7 +11,7 @@ export default function LazyTrapFocus() {
Open
</button>
{open && (
<TrapFocus open disableAutoFocus>
<FocusTrap open disableAutoFocus>
<Box tabIndex={-1} sx={{ mt: 1, p: 1 }}>
<label>
First name: <input type="text" />
Expand All @@ -21,7 +21,7 @@ export default function LazyTrapFocus() {
Close
</button>
</Box>
</TrapFocus>
</FocusTrap>
)}
</Box>
);
Expand Down
@@ -1,8 +1,8 @@
import * as React from 'react';
import Box from '@mui/system/Box';
import TrapFocus from '@mui/base/TrapFocus';
import FocusTrap from '@mui/base/FocusTrap';

export default function LazyTrapFocus() {
export default function LazyFocusTrap() {
const [open, setOpen] = React.useState(false);

return (
Expand All @@ -11,7 +11,7 @@ export default function LazyTrapFocus() {
Open
</button>
{open && (
<TrapFocus open disableAutoFocus>
<FocusTrap open disableAutoFocus>
<Box tabIndex={-1} sx={{ mt: 1, p: 1 }}>
<label>
First name: <input type="text" />
Expand All @@ -21,7 +21,7 @@ export default function LazyTrapFocus() {
Close
</button>
</Box>
</TrapFocus>
</FocusTrap>
)}
</Box>
);
Expand Down
Expand Up @@ -2,7 +2,7 @@
Open
</button>
{open && (
<TrapFocus open disableAutoFocus>
<FocusTrap open disableAutoFocus>
<Box tabIndex={-1} sx={{ mt: 1, p: 1 }}>
<label>
First name: <input type="text" />
Expand All @@ -12,5 +12,5 @@
Close
</button>
</Box>
</TrapFocus>
</FocusTrap>
)}
@@ -1,9 +1,9 @@
import * as React from 'react';
import Box from '@mui/system/Box';
import Portal from '@mui/base/Portal';
import TrapFocus from '@mui/base/TrapFocus';
import FocusTrap from '@mui/base/FocusTrap';

export default function PortalTrapFocus() {
export default function PortalFocusTrap() {
const [open, setOpen] = React.useState(false);
const [container, setContainer] = React.useState(null);

Expand All @@ -13,7 +13,7 @@ export default function PortalTrapFocus() {
Open
</button>
{open && (
<TrapFocus open>
<FocusTrap open>
<Box tabIndex={-1} sx={{ mt: 1, p: 1 }}>
<label>
First name: <input type="text" />
Expand All @@ -29,7 +29,7 @@ export default function PortalTrapFocus() {
Close
</button>
</Box>
</TrapFocus>
</FocusTrap>
)}

<div ref={setContainer} />
Expand Down
@@ -1,9 +1,9 @@
import * as React from 'react';
import Box from '@mui/system/Box';
import Portal from '@mui/base/Portal';
import TrapFocus from '@mui/base/TrapFocus';
import FocusTrap from '@mui/base/FocusTrap';

export default function PortalTrapFocus() {
export default function PortalFocusTrap() {
const [open, setOpen] = React.useState(false);
const [container, setContainer] = React.useState<HTMLElement | null>(null);

Expand All @@ -13,7 +13,7 @@ export default function PortalTrapFocus() {
Open
</button>
{open && (
<TrapFocus open>
<FocusTrap open>
<Box tabIndex={-1} sx={{ mt: 1, p: 1 }}>
<label>
First name: <input type="text" />
Expand All @@ -29,7 +29,7 @@ export default function PortalTrapFocus() {
Close
</button>
</Box>
</TrapFocus>
</FocusTrap>
)}
<div ref={setContainer} />
</Box>
Expand Down