import React from 'react'
import { Story, Meta } from '@storybook/react'
import { Card, CardProps } from './Card'

export default {
  title: 'Structure/Card',
  component: Card,
  argTypes: {
    title: {
      name: 'title',
      description: 'Controls the font line height',
      type: { name: 'string', required: false },
      control: {
        type: 'select',
        options: ['normal', 'loose', 'tight']
      }
    }
  }
} as Meta

const Template: Story<CardProps> = (args: any) => {
  return (
    <Card {...args}>
      Lorem ipsum dolor sit amet, consectetur adipiscing elit. Vivamus malesuada
      molestie tempor. Curabitur tincidunt quis lorem ut maximus.
    </Card>
  )
}

export const Default = Template.bind({})

export const WidthHeader = Template.bind({})
WidthHeader.args = {
  title: 'Maecenas'
}
