Unable to utilize Drawer component within Storybook but works outside Storybook

[DerWaffleHousen]

Details

I am able to use the Drawer component in my application, but launching in Storybook does not work. Cloning this repository and adding in simple code produces the same error.

• OS: Ubuntu
• Node: 21.7.1
• Everything Else: from the repo

Steps to Reproduce

1. Clone the next-app-template repo and checkout the master branch
2. Run the installs: yarn install
3. Launch Storybook via Yarn: yarn run storybook
4. Add a MyDrawer component (file details below)
5. Add a MyDrawer story (file details below)
6. Attempt to load it in the browser

File Details: components/MyDrawer/MyDrawer.tsx

import { useDisclosure } from "@mantine/hooks";
import { Drawer, Button } from '@mantine/core';

export function MyDrawer() {
  const [opened, { open, close }] = useDisclosure(false);

  return (
    <>
      <Drawer opened={opened} onClose={close} title='My Drawer'>
        <div>This would be content.</div>
      </Drawer>
    
      <Button onClick={open}>Open Drawer</Button>
    </>
  );
}

File Details: components/MyDrawer/MyDrawer.story.tsx

import { MyDrawer } from './MyDrawer';

export default {
  title: 'MyDrawer',
};

export const Usage = () => <MyDrawer />;