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 DropdownIcon from "./";
import T from "../typography";
export default {
    component: DropdownIcon,
    title: "New/DropdownIcon",
};
export const Equilibrium = () => {
    const [isOpened, setIsOpened] = React.useState(false);
    return (_jsx(ThemeProvider, { theme: equilibriumTheme, children: _jsxs(DropdownIcon, { icon: _jsx(DropdownIcon.WalletIcon, { opened: isOpened }), opened: isOpened, handleClickIcon: () => 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(DropdownIcon, { icon: _jsx(DropdownIcon.WalletIcon, { opened: isOpened }), opened: isOpened, handleClickIcon: () => 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-icon.stories.js.map