import { useMemo } from 'react';
import { useTheme } from '@mui/material/styles';
import type { CSSProperties } from '@mui/styles';

const useTick: () => {
  fontSize: CSSProperties['fontSize'];
  fill: string;
  fontFamily: string;
} = () => {
  const theme = useTheme();
  return useMemo(
    () => ({
      fontSize: theme.typography.caption1.fontSize,
      fill: theme.palette.primary[400],
      fontFamily: 'Inter'
    }),
    [theme.palette.primary, theme.typography.caption1.fontSize]
  );
};

export { useTick };