UNPKG

@seasketch/geoprocessing

Version:

Geoprocessing and reporting framework for SeaSketch 2.0

38 lines 2.1 kB
import React from "react"; import Toolbar from "./Toolbar.js"; import Card from "./Card.js"; import { SimpleButton } from "./SimpleButton.js"; import ReportDecorator from "./storybook/ReportDecorator.js"; import DataDownloadToolbar from "./DataDownloadToolbar.js"; import fixtures from "../testing/fixtures/index.js"; export default { component: Toolbar, title: "Components/Toolbar", decorators: [ReportDecorator], }; export const headerToolbar = () => (React.createElement(Card, null, React.createElement(Toolbar, { variant: "dense", useGutters: false }, React.createElement("h2", { style: { flexGrow: 1 } }, "Toolbar Title"), React.createElement("div", null, React.createElement(SimpleButton, null, "\u2B07"), React.createElement(SimpleButton, null, "\u27A5"))), React.createElement("p", null, "Body"))); export const regularGutterToolbar = () => (React.createElement(Card, null, React.createElement(Toolbar, { titleAlign: "center", style: { backgroundColor: "#eee" } }, React.createElement("h2", { style: { flexGrow: 1 } }, "Header Toolbar"), React.createElement("div", null, React.createElement(SimpleButton, null, "\u2B07"), React.createElement(SimpleButton, null, "\u27A5"))), React.createElement("p", null, "Body"))); export const denseGutterToolbar = () => (React.createElement(Card, { title: "Card Title" }, React.createElement("p", null, "Body"), React.createElement(Toolbar, { variant: "dense", titleAlign: "center", style: { backgroundColor: "#eee" } }, React.createElement("h2", { style: { flexGrow: 1 } }, "Footer Toolbar"), React.createElement("div", null, React.createElement(SimpleButton, null, "\u2B07"), React.createElement(SimpleButton, null, "\u27A5"))))); export const dataDownloadToolbar = () => { return (React.createElement(Card, null, React.createElement(DataDownloadToolbar, { title: "Data Download Toolbar", filename: "ranked", data: fixtures.ranked }))); }; //# sourceMappingURL=Toolbar.stories.js.map