import { jsx as _jsx } from "react/jsx-runtime";
import React from "react";
import styled, { ThemeProvider } from "styled-components";
import genshiroTheme from "../theme/genshiro.theme";
import TabsSwitch from "./tabs-switch";
export default {
    component: TabsSwitch,
    title: "New/TabsSwitch",
    decorators: [
        (Story) => (_jsx(ThemeProvider, { theme: genshiroTheme, children: _jsx(Story, {}) })),
    ],
};
const Wrapper = styled.div `
  .active > .sell {
    color: #fe6666;
  }
  .active > .buy {
    color: #57af5a;
  }
`;
const items = [
    { code: "sell", label: _jsx("div", { className: "sell", children: "Sell" }) },
    { code: "buy", label: _jsx("div", { className: "buy", children: "Buy" }) },
];
export const Default = () => {
    const [selected, setSelected] = React.useState("sell");
    return (_jsx(TabsSwitch, { items: items, selected: selected, handleSelect: (v) => setSelected(v) }));
};
export const WithCustomcolor = () => {
    const [selected, setSelected] = React.useState("sell");
    return (_jsx(Wrapper, { children: _jsx(TabsSwitch, { items: items, selected: selected, handleSelect: (v) => setSelected(v) }) }));
};
//# sourceMappingURL=tabs-switch.stories.js.map