import { html } from 'lit-html'

export default {
    title: 'GES DISC/Tag Input',
    component: 'gd-tag-input',
}

export const example = props => html`
    <gd-tag-input
        value="tag1, tag2, tag3, tag4, tag5, tag6"
        variant="${props.variant}"
        placeholder="${props.placeholder}"
    ></gd-tag-input>
`

example.argTypes = {
    variant: {
        control: {
            type: 'select',
            options: ['', 'pills']
        }
    },
    placeholder: {
        control: {
            type: 'text',
        }
    }
}

example.args = {
    variant: 'pills',
    placeholder: 'Enter tag...'
}
