uidev/src/stories/textarea.stories.tsx


1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30

import React from 'react';
import { v4 as uuid } from 'uuid';

import { Textarea } from '@meetfranz/forms';
import { storiesOf } from '../stores/stories';

const defaultProps = () => {
  const id = uuid();
  return {
    label: 'Label',
    id: `test-${id}`,
    name: `test-${id}`,
    rows: 5,
    onChange: (e: React.ChangeEvent<HTMLInputElement>) =>
      console.log('changed event', e),
  };
};

storiesOf('Textarea')
  .add('Basic', () => (
    <Textarea
      {...defaultProps()}
      // placeholder="Placeholder text"
    />
  ))
  .add('10 rows', () => <Textarea {...defaultProps()} rows={10} />)
  .add('With error', () => (
    <Textarea {...defaultProps()} error="This is a generic error message." />
  ))
  .add('Disabled', () => <Textarea {...defaultProps()} rows={2} disabled />);