import type { Meta, StoryObj } from '@storybook/react';

import ListHeading from './ListHeading';
import ListItem from './ListItem';

type PagePropsAndCustomArgs = Pick<
  React.ComponentProps<typeof ListItem>,
  'className' | 'children'
>;

const meta: Meta<PagePropsAndCustomArgs> = {
  title: 'components/ListItem',
  component: ListItem,
  argTypes: {
    className: {
      control: { type: 'text' },
    },
    children: {
      control: { type: 'text' },
    },
  },
};

export default meta;
type Story = StoryObj<PagePropsAndCustomArgs>;

export const Default: Story = {
  args: {
    children: 'List Item',
  },
};

const ListHeadingStory: StoryObj<React.ComponentProps<typeof ListHeading>> = {
  render: (args) => <ListHeading {...args} />,
  args: {
    children: 'List Heading',
  },
};
export { ListHeadingStory as ListHeading };