import type {Meta, StoryObj} from "@storybook/react";

import {Simulate} from "react-dom/test-utils";
import select = Simulate.select;
import Typography from "../../components/UI/Typography/Typography";

const meta = {
    title: 'Components/Typography/Typography',
    component: Typography,
} satisfies Meta<typeof Typography>;

export default meta;

type Story = StoryObj<typeof meta>;

export const TypographyEx: Story = {
    args: {
        children: 'This is custom typography components. Play with me.',
        tag: 'h1',
    },
    argTypes: {
        fontSize: {
            control: {
                type: 'number',
                min: 10,
                max: 80,
                step: 1,
            }
        },
        fontWeight: {
            control: {
                type: 'number',
                min: 100,
                max: 900,
                step: 100,
            }
        },
        color: {
            control: {
                type: 'color',
                presetColors: ['#040059', '#707070']
            }
        }
    }
};