1 files changed, 95 insertions, 0 deletions
diff --git a/src/components/organisms/nav/pagination/pagination.stories.ts b/src/components/organisms/nav/pagination/pagination.stories.ts
new file mode 100644
index 0000000..fb1875f
--- /dev/null
+++ b/src/components/organisms/nav/pagination/pagination.stories.ts
@@ -0,0 +1,95 @@
+import type { Meta, StoryObj } from '@storybook/react';
+import {
+  Pagination,
+  type RenderPaginationItemAriaLabel,
+  type RenderPaginationLink,
+} from './pagination';
+
+const meta = {
+  component: Pagination,
+  title: 'Organisms/Nav/Pagination',
+} satisfies Meta<typeof Pagination>;
+
+export default meta;
+
+type Story = StoryObj<typeof meta>;
+
+const renderLink: RenderPaginationLink = (num: number) => `#page-${num}`;
+
+const renderItemAriaLabel: RenderPaginationItemAriaLabel = ({
+  kind,
+  pageNumber,
+  isCurrentPage,
+}) => {
+  switch (kind) {
+    case 'backward':
+      return 'Go to previous page';
+    case 'forward':
+      return 'Go to next page';
+    case 'number':
+    default:
+      return isCurrentPage
+        ? `Current page, page ${pageNumber}`
+        : `Go to page ${pageNumber}`;
+  }
+};
+
+export const RightEllipsis: Story = {
+  args: {
+    current: 2,
+    siblings: 2,
+    renderItemAriaLabel,
+    renderLink,
+    total: 50,
+  },
+};
+
+export const LeftEllipsis: Story = {
+  args: {
+    current: 49,
+    siblings: 2,
+    renderItemAriaLabel,
+    renderLink,
+    total: 50,
+  },
+};
+
+export const BothEllipsis: Story = {
+  args: {
+    current: 25,
+    siblings: 2,
+    renderItemAriaLabel,
+    renderLink,
+    total: 50,
+  },
+};
+
+export const WithoutEllipsis: Story = {
+  args: {
+    current: 2,
+    siblings: 2,
+    renderItemAriaLabel,
+    renderLink,
+    total: 5,
+  },
+};
+
+export const WithoutBackwardLink: Story = {
+  args: {
+    current: 1,
+    siblings: 2,
+    renderItemAriaLabel,
+    renderLink,
+    total: 5,
+  },
+};
+
+export const WithoutForwardLink: Story = {
+  args: {
+    current: 5,
+    siblings: 2,
+    renderItemAriaLabel,
+    renderLink,
+    total: 5,
+  },
+};