import CStackedList from "../components/CStackedList/CStackedList.vue";
import "./utils.css";

export default {
  title: "CStackedList",
  component: CStackedList,
  argTypes: {
    listItems: { control: { type: "object" } },
    divider: Boolean,
  },
};

const Template = (args, { argTypes }) => ({
  props: Object.keys(argTypes),
  components: { CStackedList },
  template: '<c-stacked-list v-bind="$props" />',
});

export const Default = Template.bind({});
Default.args = {
  listItems: [
    {
      image:
        "https://images.unsplash.com/photo-1491528323818-fdd1faba62cc?ixlib=rb-1.2.1&amp;ixid=eyJhcHBfaWQiOjEyMDd9&amp;auto=format&amp;fit=facearea&amp;facepad=2&amp;w=256&amp;h=256&amp;q=80",
      heading: "Maths-Level1",
      tagLabel: "test",
      tagColor: "green",
      description: "calvin.hawkins@example.com",
      size: "medium",
      rounded: false,
      tag: true,
      collapse: true,
      listIcon: true,
    },
  ],
  divider: true,
};
