otterscan/src/components/ModeTab.tsx
2021-11-08 14:57:51 -03:00

24 lines
584 B
TypeScript

import React from "react";
import { Tab } from "@headlessui/react";
type ModeTabProps = {
disabled?: boolean | undefined;
};
const ModeTab: React.FC<ModeTabProps> = ({ disabled, children }) => (
<Tab
className={({ selected }) =>
`border rounded-lg px-2 py-1 bg-gray-100 ${
disabled
? "border-gray-100 text-gray-300 cursor-default"
: "hover:bg-gray-200 hover:shadow text-gray-500 hover:text-gray-600"
} text-xs ${selected ? "border-blue-300" : ""}`
}
disabled={disabled}
>
{children}
</Tab>
);
export default ModeTab;