'use client';

import { __styles, mergeClasses } from '@griffel/react';
import { typographyStyles } from '@fluentui/react-theme';
export const heatmapChartClassNames = {
  root: 'fui-hmc__root',
  text: 'fui-hmc__text',
  calloutContentRoot: 'fui-hmc__calloutContentRoot',
  xAxis: '',
  yAxis: '',
  legendContainer: '',
  hover: '',
  descriptionMessage: '',
  tooltip: '',
  axisTitle: '',
  chartTitle: '',
  opacityChangeOnHover: '',
  shapeStyles: '',
  chartWrapper: '',
  svgTooltip: '',
  chart: '',
  axisAnnotation: '',
  plotContainer: '',
  annotationLayer: ''
};
const useStyles = /*#__PURE__*/__styles({
  root: {},
  text: {
    Bahqtrf: "fk6fouc",
    Be2twd7: "fkhj508",
    Bhrd7zp: "fl43uef",
    Bg96gwp: "f1i3iumi",
    Bkecrkj: "f1aehjj5"
  },
  calloutContentRoot: {
    B2u0y6b: "f15g8at8"
  }
}, {
  d: [".fk6fouc{font-family:var(--fontFamilyBase);}", ".fkhj508{font-size:var(--fontSizeBase300);}", ".fl43uef{font-weight:var(--fontWeightSemibold);}", ".f1i3iumi{line-height:var(--lineHeightBase300);}", ".f1aehjj5{pointer-events:none;}", ".f15g8at8{max-width:238px;}"]
});
export const useHeatMapChartStyles = props => {
  const baseStyles = useStyles();
  return {
    root: mergeClasses(heatmapChartClassNames.root, baseStyles.root /*, props.styles?.root*/),
    text: mergeClasses(heatmapChartClassNames.text, baseStyles.text /*, props.styles?.text*/),
    calloutContentRoot: mergeClasses(heatmapChartClassNames.calloutContentRoot, baseStyles.calloutContentRoot /*, props.styles?.calloutContentRoot*/)
  };
};