import React from 'react'
import { Meta } from '@storybook/react/types-6-0'
import { Story } from '@storybook/react'
import { DatePicker,DatePickerProps } from './DatePicker'
import { useArgs } from '@storybook/client-api'

export default {
  title:'Components/DatePicker',
  component: DatePicker,
  args: {}
} as Meta

const Template:Story<DatePickerProps> = (args) => {
  const [{ value }, updateArgs] = useArgs()

  const handleChange = (value: string) => {
    updateArgs({ value })
  }
 
  return (
    <DatePicker 
      {...args} 
      value={value}
      onChange={handleChange} 
    />
  )
}

export const Basic = Template.bind({})
Basic.args = { label:'Birthday' }