import Builder, { toProps } from "../../utils/builder";
export default {
    title: 'Components/Divider',
    component: 'x-divider',
    argTypes: {
        align: {
            options: ['left', 'center', 'right'],
            control: {
                type: 'radio',
            },
        },
    },
};
const Template = new Builder(args => `<x-divider ${toProps(args)}>Title example</x-divider>`);
export const Simple = Template.args({}).build(() => `<x-divider></x-divider>`);
export const Left = Template.args({
    align: 'left',
}).build();
export const Center = Template.args({
    align: 'center',
}).build();
export const Right = Template.args({
    align: 'right',
}).build();
export const Joined = (new Builder(() => `<div class="d-flex">
	<x-divider align="left">Title example</x-divider>
	<x-divider align="right">
		<small><x-badge color="red">Requerido</x-badge></small>
	</x-divider>
</div>`).build());
