RelationInput: Update docs

This commit is contained in:
Gustav Hansen 2022-08-15 10:17:22 +02:00
parent d11457ad56
commit 41bf95ab82

View File

@ -5,7 +5,7 @@ import { BaseLink } from '@strapi/design-system/BaseLink';
import { Badge } from '@strapi/design-system/Badge'; import { Badge } from '@strapi/design-system/Badge';
import { Icon } from '@strapi/design-system/Icon'; import { Icon } from '@strapi/design-system/Icon';
import Cross from '@strapi/icons/Cross'; import Cross from '@strapi/icons/Cross';
import { RelationList, RelationItem } from './index'; import { RelationInput } from './RelationInput';
import { relations } from './relationsDataMock'; import { relations } from './relationsDataMock';
<Meta title="components/RelationInput" /> <Meta title="components/RelationInput" />
@ -18,33 +18,26 @@ WIP
<Canvas> <Canvas>
<Story name="base"> <Story name="base">
{() => { <RelationInput label="Relations" labelLoadMore="Load More" name="options" relations={{
return ( data: {
<Main> pages: [
<RelationList overflow="top-bottom"> {
{relations.map(relation => { id: 1,
const { title, status } = relation; href: '',
const variant = status === 'published' ? 'success' : 'secondary'; title: 'Relation 1',
return ( isDraft: false
<RelationItem endAction={<button type="button"><Icon width="12px" as={Cross} /></button>}> },
<BaseLink href="/"> {
{title} id: 2,
</BaseLink> href: '',
<Badge title: 'Relation 2',
borderSize={1} isDraft: false
borderColor={`${variant}200`} }
backgroundColor={`${variant}100`} ],
textColor={`${variant}700`} },
> isLoading: false,
{status} isSuccess: true
</Badge> }} />
</RelationItem>
);
})}
</RelationList>
</Main>
);
}}
</Story> </Story>
</Canvas> </Canvas>