Fortune-Email/stories/CustomizationToolbar.stories.tsx

37 lines
918 B
TypeScript

import type { Meta, StoryObj } from "@storybook/react";
import { CustomizationPanel } from "../.storybook/CustomizationPanel";
import React, { useState } from "react";
const meta: Meta<typeof CustomizationPanel> = {
title: "Customization/Customization Panel",
component: CustomizationPanel,
parameters: {
layout: "padded",
},
};
export default meta;
type Story = StoryObj<typeof CustomizationPanel>;
export const Panel: Story = {
render: () => {
const [active, setActive] = useState(true);
return (
<div>
<button
onClick={() => setActive(!active)}
style={{
marginBottom: "20px",
padding: "10px 20px",
fontSize: "14px",
cursor: "pointer",
}}
>
{active ? "Hide" : "Show"} Customization Panel
</button>
<CustomizationPanel active={active} />
</div>
);
},
};