import { html } from 'lit';
import { ifDefined } from 'lit-html/directives/if-defined.js';
import './Flag.svelte';
const meta = {
    title: 'Indicators/Flag',
    component: 'm-flag',
    argTypes: {
        appearance: {
            control: 'radio',
            options: ['danger', 'accent', 'inverse', 'standard'],
        },
    },
    args: {
        label: 'Flag label',
    },
    render: (args) => html `
    <m-flag label=${ifDefined(args.label)} appearance=${ifDefined(args.appearance)}></m-flag>
  `,
};
export default meta;
export const Standard = {};
export const Accent = {
    args: { appearance: 'accent' },
};
export const Danger = {
    args: { appearance: 'danger' },
};
export const Inverse = {
    globals: {
        backgrounds: { value: 'inverse' },
    },
    args: { appearance: 'inverse' },
};
