Add ArrayInputBase story

Author: djhi

packages/ra-core/src/controller/input/ArrayInputBase.stories.tsx

@@ -0,0 +1,73 @@
+import * as React from 'react';
+import fakeRestDataProvider from 'ra-data-fakerest';
+import { TestMemoryRouter } from '../../routing';
+import { EditBase } from '../edit';
+import {
+    Admin,
+    DataTable,
+    TextInput,
+    SimpleFormIterator,
+    SimpleForm,
+} from '../../test-ui';
+import { ListBase } from '../list';
+import { Resource } from '../../core';
+import { ArrayInputBase } from './ArrayInputBase';
+
+export default { title: 'ra-core/controller/input/ArrayInputBase' };
+
+export const Basic = () => (
+    <TestMemoryRouter initialEntries={['/posts/1']}>
+        <Admin
+            dataProvider={fakeRestDataProvider({
+                posts: [
+                    {
+                        id: 1,
+                        title: 'Post 1',
+                        tags: [
+                            { name: 'Tag 1', color: 'red' },
+                            { name: 'Tag 2', color: 'blue' },
+                        ],
+                    },
+                    { id: 2, title: 'Post 2' },
+                ],
+            })}
+        >
+            <Resource
+                name="posts"
+                list={
+                    <ListBase>
+                        <DataTable>
+                            <DataTable.Col source="title" />
+                            <DataTable.Col
+                                label="Tags"
+                                render={record =>
+                                    record.tags
+                                        ? record.tags
+                                              .map(tag => tag.name)
+                                              .join(', ')
+                                        : ''
+                                }
+                            />
+                        </DataTable>
+                    </ListBase>
+                }
+                edit={
+                    <EditBase>
+                        <SimpleForm>
+                            <TextInput source="title" />
+                            <div>
+                                <div>Tags:</div>
+                                <ArrayInputBase source="tags">
+                                    <SimpleFormIterator>
+                                        <TextInput source="name" />
+                                        <TextInput source="color" />
+                                    </SimpleFormIterator>
+                                </ArrayInputBase>
+                            </div>
+                        </SimpleForm>
+                    </EditBase>
+                }
+            />
+        </Admin>
+    </TestMemoryRouter>
+);