refactor(stories): migrate stories to CSF3 format

1 files changed, 36 insertions, 88 deletions

diff --git a/src/components/molecules/code/code.stories.tsx b/src/components/molecules/code/code.stories.ts
index 1127839..38a9ef8 100644
--- a/src/components/molecules/code/code.stories.tsx
+++ b/src/components/molecules/code/code.stories.ts
@@ -1,58 +1,14 @@
-import type { ComponentMeta, ComponentStory } from '@storybook/react';
+import type { Meta, StoryObj } from '@storybook/react';
 import { Code } from './code';
 
-/**
- * Code - Storybook Meta
- */
-export default {
-  title: 'Molecules/Code',
+const meta = {
   component: Code,
-  argTypes: {
-    children: {
-      control: {
-        type: 'text',
-      },
-      description: 'The code sample.',
-      type: {
-        name: 'string',
-        required: true,
-      },
-    },
-    filterPattern: {
-      control: {
-        type: 'text',
-      },
-      description: 'Define a pattern to filter the command line output.',
-      table: {
-        category: 'Options',
-      },
-      type: {
-        name: 'string',
-        required: false,
-      },
-    },
-    language: {
-      control: {
-        type: 'text',
-      },
-      description: 'The code sample language.',
-      type: {
-        name: 'string',
-        required: true,
-      },
-    },
-    plugins: {
-      description: 'An array of Prism plugins to activate.',
-      type: {
-        name: 'object',
-        required: false,
-        value: {},
-      },
-    },
-  },
-} as ComponentMeta<typeof Code>;
+  title: 'Molecules/Code',
+} satisfies Meta<typeof Code>;
 
-const Template: ComponentStory<typeof Code> = (args) => <Code {...args} />;
+export default meta;
+
+type Story = StoryObj<typeof meta>;
 
 const javascriptCodeSample = `
 const foo = () => {
@@ -60,25 +16,22 @@ const foo = () => {
 }
 `;
 
-/**
- * Code Stories - Code sample
- */
-export const CodeSample = Template.bind({});
-CodeSample.args = {
-  children: javascriptCodeSample,
-  language: 'javascript',
+export const CodeSample: Story = {
+  args: {
+    children: javascriptCodeSample,
+    language: 'javascript',
+  },
 };
 
 /**
- * Code Stories - Highlighting
- *
  * @todo Find a way to make it working: line-highlight plugin is not loaded.
  */
-export const Highlighting = Template.bind({});
-Highlighting.args = {
-  children: javascriptCodeSample,
-  highlight: '3',
-  language: 'javascript',
+export const Highlighting: Story = {
+  args: {
+    children: javascriptCodeSample,
+    highlight: '3',
+    language: 'javascript',
+  },
 };
 
 // cSpell:ignore xinitrc
@@ -89,15 +42,13 @@ ls -lah
 #output#-rw-r--r--   1 armand armand 2,0K 21 jul.  2021  .xinitrc
 `;
 
-/**
- * Code Stories - Command Line
- */
-export const CommandLine = Template.bind({});
-CommandLine.args = {
-  children: commandLineCode,
-  cmdOutputFilter: '#output#',
-  isCmd: true,
-  language: 'bash',
+export const CommandLine: Story = {
+  args: {
+    children: commandLineCode,
+    cmdOutputFilter: '#output#',
+    isCmd: true,
+    language: 'bash',
+  },
 };
 
 // cSpell:ignore lcov
@@ -163,14 +114,13 @@ const treeSample = `
 └── yarn.lock`;
 
 /**
- * Code Stories - Tree view
- *
  * @todo Find a way to make it working: treeview plugin is not loaded.
  */
-export const TreeView = Template.bind({});
-TreeView.args = {
-  children: treeSample,
-  language: 'treeview',
+export const TreeView: Story = {
+  args: {
+    children: treeSample,
+    language: 'treeview',
+  },
 };
 
 const diffSample = `
@@ -181,12 +131,10 @@ const diffSample = `
 -foo = foo + 1;
 +const foo = bar.baz([1, 2, 3]) + 1;`;
 
-/**
- * Code Stories - Diff
- */
-export const Diff = Template.bind({});
-Diff.args = {
-  children: diffSample,
-  isDiff: true,
-  language: 'diff',
+export const Diff: Story = {
+  args: {
+    children: diffSample,
+    isDiff: true,
+    language: 'diff',
+  },
 };