e5f41731ae
* bootstrap next app + add overview page * fix AssetList type * fix up nav stuff * Refactor Nav component and add network components pages * Refactor WorldMap component and update TelegramIcon, GitHubIcon, NymVpnIcon, DiscordIcon, and TwitterIcon components * add service providers page * mixnodes page * delegations page + use material react table for all tables * nodes map page * Refactor StyledLink component and remove unnecessary console.log statements * Refactor ESLint configuration, remove unused dependencies, and update component imports * update deps * Refactor imports and update dependencies * fix dark mode * build single mixnode page * build single gateway page * Refactor handleOnDelegate function to use useCallback in mixnodes page.tsx * Add defaults for constants --------- Co-authored-by: Mark Sinclair <mmsinclair@users.noreply.github.com>
37 lines
1004 B
TypeScript
37 lines
1004 B
TypeScript
import React, { ReactElement } from 'react';
|
|
import { Tooltip as MUITooltip, TooltipComponentsPropsOverrides, TooltipProps } from '@mui/material';
|
|
|
|
type ValueType<T> = T[keyof T];
|
|
|
|
type Props = {
|
|
text: string;
|
|
id: string;
|
|
placement?: ValueType<Pick<TooltipProps, 'placement'>>;
|
|
tooltipSx?: TooltipComponentsPropsOverrides;
|
|
children: React.ReactNode;
|
|
};
|
|
|
|
export const Tooltip = ({ text, id, placement, tooltipSx, children }: Props) => (
|
|
<MUITooltip
|
|
title={text}
|
|
id={id}
|
|
placement={placement || 'top-start'}
|
|
componentsProps={{
|
|
tooltip: {
|
|
sx: {
|
|
maxWidth: 200,
|
|
background: (t) => t.palette.nym.networkExplorer.tooltip.background,
|
|
color: (t) => t.palette.nym.networkExplorer.tooltip.color,
|
|
'& .MuiTooltip-arrow': {
|
|
color: (t) => t.palette.nym.networkExplorer.tooltip.background,
|
|
},
|
|
},
|
|
...tooltipSx,
|
|
},
|
|
}}
|
|
arrow
|
|
>
|
|
{children as ReactElement<any, any>}
|
|
</MUITooltip>
|
|
);
|