'use client';

import { __styles, mergeClasses } from '@griffel/react';
import { tokens, typographyStyles } from '@fluentui/react-theme';
import { color as d3Color } from 'd3-color';
export const DEFAULT_ANNOTATION_BACKGROUND_OPACITY = 0.8;
export const DEFAULT_ANNOTATION_PADDING = '4px 8px';
export const DEFAULT_CONNECTOR_START_PADDING = 12;
export const DEFAULT_CONNECTOR_END_PADDING = 0;
export const DEFAULT_CONNECTOR_STROKE_WIDTH = 2;
export const DEFAULT_CONNECTOR_ARROW = 'end';
export const applyOpacityToColor = (color, opacity, options) => {
  if (!color) {
    return undefined;
  }
  const parsed = d3Color(color);
  if (!parsed) {
    return color;
  }
  const originalOpacity = typeof parsed.opacity === 'number' ? parsed.opacity : 1;
  var _options_preserveOriginalOpacity;
  const preserveOriginalOpacity = (_options_preserveOriginalOpacity = options === null || options === void 0 ? void 0 : options.preserveOriginalOpacity) !== null && _options_preserveOriginalOpacity !== void 0 ? _options_preserveOriginalOpacity : true;
  if (preserveOriginalOpacity && originalOpacity < 1) {
    return parsed.toString();
  }
  parsed.opacity = Math.max(0, Math.min(1, opacity));
  return parsed.toString();
};
/**
 * Get default annotation background color with opacity applied
 * Updated for v9 - uses tokens instead of theme
 */
export const getDefaultAnnotationBackgroundColor = () => applyOpacityToColor(tokens.colorNeutralBackground1, DEFAULT_ANNOTATION_BACKGROUND_OPACITY);
/**
 * Get default connector stroke color
 * Updated for v9 - uses tokens instead of theme
 */
export const getDefaultConnectorStrokeColor = () => tokens.colorNeutralForeground1;
/**
 * @internal
 */
export const chartAnnotationLayerClassNames = {
  root: 'fui-chartAnnotationLayer__root',
  annotation: 'fui-chartAnnotationLayer__annotation',
  connectorLayer: 'fui-chartAnnotationLayer__connectorLayer',
  measurement: 'fui-chartAnnotationLayer__measurement',
  annotationContent: 'fui-chartAnnotationLayer__annotationContent',
  annotationForeignObject: 'fui-chartAnnotationLayer__annotationForeignObject',
  annotationContentInteractive: 'fui-chartAnnotationLayer__annotationContentInteractive',
  annotationForeignObjectInteractive: 'fui-chartAnnotationLayer__annotationForeignObjectInteractive',
  connectorGroup: 'fui-chartAnnotationLayer__connectorGroup'
};
/**
 * Base Styles
 */
const useStyles = /*#__PURE__*/__styles({
  root: {
    qhf8xq: "f1euv43f",
    Bhzewxz: "f15twtuk",
    oyh7mz: ["f1vgc2s3", "f1e31b4d"],
    j35jbq: ["f1e31b4d", "f1vgc2s3"],
    B5kzvoi: "f1yab3r1",
    a9b677: "fly5x3f",
    Bqenvij: "f1l02sjl",
    Bkecrkj: "f1aehjj5",
    B68tc82: 0,
    Bmxbyg5: 0,
    Bpg54ce: "f1gl81tg",
    Bj3rh1h: "f19g0ac"
  },
  annotation: {
    Bahqtrf: "fk6fouc",
    Be2twd7: "fy9rknc",
    Bhrd7zp: "figsok6",
    Bg96gwp: "fwrc4pm",
    qhf8xq: "f1euv43f",
    Bkecrkj: "f1aehjj5",
    mc9l5x: "f22iagw",
    Bt984gj: "f122n59",
    Brf1p80: "f4d9j23",
    fsow6f: "f17mccla",
    sj55zd: "f19n0e5",
    z8tnut: "f10ra9hq",
    Byoj8tv: "f1y2xyjm",
    uwmqm3: ["f177v4lu", "f19lj068"],
    z189sj: ["f19lj068", "f177v4lu"],
    Beyfa6y: 0,
    Bbmb7ep: 0,
    Btl43ni: 0,
    B7oj6ja: 0,
    Dimara: "ft85np5",
    E5pizo: "f1hg901r",
    Bgfg5da: 0,
    B9xav0g: 0,
    oivjwe: 0,
    Bn0qgzm: 0,
    B4g9neb: 0,
    zhjwy3: 0,
    wvpqe5: 0,
    ibv6hh: 0,
    u1mtju: 0,
    h3c5rm: 0,
    vrafjx: 0,
    Bekrc4i: 0,
    i8vvqc: 0,
    g2u3we: 0,
    icvyot: 0,
    B4j52fo: 0,
    irswps: "fm9niy",
    Huce71: "fibxuh5",
    Bj3rh1h: "fj25m7a"
  },
  connectorLayer: {
    qhf8xq: "f1euv43f",
    Bhzewxz: "f15twtuk",
    oyh7mz: ["f1vgc2s3", "f1e31b4d"],
    a9b677: "fly5x3f",
    Bqenvij: "f1l02sjl",
    Bkecrkj: "f1aehjj5",
    B68tc82: 0,
    Bmxbyg5: 0,
    Bpg54ce: "f1gl81tg"
  },
  measurement: {
    qhf8xq: "f1euv43f",
    Bcdw1i0: "fd7fpy0",
    Bkecrkj: "f1aehjj5"
  },
  annotationContent: {
    a9b677: "fly5x3f",
    Bqenvij: "f1l02sjl",
    Bkecrkj: "f1aehjj5"
  },
  annotationForeignObject: {
    B68tc82: 0,
    Bmxbyg5: 0,
    Bpg54ce: "f1gl81tg",
    Bkecrkj: "f1aehjj5"
  },
  annotationContentInteractive: {
    Bkecrkj: "f1cguypg"
  },
  annotationForeignObjectInteractive: {
    Bkecrkj: "f1cguypg"
  },
  connectorGroup: {
    Bkecrkj: "f1aehjj5"
  }
}, {
  d: [".f1euv43f{position:absolute;}", ".f15twtuk{top:0;}", ".f1vgc2s3{left:0;}", ".f1e31b4d{right:0;}", ".f1yab3r1{bottom:0;}", ".fly5x3f{width:100%;}", ".f1l02sjl{height:100%;}", ".f1aehjj5{pointer-events:none;}", [".f1gl81tg{overflow:visible;}", {
    p: -1
  }], ".f19g0ac{z-index:1;}", ".fk6fouc{font-family:var(--fontFamilyBase);}", ".fy9rknc{font-size:var(--fontSizeBase200);}", ".figsok6{font-weight:var(--fontWeightRegular);}", ".fwrc4pm{line-height:var(--lineHeightBase200);}", ".f22iagw{display:flex;}", ".f122n59{align-items:center;}", ".f4d9j23{justify-content:center;}", ".f17mccla{text-align:center;}", ".f19n0e5{color:var(--colorNeutralForeground1);}", ".f10ra9hq{padding-top:4px;}", ".f1y2xyjm{padding-bottom:4px;}", ".f177v4lu{padding-left:8px;}", ".f19lj068{padding-right:8px;}", [".ft85np5{border-radius:var(--borderRadiusMedium);}", {
    p: -1
  }], ".f1hg901r{box-shadow:var(--shadow16);}", [".fm9niy{border:1px solid var(--colorNeutralStroke1);}", {
    p: -2
  }], ".fibxuh5{white-space:pre-wrap;}", ".fj25m7a{z-index:2;}", [".f1gl81tg{overflow:visible;}", {
    p: -1
  }], ".fd7fpy0{visibility:hidden;}", [".f1gl81tg{overflow:visible;}", {
    p: -1
  }], ".f1cguypg{pointer-events:auto;}"]
});
/**
 * Apply styling to the ChartAnnotationLayer slots based on the state
 */
export const useChartAnnotationLayerStyles = props => {
  var _props_styles, _props_styles1, _props_styles2, _props_styles3, _props_styles4, _props_styles5, _props_styles6, _props_styles7, _props_styles8;
  const baseStyles = useStyles();
  return {
    root: mergeClasses(chartAnnotationLayerClassNames.root, baseStyles.root, props.className, (_props_styles = props.styles) === null || _props_styles === void 0 ? void 0 : _props_styles.root),
    annotation: mergeClasses(chartAnnotationLayerClassNames.annotation, baseStyles.annotation, (_props_styles1 = props.styles) === null || _props_styles1 === void 0 ? void 0 : _props_styles1.annotation),
    connectorLayer: mergeClasses(chartAnnotationLayerClassNames.connectorLayer, baseStyles.connectorLayer, (_props_styles2 = props.styles) === null || _props_styles2 === void 0 ? void 0 : _props_styles2.connectorLayer),
    measurement: mergeClasses(chartAnnotationLayerClassNames.measurement, baseStyles.measurement, (_props_styles3 = props.styles) === null || _props_styles3 === void 0 ? void 0 : _props_styles3.measurement),
    annotationContent: mergeClasses(chartAnnotationLayerClassNames.annotationContent, baseStyles.annotationContent, (_props_styles4 = props.styles) === null || _props_styles4 === void 0 ? void 0 : _props_styles4.annotationContent),
    annotationForeignObject: mergeClasses(chartAnnotationLayerClassNames.annotationForeignObject, baseStyles.annotationForeignObject, (_props_styles5 = props.styles) === null || _props_styles5 === void 0 ? void 0 : _props_styles5.annotationForeignObject),
    annotationContentInteractive: mergeClasses(chartAnnotationLayerClassNames.annotationContentInteractive, baseStyles.annotationContentInteractive, (_props_styles6 = props.styles) === null || _props_styles6 === void 0 ? void 0 : _props_styles6.annotationContentInteractive),
    annotationForeignObjectInteractive: mergeClasses(chartAnnotationLayerClassNames.annotationForeignObjectInteractive, baseStyles.annotationForeignObjectInteractive, (_props_styles7 = props.styles) === null || _props_styles7 === void 0 ? void 0 : _props_styles7.annotationForeignObjectInteractive),
    connectorGroup: mergeClasses(chartAnnotationLayerClassNames.connectorGroup, baseStyles.connectorGroup, (_props_styles8 = props.styles) === null || _props_styles8 === void 0 ? void 0 : _props_styles8.connectorGroup)
  };
};