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

import Chip from '@/components/atoms/Chip'
import { IScrollingNav } from './ScrollingNav.interface'
import React from 'react'
import ScrollingNav from './ScrollingNav.component'

// More on default export: https://storybook.js.org/docs/react/writing-stories/introduction#default-export
export default {
  title: 'Components/ScrollingNav',
  component: ScrollingNav,
  tags: ['autodocs'],
  // More on argTypes: https://storybook.js.org/docs/react/api/argtypes
  argTypes: {}
} as Meta

export const Simple: StoryObj<IScrollingNav> = {
  render: args => (
    <ScrollingNav {...args}>
      <Chip variant={'light'} hover={true}>
        Item 1
      </Chip>
      <Chip variant={'light'} hover={true}>
        Item 2
      </Chip>
      <Chip variant={'light'} hover={true}>
        Item 3
      </Chip>
      <Chip variant={'light'} hover={true}>
        Item 4
      </Chip>
      <Chip variant={'light'} hover={true}>
        Item 5
      </Chip>
      <Chip variant={'light'} hover={true}>
        Item 6
      </Chip>
      <Chip variant={'light'} hover={true}>
        Item 7
      </Chip>
    </ScrollingNav>
  ),
  args: {}
}