@kadconsulting/dry/dist/src/components/RadioButton/RadioButton.stories.js

KAD Reusable Component Library

import { jsx as _jsx } from "react/jsx-runtime";
import RadioButton from './RadioButton';
export default {
    title: 'Components/FormInputs/RadioButton',
    component: RadioButton,
    argTypes: {
        disabled: {
            control: 'boolean',
            defaultValue: false,
        },
        isCard: {
            control: 'boolean',
            defaultValue: false,
        },
        text: {
            control: 'text',
            defaultValue: 'Sample Text',
        },
        subText: {
            control: 'text',
            defaultValue: 'Sample Subtext',
        },
        extraText: {
            control: 'text',
            defaultValue: 'Extra Text',
        },
        id: {
            control: 'text',
            defaultValue: 'id',
        },
        name: {
            control: 'text',
            defaultValue: 'name',
        },
        value: {
            control: 'text',
            defaultValue: 'value',
        },
        className: {
            control: 'text',
            defaultValue: 'className',
        },
        radioPosition: {
            control: 'radio',
            options: ['left', 'right'],
            defaultValue: 'left',
        },
        extraTextPosition: {
            control: 'radio',
            options: ['left', 'right'],
            defaultValue: 'left',
        },
    },
};
const Template = (args) => (_jsx(RadioButton, { ...args }));
export const Default = Template.bind({});
Default.args = {};
export const Disabled = Template.bind({});
Disabled.args = {
    disabled: true,
};
export const WithCardStyle = Template.bind({});
WithCardStyle.args = {
    isCard: true,
};
export const WithSubtext = Template.bind({});
WithSubtext.args = {
    subText: 'This is a subtext',
};
export const WithExtraText = Template.bind({});
WithExtraText.args = {
    extraText: 'This is extra text',
};
export const AlignedRight = Template.bind({});
AlignedRight.args = {
    radioPosition: 'right',
};
export const AllOptions = Template.bind({});
AllOptions.args = {
    disabled: false,
    isCard: true,
    text: 'All Options',
    subText: 'This is a subtext',
    extraText: 'This is extra text',
    radioPosition: 'right',
    extraTextPosition: 'left',
};
//# sourceMappingURL=RadioButton.stories.js.map