diff --git a/code/addons/storysource/src/StoryPanel.tsx b/code/addons/storysource/src/StoryPanel.tsx
index 260fbdb316fa..4dd67b8b8b42 100644
--- a/code/addons/storysource/src/StoryPanel.tsx
+++ b/code/addons/storysource/src/StoryPanel.tsx
@@ -176,6 +176,8 @@ export const StoryPanel: React.FC<StoryPanelProps> = ({ api }) => {
       format={false}
       copyable={false}
       padded
+      wrapLongLines
+      lineProps={{ style: { whiteSpace: 'pre' } }}
     >
       {source}
     </StyledSyntaxHighlighter>
diff --git a/code/ui/components/src/syntaxhighlighter/syntaxhighlighter-types.ts b/code/ui/components/src/syntaxhighlighter/syntaxhighlighter-types.ts
index b2c5ee2d39ee..f2287c985c7f 100644
--- a/code/ui/components/src/syntaxhighlighter/syntaxhighlighter-types.ts
+++ b/code/ui/components/src/syntaxhighlighter/syntaxhighlighter-types.ts
@@ -35,6 +35,7 @@ export interface SyntaxHighlighterBaseProps {
   lineProps?: LineTagPropsFunction | React.HTMLProps<HTMLElement>;
   showLineNumbers?: boolean;
   startingLineNumber?: number;
+  wrapLongLines?: boolean;
   style?: any;
   useInlineStyles?: boolean;
 }