58 lines
1.3 KiB
TypeScript
58 lines
1.3 KiB
TypeScript
import type { Meta, StoryObj } from '@storybook/react-vite';
|
|
|
|
import LinkIcon from '@/material-icons/400-24px/link_2.svg?react';
|
|
|
|
import { MiniCardList } from './list';
|
|
|
|
const meta = {
|
|
title: 'Components/MiniCard',
|
|
component: MiniCardList,
|
|
} satisfies Meta<typeof MiniCardList>;
|
|
|
|
export default meta;
|
|
|
|
type Story = StoryObj<typeof meta>;
|
|
|
|
export const Default: Story = {
|
|
args: {
|
|
cards: [
|
|
{ label: 'Pronouns', value: 'they/them' },
|
|
{
|
|
label: 'Website',
|
|
value: <a href='https://example.com'>bowie-the-db.meow</a>,
|
|
icon: LinkIcon,
|
|
},
|
|
{
|
|
label: 'Free playlists',
|
|
value: <a href='https://soundcloud.com/bowie-the-dj'>soundcloud.com</a>,
|
|
icon: LinkIcon,
|
|
},
|
|
{ label: 'Location', value: 'Purris, France' },
|
|
],
|
|
},
|
|
};
|
|
|
|
export const LongValue: Story = {
|
|
args: {
|
|
cards: [
|
|
{
|
|
label: 'Username',
|
|
value: 'bowie-the-dj',
|
|
style: { maxWidth: '250px' },
|
|
},
|
|
{
|
|
label: 'Bio',
|
|
value:
|
|
'Lorem ipsum dolor sit amet, consectetur adipiscing elit. Sed do eiusmod tempor incididunt ut labore et dolore magna aliqua.',
|
|
style: { maxWidth: '250px' },
|
|
},
|
|
],
|
|
},
|
|
};
|
|
|
|
export const OneCard: Story = {
|
|
args: {
|
|
cards: [{ label: 'Pronouns', value: 'they/them' }],
|
|
},
|
|
};
|