import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
import * as ToggleGroupPrimitive from "@radix-ui/react-toggle-group";
import { ToggleItem } from "../ToggleItem";
export const Default = {
    args: {
        children: "Just a toggle",
        value: "toggle",
        disabled: false,
    },
    render: (args) => (_jsx(ToggleGroupPrimitive.Root, { type: "single", defaultValue: args.value, children: _jsx(ToggleItem, { value: args.value, disabled: args.disabled, children: args.children }) })),
    parameters: {
        docs: {
            description: {
                story: "A basic toggle item rendered inside a single-select toggle group.",
            },
        },
    },
};
export const Disabled = {
    args: {
        children: "Disabled toggle",
        value: "disabled",
        disabled: true,
    },
    render: (args) => (_jsx(ToggleGroupPrimitive.Root, { type: "single", children: _jsx(ToggleItem, { value: args.value, disabled: args.disabled, children: args.children }) })),
    parameters: {
        docs: {
            description: {
                story: "A disabled toggle item.",
            },
        },
    },
};
export const Multiple = {
    render: () => (_jsxs(ToggleGroupPrimitive.Root, { type: "multiple", defaultValue: ["bold", "italic"], children: [_jsx(ToggleItem, { value: "bold", children: "Bold" }), _jsx(ToggleItem, { value: "italic", children: "Italic" }), _jsx(ToggleItem, { value: "underline", children: "Underline" })] })),
    parameters: {
        docs: {
            description: {
                story: "Multiple toggle items rendered inside a multi-select toggle group.",
            },
        },
    },
};
const meta = {
    title: "Components/ToggleItem",
    component: ToggleItem,
    parameters: {
        layout: "centered",
        docs: {
            description: {
                component: "```tsx\nimport { ToggleItem } from '@openuidev/react-ui';\n```",
            },
        },
        controls: {
            exclude: ["className"],
        },
    },
    argTypes: {
        children: {
            control: "text",
        },
        value: {
            control: "text",
            description: "Unique value that identifies this item inside the toggle group.",
        },
        disabled: {
            control: "boolean",
            table: {
                category: "State",
            },
        },
        className: {
            table: {
                disable: true,
            },
        },
    },
    tags: ["autodocs", "!dev"],
};
export default meta;
//# sourceMappingURL=ToggleItem.stories.js.map