leaflet.pub
a tool for shared writing and social publishing
cozylittle.house
1import { ExternalLinkTiny } from "./Icons/ExternalLinkTiny";
2
3export const Tab = (props: {
4 name: string;
5 icon?: React.ReactNode;
6 selected: boolean;
7 onSelect: () => void;
8 onMouseEnter?: () => void;
9 onPointerDown?: () => void;
10 href?: string;
11}) => {
12 return (
13 <div
14 className={`pubTabs px-1 py-0 flex gap-1 items-center rounded-md hover:cursor-pointer ${props.selected ? "text-accent-2 bg-accent-1 font-bold -mb-px" : "text-secondary"}`}
15 onClick={() => props.onSelect()}
16 onMouseEnter={props.onMouseEnter}
17 onPointerDown={props.onPointerDown}
18 >
19 {props.icon ? props.icon : props.name}
20 {props.href && <ExternalLinkTiny />}
21 </div>
22 );
23};