"use strict";
var __importDefault = (this && this.__importDefault) || function (mod) {
    return (mod && mod.__esModule) ? mod : { "default": mod };
};
Object.defineProperty(exports, "__esModule", { value: true });
exports.VerticalTabs = exports.HorizontalesScrollingTabs = exports.HorizontalTabs = void 0;
const react_1 = __importDefault(require("react"));
const Tabs_1 = __importDefault(require("@material-ui/core/Tabs"));
const Tab_1 = __importDefault(require("@material-ui/core/Tab"));
exports.default = {
    title: "MUI-v4/Tabs",
    argTypes: {
        textColor: {
            control: "inline-radio",
            options: [undefined, "inherit", "primary", "secondary"],
        },
        indicatorColor: {
            control: "inline-radio",
            options: [undefined, "primary", "secondary"],
        },
        variant: {
            control: "inline-radio",
            options: [undefined, "standard", "scrollable", "fullWidth"],
        },
        onClick: { action: "clicked" },
    },
};
exports.HorizontalTabs = {
    render: (args) => {
        const tabs = [
            { label: "Tab 1" },
            { label: "Tab 2" },
            { label: "Tab 3" },
            { label: "Tab 4 (disabled)", disabled: true },
            { label: "Tab 4 (a much much much much much much too long label)" },
        ];
        const [selectedValue, setSelectedValue] = react_1.default.useState(0);
        return (react_1.default.createElement(Tabs_1.default, Object.assign({ value: selectedValue, onChange: (_event, value) => setSelectedValue(value), orientation: "horizontal" }, args), tabs.map((tab) => (react_1.default.createElement(Tab_1.default, Object.assign({ key: tab.label }, tab))))));
    },
};
exports.HorizontalesScrollingTabs = {
    render: (args) => {
        const tabs = Array.from({ length: 20 }, (_, i) => ({ label: `Tab ${i}` }));
        const [selectedValue, setSelectedValue] = react_1.default.useState(0);
        return (react_1.default.createElement(Tabs_1.default, Object.assign({ value: selectedValue, onChange: (_event, value) => setSelectedValue(value), orientation: "horizontal", variant: "scrollable" }, args), tabs.map((tab) => (react_1.default.createElement(Tab_1.default, Object.assign({ key: tab.label }, tab))))));
    },
};
exports.VerticalTabs = {
    render: (args) => {
        const tabs = [
            { label: "Tab 1" },
            { label: "Tab 2" },
            { label: "Tab 3" },
            { label: "Tab 4 (disabled)", disabled: true },
        ];
        const [selectedValue, setSelectedValue] = react_1.default.useState(0);
        return (react_1.default.createElement(Tabs_1.default, Object.assign({ value: selectedValue, onChange: (_event, value) => setSelectedValue(value), orientation: "vertical" }, args), tabs.map((tab) => (react_1.default.createElement(Tab_1.default, Object.assign({ key: tab.label }, tab))))));
    },
};