eventx-design-system
Version:
Design System do EventX
81 lines (80 loc) • 2.2 kB
JavaScript
import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
import { Badge } from './Badge';
const meta = {
title: 'Components/Badge',
component: Badge,
parameters: {
layout: 'centered',
},
tags: ['autodocs'],
argTypes: {
variant: {
control: { type: 'select' },
options: ['primary', 'secondary', 'success', 'error', 'warning', 'info'],
},
size: {
control: { type: 'select' },
options: ['sm', 'md', 'lg'],
},
},
};
export default meta;
export const Default = {
args: {
children: 'Badge',
},
};
export const Primary = {
args: {
variant: 'primary',
children: 'Primary',
},
};
export const Secondary = {
args: {
variant: 'secondary',
children: 'Secondary',
},
};
export const Success = {
args: {
variant: 'success',
children: 'Success',
},
};
export const Error = {
args: {
variant: 'error',
children: 'Error',
},
};
export const Warning = {
args: {
variant: 'warning',
children: 'Warning',
},
};
export const Info = {
args: {
variant: 'info',
children: 'Info',
},
};
export const Small = {
args: {
size: 'sm',
children: 'Small',
},
};
export const Large = {
args: {
size: 'lg',
children: 'Large',
},
};
export const AllVariants = {
render: () => (_jsxs("div", { style: { display: 'flex', gap: '8px', flexWrap: 'wrap' }, children: [_jsx(Badge, { variant: "primary", children: "Primary" }), _jsx(Badge, { variant: "secondary", children: "Secondary" }), _jsx(Badge, { variant: "success", children: "Success" }), _jsx(Badge, { variant: "error", children: "Error" }), _jsx(Badge, { variant: "warning", children: "Warning" }), _jsx(Badge, { variant: "info", children: "Info" })] })),
};
export const AllSizes = {
render: () => (_jsxs("div", { style: { display: 'flex', gap: '8px', alignItems: 'center' }, children: [_jsx(Badge, { size: "sm", children: "Small" }), _jsx(Badge, { size: "md", children: "Medium" }), _jsx(Badge, { size: "lg", children: "Large" })] })),
};