1 files changed, 30 insertions, 65 deletions
diff --git a/src/components/atoms/figure/figure.stories.tsx b/src/components/atoms/figure/figure.stories.tsx
index 7763641..ece08b7 100644
--- a/src/components/atoms/figure/figure.stories.tsx
+++ b/src/components/atoms/figure/figure.stories.tsx
@@ -1,74 +1,39 @@
-import type { ComponentMeta, ComponentStory } from '@storybook/react';
+import type { Meta, StoryObj } from '@storybook/react';
 import NextImage from 'next/image';
 import { Figure } from './figure';
 
-/**
- * Figure - Storybook Meta
- */
-export default {
-  title: 'Atoms/Figure',
+const meta = {
   component: Figure,
-  args: {},
-  argTypes: {
-    caption: {
-      control: {
-        type: 'text',
-      },
-      description: 'A figure caption.',
-      table: {
-        category: 'Options',
-      },
-      type: {
-        name: 'string',
-        required: false,
-      },
-    },
-    hasBorders: {
-      control: {
-        type: 'boolean',
-      },
-      description: 'Add borders around the figure.',
-      table: {
-        category: 'Styles',
-        defaultValue: { summary: false },
-      },
-      type: {
-        name: 'boolean',
-        required: false,
-      },
-    },
-  },
-} as ComponentMeta<typeof Figure>;
+  title: 'Atoms/Figure',
+} satisfies Meta<typeof Figure>;
 
-const Template: ComponentStory<typeof Figure> = (args) => <Figure {...args} />;
+export default meta;
 
-/**
- * Figure Stories - Illustration
- */
-export const Illustration = Template.bind({});
-Illustration.args = {
-  children: (
-    <NextImage
-      alt="An example"
-      height={480}
-      src="https://picsum.photos/640/480"
-      width={640}
-    />
-  ),
+type Story = StoryObj<typeof meta>;
+
+export const Default: Story = {
+  args: {
+    children: (
+      <NextImage
+        alt="An example"
+        height={480}
+        src="https://picsum.photos/640/480"
+        width={640}
+      />
+    ),
+  },
 };
 
-/**
- * Figure Stories - BorderedIllustration
- */
-export const BorderedIllustration = Template.bind({});
-BorderedIllustration.args = {
-  children: (
-    <NextImage
-      alt="An example"
-      height={480}
-      src="https://picsum.photos/640/480"
-      width={640}
-    />
-  ),
-  hasBorders: true,
+export const Bordered: Story = {
+  args: {
+    children: (
+      <NextImage
+        alt="An example"
+        height={480}
+        src="https://picsum.photos/640/480"
+        width={640}
+      />
+    ),
+    hasBorders: true,
+  },
 };