function FocusTrapProto()

in packages/palette-mantine-core/palette.tsx [2411:2430]


function FocusTrapProto() {
  const [active, setActive] = useState(false);
  const toggleActive = useCallback(() => setActive(!active), [setActive]);

  return (
    <>
      <Button onClick={toggleActive}>
        {active ? "Deactivate" : "Activate"} focus trap
      </Button>

      <FocusTrap active={active}>
        <div>
          <TextInput mt="sm" label="First input" placeholder="First input" />
          <TextInput mt="sm" label="Second input" placeholder="Second input" />
          <TextInput mt="sm" label="Third input" placeholder="Third input" />
        </div>
      </FocusTrap>
    </>
  );
}