90 lines
1.6 KiB
TypeScript
90 lines
1.6 KiB
TypeScript
import type { Meta, StoryObj } from '@storybook/react-vite';
|
|
|
|
import CelebrationIcon from '@/material-icons/400-24px/celebration-fill.svg?react';
|
|
|
|
import * as badges from '.';
|
|
|
|
const meta = {
|
|
component: badges.Badge,
|
|
title: 'Components/Badge',
|
|
args: {
|
|
domain: '',
|
|
label: undefined,
|
|
},
|
|
argTypes: {
|
|
domain: {
|
|
control: 'text',
|
|
},
|
|
},
|
|
} satisfies Meta<typeof badges.Badge>;
|
|
|
|
export default meta;
|
|
|
|
type Story = StoryObj<typeof meta>;
|
|
|
|
export const Default: Story = {
|
|
args: {
|
|
label: 'Example',
|
|
},
|
|
};
|
|
|
|
export const Domain: Story = {
|
|
args: {
|
|
...Default.args,
|
|
domain: 'example.com',
|
|
},
|
|
};
|
|
|
|
export const Verified: Story = {
|
|
render() {
|
|
return <badges.VerifiedBadge link='example.com' />;
|
|
},
|
|
};
|
|
|
|
export const CustomIcon: Story = {
|
|
args: {
|
|
...Default.args,
|
|
icon: <CelebrationIcon />,
|
|
},
|
|
};
|
|
|
|
export const Admin: Story = {
|
|
args: {
|
|
roleId: '1',
|
|
},
|
|
render(args) {
|
|
return <badges.AdminBadge {...args} />;
|
|
},
|
|
};
|
|
|
|
export const Group: Story = {
|
|
render(args) {
|
|
return <badges.GroupBadge {...args} />;
|
|
},
|
|
};
|
|
|
|
export const Automated: Story = {
|
|
render(args) {
|
|
return <badges.AutomatedBadge {...args} />;
|
|
},
|
|
};
|
|
|
|
export const Muted: Story = {
|
|
render(args) {
|
|
return <badges.MutedBadge {...args} />;
|
|
},
|
|
};
|
|
|
|
export const MutedWithDate: Story = {
|
|
render(args) {
|
|
const futureDate = new Date(new Date().getFullYear(), 11, 31).toISOString();
|
|
return <badges.MutedBadge {...args} expiresAt={futureDate} />;
|
|
},
|
|
};
|
|
|
|
export const Blocked: Story = {
|
|
render(args) {
|
|
return <badges.BlockedBadge {...args} />;
|
|
},
|
|
};
|