Function Example

packages/react-aria/stories/focus/FocusScope.stories.tsx:104–121

({isPortaled, contain}: FocusScopeProps & StoryProps)

}

export let Example = ({isPortaled, contain}: FocusScopeProps & StoryProps): JSX.Element => {
  let [open, setOpen] = useState(false);

  return (
    <div>
      <input aria-label="input before" />
      <button type="button" onClick={() => setOpen(true)}>
        Open dialog
      </button>
      <input aria-label="input after" />
      {open && (
        <NestedDialog onClose={() => setOpen(false)} isPortaled={isPortaled} contain={contain} />
      )}

      <div id={dialogsRoot} />
    </div>
  );
};

export let ExampleStory: FocusScopeStory = args => <Example {...args} />;
ExampleStory.storyName = 'Example';