83 lines
1.8 KiB
JavaScript
83 lines
1.8 KiB
JavaScript
import React from "react";
|
|
import MainButton from ".";
|
|
|
|
export default {
|
|
title: "Components/MainButton",
|
|
component: MainButton,
|
|
parameters: { docs: { description: { component: "Components/MainButton" } } },
|
|
clickAction: { action: "clickAction" },
|
|
clickActionSecondary: { action: "clickActionSecondary" },
|
|
clickItem: { action: "clickItem", table: { disable: true } },
|
|
};
|
|
|
|
const Template = ({
|
|
clickAction,
|
|
clickActionSecondary,
|
|
clickItem,
|
|
...args
|
|
}) => {
|
|
const clickMainButtonHandler = (e, credentials) => {
|
|
clickAction(e, credentials);
|
|
};
|
|
|
|
const clickSecondaryButtonHandler = (e, credentials) => {
|
|
clickActionSecondary(e, credentials);
|
|
};
|
|
|
|
const itemsModel = [
|
|
{
|
|
label: "New document",
|
|
icon: "/static/images/catalog.folder.react.svg",
|
|
},
|
|
{
|
|
label: "New spreadsheet",
|
|
icon: "/static/images/catalog.folder.react.svg",
|
|
},
|
|
{
|
|
label: "New presentation",
|
|
icon: "/static/images/catalog.folder.react.svg",
|
|
},
|
|
{
|
|
label: "Master form",
|
|
icon: "/static/images/catalog.folder.react.svg",
|
|
items: [
|
|
{
|
|
label: "From blank",
|
|
},
|
|
{
|
|
label: "From an existing text file",
|
|
},
|
|
],
|
|
},
|
|
{
|
|
label: "New folder",
|
|
icon: "/static/images/catalog.folder.react.svg",
|
|
},
|
|
{ separator: true },
|
|
{
|
|
label: "Upload",
|
|
icon: "/static/images/catalog.folder.react.svg",
|
|
},
|
|
];
|
|
|
|
return (
|
|
<div style={{ width: "280px" }}>
|
|
<MainButton
|
|
{...args}
|
|
clickAction={clickMainButtonHandler}
|
|
clickActionSecondary={clickSecondaryButtonHandler}
|
|
model={itemsModel}
|
|
iconName
|
|
></MainButton>
|
|
</div>
|
|
);
|
|
};
|
|
|
|
export const Default = Template.bind({});
|
|
Default.args = {
|
|
isDisabled: false,
|
|
isDropdown: true,
|
|
text: "Actions",
|
|
iconName: "static/images/people.react.svg",
|
|
};
|