import { ref } from 'vue'
import DefaultTextarea from './default-textarea.tsx'

export default {
  title: 'The Design system/Default textarea',
  component: DefaultTextarea,
  tags: ['autodocs'],
  args: {
    autoresize: false,
    isRequired: false,
    isDisabled: false,
    disableResize: false,
    label: 'Label text',
    description: 'Для проверки ошибок см вкладку вверху Docs => Description',
    placeholder: 'Placeholder text',
    errors: [] || '',
  },
}

const modelValue = ref('')

const Template = (args) => ({
  props: Object.keys(args),
  render() {
    return (
      <div style="max-width: 230px">
        <DefaultTextarea
          {...args }
          modelValue={modelValue.value}
          onValueChange={(v) => { modelValue.value = v }}
        />
      </div>
    )
  },
})

export const Primary = Template.bind({})