Refine the Event Log code example

src/components/event-log/event-log.stories.mdx

@@ -1,5 +1,14 @@
 import { Story, Canvas, Meta } from '@storybook/addon-docs/blocks';
 import events from './demo/events.json';
+// The '!!raw-loader!' syntax is a non-standard, Webpack-specific, syntax.
+// See: https://github.com/webpack-contrib/raw-loader#examples
+// For now, it seems likely Storybook is pretty tied to Webpack, therefore, we are
+// okay with the following Webpack-specific raw loader syntax. It's better to leave
+// the ESLint rule enabled globally, and only thoughtfully disable as needed (e.g.
+// within a Storybook docs page and not within an actual component).
+// This can be revisited in the future if Storybook no longer relies on Webpack.
+// eslint-disable-next-line @cloudfour/import/no-webpack-loader-syntax
+import eventsDemoSource from '!!raw-loader!./demo/events.twig';
 import eventsDemo from './demo/events.twig';
 const eventsDemoStory = (args) => eventsDemo({ items: events, ...args });
 
@@ -12,7 +21,18 @@ Displays a list of event details in chronological order. Designed to show the pr
 For a less specialized display of tabular data, consider using [Table](/docs/components-table--basic). For simple string/number pairs, consider [Dot Leader](/docs/components-dot-leader--list). To display a single or upcoming date, consider using [Calendar Date](/docs/components-calendar-date--basic) (optionally combined with [Media](/docs/objects-media--event-summary)).
 
 <Canvas>
-  <Story name="Example">{eventsDemoStory.bind({})}</Story>
+  <Story
+    name="Example"
+    parameters={{
+      docs: {
+        source: {
+          code: eventsDemoSource,
+        },
+      },
+    }}
+  >
+    {eventsDemoStory.bind({})}
+  </Story>
 </Canvas>
 
 ## Template Properties