'use client';

import { __styles, mergeClasses } from '@griffel/react';
import { tokens, typographyStyles } from '@fluentui/react-theme';
import { CARTESIAN_XAXIS_CLASSNAME, HighContrastSelector, useRtl } from '../../utilities/utilities';
import { getAxisTitleStyle, getTooltipStyle } from '../../utilities/index';
/**
 * @internal
 */
export const cartesianchartClassNames = {
  root: 'fui-cart__root',
  chartWrapper: 'fui-cart__chartWrapper',
  plotContainer: 'fui-cart__plotContainer',
  axisTitle: 'fui-cart__axisTitle',
  xAxis: CARTESIAN_XAXIS_CLASSNAME,
  yAxis: 'fui-cart__yAxis',
  opacityChangeOnHover: 'fui-cart__opacityChangeOnHover',
  legendContainer: 'fui-cart__legendContainer',
  svgTooltip: 'fui-cart_svgTooltip',
  shapeStyles: 'fui-cart__shapeStyles',
  descriptionMessage: 'fui-cart__descriptionMessage',
  hover: 'fui-cart__hover',
  tooltip: 'fui-cart__tooltip',
  axisAnnotation: 'fui-cart__axisAnnotation',
  chartTitle: 'fui-cart__chartTitle',
  chart: 'fui-cart__chart',
  annotationLayer: 'fui-cart__annotationLayer'
};
/**
 * Base Styles
 */
const useStyles = /*#__PURE__*/__styles({
  root: {
    Bahqtrf: "fk6fouc",
    Be2twd7: "fkhj508",
    Bhrd7zp: "figsok6",
    Bg96gwp: "f1i3iumi",
    mc9l5x: "f22iagw",
    a9b677: "fly5x3f",
    Bqenvij: "f1l02sjl",
    Beiy3e4: "f1vx9l62",
    B68tc82: 0,
    Bmxbyg5: 0,
    Bpg54ce: "f1a3p1vp",
    fsow6f: ["f1o700av", "fes3tcz"],
    qhf8xq: "f10pi13n"
  },
  chartWrapper: {
    qhf8xq: "f10pi13n"
  },
  chartWrapperMinWidth: {
    B68tc82: 0,
    Bmxbyg5: 0,
    Bpg54ce: "f1enuhaj"
  },
  plotContainer: {
    qhf8xq: "f10pi13n",
    a9b677: "fly5x3f",
    Bqenvij: "f1l02sjl"
  },
  axisTitle: {
    Bahqtrf: "fk6fouc",
    Be2twd7: "f13mqy1h",
    Bhrd7zp: "fl43uef",
    Bg96gwp: "fcpl73t",
    B80ckks: "fmd4ok8",
    fsow6f: "f17mccla",
    sj55zd: "fkfq4zb",
    Bkfmm31: "fhuob2q",
    Bxms50k: "f1yn2ez9"
  },
  axisAnnotation: {
    Bahqtrf: "fk6fouc",
    Be2twd7: "f13mqy1h",
    Bhrd7zp: "fl43uef",
    Bg96gwp: "fcpl73t",
    B80ckks: "fmd4ok8",
    fsow6f: "f17mccla",
    sj55zd: "fkfq4zb",
    Bkfmm31: "fhuob2q",
    Bxms50k: "f1yn2ez9"
  },
  xAxis: {
    Bifops1: "fk6onyz",
    lr70ht: "f17odlr9",
    D01gh: "f1wvrikb",
    vxuu72: "fidmvdy",
    lclgl4: "f1noc3f3",
    zp1vxd: "f44ebzg",
    jxu3ei: "fkuun",
    B3i31d3: "f1u7a78k",
    Bhcy8il: "f1myyn02",
    z3m6do: "f1oca6e6",
    se2xxg: "f1x8lysa"
  },
  yAxis: {
    lr70ht: "f17odlr9",
    D01gh: "f1wvrikb",
    vxuu72: "fidmvdy",
    lclgl4: "f1noc3f3",
    Bifops1: "fk6onyz",
    zp1vxd: "f44ebzg",
    jxu3ei: "fkuun",
    B3i31d3: "f1u7a78k",
    z3m6do: "f1oca6e6",
    se2xxg: "f1x8lysa"
  },
  rtl: {
    Bkw34lo: "f1j2g1si"
  },
  ltr: {},
  opacityChangeOnHover: {
    abs64n: "f9das1l",
    Bceei9c: "f158kwzp"
  },
  legendContainer: {
    B6of3ja: "frnwi6n",
    Frg6f3: ["ff3wqvv", "f1l2akhw"]
  },
  svgTooltip: {
    Bkfmm31: "f5q6cfr",
    Bxms50k: "f1bgda6t"
  },
  annotationLayer: {
    Bkecrkj: "f1aehjj5"
  },
  tooltip: {
    Bahqtrf: "fk6fouc",
    Be2twd7: "fkhj508",
    Bhrd7zp: "figsok6",
    Bg96gwp: "f1i3iumi",
    mc9l5x: "f22iagw",
    Beiy3e4: "f1vx9l62",
    Byoj8tv: 0,
    uwmqm3: 0,
    z189sj: 0,
    z8tnut: 0,
    B0ocmuz: "f1bnz8pu",
    qhf8xq: "f1euv43f",
    fsow6f: "f17mccla",
    De3pzq: "fxugw4r",
    Beyfa6y: 0,
    Bbmb7ep: 0,
    Btl43ni: 0,
    B7oj6ja: 0,
    Dimara: "fq9zq91",
    Bkecrkj: "f1aehjj5",
    sj55zd: "f19n0e5"
  }
}, {
  d: [".fk6fouc{font-family:var(--fontFamilyBase);}", ".fkhj508{font-size:var(--fontSizeBase300);}", ".figsok6{font-weight:var(--fontWeightRegular);}", ".f1i3iumi{line-height:var(--lineHeightBase300);}", ".f22iagw{display:flex;}", ".fly5x3f{width:100%;}", ".f1l02sjl{height:100%;}", ".f1vx9l62{flex-direction:column;}", [".f1a3p1vp{overflow:hidden;}", {
    p: -1
  }], ".f1o700av{text-align:left;}", ".fes3tcz{text-align:right;}", ".f10pi13n{position:relative;}", [".f1enuhaj{overflow:auto;}", {
    p: -1
  }], ".f13mqy1h{font-size:var(--fontSizeBase100);}", ".fl43uef{font-weight:var(--fontWeightSemibold);}", ".fcpl73t{line-height:var(--lineHeightBase100);}", ".fmd4ok8{font-style:normal;}", ".f17mccla{text-align:center;}", ".fkfq4zb{color:var(--colorNeutralForeground2);}", ".fhuob2q{fill:var(--colorNeutralForeground1);}", ".fk6onyz text{fill:var(--colorNeutralForeground1);}", ".f17odlr9 text{font-family:var(--fontFamilyBase);}", ".f1wvrikb text{font-size:var(--fontSizeBase100);}", ".fidmvdy text{font-weight:var(--fontWeightSemibold);}", ".f1noc3f3 text{line-height:var(--lineHeightBase100);}", ".f44ebzg text{forced-color-adjust:auto;}", ".fkuun line{opacity:0.2;}", ".f1u7a78k line{stroke:var(--colorNeutralForeground1);}", ".f1myyn02 line{width:1px;}", ".f1oca6e6 line{forced-color-adjust:auto;}", ".f1x8lysa path{display:none;}", ".f1j2g1si g{text-anchor:end;}", ".f9das1l{opacity:0.1;}", ".f158kwzp{cursor:default;}", ".frnwi6n{margin-top:var(--spacingVerticalS);}", ".ff3wqvv{margin-left:var(--spacingHorizontalXL);}", ".f1l2akhw{margin-right:var(--spacingHorizontalXL);}", ".f5q6cfr{fill:var(--colorNeutralBackground1);}", ".f1aehjj5{pointer-events:none;}", [".f1bnz8pu{padding:var(--spacingHorizontalS);}", {
    p: -1
  }], ".f1euv43f{position:absolute;}", ".fxugw4r{background-color:var(--colorNeutralBackground1);}", [".fq9zq91{border-radius:var(--borderRadiusSmall);}", {
    p: -1
  }], ".f19n0e5{color:var(--colorNeutralForeground1);}"],
  m: [["@media screen and (-ms-high-contrast: active),screen and (forced-colors: active){.f1yn2ez9{fill:CanvasText;}}", {
    m: "screen and (-ms-high-contrast: active), screen and (forced-colors: active)"
  }], ["@media screen and (-ms-high-contrast: active),screen and (forced-colors: active){.f1bgda6t{fill:Canvas;}}", {
    m: "screen and (-ms-high-contrast: active), screen and (forced-colors: active)"
  }]]
});
/**
 *
 * Apply styling to the Carousel slots based on the state
 */
export const useCartesianChartStyles = props => {
  var _props_styles, _props_reflowProps, _props_styles1, _props_styles2, _props_styles3;
  const _useRtl = useRtl();
  const baseStyles = useStyles();
  return {
    root: mergeClasses(cartesianchartClassNames.root, baseStyles.root, (_props_styles = props.styles) === null || _props_styles === void 0 ? void 0 : _props_styles.root),
    chartWrapper: mergeClasses(cartesianchartClassNames.chartWrapper, baseStyles.chartWrapper, ((_props_reflowProps = props.reflowProps) === null || _props_reflowProps === void 0 ? void 0 : _props_reflowProps.mode) === 'min-width' ? baseStyles.chartWrapperMinWidth : undefined, (_props_styles1 = props.styles) === null || _props_styles1 === void 0 ? void 0 : _props_styles1.chartWrapper),
    plotContainer: mergeClasses(cartesianchartClassNames.plotContainer, baseStyles.plotContainer /*props.styles?.plotContainer*/),
    axisTitle: mergeClasses(cartesianchartClassNames.axisTitle, baseStyles.axisTitle /*props.styles?.axisTitle*/),
    xAxis: mergeClasses(cartesianchartClassNames.xAxis, baseStyles.xAxis /*props.styles?.xAxis*/),
    yAxis: mergeClasses(cartesianchartClassNames.yAxis, baseStyles.yAxis, _useRtl ? baseStyles.rtl : baseStyles.ltr /*props.styles?.yAxis*/),
    opacityChangeOnHover: mergeClasses(cartesianchartClassNames.opacityChangeOnHover, baseStyles.opacityChangeOnHover /*props.styles?.opacityChangeOnHover*/),
    legendContainer: mergeClasses(cartesianchartClassNames.legendContainer, baseStyles.legendContainer /*props.styles?.legendContainer*/),
    svgTooltip: mergeClasses(cartesianchartClassNames.svgTooltip, baseStyles.svgTooltip, (_props_styles2 = props.styles) === null || _props_styles2 === void 0 ? void 0 : _props_styles2.svgTooltip),
    annotationLayer: mergeClasses(cartesianchartClassNames.annotationLayer, baseStyles.annotationLayer /*props.styles?.annotationLayer*/),
    tooltip: mergeClasses(cartesianchartClassNames.tooltip, baseStyles.tooltip /*props.styles?.tooltip*/),
    axisAnnotation: mergeClasses(cartesianchartClassNames.axisAnnotation, baseStyles.axisAnnotation),
    chart: mergeClasses(cartesianchartClassNames.chart, (_props_styles3 = props.styles) === null || _props_styles3 === void 0 ? void 0 : _props_styles3.chart)
  };
};