import React from 'react'
import { Meta } from '@storybook/react/types-6-0'
import { Story } from '@storybook/react'
import { BurgerMenuProps,BurgerMenu } from './BurgerMenu'
import { IoHome, IoLogOut } from 'react-icons/io5'
import { BsStar } from 'react-icons/bs'

export default {
  title:'Components/BurgerMenu',
  component: BurgerMenu,
  argTypes: {}
} as Meta

const options = [
  {
    onClick:()=>console.log('Home'),
    label: 'Home',
    icon: <IoHome size={16}/>,
  },
  {
    onClick:()=>console.log('Reviews'),
    label: 'Reviews',
    icon: <BsStar size={16}/>,
  },
  {
    onClick:()=>console.log('Logged out'),
    label: 'Log out',
    icon: <IoLogOut size={16}/>,
  },
]

const Template: Story<BurgerMenuProps> = (args) => {
  return (
    <BurgerMenu {...args} />
  )
}

export const Basic = Template.bind({})
Basic.args = { options:options, css:'.menu {background-color:lightblue;}' }




