import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
import React from "react";
import { ThemeProvider } from "styled-components";
import equilibriumTheme from "../theme/equilibrium.theme";
import genshiroTheme from "../theme/genshiro.theme";
import Dropdown from "./dropdown";
import T from "../typography";
export default {
    component: Dropdown,
    title: "New/Dropdown",
};
export const Equilibrium = () => {
    const [isOpened, setIsOpened] = React.useState(false);
    return (_jsx(ThemeProvider, { theme: equilibriumTheme, children: _jsxs(Dropdown, { label: "dropdown", opened: isOpened, onClick: () => setIsOpened(!isOpened), handleClickOutside: () => setIsOpened(false), children: [_jsx(T, { children: "item 1" }), _jsx(T, { children: "item 2" }), _jsx(T, { children: "item 3" }), _jsx(T, { children: "item 4" })] }) }));
};
export const Genshiro = () => {
    const [isOpened, setIsOpened] = React.useState(false);
    return (_jsx(ThemeProvider, { theme: genshiroTheme, children: _jsxs(Dropdown, { label: "dropdown", opened: isOpened, onClick: () => setIsOpened(!isOpened), handleClickOutside: () => setIsOpened(false), children: [_jsx(T, { children: "item 1" }), _jsx(T, { children: "item 2" }), _jsx(T, { children: "item 3" }), _jsx(T, { children: "item 4" })] }) }));
};
//# sourceMappingURL=dropdown.stories.js.map