import * as React from "react";
import { storiesOf } from "@storybook/react";
import Story from "../../storybook-components/Story";
import { List } from "./List";

const stories = storiesOf("Components/Data/List", module);

stories.add("Unordered list", () => (
  <Story title="List">
    <List>
      {[0, 1, 2, 3, 4].map((item) => (
        <List.Item key={item}>This is the List component</List.Item>
      ))}
    </List>
  </Story>
));

stories.add("Ordered list", () => (
  <Story title="List">
    <List as="ol">
      {[0, 1, 2, 3, 4].map((item) => (
        <List.Item key={item}>This is the List component</List.Item>
      ))}
    </List>
  </Story>
));