import React from "react";
import { storiesOf } from "@storybook/react";
import { action } from "@storybook/addon-actions";
import styled from "@emotion/styled";
import NavMenu from "../NavMenu";
import Main from "client/Main";
import Section from ".";
import history from "../../history";
import Headline from "../Headline";
import store from "../../store";
import { Provider as MobxProvider } from "mobx-react";
import IconButton from "@docspace/components/icon-button";
import ContextMenuButton from "@docspace/components/context-menu-button";
import SearchInput from "@docspace/components/search-input";
import Paging from "@docspace/components/paging";
import withReadme from "storybook-readme/with-readme";
import { boolean, withKnobs } from "@storybook/addon-knobs/react";
import Readme from "./README.md";
import { Router } from "react-router-dom";
const { authStore } = store;
const HeaderContent = styled.div`
display: flex;
align-items: center;
& > * {
margin-right: 8px !important;
}
`;
const pageItems = [
{
key: "1",
label: "1 of 2",
onClick: (e) => action("set paging 1 of 2")(e),
},
{
key: "2",
label: "2 of 2",
onClick: (e) => action("set paging 2 of 2")(e),
},
];
const perPageItems = [
{
key: "1-1",
label: "25 per page",
onClick: (e) => action("set paging 25 action")(e),
},
{
key: "1-2",
label: "50 per page",
onClick: (e) => action("set paging 50 action")(e),
},
];
const sectionHeaderContent = (
action("ArrowPathIcon Clicked")(e)}
/>
Section Header
action("PlusIcon Clicked")(e)}
/>
[
{
key: "key",
label: "label",
onClick: (e) => action("label Clicked")(e),
},
]}
/>
);
const sectionFilterContent = (
[
{
key: "filter-example",
group: "filter-example",
label: "example group",
isHeader: true,
},
{
key: "filter-example-test",
group: "filter-example",
label: "Test",
},
]}
onSearchClick={(result) => {
console.log(result);
}}
onChangeFilter={(result) => {
console.log(result);
}}
/>
);
const sectionBodyContent = Section Content
;
const sectionPagingContent = (
console.log(a)}
onSelectCount={(a) => console.log(a)}
previousAction={(e) => action("Prev Clicked")(e)}
nextAction={(e) => action("Next Clicked")(e)}
openDirection="top"
/>
);
storiesOf("Components|Section", module)
.addDecorator(withKnobs)
.addDecorator(withReadme(Readme))
.add("base", () => (
{sectionHeaderContent}
{sectionFilterContent}
{sectionBodyContent}
{sectionPagingContent}
));