'use client';
import { makeStyles, mergeClasses } from '@griffel/react';
import { getMarkerLabelStyle, getTooltipStyle } from '../../utilities/index';
/**
 * @internal
 */ export const scatterChartClassNames = {
    tooltip: 'fui-line__tooltip',
    markerLabel: 'fui-line__markerLabel',
    root: 'fui-line__root',
    xAxis: 'fui-line__xAxis',
    yAxis: 'fui-line__yAxis',
    legendContainer: 'fui-line__legendContainer',
    hover: 'fui-line__hover',
    descriptionMessage: 'fui-line__descriptionMessage',
    axisTitle: 'fui-line__axisTitle',
    chartTitle: 'fui-line__chartTitle',
    opacityChangeOnHover: 'fui-line__opacityChangeOnHover',
    shapeStyles: 'fui-line__shapeStyles',
    chartWrapper: 'fui-line__chartWrapper',
    svgTooltip: '',
    chart: '',
    axisAnnotation: '',
    plotContainer: '',
    annotationLayer: ''
};
/**
 * Base Styles
 */ const useStyles = makeStyles({
    tooltip: getTooltipStyle(),
    markerLabel: getMarkerLabelStyle()
});
/**
 * Apply styling to the Carousel slots based on the state
 */ export const useScatterChartStyles = (props)=>{
    var _props_styles;
    const baseStyles = useStyles();
    return {
        tooltip: mergeClasses(scatterChartClassNames.tooltip, baseStyles.tooltip /*props.styles?.tooltip*/ ),
        markerLabel: mergeClasses(scatterChartClassNames.markerLabel, baseStyles.markerLabel, (_props_styles = props.styles) === null || _props_styles === void 0 ? void 0 : _props_styles.markerLabel)
    };
};
