konobangu/apps/storybook/stories/pagination.stories.tsx

58 lines
1.3 KiB
TypeScript

import type { Meta, StoryObj } from '@storybook/react';
import {
Pagination,
PaginationContent,
PaginationEllipsis,
PaginationItem,
PaginationLink,
PaginationNext,
PaginationPrevious,
} from '@konobangu/design-system/components/ui/pagination';
/**
* Pagination with page navigation, next and previous links.
*/
const meta = {
title: 'ui/Pagination',
component: Pagination,
tags: ['autodocs'],
argTypes: {},
render: (args) => (
<Pagination {...args}>
<PaginationContent>
<PaginationItem>
<PaginationPrevious href="#" />
</PaginationItem>
<PaginationItem>
<PaginationLink href="#">1</PaginationLink>
</PaginationItem>
<PaginationItem>
<PaginationLink href="#">2</PaginationLink>
</PaginationItem>
<PaginationItem>
<PaginationLink href="#">3</PaginationLink>
</PaginationItem>
<PaginationItem>
<PaginationEllipsis />
</PaginationItem>
<PaginationItem>
<PaginationNext href="#" />
</PaginationItem>
</PaginationContent>
</Pagination>
),
parameters: {
layout: 'centered',
},
} satisfies Meta<typeof Pagination>;
export default meta;
type Story = StoryObj<typeof meta>;
/**
* The default form of the pagination.
*/
export const Default: Story = {};