import * as React from 'react';
import type { Meta, StoryObj } from '@storybook/react-vite';

import { Pagination } from './Pagination';

const meta: Meta<typeof Pagination> = {
  title: 'UI kit/Table/Pagination/Pagination',
  component: Pagination,
  tags: ['autodocs'],
};

export default meta;
type Story = StoryObj<typeof Pagination>;

const onLimitsChange = (numberOfPages: number) => alert(`Number of pages selected: ${numberOfPages}`);

export const Default: Story = {
  args: {
    summary: '124 items total',
    pages: (
      <Pagination.Pages
        pagesTotal={50}
        pageCurrent={5}
        getLinkProps={(page: number | string) => ({ href: `?from=${page}` })}
      />
    ),
    limits: <Pagination.Limits itemsPerPage={25} label='Položek na stránku' onChange={onLimitsChange} />,
    jump: (
      <Pagination.Jump
        label='Zobrazit stránku'
        totalPages={50}
        getLinkProps={(page: number) => ({ href: `?from=${page}` })}
      />
    ),
  },
};