52 lines
1.7 KiB
TypeScript
52 lines
1.7 KiB
TypeScript
import type { Meta, StoryObj } from "@storybook/react-vite";
|
|
|
|
import { AddIcon, DeleteIcon, EditIcon } from "./index";
|
|
|
|
const meta = {
|
|
component: AddIcon,
|
|
parameters: {
|
|
docs: {
|
|
description: {
|
|
component:
|
|
"Статичные SVG: size по умолчанию 24, strokeWidth 1.5, цвет currentColor. В кнопке иконка декоративная, имя принадлежит действию. Для самостоятельного изображения задайте aria-hidden={false}, role=img и aria-label либо aria-labelledby. Геометрия взята из Card/Cards; подписи и действия остаются у приложения.",
|
|
},
|
|
},
|
|
},
|
|
tags: ["autodocs"],
|
|
title: "Design System/Icons",
|
|
} satisfies Meta<typeof AddIcon>;
|
|
|
|
export default meta;
|
|
|
|
type Story = StoryObj<typeof meta>;
|
|
|
|
export const Decorative: Story = {
|
|
render: () => (
|
|
<div style={{ color: "#2563eb", display: "flex", gap: 16 }}>
|
|
<button aria-label="Добавить пример" type="button">
|
|
<AddIcon size={20} strokeWidth={2} />
|
|
</button>
|
|
|
|
<button aria-label="Изменить пример" type="button">
|
|
<EditIcon size={18} />
|
|
</button>
|
|
|
|
<button aria-label="Удалить пример" type="button">
|
|
<DeleteIcon size={18} />
|
|
</button>
|
|
</div>
|
|
),
|
|
};
|
|
|
|
export const Meaningful: Story = {
|
|
render: () => (
|
|
<div style={{ color: "#2563eb", display: "flex", gap: 16 }}>
|
|
<AddIcon aria-hidden={false} aria-label="Добавление" role="img" />
|
|
|
|
<EditIcon aria-hidden={false} aria-label="Редактирование" role="img" />
|
|
|
|
<DeleteIcon aria-hidden={false} aria-label="Удаление" role="img" />
|
|
</div>
|
|
),
|
|
};
|