1 import React from 'react';
2 import {storiesOf, action} from '@kadira/storybook';
3 import ListEditorView from './ListEditorView.jsx';
4 import ListEditorItemView from './ListEditorItemView.jsx';
5 import ListEditorItemViewField from './ListEditorItemViewField.jsx';
6 import {text, number} from '@kadira/storybook-addon-knobs';
7 import {withKnobs} from '@kadira/storybook-addon-knobs';
9 function makeChildren({onEdit = false, onDelete = false} = {}) {
11 [...Array(number('Items', 2)).keys()].map(index => (
14 onEdit={onEdit ? onEdit : undefined}
15 onDelete={onDelete ? onDelete : undefined}>
16 <ListEditorItemViewField>
17 <div>{text('field 1', 'Lorum Ipsum')}</div>
18 </ListEditorItemViewField>
19 <ListEditorItemViewField>
20 <div>{text('field 2', 'Lorum Ipsum')}</div>
21 </ListEditorItemViewField>
22 </ListEditorItemView>)
27 const stories = storiesOf('ListEditor', module);
28 stories.addDecorator(withKnobs);
31 .add('regular', () => (
32 <ListEditorView title='List Editor'>
36 .add('two columns', () => (
37 <ListEditorView title='List Editor' twoColumns>
41 .add('with add', () => (
42 <ListEditorView title='List Editor' onAdd={action('onAdd')} plusButtonTitle='Add' twoColumns>
46 .add('with delete', () => (
47 <ListEditorView title='List Editor' onAdd={action('onAdd')} plusButtonTitle='Add' twoColumns>
48 {makeChildren({onDelete: action('onDelete')})}
51 .add('with edit', () => (
52 <ListEditorView title='List Editor' onAdd={action('onAdd')} plusButtonTitle='Add' twoColumns>
53 {makeChildren({onEdit: action('onEdit')})}
56 .add('with edit and delete', () => (
57 <ListEditorView title='List Editor' onAdd={action('onAdd')} plusButtonTitle='Add' twoColumns>
58 {makeChildren({onDelete: action('onDelete'), onEdit: action('onEdit')})}