@fluentui/react-charts 9.3.7 → 9.3.8

package/lib-commonjs/components/CommonComponents/Annotations/useChartAnnotationLayer.styles.js.map

@@ -1 +1 @@
-{"version":3,"sources":["useChartAnnotationLayer.styles.js"],"sourcesContent":["'use client';\nimport { makeStyles, mergeClasses } from '@griffel/react';\nimport { tokens, typographyStyles } from '@fluentui/react-theme';\nimport { color as d3Color } from 'd3-color';\nexport const DEFAULT_ANNOTATION_BACKGROUND_OPACITY = 0.8;\nexport const DEFAULT_ANNOTATION_PADDING = '4px 8px';\nexport const DEFAULT_CONNECTOR_START_PADDING = 12;\nexport const DEFAULT_CONNECTOR_END_PADDING = 0;\nexport const DEFAULT_CONNECTOR_STROKE_WIDTH = 2;\nexport const DEFAULT_CONNECTOR_ARROW = 'end';\nexport const applyOpacityToColor = (color, opacity)=>{\n    if (!color) {\n        return undefined;\n    }\n    const parsed = d3Color(color);\n    if (!parsed) {\n        return color;\n    }\n    parsed.opacity = Math.max(0, Math.min(1, opacity));\n    return parsed.toString();\n};\n/**\n * Get default annotation background color with opacity applied\n * Updated for v9 - uses tokens instead of theme\n */ export const getDefaultAnnotationBackgroundColor = ()=>applyOpacityToColor(tokens.colorNeutralBackground1, DEFAULT_ANNOTATION_BACKGROUND_OPACITY);\n/**\n * Get default connector stroke color\n * Updated for v9 - uses tokens instead of theme\n */ export const getDefaultConnectorStrokeColor = ()=>tokens.colorNeutralForeground1;\n/**\n * @internal\n */ export const chartAnnotationLayerClassNames = {\n    root: 'fui-chartAnnotationLayer__root',\n    annotation: 'fui-chartAnnotationLayer__annotation',\n    connectorLayer: 'fui-chartAnnotationLayer__connectorLayer',\n    measurement: 'fui-chartAnnotationLayer__measurement',\n    annotationContent: 'fui-chartAnnotationLayer__annotationContent',\n    annotationForeignObject: 'fui-chartAnnotationLayer__annotationForeignObject',\n    annotationContentInteractive: 'fui-chartAnnotationLayer__annotationContentInteractive',\n    annotationForeignObjectInteractive: 'fui-chartAnnotationLayer__annotationForeignObjectInteractive',\n    connectorGroup: 'fui-chartAnnotationLayer__connectorGroup'\n};\n/**\n * Base Styles\n */ const useStyles = makeStyles({\n    root: {\n        position: 'absolute',\n        top: '0',\n        left: '0',\n        right: '0',\n        bottom: '0',\n        width: '100%',\n        height: '100%',\n        pointerEvents: 'none',\n        overflow: 'visible',\n        zIndex: 1\n    },\n    annotation: {\n        ...typographyStyles.caption1,\n        position: 'absolute',\n        pointerEvents: 'none',\n        display: 'flex',\n        alignItems: 'center',\n        justifyContent: 'center',\n        textAlign: 'center',\n        color: tokens.colorNeutralForeground1,\n        paddingTop: '4px',\n        paddingBottom: '4px',\n        paddingLeft: '8px',\n        paddingRight: '8px',\n        borderRadius: tokens.borderRadiusMedium,\n        boxShadow: tokens.shadow16,\n        border: `1px solid ${tokens.colorNeutralStroke1}`,\n        whiteSpace: 'pre-wrap',\n        zIndex: 2\n    },\n    connectorLayer: {\n        position: 'absolute',\n        top: '0',\n        left: '0',\n        width: '100%',\n        height: '100%',\n        pointerEvents: 'none',\n        overflow: 'visible'\n    },\n    measurement: {\n        position: 'absolute',\n        visibility: 'hidden',\n        pointerEvents: 'none'\n    },\n    annotationContent: {\n        width: '100%',\n        height: '100%',\n        pointerEvents: 'none'\n    },\n    annotationForeignObject: {\n        overflow: 'visible',\n        pointerEvents: 'none'\n    },\n    annotationContentInteractive: {\n        pointerEvents: 'auto'\n    },\n    annotationForeignObjectInteractive: {\n        pointerEvents: 'auto'\n    },\n    connectorGroup: {\n        pointerEvents: 'none'\n    }\n});\n/**\n * Apply styling to the ChartAnnotationLayer slots based on the state\n */ export const useChartAnnotationLayerStyles = (props)=>{\n    var _props_styles, _props_styles1, _props_styles2, _props_styles3, _props_styles4, _props_styles5, _props_styles6, _props_styles7, _props_styles8;\n    const baseStyles = useStyles();\n    return {\n        root: mergeClasses(chartAnnotationLayerClassNames.root, baseStyles.root, props.className, (_props_styles = props.styles) === null || _props_styles === void 0 ? void 0 : _props_styles.root),\n        annotation: mergeClasses(chartAnnotationLayerClassNames.annotation, baseStyles.annotation, (_props_styles1 = props.styles) === null || _props_styles1 === void 0 ? void 0 : _props_styles1.annotation),\n        connectorLayer: mergeClasses(chartAnnotationLayerClassNames.connectorLayer, baseStyles.connectorLayer, (_props_styles2 = props.styles) === null || _props_styles2 === void 0 ? void 0 : _props_styles2.connectorLayer),\n        measurement: mergeClasses(chartAnnotationLayerClassNames.measurement, baseStyles.measurement, (_props_styles3 = props.styles) === null || _props_styles3 === void 0 ? void 0 : _props_styles3.measurement),\n        annotationContent: mergeClasses(chartAnnotationLayerClassNames.annotationContent, baseStyles.annotationContent, (_props_styles4 = props.styles) === null || _props_styles4 === void 0 ? void 0 : _props_styles4.annotationContent),\n        annotationForeignObject: mergeClasses(chartAnnotationLayerClassNames.annotationForeignObject, baseStyles.annotationForeignObject, (_props_styles5 = props.styles) === null || _props_styles5 === void 0 ? void 0 : _props_styles5.annotationForeignObject),\n        annotationContentInteractive: mergeClasses(chartAnnotationLayerClassNames.annotationContentInteractive, baseStyles.annotationContentInteractive, (_props_styles6 = props.styles) === null || _props_styles6 === void 0 ? void 0 : _props_styles6.annotationContentInteractive),\n        annotationForeignObjectInteractive: mergeClasses(chartAnnotationLayerClassNames.annotationForeignObjectInteractive, baseStyles.annotationForeignObjectInteractive, (_props_styles7 = props.styles) === null || _props_styles7 === void 0 ? void 0 : _props_styles7.annotationForeignObjectInteractive),\n        connectorGroup: mergeClasses(chartAnnotationLayerClassNames.connectorGroup, baseStyles.connectorGroup, (_props_styles8 = props.styles) === null || _props_styles8 === void 0 ? void 0 : _props_styles8.connectorGroup)\n    };\n};\n"],"names":["__styles","mergeClasses","tokens","typographyStyles","color","d3Color","DEFAULT_ANNOTATION_BACKGROUND_OPACITY","DEFAULT_ANNOTATION_PADDING","DEFAULT_CONNECTOR_START_PADDING","DEFAULT_CONNECTOR_END_PADDING","DEFAULT_CONNECTOR_STROKE_WIDTH","DEFAULT_CONNECTOR_ARROW","applyOpacityToColor","opacity","undefined","parsed","Math","max","min","toString","getDefaultAnnotationBackgroundColor","colorNeutralBackground1","getDefaultConnectorStrokeColor","colorNeutralForeground1","chartAnnotationLayerClassNames","root","annotation","connectorLayer","measurement","annotationContent","annotationForeignObject","annotationContentInteractive","annotationForeignObjectInteractive","connectorGroup","useStyles","qhf8xq","Bhzewxz","oyh7mz","j35jbq","B5kzvoi","a9b677","Bqenvij","Bkecrkj","B68tc82","Bmxbyg5","Bpg54ce","Bj3rh1h","Bahqtrf","Be2twd7","Bhrd7zp","Bg96gwp","mc9l5x","Bt984gj","Brf1p80","fsow6f","sj55zd","z8tnut","Byoj8tv","uwmqm3","z189sj","Beyfa6y","Bbmb7ep","Btl43ni","B7oj6ja","Dimara","E5pizo","Bgfg5da","B9xav0g","oivjwe","Bn0qgzm","B4g9neb","zhjwy3","wvpqe5","ibv6hh","u1mtju","h3c5rm","vrafjx","Bekrc4i","i8vvqc","g2u3we","icvyot","B4j52fo","irswps","Huce71","Bcdw1i0","d","p","useChartAnnotationLayerStyles","props","_props_styles","_props_styles1","_props_styles2","_props_styles3","_props_styles4","_props_styles5","_props_styles6","_props_styles7","_props_styles8","baseStyles","className","styles"],"mappings":"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"}
+{"version":3,"sources":["useChartAnnotationLayer.styles.js"],"sourcesContent":["'use client';\nimport { makeStyles, mergeClasses } from '@griffel/react';\nimport { tokens, typographyStyles } from '@fluentui/react-theme';\nimport { color as d3Color } from 'd3-color';\nexport const DEFAULT_ANNOTATION_BACKGROUND_OPACITY = 0.8;\nexport const DEFAULT_ANNOTATION_PADDING = '4px 8px';\nexport const DEFAULT_CONNECTOR_START_PADDING = 12;\nexport const DEFAULT_CONNECTOR_END_PADDING = 0;\nexport const DEFAULT_CONNECTOR_STROKE_WIDTH = 2;\nexport const DEFAULT_CONNECTOR_ARROW = 'end';\nexport const applyOpacityToColor = (color, opacity, options)=>{\n    if (!color) {\n        return undefined;\n    }\n    const parsed = d3Color(color);\n    if (!parsed) {\n        return color;\n    }\n    const originalOpacity = typeof parsed.opacity === 'number' ? parsed.opacity : 1;\n    var _options_preserveOriginalOpacity;\n    const preserveOriginalOpacity = (_options_preserveOriginalOpacity = options === null || options === void 0 ? void 0 : options.preserveOriginalOpacity) !== null && _options_preserveOriginalOpacity !== void 0 ? _options_preserveOriginalOpacity : true;\n    if (preserveOriginalOpacity && originalOpacity < 1) {\n        return parsed.toString();\n    }\n    parsed.opacity = Math.max(0, Math.min(1, opacity));\n    return parsed.toString();\n};\n/**\n * Get default annotation background color with opacity applied\n * Updated for v9 - uses tokens instead of theme\n */ export const getDefaultAnnotationBackgroundColor = ()=>applyOpacityToColor(tokens.colorNeutralBackground1, DEFAULT_ANNOTATION_BACKGROUND_OPACITY);\n/**\n * Get default connector stroke color\n * Updated for v9 - uses tokens instead of theme\n */ export const getDefaultConnectorStrokeColor = ()=>tokens.colorNeutralForeground1;\n/**\n * @internal\n */ export const chartAnnotationLayerClassNames = {\n    root: 'fui-chartAnnotationLayer__root',\n    annotation: 'fui-chartAnnotationLayer__annotation',\n    connectorLayer: 'fui-chartAnnotationLayer__connectorLayer',\n    measurement: 'fui-chartAnnotationLayer__measurement',\n    annotationContent: 'fui-chartAnnotationLayer__annotationContent',\n    annotationForeignObject: 'fui-chartAnnotationLayer__annotationForeignObject',\n    annotationContentInteractive: 'fui-chartAnnotationLayer__annotationContentInteractive',\n    annotationForeignObjectInteractive: 'fui-chartAnnotationLayer__annotationForeignObjectInteractive',\n    connectorGroup: 'fui-chartAnnotationLayer__connectorGroup'\n};\n/**\n * Base Styles\n */ const useStyles = makeStyles({\n    root: {\n        position: 'absolute',\n        top: '0',\n        left: '0',\n        right: '0',\n        bottom: '0',\n        width: '100%',\n        height: '100%',\n        pointerEvents: 'none',\n        overflow: 'visible',\n        zIndex: 1\n    },\n    annotation: {\n        ...typographyStyles.caption1,\n        position: 'absolute',\n        pointerEvents: 'none',\n        display: 'flex',\n        alignItems: 'center',\n        justifyContent: 'center',\n        textAlign: 'center',\n        color: tokens.colorNeutralForeground1,\n        paddingTop: '4px',\n        paddingBottom: '4px',\n        paddingLeft: '8px',\n        paddingRight: '8px',\n        borderRadius: tokens.borderRadiusMedium,\n        boxShadow: tokens.shadow16,\n        border: `1px solid ${tokens.colorNeutralStroke1}`,\n        whiteSpace: 'pre-wrap',\n        zIndex: 2\n    },\n    connectorLayer: {\n        position: 'absolute',\n        top: '0',\n        left: '0',\n        width: '100%',\n        height: '100%',\n        pointerEvents: 'none',\n        overflow: 'visible'\n    },\n    measurement: {\n        position: 'absolute',\n        visibility: 'hidden',\n        pointerEvents: 'none'\n    },\n    annotationContent: {\n        width: '100%',\n        height: '100%',\n        pointerEvents: 'none'\n    },\n    annotationForeignObject: {\n        overflow: 'visible',\n        pointerEvents: 'none'\n    },\n    annotationContentInteractive: {\n        pointerEvents: 'auto'\n    },\n    annotationForeignObjectInteractive: {\n        pointerEvents: 'auto'\n    },\n    connectorGroup: {\n        pointerEvents: 'none'\n    }\n});\n/**\n * Apply styling to the ChartAnnotationLayer slots based on the state\n */ export const useChartAnnotationLayerStyles = (props)=>{\n    var _props_styles, _props_styles1, _props_styles2, _props_styles3, _props_styles4, _props_styles5, _props_styles6, _props_styles7, _props_styles8;\n    const baseStyles = useStyles();\n    return {\n        root: mergeClasses(chartAnnotationLayerClassNames.root, baseStyles.root, props.className, (_props_styles = props.styles) === null || _props_styles === void 0 ? void 0 : _props_styles.root),\n        annotation: mergeClasses(chartAnnotationLayerClassNames.annotation, baseStyles.annotation, (_props_styles1 = props.styles) === null || _props_styles1 === void 0 ? void 0 : _props_styles1.annotation),\n        connectorLayer: mergeClasses(chartAnnotationLayerClassNames.connectorLayer, baseStyles.connectorLayer, (_props_styles2 = props.styles) === null || _props_styles2 === void 0 ? void 0 : _props_styles2.connectorLayer),\n        measurement: mergeClasses(chartAnnotationLayerClassNames.measurement, baseStyles.measurement, (_props_styles3 = props.styles) === null || _props_styles3 === void 0 ? void 0 : _props_styles3.measurement),\n        annotationContent: mergeClasses(chartAnnotationLayerClassNames.annotationContent, baseStyles.annotationContent, (_props_styles4 = props.styles) === null || _props_styles4 === void 0 ? void 0 : _props_styles4.annotationContent),\n        annotationForeignObject: mergeClasses(chartAnnotationLayerClassNames.annotationForeignObject, baseStyles.annotationForeignObject, (_props_styles5 = props.styles) === null || _props_styles5 === void 0 ? void 0 : _props_styles5.annotationForeignObject),\n        annotationContentInteractive: mergeClasses(chartAnnotationLayerClassNames.annotationContentInteractive, baseStyles.annotationContentInteractive, (_props_styles6 = props.styles) === null || _props_styles6 === void 0 ? void 0 : _props_styles6.annotationContentInteractive),\n        annotationForeignObjectInteractive: mergeClasses(chartAnnotationLayerClassNames.annotationForeignObjectInteractive, baseStyles.annotationForeignObjectInteractive, (_props_styles7 = props.styles) === null || _props_styles7 === void 0 ? void 0 : _props_styles7.annotationForeignObjectInteractive),\n        connectorGroup: mergeClasses(chartAnnotationLayerClassNames.connectorGroup, baseStyles.connectorGroup, (_props_styles8 = props.styles) === null || _props_styles8 === void 0 ? void 0 : _props_styles8.connectorGroup)\n    };\n};\n"],"names":["__styles","mergeClasses","tokens","typographyStyles","color","d3Color","DEFAULT_ANNOTATION_BACKGROUND_OPACITY","DEFAULT_ANNOTATION_PADDING","DEFAULT_CONNECTOR_START_PADDING","DEFAULT_CONNECTOR_END_PADDING","DEFAULT_CONNECTOR_STROKE_WIDTH","DEFAULT_CONNECTOR_ARROW","applyOpacityToColor","opacity","options","undefined","parsed","originalOpacity","_options_preserveOriginalOpacity","preserveOriginalOpacity","toString","Math","max","min","getDefaultAnnotationBackgroundColor","colorNeutralBackground1","getDefaultConnectorStrokeColor","colorNeutralForeground1","chartAnnotationLayerClassNames","root","annotation","connectorLayer","measurement","annotationContent","annotationForeignObject","annotationContentInteractive","annotationForeignObjectInteractive","connectorGroup","useStyles","qhf8xq","Bhzewxz","oyh7mz","j35jbq","B5kzvoi","a9b677","Bqenvij","Bkecrkj","B68tc82","Bmxbyg5","Bpg54ce","Bj3rh1h","Bahqtrf","Be2twd7","Bhrd7zp","Bg96gwp","mc9l5x","Bt984gj","Brf1p80","fsow6f","sj55zd","z8tnut","Byoj8tv","uwmqm3","z189sj","Beyfa6y","Bbmb7ep","Btl43ni","B7oj6ja","Dimara","E5pizo","Bgfg5da","B9xav0g","oivjwe","Bn0qgzm","B4g9neb","zhjwy3","wvpqe5","ibv6hh","u1mtju","h3c5rm","vrafjx","Bekrc4i","i8vvqc","g2u3we","icvyot","B4j52fo","irswps","Huce71","Bcdw1i0","d","p","useChartAnnotationLayerStyles","props","_props_styles","_props_styles1","_props_styles2","_props_styles3","_props_styles4","_props_styles5","_props_styles6","_props_styles7","_props_styles8","baseStyles","className","styles"],"mappings":"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"}

package/lib-commonjs/components/CommonComponents/Annotations/useChartAnnotationLayer.styles.raw.js

@@ -53,7 +53,7 @@ const DEFAULT_CONNECTOR_START_PADDING = 12;
 const DEFAULT_CONNECTOR_END_PADDING = 0;
 const DEFAULT_CONNECTOR_STROKE_WIDTH = 2;
 const DEFAULT_CONNECTOR_ARROW = 'end';
-const applyOpacityToColor = (color, opacity)=>{
+const applyOpacityToColor = (color, opacity, options)=>{
     if (!color) {
         return undefined;
     }
@@ -61,6 +61,12 @@ const applyOpacityToColor = (color, opacity)=>{
     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();
 };

package/lib-commonjs/components/CommonComponents/Annotations/useChartAnnotationLayer.styles.raw.js.map

@@ -1 +1 @@
-{"version":3,"sources":["../src/components/CommonComponents/Annotations/useChartAnnotationLayer.styles.ts"],"sourcesContent":["'use client';\n\nimport { makeStyles, mergeClasses } from '@griffel/react';\nimport { SlotClassNames } from '@fluentui/react-utilities';\nimport { tokens, typographyStyles } from '@fluentui/react-theme';\nimport { color as d3Color } from 'd3-color';\nimport { ChartAnnotationArrowHead } from '../../../types/ChartAnnotation';\n\nexport interface ChartAnnotationLayerStyles {\n  root?: string;\n  annotation?: string;\n  connectorLayer?: string;\n  measurement?: string;\n  annotationContent?: string;\n  annotationForeignObject?: string;\n  annotationContentInteractive?: string;\n  annotationForeignObjectInteractive?: string;\n  connectorGroup?: string;\n}\n\nexport interface ChartAnnotationLayerStyleProps {\n  className?: string;\n  styles?: Partial<ChartAnnotationLayerStyles>;\n}\n\nexport const DEFAULT_ANNOTATION_BACKGROUND_OPACITY = 0.8;\nexport const DEFAULT_ANNOTATION_PADDING = '4px 8px';\nexport const DEFAULT_CONNECTOR_START_PADDING = 12;\nexport const DEFAULT_CONNECTOR_END_PADDING = 0;\nexport const DEFAULT_CONNECTOR_STROKE_WIDTH = 2;\nexport const DEFAULT_CONNECTOR_ARROW: ChartAnnotationArrowHead = 'end';\n\nexport const applyOpacityToColor = (color: string | undefined, opacity: number): string | undefined => {\n  if (!color) {\n    return undefined;\n  }\n\n  const parsed = d3Color(color);\n  if (!parsed) {\n    return color;\n  }\n\n  parsed.opacity = Math.max(0, Math.min(1, opacity));\n  return parsed.toString();\n};\n\n/**\n * Get default annotation background color with opacity applied\n * Updated for v9 - uses tokens instead of theme\n */\nexport const getDefaultAnnotationBackgroundColor = (): string | undefined =>\n  applyOpacityToColor(tokens.colorNeutralBackground1, DEFAULT_ANNOTATION_BACKGROUND_OPACITY);\n\n/**\n * Get default connector stroke color\n * Updated for v9 - uses tokens instead of theme\n */\nexport const getDefaultConnectorStrokeColor = (): string => tokens.colorNeutralForeground1;\n\n/**\n * @internal\n */\nexport const chartAnnotationLayerClassNames: SlotClassNames<ChartAnnotationLayerStyles> = {\n  root: 'fui-chartAnnotationLayer__root',\n  annotation: 'fui-chartAnnotationLayer__annotation',\n  connectorLayer: 'fui-chartAnnotationLayer__connectorLayer',\n  measurement: 'fui-chartAnnotationLayer__measurement',\n  annotationContent: 'fui-chartAnnotationLayer__annotationContent',\n  annotationForeignObject: 'fui-chartAnnotationLayer__annotationForeignObject',\n  annotationContentInteractive: 'fui-chartAnnotationLayer__annotationContentInteractive',\n  annotationForeignObjectInteractive: 'fui-chartAnnotationLayer__annotationForeignObjectInteractive',\n  connectorGroup: 'fui-chartAnnotationLayer__connectorGroup',\n};\n\n/**\n * Base Styles\n */\nconst useStyles = makeStyles({\n  root: {\n    position: 'absolute',\n    top: '0',\n    left: '0',\n    right: '0',\n    bottom: '0',\n    width: '100%',\n    height: '100%',\n    pointerEvents: 'none',\n    overflow: 'visible',\n    zIndex: 1,\n  },\n  annotation: {\n    ...typographyStyles.caption1,\n    position: 'absolute',\n    pointerEvents: 'none',\n    display: 'flex',\n    alignItems: 'center',\n    justifyContent: 'center',\n    textAlign: 'center',\n    color: tokens.colorNeutralForeground1,\n    paddingTop: '4px',\n    paddingBottom: '4px',\n    paddingLeft: '8px',\n    paddingRight: '8px',\n    borderRadius: tokens.borderRadiusMedium,\n    boxShadow: tokens.shadow16,\n    border: `1px solid ${tokens.colorNeutralStroke1}`,\n    whiteSpace: 'pre-wrap',\n    zIndex: 2,\n  },\n  connectorLayer: {\n    position: 'absolute',\n    top: '0',\n    left: '0',\n    width: '100%',\n    height: '100%',\n    pointerEvents: 'none',\n    overflow: 'visible',\n  },\n  measurement: {\n    position: 'absolute',\n    visibility: 'hidden',\n    pointerEvents: 'none',\n  },\n  annotationContent: {\n    width: '100%',\n    height: '100%',\n    pointerEvents: 'none',\n  },\n  annotationForeignObject: {\n    overflow: 'visible',\n    pointerEvents: 'none',\n  },\n  annotationContentInteractive: {\n    pointerEvents: 'auto',\n  },\n  annotationForeignObjectInteractive: {\n    pointerEvents: 'auto',\n  },\n  connectorGroup: {\n    pointerEvents: 'none',\n  },\n});\n\n/**\n * Apply styling to the ChartAnnotationLayer slots based on the state\n */\nexport const useChartAnnotationLayerStyles = (props: ChartAnnotationLayerStyleProps): ChartAnnotationLayerStyles => {\n  const baseStyles = useStyles();\n\n  return {\n    root: mergeClasses(chartAnnotationLayerClassNames.root, baseStyles.root, props.className, props.styles?.root),\n    annotation: mergeClasses(\n      chartAnnotationLayerClassNames.annotation,\n      baseStyles.annotation,\n      props.styles?.annotation,\n    ),\n    connectorLayer: mergeClasses(\n      chartAnnotationLayerClassNames.connectorLayer,\n      baseStyles.connectorLayer,\n      props.styles?.connectorLayer,\n    ),\n    measurement: mergeClasses(\n      chartAnnotationLayerClassNames.measurement,\n      baseStyles.measurement,\n      props.styles?.measurement,\n    ),\n    annotationContent: mergeClasses(\n      chartAnnotationLayerClassNames.annotationContent,\n      baseStyles.annotationContent,\n      props.styles?.annotationContent,\n    ),\n    annotationForeignObject: mergeClasses(\n      chartAnnotationLayerClassNames.annotationForeignObject,\n      baseStyles.annotationForeignObject,\n      props.styles?.annotationForeignObject,\n    ),\n    annotationContentInteractive: mergeClasses(\n      chartAnnotationLayerClassNames.annotationContentInteractive,\n      baseStyles.annotationContentInteractive,\n      props.styles?.annotationContentInteractive,\n    ),\n    annotationForeignObjectInteractive: mergeClasses(\n      chartAnnotationLayerClassNames.annotationForeignObjectInteractive,\n      baseStyles.annotationForeignObjectInteractive,\n      props.styles?.annotationForeignObjectInteractive,\n    ),\n    connectorGroup: mergeClasses(\n      chartAnnotationLayerClassNames.connectorGroup,\n      baseStyles.connectorGroup,\n      props.styles?.connectorGroup,\n    ),\n  };\n};\n"],"names":["makeStyles","mergeClasses","tokens","typographyStyles","color","d3Color","DEFAULT_ANNOTATION_BACKGROUND_OPACITY","DEFAULT_ANNOTATION_PADDING","DEFAULT_CONNECTOR_START_PADDING","DEFAULT_CONNECTOR_END_PADDING","DEFAULT_CONNECTOR_STROKE_WIDTH","DEFAULT_CONNECTOR_ARROW","applyOpacityToColor","opacity","undefined","parsed","Math","max","min","toString","getDefaultAnnotationBackgroundColor","colorNeutralBackground1","getDefaultConnectorStrokeColor","colorNeutralForeground1","chartAnnotationLayerClassNames","root","annotation","connectorLayer","measurement","annotationContent","annotationForeignObject","annotationContentInteractive","annotationForeignObjectInteractive","connectorGroup","useStyles","position","top","left","right","bottom","width","height","pointerEvents","overflow","zIndex","caption1","display","alignItems","justifyContent","textAlign","paddingTop","paddingBottom","paddingLeft","paddingRight","borderRadius","borderRadiusMedium","boxShadow","shadow16","border","colorNeutralStroke1","whiteSpace","visibility","useChartAnnotationLayerStyles","props","baseStyles","className","styles"],"mappings":"AAAA;;;;;;;;;;;;IAyBaM,qCAAAA;;;8BACAC;;;2BAIAI;;;iCAFAF;;;mCADAD;eAAAA;;IAEAE,8BAAAA;;;uBAGAE;;;kCA8BAY;;;uCAZAJ;;;IAOAE,8BAAAA;;;iCAyFAwC;;;;uBAhJ4B,iBAAiB;4BAEjB,wBAAwB;yBAChC,WAAW;AAoBrC,8CAA8C,IAAI;AAClD,MAAMvD,6BAA6B,UAAU;AAC7C,wCAAwC,GAAG;AAC3C,MAAME,gCAAgC,EAAE;AACxC,uCAAuC,EAAE;AACzC,MAAME,0BAAoD,MAAM;AAEhE,MAAMC,sBAAsB,CAACR,OAA2BS;IAC7D,IAAI,CAACT,OAAO;QACV,OAAOU;IACT;IAEA,MAAMC,aAASV,cAAAA,EAAQD;IACvB,IAAI,CAACW,QAAQ;QACX,OAAOX;IACT;IAEAW,OAAOF,OAAO,GAAGG,KAAKC,GAAG,CAAC,GAAGD,KAAKE,GAAG,CAAC,GAAGL;IACzC,OAAOE,OAAOI,QAAQ;AACxB,EAAE;AAMK,MAAMC,sCAAsC,IACjDR,oBAAoBV,kBAAAA,CAAOmB,uBAAuB,EAAEf,uCAAuC;AAMtF,uCAAuC,IAAcJ,kBAAAA,CAAOqB,uBAAuB,CAAC;AAKpF,MAAMC,iCAA6E;IACxFC,MAAM;IACNC,YAAY;IACZC,gBAAgB;IAChBC,aAAa;IACbC,mBAAmB;IACnBC,yBAAyB;IACzBC,8BAA8B;IAC9BC,oCAAoC;IACpCC,gBAAgB;AAClB,EAAE;AAEF;;CAEC,GACD,MAAMC,gBAAYlC,iBAAAA,EAAW;IAC3ByB,MAAM;QACJU,UAAU;QACVC,KAAK;QACLC,MAAM;QACNC,OAAO;QACPC,QAAQ;QACRC,OAAO;QACPC,QAAQ;QACRC,eAAe;QACfC,UAAU;QACVC,QAAQ;IACV;IACAlB,YAAY;QACV,GAAGvB,4BAAAA,CAAiB0C,QAAQ;QAC5BV,UAAU;QACVO,eAAe;QACfI,SAAS;QACTC,YAAY;QACZC,gBAAgB;QAChBC,WAAW;QACX7C,OAAOF,kBAAAA,CAAOqB,uBAAuB;QACrC2B,YAAY;QACZC,eAAe;QACfC,aAAa;QACbC,cAAc;QACdC,cAAcpD,kBAAAA,CAAOqD,kBAAkB;QACvCC,WAAWtD,kBAAAA,CAAOuD,QAAQ;QAC1BC,QAAQ,CAAC,UAAU,EAAExD,kBAAAA,CAAOyD,mBAAmB,EAAE;QACjDC,YAAY;QACZhB,QAAQ;IACV;IACAjB,gBAAgB;QACdQ,UAAU;QACVC,KAAK;QACLC,MAAM;QACNG,OAAO;QACPC,QAAQ;QACRC,eAAe;QACfC,UAAU;IACZ;IACAf,aAAa;QACXO,UAAU;QACV0B,YAAY;QACZnB,eAAe;IACjB;IACAb,mBAAmB;QACjBW,OAAO;QACPC,QAAQ;QACRC,eAAe;IACjB;IACAZ,yBAAyB;QACvBa,UAAU;QACVD,eAAe;IACjB;IACAX,8BAA8B;QAC5BW,eAAe;IACjB;IACAV,oCAAoC;QAClCU,eAAe;IACjB;IACAT,gBAAgB;QACdS,eAAe;IACjB;AACF;AAKO,MAAMoB,gCAAgC,CAACC;QAIgDA,eAIxFA,gBAKAA,gBAKAA,gBAKAA,gBAKAA,gBAKAA,gBAKAA,gBAKAA;IA1CJ,MAAMC,aAAa9B;IAEnB,OAAO;QACLT,UAAMxB,mBAAAA,EAAauB,+BAA+BC,IAAI,EAAEuC,WAAWvC,IAAI,EAAEsC,MAAME,SAAS,EAAA,CAAEF,gBAAAA,MAAMG,MAAM,AAANA,MAAM,QAAZH,kBAAAA,KAAAA,IAAAA,KAAAA,IAAAA,cAActC,IAAI;QAC5GC,gBAAYzB,mBAAAA,EACVuB,+BAA+BE,UAAU,EACzCsC,WAAWtC,UAAU,EAAA,CACrBqC,iBAAAA,MAAMG,MAAAA,AAAM,MAAA,QAAZH,mBAAAA,KAAAA,IAAAA,KAAAA,IAAAA,eAAcrC,UAAU;QAE1BC,oBAAgB1B,mBAAAA,EACduB,+BAA+BG,cAAc,EAC7CqC,WAAWrC,cAAc,EAAA,CACzBoC,iBAAAA,MAAMG,MAAAA,AAAM,MAAA,QAAZH,mBAAAA,KAAAA,IAAAA,KAAAA,IAAAA,eAAcpC,cAAc;QAE9BC,iBAAa3B,mBAAAA,EACXuB,+BAA+BI,WAAW,EAC1CoC,WAAWpC,WAAW,EAAA,CACtBmC,iBAAAA,MAAMG,MAAM,AAANA,MAAM,QAAZH,mBAAAA,KAAAA,IAAAA,KAAAA,IAAAA,eAAcnC,WAAW;QAE3BC,uBAAmB5B,mBAAAA,EACjBuB,+BAA+BK,iBAAiB,EAChDmC,WAAWnC,iBAAiB,EAAA,CAC5BkC,iBAAAA,MAAMG,MAAAA,AAAM,MAAA,QAAZH,mBAAAA,KAAAA,IAAAA,KAAAA,IAAAA,eAAclC,iBAAiB;QAEjCC,6BAAyB7B,mBAAAA,EACvBuB,+BAA+BM,uBAAuB,EACtDkC,WAAWlC,uBAAuB,EAAA,CAClCiC,iBAAAA,MAAMG,MAAAA,AAAM,MAAA,QAAZH,mBAAAA,KAAAA,IAAAA,KAAAA,IAAAA,eAAcjC,uBAAuB;QAEvCC,kCAA8B9B,mBAAAA,EAC5BuB,+BAA+BO,4BAA4B,EAC3DiC,WAAWjC,4BAA4B,EAAA,CACvCgC,iBAAAA,MAAMG,MAAAA,AAAM,MAAA,QAAZH,mBAAAA,KAAAA,IAAAA,KAAAA,IAAAA,eAAchC,4BAA4B;QAE5CC,wCAAoC/B,mBAAAA,EAClCuB,+BAA+BQ,kCAAkC,EACjEgC,WAAWhC,kCAAkC,EAAA,CAC7C+B,iBAAAA,MAAMG,MAAAA,AAAM,MAAA,QAAZH,mBAAAA,KAAAA,IAAAA,KAAAA,IAAAA,eAAc/B,kCAAkC;QAElDC,oBAAgBhC,mBAAAA,EACduB,+BAA+BS,cAAc,EAC7C+B,WAAW/B,cAAc,EAAA,CACzB8B,iBAAAA,MAAMG,MAAAA,AAAM,MAAA,QAAZH,mBAAAA,KAAAA,IAAAA,KAAAA,IAAAA,eAAc9B,cAAc;IAEhC;AACF,EAAE"}
+{"version":3,"sources":["../src/components/CommonComponents/Annotations/useChartAnnotationLayer.styles.ts"],"sourcesContent":["'use client';\n\nimport { makeStyles, mergeClasses } from '@griffel/react';\nimport { SlotClassNames } from '@fluentui/react-utilities';\nimport { tokens, typographyStyles } from '@fluentui/react-theme';\nimport { color as d3Color } from 'd3-color';\nimport { ChartAnnotationArrowHead } from '../../../types/ChartAnnotation';\n\nexport interface ChartAnnotationLayerStyles {\n  root?: string;\n  annotation?: string;\n  connectorLayer?: string;\n  measurement?: string;\n  annotationContent?: string;\n  annotationForeignObject?: string;\n  annotationContentInteractive?: string;\n  annotationForeignObjectInteractive?: string;\n  connectorGroup?: string;\n}\n\nexport interface ChartAnnotationLayerStyleProps {\n  className?: string;\n  styles?: Partial<ChartAnnotationLayerStyles>;\n}\n\nexport const DEFAULT_ANNOTATION_BACKGROUND_OPACITY = 0.8;\nexport const DEFAULT_ANNOTATION_PADDING = '4px 8px';\nexport const DEFAULT_CONNECTOR_START_PADDING = 12;\nexport const DEFAULT_CONNECTOR_END_PADDING = 0;\nexport const DEFAULT_CONNECTOR_STROKE_WIDTH = 2;\nexport const DEFAULT_CONNECTOR_ARROW: ChartAnnotationArrowHead = 'end';\n\nexport const applyOpacityToColor = (\n  color: string | undefined,\n  opacity: number,\n  options?: {\n    preserveOriginalOpacity?: boolean;\n  },\n): string | undefined => {\n  if (!color) {\n    return undefined;\n  }\n\n  const parsed = d3Color(color);\n  if (!parsed) {\n    return color;\n  }\n\n  const originalOpacity = typeof parsed.opacity === 'number' ? parsed.opacity : 1;\n  const preserveOriginalOpacity = options?.preserveOriginalOpacity ?? true;\n\n  if (preserveOriginalOpacity && originalOpacity < 1) {\n    return parsed.toString();\n  }\n\n  parsed.opacity = Math.max(0, Math.min(1, opacity));\n  return parsed.toString();\n};\n\n/**\n * Get default annotation background color with opacity applied\n * Updated for v9 - uses tokens instead of theme\n */\nexport const getDefaultAnnotationBackgroundColor = (): string | undefined =>\n  applyOpacityToColor(tokens.colorNeutralBackground1, DEFAULT_ANNOTATION_BACKGROUND_OPACITY);\n\n/**\n * Get default connector stroke color\n * Updated for v9 - uses tokens instead of theme\n */\nexport const getDefaultConnectorStrokeColor = (): string => tokens.colorNeutralForeground1;\n\n/**\n * @internal\n */\nexport const chartAnnotationLayerClassNames: SlotClassNames<ChartAnnotationLayerStyles> = {\n  root: 'fui-chartAnnotationLayer__root',\n  annotation: 'fui-chartAnnotationLayer__annotation',\n  connectorLayer: 'fui-chartAnnotationLayer__connectorLayer',\n  measurement: 'fui-chartAnnotationLayer__measurement',\n  annotationContent: 'fui-chartAnnotationLayer__annotationContent',\n  annotationForeignObject: 'fui-chartAnnotationLayer__annotationForeignObject',\n  annotationContentInteractive: 'fui-chartAnnotationLayer__annotationContentInteractive',\n  annotationForeignObjectInteractive: 'fui-chartAnnotationLayer__annotationForeignObjectInteractive',\n  connectorGroup: 'fui-chartAnnotationLayer__connectorGroup',\n};\n\n/**\n * Base Styles\n */\nconst useStyles = makeStyles({\n  root: {\n    position: 'absolute',\n    top: '0',\n    left: '0',\n    right: '0',\n    bottom: '0',\n    width: '100%',\n    height: '100%',\n    pointerEvents: 'none',\n    overflow: 'visible',\n    zIndex: 1,\n  },\n  annotation: {\n    ...typographyStyles.caption1,\n    position: 'absolute',\n    pointerEvents: 'none',\n    display: 'flex',\n    alignItems: 'center',\n    justifyContent: 'center',\n    textAlign: 'center',\n    color: tokens.colorNeutralForeground1,\n    paddingTop: '4px',\n    paddingBottom: '4px',\n    paddingLeft: '8px',\n    paddingRight: '8px',\n    borderRadius: tokens.borderRadiusMedium,\n    boxShadow: tokens.shadow16,\n    border: `1px solid ${tokens.colorNeutralStroke1}`,\n    whiteSpace: 'pre-wrap',\n    zIndex: 2,\n  },\n  connectorLayer: {\n    position: 'absolute',\n    top: '0',\n    left: '0',\n    width: '100%',\n    height: '100%',\n    pointerEvents: 'none',\n    overflow: 'visible',\n  },\n  measurement: {\n    position: 'absolute',\n    visibility: 'hidden',\n    pointerEvents: 'none',\n  },\n  annotationContent: {\n    width: '100%',\n    height: '100%',\n    pointerEvents: 'none',\n  },\n  annotationForeignObject: {\n    overflow: 'visible',\n    pointerEvents: 'none',\n  },\n  annotationContentInteractive: {\n    pointerEvents: 'auto',\n  },\n  annotationForeignObjectInteractive: {\n    pointerEvents: 'auto',\n  },\n  connectorGroup: {\n    pointerEvents: 'none',\n  },\n});\n\n/**\n * Apply styling to the ChartAnnotationLayer slots based on the state\n */\nexport const useChartAnnotationLayerStyles = (props: ChartAnnotationLayerStyleProps): ChartAnnotationLayerStyles => {\n  const baseStyles = useStyles();\n\n  return {\n    root: mergeClasses(chartAnnotationLayerClassNames.root, baseStyles.root, props.className, props.styles?.root),\n    annotation: mergeClasses(\n      chartAnnotationLayerClassNames.annotation,\n      baseStyles.annotation,\n      props.styles?.annotation,\n    ),\n    connectorLayer: mergeClasses(\n      chartAnnotationLayerClassNames.connectorLayer,\n      baseStyles.connectorLayer,\n      props.styles?.connectorLayer,\n    ),\n    measurement: mergeClasses(\n      chartAnnotationLayerClassNames.measurement,\n      baseStyles.measurement,\n      props.styles?.measurement,\n    ),\n    annotationContent: mergeClasses(\n      chartAnnotationLayerClassNames.annotationContent,\n      baseStyles.annotationContent,\n      props.styles?.annotationContent,\n    ),\n    annotationForeignObject: mergeClasses(\n      chartAnnotationLayerClassNames.annotationForeignObject,\n      baseStyles.annotationForeignObject,\n      props.styles?.annotationForeignObject,\n    ),\n    annotationContentInteractive: mergeClasses(\n      chartAnnotationLayerClassNames.annotationContentInteractive,\n      baseStyles.annotationContentInteractive,\n      props.styles?.annotationContentInteractive,\n    ),\n    annotationForeignObjectInteractive: mergeClasses(\n      chartAnnotationLayerClassNames.annotationForeignObjectInteractive,\n      baseStyles.annotationForeignObjectInteractive,\n      props.styles?.annotationForeignObjectInteractive,\n    ),\n    connectorGroup: mergeClasses(\n      chartAnnotationLayerClassNames.connectorGroup,\n      baseStyles.connectorGroup,\n      props.styles?.connectorGroup,\n    ),\n  };\n};\n"],"names":["makeStyles","mergeClasses","tokens","typographyStyles","color","d3Color","DEFAULT_ANNOTATION_BACKGROUND_OPACITY","DEFAULT_ANNOTATION_PADDING","DEFAULT_CONNECTOR_START_PADDING","DEFAULT_CONNECTOR_END_PADDING","DEFAULT_CONNECTOR_STROKE_WIDTH","DEFAULT_CONNECTOR_ARROW","applyOpacityToColor","opacity","options","undefined","parsed","originalOpacity","preserveOriginalOpacity","toString","Math","max","min","getDefaultAnnotationBackgroundColor","colorNeutralBackground1","getDefaultConnectorStrokeColor","colorNeutralForeground1","chartAnnotationLayerClassNames","root","annotation","connectorLayer","measurement","annotationContent","annotationForeignObject","annotationContentInteractive","annotationForeignObjectInteractive","connectorGroup","useStyles","position","top","left","right","bottom","width","height","pointerEvents","overflow","zIndex","caption1","display","alignItems","justifyContent","textAlign","paddingTop","paddingBottom","paddingLeft","paddingRight","borderRadius","borderRadiusMedium","boxShadow","shadow16","border","colorNeutralStroke1","whiteSpace","visibility","useChartAnnotationLayerStyles","props","baseStyles","className","styles"],"mappings":"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"}

package/lib-commonjs/components/CommonComponents/CartesianChart.js

@@ -35,7 +35,7 @@ const CartesianChart = /*#__PURE__*/ _react.forwardRef(({ hideTickOverlap = true
     const idForGraph = 'chart_';
     let _reqID;
     const _useRtl = (0, _index.useRtl)();
-    let _tickValues;
+    let _tickLabels;
     const _isFirstRender = _react.useRef(true);
     // eslint-disable-next-line @typescript-eslint/no-explicit-any
     let _xScale;
@@ -60,6 +60,7 @@ const CartesianChart = /*#__PURE__*/ _react.forwardRef(({ hideTickOverlap = true
     const classes = (0, _useCartesianChartStylesstyles.useCartesianChartStyles)(props);
     const focusAttributes = (0, _reacttabster.useFocusableGroup)();
     const arrowAttributes = (0, _reacttabster.useArrowNavigationGroup)({
+        circular: true,
         axis: 'horizontal'
     });
     // ComponentdidMount and Componentwillunmount logic
@@ -144,6 +145,7 @@ const CartesianChart = /*#__PURE__*/ _react.forwardRef(({ hideTickOverlap = true
     let yScaleSecondary;
     let children = null;
     if (props.enableFirstRenderOptimization && chartContainer.current || !props.enableFirstRenderOptimization) {
+        var _props_xAxis, _props_xAxis1, _props_xAxis2;
         _isFirstRender.current = false;
         var _props_showRoundOffXTickValues;
         const XAxisParams = {
@@ -165,7 +167,7 @@ const CartesianChart = /*#__PURE__*/ _react.forwardRef(({ hideTickOverlap = true
             xAxisInnerPadding: props.xAxisInnerPadding,
             xAxisOuterPadding: props.xAxisOuterPadding,
             containerWidth: containerWidth,
-            hideTickOverlap: props.rotateXAxisLables ? false : hideTickOverlap,
+            hideTickOverlap: props.rotateXAxisLables || ((_props_xAxis = props.xAxis) === null || _props_xAxis === void 0 ? void 0 : _props_xAxis.tickLayout) === 'auto' ? false : hideTickOverlap,
             calcMaxLabelWidth: _calcMaxLabelWidthWithTransform,
             xMinValue: props.xMinValue,
             xMaxValue: props.xMaxValue,
@@ -179,22 +181,27 @@ const CartesianChart = /*#__PURE__*/ _react.forwardRef(({ hideTickOverlap = true
      */ // eslint-disable-next-line @typescript-eslint/no-explicit-any
         let xScale;
         let tickValues;
+        let tickLabels;
         switch(props.xAxisType){
             case _index.XAxisTypes.NumericAxis:
-                ({ xScale, tickValues } = (0, _index.createNumericXAxis)(XAxisParams, props.tickParams, props.chartType, culture, props.xScaleType, _useRtl));
+                ({ xScale, tickValues, tickLabels } = (0, _index.createNumericXAxis)(XAxisParams, props.tickParams, props.chartType, culture, props.xScaleType, _useRtl));
                 break;
             case _index.XAxisTypes.DateAxis:
-                ({ xScale, tickValues } = (0, _index.createDateXAxis)(XAxisParams, props.tickParams, culture, dateLocalizeOptions, timeFormatLocale, customDateTimeFormatter, props.useUTC, props.chartType));
+                ({ xScale, tickValues, tickLabels } = (0, _index.createDateXAxis)(XAxisParams, props.tickParams, culture, dateLocalizeOptions, timeFormatLocale, customDateTimeFormatter, props.useUTC, props.chartType));
                 break;
             case _index.XAxisTypes.StringAxis:
-                ({ xScale, tickValues } = (0, _index.createStringXAxis)(XAxisParams, props.tickParams, props.datasetForXAxisDomain, culture, _useRtl));
+                ({ xScale, tickValues, tickLabels } = (0, _index.createStringXAxis)(XAxisParams, props.tickParams, props.datasetForXAxisDomain, culture, _useRtl));
                 break;
             default:
-                ({ xScale, tickValues } = (0, _index.createNumericXAxis)(XAxisParams, props.tickParams, props.chartType, culture, props.xScaleType, _useRtl));
+                ({ xScale, tickValues, tickLabels } = (0, _index.createNumericXAxis)(XAxisParams, props.tickParams, props.chartType, culture, props.xScaleType, _useRtl));
         }
         _xScale = xScale;
-        _tickValues = tickValues;
-        _transformXAxisLabels();
+        _tickLabels = tickLabels;
+        if (((_props_xAxis1 = props.xAxis) === null || _props_xAxis1 === void 0 ? void 0 : _props_xAxis1.tickLayout) === 'auto') {
+            _removalValueForTextTuncate = (0, _index.autoLayoutXAxisLabels)(tickValues, _tickLabels, _xScale, xAxisElement.current, containerWidth, chartContainer.current);
+        } else {
+            _transformXAxisLabels();
+        }
         const YAxisParams = {
             margins: props.getYDomainMargins ? props.getYDomainMargins(containerHeight) : margins,
             containerWidth: containerWidth,
@@ -253,31 +260,34 @@ const CartesianChart = /*#__PURE__*/ _react.forwardRef(({ hideTickOverlap = true
         }
         _yAxisTickText.current = axisData.yAxisTickText;
         props.getAxisData && props.getAxisData(axisData);
-        // Removing un wanted tooltip div from DOM, when prop not provided, for proper cleanup
-        // of unwanted DOM elements, to prevent flacky behaviour in tooltips , that might occur
-        // in creating tooltips when tooltips are enabled( as we try to recreate a tspan with _tooltipId)
-        if (!props.showYAxisLablesTooltip) {
-            try {
-                document.getElementById(_tooltipId) && document.getElementById(_tooltipId).remove();
-            //eslint-disable-next-line no-empty
-            } catch (e) {}
+        // Removing previously created tooltips.
+        try {
+            // eslint-disable-next-line @nx/workspace-no-restricted-globals
+            document.getElementById(_tooltipId) && document.getElementById(_tooltipId).remove();
+        // eslint-disable-next-line no-empty
+        } catch (e) {}
+        // Used to display tooltip at x axis labels.
+        if (props.showXAxisLablesTooltip || ((_props_xAxis2 = props.xAxis) === null || _props_xAxis2 === void 0 ? void 0 : _props_xAxis2.tickLayout) === 'auto') {
+            const _xAxisElement = xAxisElement.current ? (0, _d3selection.select)(xAxisElement.current).call(xScale) : null;
+            const tooltipProps = {
+                tooltipCls: classes.tooltip,
+                id: _tooltipId,
+                axis: _xAxisElement,
+                container: chartContainer.current
+            };
+            _xAxisElement && (0, _index.tooltipOfAxislabels)(tooltipProps);
         }
         // Used to display tooltip at y axis labels.
         if (props.showYAxisLablesTooltip) {
             // To create y axis tick values by if specified truncating the rest of the text
             // and showing elipsis or showing the whole string,
-            yScalePrimary && // Note: This function should be invoked within the showYAxisLablesTooltip check,
-            // as its sole purpose is to truncate labels that exceed the noOfCharsToTruncate limit.
-            (0, _index.createYAxisLabels)(yAxisElement.current, yScalePrimary, props.noOfCharsToTruncate || 4, props.showYAxisLablesTooltip || false, _useRtl);
-            const _yAxisElement = (0, _d3selection.select)(yAxisElement.current).call(yScalePrimary);
-            try {
-                document.getElementById(_tooltipId) && document.getElementById(_tooltipId).remove();
-            //eslint-disable-next-line no-empty
-            } catch (e) {}
+            yScalePrimary && (0, _index.createYAxisLabels)(yAxisElement.current, yScalePrimary, props.noOfCharsToTruncate || 4, props.showYAxisLablesTooltip || false, _useRtl);
+            const _yAxisElement = yAxisElement.current ? (0, _d3selection.select)(yAxisElement.current).call(yScalePrimary) : null;
             const ytooltipProps = {
                 tooltipCls: classes.tooltip,
                 id: _tooltipId,
-                axis: _yAxisElement
+                axis: _yAxisElement,
+                container: chartContainer.current
             };
             _yAxisElement && (0, _index.tooltipOfAxislabels)(ytooltipProps);
         }
@@ -364,8 +374,8 @@ const CartesianChart = /*#__PURE__*/ _react.forwardRef(({ hideTickOverlap = true
     }
     function _calculateChartMinWidth() {
         // Adding 10px for padding on both sides
-        const labelWidth = _calcMaxLabelWidthWithTransform(_tickValues) + 10;
-        let minChartWidth = margins.left + margins.right + labelWidth * (_tickValues.length - 1);
+        const labelWidth = _calcMaxLabelWidthWithTransform(_tickLabels) + 10;
+        let minChartWidth = margins.left + margins.right + labelWidth * (_tickLabels.length - 1);
         if ([
             _index.ChartTypes.GroupedVerticalBarChart,
             _index.ChartTypes.VerticalBarChart,
@@ -376,6 +386,12 @@ const CartesianChart = /*#__PURE__*/ _react.forwardRef(({ hideTickOverlap = true
         }
         return minChartWidth;
     }
+    function _getChartDescription() {
+        return (props.chartTitle || 'Chart. ') + _getAxisTitle('X', props.xAxisTitle, props.xAxisType) + _getAxisTitle('Y', props.yAxisTitle, props.yAxisType || _index.YAxisType.NumericAxis) + (props.secondaryYScaleOptions ? _getAxisTitle('secondary Y', props.secondaryYAxistitle, _index.YAxisType.NumericAxis) : '');
+    }
+    function _getAxisTitle(axisLabel, axisTitle, axisType) {
+        return `The ${axisLabel} axis displays ` + (axisTitle || (axisType === _index.XAxisTypes.StringAxis || axisType === _index.YAxisType.StringAxis ? 'categories' : axisType === _index.XAxisTypes.DateAxis || axisType === _index.YAxisType.DateAxis ? 'time' : 'values')) + '. ';
+    }
     function _calcMaxLabelWidthWithTransform(x) {
         // Case: rotated labels
         if (!props.wrapXAxisLables && props.rotateXAxisLables && props.xAxisType === _index.XAxisTypes.StringAxis) {
@@ -384,11 +400,11 @@ const CartesianChart = /*#__PURE__*/ _react.forwardRef(({ hideTickOverlap = true
         }
         // Case: truncated labels
         if (props.showXAxisLablesTooltip) {
-            const tickValues = x.map((val)=>{
+            const tickLabels = x.map((val)=>{
                 const numChars = props.noOfCharsToTruncate || 4;
                 return val.toString().length > numChars ? `${val.toString().slice(0, numChars)}...` : val;
             });
-            const longestLabelWidth = (0, _index.calculateLongestLabelWidth)(tickValues, `.${classes.xAxis} text`);
+            const longestLabelWidth = (0, _index.calculateLongestLabelWidth)(tickLabels, `.${classes.xAxis} text`);
             return Math.ceil(longestLabelWidth);
         }
         // Case: wrapped labels
@@ -430,7 +446,8 @@ const CartesianChart = /*#__PURE__*/ _react.forwardRef(({ hideTickOverlap = true
                 xAxis: _xScale,
                 showXAxisLablesTooltip: props.showXAxisLablesTooltip || false,
                 noOfCharsToTruncate: props.noOfCharsToTruncate || 4,
-                width: maxXAxisLabelWidth
+                width: maxXAxisLabelWidth,
+                container: chartContainer.current
             };
             var _createWrapOfXLabels;
             _removalValueForTextTuncate = (_createWrapOfXLabels = (0, _index.createWrapOfXLabels)(wrapLabelProps)) !== null && _createWrapOfXLabels !== void 0 ? _createWrapOfXLabels : 0;
@@ -537,7 +554,8 @@ const CartesianChart = /*#__PURE__*/ _react.forwardRef(({ hideTickOverlap = true
     }, _isFirstRender.current, /*#__PURE__*/ _react.createElement("svg", {
         width: svgDimensions.width,
         height: svgDimensions.height,
-        "aria-label": props.chartTitle,
+        role: "region",
+        "aria-label": _getChartDescription(),
         style: {
             display: 'block'
         },