diff --git a/generated/components.json b/generated/components.json
index 063d1273e37..653506bd7fc 100644
--- a/generated/components.json
+++ b/generated/components.json
@@ -3120,7 +3120,12 @@
       "name": "Portal",
       "status": "alpha",
       "a11yReviewed": false,
-      "stories": [],
+      "stories": [
+        {
+          "id": "components-portal--default",
+          "code": "() => (\n  <>\n    Root position\n    <Box bg=\"red.2\" p={3}>\n      Outer container\n      <Box bg=\"green.2\" p={3}>\n        Inner container\n        <Portal>\n          Portaled content rendered at <code>&lt;BaseStyles&gt;</code> root.\n        </Portal>\n      </Box>\n    </Box>\n  </>\n)"
+        }
+      ],
       "props": [
         {
           "name": "onMount",
diff --git a/src/stories/Portal.stories.tsx b/src/Portal/Portal.features.stories.tsx
similarity index 78%
rename from src/stories/Portal.stories.tsx
rename to src/Portal/Portal.features.stories.tsx
index e0d0df71c2f..45bc5a969cf 100644
--- a/src/stories/Portal.stories.tsx
+++ b/src/Portal/Portal.features.stories.tsx
@@ -1,39 +1,12 @@
 import React from 'react'
-import {Meta} from '@storybook/react'
-
-import {BaseStyles, Box, ThemeProvider} from '..'
-import Portal, {registerPortalRoot} from '../Portal'
+import {ComponentMeta} from '@storybook/react'
+import Box from '../Box'
+import {Portal, registerPortalRoot} from './Portal'
 
 export default {
-  title: 'Behaviors/Portal',
+  title: 'Behaviors/Portal/Features',
   component: Portal,
-  decorators: [
-    Story => {
-      return (
-        <ThemeProvider>
-          <BaseStyles>
-            <Story />
-          </BaseStyles>
-        </ThemeProvider>
-      )
-    },
-  ],
-} as Meta
-
-export const DefaultPortal = () => (
-  <>
-    Root position
-    <Box bg="red.2" p={3}>
-      Outer container
-      <Box bg="green.2" p={3}>
-        Inner container
-        <Portal>
-          Portaled content rendered at <code>&lt;BaseStyles&gt;</code> root.
-        </Portal>
-      </Box>
-    </Box>
-  </>
-)
+} as ComponentMeta<typeof Portal>
 
 export const CustomPortalRootById = () => (
   <>
diff --git a/src/Portal/Portal.stories.tsx b/src/Portal/Portal.stories.tsx
new file mode 100644
index 00000000000..6755d7e28da
--- /dev/null
+++ b/src/Portal/Portal.stories.tsx
@@ -0,0 +1,25 @@
+import React from 'react'
+import {ComponentMeta} from '@storybook/react'
+
+import {Box} from '..'
+import {Portal} from './Portal'
+
+export default {
+  title: 'Behaviors/Portal',
+  component: Portal,
+} as ComponentMeta<typeof Portal>
+
+export const Default = () => (
+  <>
+    Root position
+    <Box bg="red.2" p={3}>
+      Outer container
+      <Box bg="green.2" p={3}>
+        Inner container
+        <Portal>
+          Portaled content rendered at <code>&lt;BaseStyles&gt;</code> root.
+        </Portal>
+      </Box>
+    </Box>
+  </>
+)