"use strict";
var __importDefault = (this && this.__importDefault) || function (mod) {
    return (mod && mod.__esModule) ? mod : { "default": mod };
};
Object.defineProperty(exports, "__esModule", { value: true });
exports.WithIcons = exports.Sizes = exports.TextButtons = exports.BasicButtons = void 0;
const react_1 = __importDefault(require("react"));
const Stack_1 = __importDefault(require("@mui/material/Stack"));
const Button_1 = __importDefault(require("@mui/material/Button"));
const Box_1 = __importDefault(require("@mui/material/Box"));
const Delete_1 = __importDefault(require("@mui/icons-material/Delete"));
const Send_1 = __importDefault(require("@mui/icons-material/Send"));
exports.default = {
    title: "MUI-v5/Button",
    argTypes: {
        variant: {
            control: "inline-radio",
            options: [undefined, "text", "contained", "outlined"],
        },
        disabled: { control: "boolean" },
        size: {
            control: "inline-radio",
            options: [undefined, "small", "medium", "large"],
        },
        onClick: { action: "clicked" },
    },
};
exports.BasicButtons = {
    render: (args) => {
        const variants = ["text", "contained", "outlined"];
        const colors = ["primary", "secondary"];
        return (react_1.default.createElement(Stack_1.default, { spacing: 2, direction: "row" }, colors.map((color) => (react_1.default.createElement(Stack_1.default, { key: color, spacing: 2, direction: "row" }, variants.map((variant) => (react_1.default.createElement(Button_1.default, Object.assign({ key: variant }, args, { variant: variant, color: color }), variant))))))));
    },
};
exports.TextButtons = {
    render: (args) => (react_1.default.createElement(Stack_1.default, { spacing: 2, direction: "row" },
        react_1.default.createElement(Button_1.default, Object.assign({}, args), "Primary"),
        react_1.default.createElement(Button_1.default, Object.assign({ disabled: true }, args), "Disabled"),
        react_1.default.createElement(Button_1.default, Object.assign({ href: "#text-buttons" }, args), "Link"))),
};
exports.Sizes = {
    render: (args) => (react_1.default.createElement(Box_1.default, { sx: { "& button": { m: 1 } } },
        react_1.default.createElement("div", null,
            react_1.default.createElement(Button_1.default, Object.assign({ size: "small" }, args), "Small"),
            react_1.default.createElement(Button_1.default, Object.assign({ size: "medium" }, args), "Medium"),
            react_1.default.createElement(Button_1.default, Object.assign({ size: "large" }, args), "Large")),
        react_1.default.createElement("div", null,
            react_1.default.createElement(Button_1.default, Object.assign({ variant: "outlined", size: "small" }, args), "Small"),
            react_1.default.createElement(Button_1.default, Object.assign({ variant: "outlined", size: "medium" }, args), "Medium"),
            react_1.default.createElement(Button_1.default, Object.assign({ variant: "outlined", size: "large" }, args), "Large")),
        react_1.default.createElement("div", null,
            react_1.default.createElement(Button_1.default, Object.assign({ variant: "contained", size: "small" }, args), "Small"),
            react_1.default.createElement(Button_1.default, Object.assign({ variant: "contained", size: "medium" }, args), "Medium"),
            react_1.default.createElement(Button_1.default, Object.assign({ variant: "contained", size: "large" }, args), "Large")))),
};
exports.WithIcons = {
    render: (args) => (react_1.default.createElement(Stack_1.default, { direction: "row", spacing: 2 },
        react_1.default.createElement(Button_1.default, Object.assign({ variant: "outlined", startIcon: react_1.default.createElement(Delete_1.default, null) }, args), "Delete"),
        react_1.default.createElement(Button_1.default, Object.assign({ variant: "contained", endIcon: react_1.default.createElement(Send_1.default, null) }, args), "Send"))),
};