import { html } from 'lit';
import './StepperStacked.svelte';
const meta = {
    title: 'Indicators/Stepper Stacked',
    component: 'm-stepper-stacked',
    argTypes: {
        step: {
            control: { type: 'number', min: 1, max: 10 },
        },
    },
    args: {
        step: 2,
        steps: [
            { label: 'Cart' },
            { label: 'Delivery address' },
            { label: 'Payment' },
            { label: 'Order confirmation' },
        ],
    },
    render: (args) => html `<m-stepper-stacked .step="${args.step}" .steps="${args.steps}"></m-stepper-stacked>`,
};
export default meta;
export const Default = {};
export const AditionnalInfo = {
    args: {
        steps: [
            { label: 'Cart', additionalinfo: 'Additional information' },
            { label: 'Delivery address', additionalinfo: 'Additional information' },
            { label: 'Payment', additionalinfo: 'Additional information' },
            { label: 'Order confirmation', additionalinfo: 'Additional information' },
        ],
    },
};
