@fluentui/react-charting 5.24.5 → 5.24.7

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (134) hide show
  1. package/CHANGELOG.json +43 -1
  2. package/CHANGELOG.md +22 -2
  3. package/dist/react-charting.js +1 -1
  4. package/dist/react-charting.min.js +1 -1
  5. package/lib/components/AreaChart/AreaChart.styles.js +2 -2
  6. package/lib/components/AreaChart/AreaChart.styles.js.map +1 -1
  7. package/lib/components/CommonComponents/CartesianChart.base.d.ts +3 -2
  8. package/lib/components/CommonComponents/CartesianChart.base.js +134 -112
  9. package/lib/components/CommonComponents/CartesianChart.base.js.map +1 -1
  10. package/lib/components/CommonComponents/CartesianChart.styles.js +35 -62
  11. package/lib/components/CommonComponents/CartesianChart.styles.js.map +1 -1
  12. package/lib/components/DeclarativeChart/PlotlySchemaAdapter.js +13 -10
  13. package/lib/components/DeclarativeChart/PlotlySchemaAdapter.js.map +1 -1
  14. package/lib/components/DonutChart/DonutChart.styles.js +2 -18
  15. package/lib/components/DonutChart/DonutChart.styles.js.map +1 -1
  16. package/lib/components/GroupedVerticalBarChart/GroupedVerticalBarChart.base.js +15 -24
  17. package/lib/components/GroupedVerticalBarChart/GroupedVerticalBarChart.base.js.map +1 -1
  18. package/lib/components/GroupedVerticalBarChart/GroupedVerticalBarChart.styles.js +3 -14
  19. package/lib/components/GroupedVerticalBarChart/GroupedVerticalBarChart.styles.js.map +1 -1
  20. package/lib/components/LineChart/LineChart.styles.js +3 -11
  21. package/lib/components/LineChart/LineChart.styles.js.map +1 -1
  22. package/lib/components/SankeyChart/SankeyChart.styles.js +2 -1
  23. package/lib/components/SankeyChart/SankeyChart.styles.js.map +1 -1
  24. package/lib/components/ScatterChart/ScatterChart.styles.js +3 -14
  25. package/lib/components/ScatterChart/ScatterChart.styles.js.map +1 -1
  26. package/lib/components/VerticalBarChart/VerticalBarChart.base.js +14 -12
  27. package/lib/components/VerticalBarChart/VerticalBarChart.base.js.map +1 -1
  28. package/lib/components/VerticalBarChart/VerticalBarChart.styles.js +3 -14
  29. package/lib/components/VerticalBarChart/VerticalBarChart.styles.js.map +1 -1
  30. package/lib/components/VerticalStackedBarChart/VerticalStackedBarChart.base.js +13 -17
  31. package/lib/components/VerticalStackedBarChart/VerticalStackedBarChart.base.js.map +1 -1
  32. package/lib/components/VerticalStackedBarChart/VerticalStackedBarChart.styles.js +3 -14
  33. package/lib/components/VerticalStackedBarChart/VerticalStackedBarChart.styles.js.map +1 -1
  34. package/lib/utilities/Common.styles.d.ts +6 -0
  35. package/lib/utilities/Common.styles.js +51 -0
  36. package/lib/utilities/Common.styles.js.map +1 -0
  37. package/lib/utilities/SVGTooltipText.d.ts +1 -1
  38. package/lib/utilities/SVGTooltipText.js.map +1 -1
  39. package/lib/utilities/index.d.ts +1 -0
  40. package/lib/utilities/index.js +1 -0
  41. package/lib/utilities/index.js.map +1 -1
  42. package/lib/utilities/utilities.d.ts +3 -0
  43. package/lib/utilities/utilities.js +25 -38
  44. package/lib/utilities/utilities.js.map +1 -1
  45. package/lib/utilities/vbc-utils.d.ts +18 -0
  46. package/lib/utilities/vbc-utils.js +29 -0
  47. package/lib/utilities/vbc-utils.js.map +1 -1
  48. package/lib-amd/components/AreaChart/AreaChart.styles.js +2 -2
  49. package/lib-amd/components/AreaChart/AreaChart.styles.js.map +1 -1
  50. package/lib-amd/components/CommonComponents/CartesianChart.base.d.ts +3 -2
  51. package/lib-amd/components/CommonComponents/CartesianChart.base.js +133 -111
  52. package/lib-amd/components/CommonComponents/CartesianChart.base.js.map +1 -1
  53. package/lib-amd/components/CommonComponents/CartesianChart.styles.js +33 -61
  54. package/lib-amd/components/CommonComponents/CartesianChart.styles.js.map +1 -1
  55. package/lib-amd/components/DeclarativeChart/PlotlySchemaAdapter.js +13 -10
  56. package/lib-amd/components/DeclarativeChart/PlotlySchemaAdapter.js.map +1 -1
  57. package/lib-amd/components/DonutChart/DonutChart.styles.js +2 -17
  58. package/lib-amd/components/DonutChart/DonutChart.styles.js.map +1 -1
  59. package/lib-amd/components/GroupedVerticalBarChart/GroupedVerticalBarChart.base.js +14 -23
  60. package/lib-amd/components/GroupedVerticalBarChart/GroupedVerticalBarChart.base.js.map +1 -1
  61. package/lib-amd/components/GroupedVerticalBarChart/GroupedVerticalBarChart.styles.js +3 -13
  62. package/lib-amd/components/GroupedVerticalBarChart/GroupedVerticalBarChart.styles.js.map +1 -1
  63. package/lib-amd/components/LineChart/LineChart.styles.js +3 -10
  64. package/lib-amd/components/LineChart/LineChart.styles.js.map +1 -1
  65. package/lib-amd/components/SankeyChart/SankeyChart.styles.js +2 -2
  66. package/lib-amd/components/SankeyChart/SankeyChart.styles.js.map +1 -1
  67. package/lib-amd/components/ScatterChart/ScatterChart.styles.js +3 -13
  68. package/lib-amd/components/ScatterChart/ScatterChart.styles.js.map +1 -1
  69. package/lib-amd/components/VerticalBarChart/VerticalBarChart.base.js +13 -11
  70. package/lib-amd/components/VerticalBarChart/VerticalBarChart.base.js.map +1 -1
  71. package/lib-amd/components/VerticalBarChart/VerticalBarChart.styles.js +3 -13
  72. package/lib-amd/components/VerticalBarChart/VerticalBarChart.styles.js.map +1 -1
  73. package/lib-amd/components/VerticalStackedBarChart/VerticalStackedBarChart.base.js +12 -16
  74. package/lib-amd/components/VerticalStackedBarChart/VerticalStackedBarChart.base.js.map +1 -1
  75. package/lib-amd/components/VerticalStackedBarChart/VerticalStackedBarChart.styles.js +3 -13
  76. package/lib-amd/components/VerticalStackedBarChart/VerticalStackedBarChart.styles.js.map +1 -1
  77. package/lib-amd/utilities/Common.styles.d.ts +6 -0
  78. package/lib-amd/utilities/Common.styles.js +57 -0
  79. package/lib-amd/utilities/Common.styles.js.map +1 -0
  80. package/lib-amd/utilities/SVGTooltipText.d.ts +1 -1
  81. package/lib-amd/utilities/SVGTooltipText.js.map +1 -1
  82. package/lib-amd/utilities/index.d.ts +1 -0
  83. package/lib-amd/utilities/index.js +2 -1
  84. package/lib-amd/utilities/index.js.map +1 -1
  85. package/lib-amd/utilities/utilities.d.ts +3 -0
  86. package/lib-amd/utilities/utilities.js +26 -39
  87. package/lib-amd/utilities/utilities.js.map +1 -1
  88. package/lib-amd/utilities/vbc-utils.d.ts +18 -0
  89. package/lib-amd/utilities/vbc-utils.js +34 -1
  90. package/lib-amd/utilities/vbc-utils.js.map +1 -1
  91. package/lib-commonjs/components/AreaChart/AreaChart.styles.js +2 -2
  92. package/lib-commonjs/components/AreaChart/AreaChart.styles.js.map +1 -1
  93. package/lib-commonjs/components/CommonComponents/CartesianChart.base.d.ts +3 -2
  94. package/lib-commonjs/components/CommonComponents/CartesianChart.base.js +133 -111
  95. package/lib-commonjs/components/CommonComponents/CartesianChart.base.js.map +1 -1
  96. package/lib-commonjs/components/CommonComponents/CartesianChart.styles.js +33 -60
  97. package/lib-commonjs/components/CommonComponents/CartesianChart.styles.js.map +1 -1
  98. package/lib-commonjs/components/DeclarativeChart/PlotlySchemaAdapter.js +13 -10
  99. package/lib-commonjs/components/DeclarativeChart/PlotlySchemaAdapter.js.map +1 -1
  100. package/lib-commonjs/components/DonutChart/DonutChart.styles.js +2 -18
  101. package/lib-commonjs/components/DonutChart/DonutChart.styles.js.map +1 -1
  102. package/lib-commonjs/components/GroupedVerticalBarChart/GroupedVerticalBarChart.base.js +14 -23
  103. package/lib-commonjs/components/GroupedVerticalBarChart/GroupedVerticalBarChart.base.js.map +1 -1
  104. package/lib-commonjs/components/GroupedVerticalBarChart/GroupedVerticalBarChart.styles.js +3 -14
  105. package/lib-commonjs/components/GroupedVerticalBarChart/GroupedVerticalBarChart.styles.js.map +1 -1
  106. package/lib-commonjs/components/LineChart/LineChart.styles.js +3 -11
  107. package/lib-commonjs/components/LineChart/LineChart.styles.js.map +1 -1
  108. package/lib-commonjs/components/SankeyChart/SankeyChart.styles.js +2 -1
  109. package/lib-commonjs/components/SankeyChart/SankeyChart.styles.js.map +1 -1
  110. package/lib-commonjs/components/ScatterChart/ScatterChart.styles.js +3 -14
  111. package/lib-commonjs/components/ScatterChart/ScatterChart.styles.js.map +1 -1
  112. package/lib-commonjs/components/VerticalBarChart/VerticalBarChart.base.js +13 -11
  113. package/lib-commonjs/components/VerticalBarChart/VerticalBarChart.base.js.map +1 -1
  114. package/lib-commonjs/components/VerticalBarChart/VerticalBarChart.styles.js +3 -14
  115. package/lib-commonjs/components/VerticalBarChart/VerticalBarChart.styles.js.map +1 -1
  116. package/lib-commonjs/components/VerticalStackedBarChart/VerticalStackedBarChart.base.js +12 -16
  117. package/lib-commonjs/components/VerticalStackedBarChart/VerticalStackedBarChart.base.js.map +1 -1
  118. package/lib-commonjs/components/VerticalStackedBarChart/VerticalStackedBarChart.styles.js +3 -14
  119. package/lib-commonjs/components/VerticalStackedBarChart/VerticalStackedBarChart.styles.js.map +1 -1
  120. package/lib-commonjs/utilities/Common.styles.d.ts +6 -0
  121. package/lib-commonjs/utilities/Common.styles.js +58 -0
  122. package/lib-commonjs/utilities/Common.styles.js.map +1 -0
  123. package/lib-commonjs/utilities/SVGTooltipText.d.ts +1 -1
  124. package/lib-commonjs/utilities/SVGTooltipText.js.map +1 -1
  125. package/lib-commonjs/utilities/index.d.ts +1 -0
  126. package/lib-commonjs/utilities/index.js +1 -0
  127. package/lib-commonjs/utilities/index.js.map +1 -1
  128. package/lib-commonjs/utilities/utilities.d.ts +3 -0
  129. package/lib-commonjs/utilities/utilities.js +27 -40
  130. package/lib-commonjs/utilities/utilities.js.map +1 -1
  131. package/lib-commonjs/utilities/vbc-utils.d.ts +18 -0
  132. package/lib-commonjs/utilities/vbc-utils.js +34 -1
  133. package/lib-commonjs/utilities/vbc-utils.js.map +1 -1
  134. package/package.json +1 -1
@@ -0,0 +1,51 @@
1
+ import { __assign } from "tslib";
2
+ import { FontSizes, FontWeights, HighContrastSelector } from '@fluentui/react/lib/Styling';
3
+ import { NeutralColors } from '@fluentui/react';
4
+ export var getTooltipStyle = function (theme) {
5
+ return __assign(__assign({}, theme.fonts.medium), { display: 'flex', flexDirection: 'column', padding: '8px', position: 'absolute', textAlign: 'center', top: '0px', background: theme.semanticColors.bodyBackground, borderRadius: '2px', pointerEvents: 'none', color: theme.semanticColors.bodyText });
6
+ };
7
+ export var getAxisTitleStyle = function (theme, font) {
8
+ var _a;
9
+ return [
10
+ font,
11
+ (_a = {
12
+ textAlign: 'center',
13
+ fontWeight: FontWeights.semibold,
14
+ fontStyle: 'normal',
15
+ lineHeight: FontSizes.medium,
16
+ color: NeutralColors.gray160,
17
+ fill: theme.semanticColors.bodyText
18
+ },
19
+ _a[HighContrastSelector] = {
20
+ fill: 'CanvasText',
21
+ },
22
+ _a),
23
+ ];
24
+ };
25
+ export var getBarLabelStyle = function (theme) {
26
+ var _a;
27
+ return {
28
+ fontSize: FontSizes.small,
29
+ fontWeight: FontWeights.semibold,
30
+ fill: theme.palette.neutralPrimary,
31
+ selectors: (_a = {},
32
+ _a[HighContrastSelector] = {
33
+ fill: 'CanvasText',
34
+ },
35
+ _a),
36
+ };
37
+ };
38
+ export var getMarkerLabelStyle = function (theme) {
39
+ var _a;
40
+ return {
41
+ fontSize: FontSizes.medium,
42
+ fill: theme.semanticColors.bodyText,
43
+ textAnchor: 'middle',
44
+ selectors: (_a = {},
45
+ _a[HighContrastSelector] = {
46
+ fill: 'CanvasText',
47
+ },
48
+ _a),
49
+ };
50
+ };
51
+ //# sourceMappingURL=Common.styles.js.map
@@ -0,0 +1 @@
1
+ {"version":3,"file":"Common.styles.js","sourceRoot":"../src/","sources":["utilities/Common.styles.ts"],"names":[],"mappings":";AAEA,OAAO,EAAE,SAAS,EAAE,WAAW,EAAE,oBAAoB,EAAE,MAAM,6BAA6B,CAAC;AAC3F,OAAO,EAAE,aAAa,EAAE,MAAM,iBAAiB,CAAC;AAEhD,MAAM,CAAC,IAAM,eAAe,GAAG,UAAC,KAAa;IAC3C,6BACK,KAAK,CAAC,KAAK,CAAC,MAAM,KACrB,OAAO,EAAE,MAAM,EACf,aAAa,EAAE,QAAQ,EACvB,OAAO,EAAE,KAAK,EACd,QAAQ,EAAE,UAAU,EACpB,SAAS,EAAE,QAAQ,EACnB,GAAG,EAAE,KAAK,EACV,UAAU,EAAE,KAAK,CAAC,cAAc,CAAC,cAAc,EAC/C,YAAY,EAAE,KAAK,EACnB,aAAa,EAAE,MAAM,EACrB,KAAK,EAAE,KAAK,CAAC,cAAc,CAAC,QAAQ,IACpC;AACJ,CAAC,CAAC;AAEF,MAAM,CAAC,IAAM,iBAAiB,GAAG,UAAC,KAAa,EAAE,IAAe;;IAC9D,OAAO;QACL,IAAI;;gBAEF,SAAS,EAAE,QAAQ;gBACnB,UAAU,EAAE,WAAW,CAAC,QAAQ;gBAChC,SAAS,EAAE,QAAQ;gBACnB,UAAU,EAAE,SAAS,CAAC,MAAM;gBAC5B,KAAK,EAAE,aAAa,CAAC,OAAO;gBAC5B,IAAI,EAAE,KAAK,CAAC,cAAc,CAAC,QAAQ;;YACnC,GAAC,oBAAoB,IAAG;gBACtB,IAAI,EAAE,YAAY;aACnB;;KAEJ,CAAC;AACJ,CAAC,CAAC;AAEF,MAAM,CAAC,IAAM,gBAAgB,GAAG,UAAC,KAAa;;IAC5C,OAAO;QACL,QAAQ,EAAE,SAAS,CAAC,KAAK;QACzB,UAAU,EAAE,WAAW,CAAC,QAAQ;QAChC,IAAI,EAAE,KAAK,CAAC,OAAO,CAAC,cAAc;QAClC,SAAS;YACP,GAAC,oBAAoB,IAAG;gBACtB,IAAI,EAAE,YAAY;aACnB;eACF;KACF,CAAC;AACJ,CAAC,CAAC;AAEF,MAAM,CAAC,IAAM,mBAAmB,GAAG,UAAC,KAAa;;IAC/C,OAAO;QACL,QAAQ,EAAE,SAAS,CAAC,MAAM;QAC1B,IAAI,EAAE,KAAK,CAAC,cAAc,CAAC,QAAQ;QACnC,UAAU,EAAE,QAAQ;QACpB,SAAS;YACP,GAAC,oBAAoB,IAAG;gBACtB,IAAI,EAAE,YAAY;aACnB;eACF;KACF,CAAC;AACJ,CAAC,CAAC","sourcesContent":["import { IStyle, ITheme } from '@fluentui/react/lib/Styling';\nimport type { IRawStyle } from '@fluentui/merge-styles';\nimport { FontSizes, FontWeights, HighContrastSelector } from '@fluentui/react/lib/Styling';\nimport { NeutralColors } from '@fluentui/react';\n\nexport const getTooltipStyle = (theme: ITheme): IStyle => {\n return {\n ...theme.fonts.medium,\n display: 'flex',\n flexDirection: 'column',\n padding: '8px',\n position: 'absolute',\n textAlign: 'center',\n top: '0px',\n background: theme.semanticColors.bodyBackground,\n borderRadius: '2px',\n pointerEvents: 'none',\n color: theme.semanticColors.bodyText,\n };\n};\n\nexport const getAxisTitleStyle = (theme: ITheme, font: IRawStyle): IStyle => {\n return [\n font,\n {\n textAlign: 'center',\n fontWeight: FontWeights.semibold,\n fontStyle: 'normal',\n lineHeight: FontSizes.medium,\n color: NeutralColors.gray160,\n fill: theme.semanticColors.bodyText,\n [HighContrastSelector]: {\n fill: 'CanvasText',\n },\n },\n ];\n};\n\nexport const getBarLabelStyle = (theme: ITheme): IStyle => {\n return {\n fontSize: FontSizes.small,\n fontWeight: FontWeights.semibold,\n fill: theme.palette.neutralPrimary,\n selectors: {\n [HighContrastSelector]: {\n fill: 'CanvasText',\n },\n },\n };\n};\n\nexport const getMarkerLabelStyle = (theme: ITheme): IStyle => {\n return {\n fontSize: FontSizes.medium,\n fill: theme.semanticColors.bodyText,\n textAnchor: 'middle',\n selectors: {\n [HighContrastSelector]: {\n fill: 'CanvasText',\n },\n },\n };\n};\n"]}
@@ -1,7 +1,7 @@
1
1
  import * as React from 'react';
2
2
  import { ITooltipHost, ITooltipProps, TooltipDelay } from '@fluentui/react/lib/Tooltip';
3
3
  import { ITheme } from '@fluentui/react';
4
- interface ISVGTooltipTextProps {
4
+ export interface ISVGTooltipTextProps {
5
5
  /**
6
6
  * Number of milliseconds to delay closing the tooltip, so that the user has time to hover over
7
7
  * the tooltip and interact with it. Hovering over the tooltip will count as hovering over the
@@ -1 +1 @@
1
- {"version":3,"file":"SVGTooltipText.js","sourceRoot":"../src/","sources":["utilities/SVGTooltipText.tsx"],"names":[],"mappings":"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","sourcesContent":["import * as React from 'react';\nimport { ITooltipHost, ITooltipProps, Tooltip, TooltipDelay } from '@fluentui/react/lib/Tooltip';\nimport { Async, KeyCodes, getId, portalContainsElement } from '../Utilities';\nimport { ITheme } from '@fluentui/react';\n\ninterface ISVGTooltipTextProps {\n /**\n * Number of milliseconds to delay closing the tooltip, so that the user has time to hover over\n * the tooltip and interact with it. Hovering over the tooltip will count as hovering over the\n * host, so that the tooltip will stay open if the user is actively interacting with it.\n */\n closeDelay?: number;\n\n /**\n * Content to display in the Tooltip.\n */\n content?: string;\n\n /**\n * Length of delay before showing the tooltip on hover.\n * @defaultvalue TooltipDelay.medium\n */\n delay?: TooltipDelay;\n\n /**\n * Additional properties to pass through for Tooltip.\n */\n tooltipProps?: ITooltipProps;\n\n /**\n * Additional properties to pass through for SVG <text>.\n */\n textProps?: React.SVGAttributes<SVGTextElement>;\n\n /**\n * Max width of text\n */\n maxWidth?: number;\n\n /**\n * Max height of text\n */\n maxHeight?: number;\n\n /**\n * Pass false to make prevent the tooptip from receiving focus through keyboard\n * Eg: In Pie Chart, the focus should only land on the arcs and not on the text to\n * avoid repitition of the same datapoint\n * @defaultvalue true\n */\n shouldReceiveFocus?: boolean;\n\n /**\n * Pass true to show tooltip directly\n * Eg: In Pie Chart, the tooltip is shown when the arc is focussed, so the prop is set to true,\n * to directly show the tooltip from this component\n * @defaultvalue false\n */\n isTooltipVisibleProp?: boolean;\n\n /**\n * Function to wrap text within specified width and height\n * and return a boolean value indicating whether the text overflowed\n */\n wrapContent?: (content: string, id: string, maxWidth: number, maxHeight?: number) => boolean;\n\n /**\n * Theme provided by High Order Component\n */\n theme?: ITheme;\n\n /**\n * @default false\n * Prop to selectively display the tooltip background\n */\n showBackground?: boolean;\n\n /**\n * Prop to set classname\n */\n className?: string;\n}\n\ninterface ISVGTooltipTextState {\n isTooltipVisible: boolean;\n isOverflowing: boolean;\n textX?: number;\n textY?: number;\n textWidth?: number;\n textHeight?: number;\n}\n\nconst PADDING = 3;\n\n/**\n * Component to render an SVG text element with an optional tooltip.\n * The tooltip appears on hovering and focusing the element when its content overflows.\n */\nexport class SVGTooltipText\n extends React.Component<ISVGTooltipTextProps, ISVGTooltipTextState>\n implements ITooltipHost\n{\n public static defaultProps = {\n delay: TooltipDelay.medium,\n };\n\n private static _currentVisibleTooltip: ITooltipHost | undefined;\n\n /** The element that gets the hover events */\n private _tooltipHost = React.createRef<SVGTextElement>();\n\n private _async: Async;\n private _dismissTimerId: number;\n private _openTimerId: number;\n private _tooltipHostId = getId('tooltip-host');\n private _ignoreNextFocusEvent: boolean;\n\n constructor(props: ISVGTooltipTextProps) {\n super(props);\n\n this.state = {\n isTooltipVisible: false,\n isOverflowing: false,\n };\n\n this._async = new Async(this);\n }\n\n public render(): React.ReactNode {\n const { content, tooltipProps, textProps, shouldReceiveFocus = true, showBackground = false } = this.props;\n const { isTooltipVisible, textWidth, textHeight } = this.state;\n const tooltipRenderProps: ITooltipProps = {\n content,\n targetElement: this._getTargetElement(),\n calloutProps: {\n onDismiss: this._hideTooltip,\n onMouseEnter: this._onTooltipMouseEnter,\n onMouseLeave: this._onTooltipMouseLeave,\n },\n onMouseEnter: this._onTooltipMouseEnter,\n onMouseLeave: this._onTooltipMouseLeave,\n ...tooltipProps,\n };\n\n const showTooltip =\n (!!this.props.isTooltipVisibleProp && this.state.isOverflowing && !!content) || (isTooltipVisible && !!content);\n const rectX = (typeof textProps?.x === 'number' ? textProps.x : 0) - (textWidth ?? 0) / 2 - PADDING;\n const rectY = (typeof textProps?.y === 'number' ? textProps.y : 0) - (textHeight ?? 0) / 2 - 2 * PADDING;\n return (\n <>\n {showBackground && (\n <rect\n x={rectX}\n y={rectY}\n width={(textWidth ?? 0) + 2 * PADDING}\n height={(textHeight ?? 0) + PADDING}\n transform={textProps?.transform}\n className={this.props.className}\n />\n )}\n <text\n {...textProps}\n id={this._tooltipHostId}\n ref={this._tooltipHost}\n onFocusCapture={this._onTooltipFocus}\n onBlurCapture={this._onTooltipBlur}\n onMouseEnter={this._onTooltipMouseEnter}\n onMouseLeave={this._onTooltipMouseLeave}\n onKeyDown={this._onTooltipKeyDown}\n data-is-focusable={shouldReceiveFocus && this.state.isOverflowing}\n >\n {content}\n </text>\n {showTooltip && <Tooltip {...tooltipRenderProps} />}\n </>\n );\n }\n\n public componentDidMount(): void {\n this._wrapContent();\n this._measureText();\n }\n\n public componentDidUpdate(prevProps: Readonly<ISVGTooltipTextProps>): void {\n if (this.props.maxWidth !== prevProps.maxWidth || this.props.maxHeight !== prevProps.maxHeight) {\n this._wrapContent();\n this._measureText();\n }\n }\n\n public componentWillUnmount(): void {\n if (SVGTooltipText._currentVisibleTooltip && SVGTooltipText._currentVisibleTooltip === this) {\n SVGTooltipText._currentVisibleTooltip = undefined;\n }\n\n this._async.dispose();\n }\n\n public show = (): void => {\n this._toggleTooltip(true);\n };\n\n public dismiss = (): void => {\n this._hideTooltip();\n };\n\n private _measureText = (): void => {\n if (this._tooltipHost.current && typeof this._tooltipHost.current.getBBox === 'function') {\n const bbox = this._tooltipHost.current.getBBox();\n this.setState({\n textX: bbox.x,\n textY: bbox.y,\n textWidth: bbox.width,\n textHeight: bbox.height,\n });\n }\n };\n\n private _getTargetElement = (): HTMLElement | undefined => {\n if (!this._tooltipHost.current) {\n return undefined;\n }\n\n return this._tooltipHost.current as unknown as HTMLElement;\n };\n\n private _onTooltipFocus = (ev: React.FocusEvent<SVGElement>) => {\n if (this._ignoreNextFocusEvent) {\n this._ignoreNextFocusEvent = false;\n return;\n }\n\n this._onTooltipMouseEnter(ev);\n };\n\n private _onTooltipBlur = (ev: React.FocusEvent<SVGElement>) => {\n // The focused element gets a blur event when the document loses focus\n // (e.g. switching tabs in the browser), but we don't want to show the\n // tooltip again when the document gets focus back. Handle this case by\n // checking if the blurred element is still the document's activeElement,\n // and ignoring when it next gets focus back.\n // See https://github.com/microsoft/fluentui/issues/13541\n this._ignoreNextFocusEvent = document?.activeElement === ev.target;\n\n this._dismissTimerId = this._async.setTimeout(() => {\n this._hideTooltip();\n }, 0);\n };\n\n // eslint-disable-next-line @typescript-eslint/no-explicit-any\n private _onTooltipMouseEnter = (ev: any): void => {\n const { delay } = this.props;\n\n if (SVGTooltipText._currentVisibleTooltip && SVGTooltipText._currentVisibleTooltip !== this) {\n SVGTooltipText._currentVisibleTooltip.dismiss();\n }\n SVGTooltipText._currentVisibleTooltip = this;\n\n if (!this.state.isOverflowing) {\n return;\n }\n\n if (ev.target && portalContainsElement(ev.target as HTMLElement, this._getTargetElement())) {\n // Do not show tooltip when target is inside a portal relative to TooltipHost.\n return;\n }\n\n this._clearDismissTimer();\n this._clearOpenTimer();\n\n if (delay !== TooltipDelay.zero) {\n const delayTime = this._getDelayTime(delay!); // non-null assertion because we set it in `defaultProps`\n\n this._openTimerId = this._async.setTimeout(() => {\n this._toggleTooltip(true);\n }, delayTime);\n } else {\n this._toggleTooltip(true);\n }\n };\n\n // eslint-disable-next-line @typescript-eslint/no-explicit-any\n private _onTooltipMouseLeave = (ev: any): void => {\n const { closeDelay } = this.props;\n\n this._clearDismissTimer();\n this._clearOpenTimer();\n\n if (closeDelay) {\n this._dismissTimerId = this._async.setTimeout(() => {\n this._toggleTooltip(false);\n }, closeDelay);\n } else {\n this._toggleTooltip(false);\n }\n\n if (SVGTooltipText._currentVisibleTooltip === this) {\n SVGTooltipText._currentVisibleTooltip = undefined;\n }\n };\n\n private _onTooltipKeyDown = (ev: React.KeyboardEvent<SVGElement>): void => {\n // eslint-disable-next-line @typescript-eslint/no-deprecated\n if ((ev.which === KeyCodes.escape || ev.ctrlKey) && this.state.isTooltipVisible) {\n this._hideTooltip();\n ev.stopPropagation();\n }\n };\n\n private _clearDismissTimer = (): void => {\n this._async.clearTimeout(this._dismissTimerId);\n };\n\n private _clearOpenTimer = (): void => {\n this._async.clearTimeout(this._openTimerId);\n };\n\n private _hideTooltip = (): void => {\n this._clearOpenTimer();\n this._clearDismissTimer();\n this._toggleTooltip(false);\n };\n\n private _toggleTooltip = (isTooltipVisible: boolean): void => {\n if (this.state.isTooltipVisible !== isTooltipVisible) {\n this.setState({ isTooltipVisible });\n }\n };\n\n private _getDelayTime = (delay: TooltipDelay): number => {\n switch (delay) {\n case TooltipDelay.medium:\n return 300;\n case TooltipDelay.long:\n return 500;\n default:\n return 0;\n }\n };\n\n private _wrapContent = () => {\n const { content, wrapContent, maxWidth = Number.POSITIVE_INFINITY, maxHeight } = this.props;\n\n let isOverflowing = false;\n if (content && wrapContent && wrapContent(content, this._tooltipHostId, maxWidth, maxHeight)) {\n isOverflowing = true;\n }\n\n if (this.state.isOverflowing !== isOverflowing) {\n this.setState({ isOverflowing });\n }\n };\n}\n"]}
1
+ {"version":3,"file":"SVGTooltipText.js","sourceRoot":"../src/","sources":["utilities/SVGTooltipText.tsx"],"names":[],"mappings":"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","sourcesContent":["import * as React from 'react';\nimport { ITooltipHost, ITooltipProps, Tooltip, TooltipDelay } from '@fluentui/react/lib/Tooltip';\nimport { Async, KeyCodes, getId, portalContainsElement } from '../Utilities';\nimport { ITheme } from '@fluentui/react';\n\nexport interface ISVGTooltipTextProps {\n /**\n * Number of milliseconds to delay closing the tooltip, so that the user has time to hover over\n * the tooltip and interact with it. Hovering over the tooltip will count as hovering over the\n * host, so that the tooltip will stay open if the user is actively interacting with it.\n */\n closeDelay?: number;\n\n /**\n * Content to display in the Tooltip.\n */\n content?: string;\n\n /**\n * Length of delay before showing the tooltip on hover.\n * @defaultvalue TooltipDelay.medium\n */\n delay?: TooltipDelay;\n\n /**\n * Additional properties to pass through for Tooltip.\n */\n tooltipProps?: ITooltipProps;\n\n /**\n * Additional properties to pass through for SVG <text>.\n */\n textProps?: React.SVGAttributes<SVGTextElement>;\n\n /**\n * Max width of text\n */\n maxWidth?: number;\n\n /**\n * Max height of text\n */\n maxHeight?: number;\n\n /**\n * Pass false to make prevent the tooptip from receiving focus through keyboard\n * Eg: In Pie Chart, the focus should only land on the arcs and not on the text to\n * avoid repitition of the same datapoint\n * @defaultvalue true\n */\n shouldReceiveFocus?: boolean;\n\n /**\n * Pass true to show tooltip directly\n * Eg: In Pie Chart, the tooltip is shown when the arc is focussed, so the prop is set to true,\n * to directly show the tooltip from this component\n * @defaultvalue false\n */\n isTooltipVisibleProp?: boolean;\n\n /**\n * Function to wrap text within specified width and height\n * and return a boolean value indicating whether the text overflowed\n */\n wrapContent?: (content: string, id: string, maxWidth: number, maxHeight?: number) => boolean;\n\n /**\n * Theme provided by High Order Component\n */\n theme?: ITheme;\n\n /**\n * @default false\n * Prop to selectively display the tooltip background\n */\n showBackground?: boolean;\n\n /**\n * Prop to set classname\n */\n className?: string;\n}\n\ninterface ISVGTooltipTextState {\n isTooltipVisible: boolean;\n isOverflowing: boolean;\n textX?: number;\n textY?: number;\n textWidth?: number;\n textHeight?: number;\n}\n\nconst PADDING = 3;\n\n/**\n * Component to render an SVG text element with an optional tooltip.\n * The tooltip appears on hovering and focusing the element when its content overflows.\n */\nexport class SVGTooltipText\n extends React.Component<ISVGTooltipTextProps, ISVGTooltipTextState>\n implements ITooltipHost\n{\n public static defaultProps = {\n delay: TooltipDelay.medium,\n };\n\n private static _currentVisibleTooltip: ITooltipHost | undefined;\n\n /** The element that gets the hover events */\n private _tooltipHost = React.createRef<SVGTextElement>();\n\n private _async: Async;\n private _dismissTimerId: number;\n private _openTimerId: number;\n private _tooltipHostId = getId('tooltip-host');\n private _ignoreNextFocusEvent: boolean;\n\n constructor(props: ISVGTooltipTextProps) {\n super(props);\n\n this.state = {\n isTooltipVisible: false,\n isOverflowing: false,\n };\n\n this._async = new Async(this);\n }\n\n public render(): React.ReactNode {\n const { content, tooltipProps, textProps, shouldReceiveFocus = true, showBackground = false } = this.props;\n const { isTooltipVisible, textWidth, textHeight } = this.state;\n const tooltipRenderProps: ITooltipProps = {\n content,\n targetElement: this._getTargetElement(),\n calloutProps: {\n onDismiss: this._hideTooltip,\n onMouseEnter: this._onTooltipMouseEnter,\n onMouseLeave: this._onTooltipMouseLeave,\n },\n onMouseEnter: this._onTooltipMouseEnter,\n onMouseLeave: this._onTooltipMouseLeave,\n ...tooltipProps,\n };\n\n const showTooltip =\n (!!this.props.isTooltipVisibleProp && this.state.isOverflowing && !!content) || (isTooltipVisible && !!content);\n const rectX = (typeof textProps?.x === 'number' ? textProps.x : 0) - (textWidth ?? 0) / 2 - PADDING;\n const rectY = (typeof textProps?.y === 'number' ? textProps.y : 0) - (textHeight ?? 0) / 2 - 2 * PADDING;\n return (\n <>\n {showBackground && (\n <rect\n x={rectX}\n y={rectY}\n width={(textWidth ?? 0) + 2 * PADDING}\n height={(textHeight ?? 0) + PADDING}\n transform={textProps?.transform}\n className={this.props.className}\n />\n )}\n <text\n {...textProps}\n id={this._tooltipHostId}\n ref={this._tooltipHost}\n onFocusCapture={this._onTooltipFocus}\n onBlurCapture={this._onTooltipBlur}\n onMouseEnter={this._onTooltipMouseEnter}\n onMouseLeave={this._onTooltipMouseLeave}\n onKeyDown={this._onTooltipKeyDown}\n data-is-focusable={shouldReceiveFocus && this.state.isOverflowing}\n >\n {content}\n </text>\n {showTooltip && <Tooltip {...tooltipRenderProps} />}\n </>\n );\n }\n\n public componentDidMount(): void {\n this._wrapContent();\n this._measureText();\n }\n\n public componentDidUpdate(prevProps: Readonly<ISVGTooltipTextProps>): void {\n if (this.props.maxWidth !== prevProps.maxWidth || this.props.maxHeight !== prevProps.maxHeight) {\n this._wrapContent();\n this._measureText();\n }\n }\n\n public componentWillUnmount(): void {\n if (SVGTooltipText._currentVisibleTooltip && SVGTooltipText._currentVisibleTooltip === this) {\n SVGTooltipText._currentVisibleTooltip = undefined;\n }\n\n this._async.dispose();\n }\n\n public show = (): void => {\n this._toggleTooltip(true);\n };\n\n public dismiss = (): void => {\n this._hideTooltip();\n };\n\n private _measureText = (): void => {\n if (this._tooltipHost.current && typeof this._tooltipHost.current.getBBox === 'function') {\n const bbox = this._tooltipHost.current.getBBox();\n this.setState({\n textX: bbox.x,\n textY: bbox.y,\n textWidth: bbox.width,\n textHeight: bbox.height,\n });\n }\n };\n\n private _getTargetElement = (): HTMLElement | undefined => {\n if (!this._tooltipHost.current) {\n return undefined;\n }\n\n return this._tooltipHost.current as unknown as HTMLElement;\n };\n\n private _onTooltipFocus = (ev: React.FocusEvent<SVGElement>) => {\n if (this._ignoreNextFocusEvent) {\n this._ignoreNextFocusEvent = false;\n return;\n }\n\n this._onTooltipMouseEnter(ev);\n };\n\n private _onTooltipBlur = (ev: React.FocusEvent<SVGElement>) => {\n // The focused element gets a blur event when the document loses focus\n // (e.g. switching tabs in the browser), but we don't want to show the\n // tooltip again when the document gets focus back. Handle this case by\n // checking if the blurred element is still the document's activeElement,\n // and ignoring when it next gets focus back.\n // See https://github.com/microsoft/fluentui/issues/13541\n this._ignoreNextFocusEvent = document?.activeElement === ev.target;\n\n this._dismissTimerId = this._async.setTimeout(() => {\n this._hideTooltip();\n }, 0);\n };\n\n // eslint-disable-next-line @typescript-eslint/no-explicit-any\n private _onTooltipMouseEnter = (ev: any): void => {\n const { delay } = this.props;\n\n if (SVGTooltipText._currentVisibleTooltip && SVGTooltipText._currentVisibleTooltip !== this) {\n SVGTooltipText._currentVisibleTooltip.dismiss();\n }\n SVGTooltipText._currentVisibleTooltip = this;\n\n if (!this.state.isOverflowing) {\n return;\n }\n\n if (ev.target && portalContainsElement(ev.target as HTMLElement, this._getTargetElement())) {\n // Do not show tooltip when target is inside a portal relative to TooltipHost.\n return;\n }\n\n this._clearDismissTimer();\n this._clearOpenTimer();\n\n if (delay !== TooltipDelay.zero) {\n const delayTime = this._getDelayTime(delay!); // non-null assertion because we set it in `defaultProps`\n\n this._openTimerId = this._async.setTimeout(() => {\n this._toggleTooltip(true);\n }, delayTime);\n } else {\n this._toggleTooltip(true);\n }\n };\n\n // eslint-disable-next-line @typescript-eslint/no-explicit-any\n private _onTooltipMouseLeave = (ev: any): void => {\n const { closeDelay } = this.props;\n\n this._clearDismissTimer();\n this._clearOpenTimer();\n\n if (closeDelay) {\n this._dismissTimerId = this._async.setTimeout(() => {\n this._toggleTooltip(false);\n }, closeDelay);\n } else {\n this._toggleTooltip(false);\n }\n\n if (SVGTooltipText._currentVisibleTooltip === this) {\n SVGTooltipText._currentVisibleTooltip = undefined;\n }\n };\n\n private _onTooltipKeyDown = (ev: React.KeyboardEvent<SVGElement>): void => {\n // eslint-disable-next-line @typescript-eslint/no-deprecated\n if ((ev.which === KeyCodes.escape || ev.ctrlKey) && this.state.isTooltipVisible) {\n this._hideTooltip();\n ev.stopPropagation();\n }\n };\n\n private _clearDismissTimer = (): void => {\n this._async.clearTimeout(this._dismissTimerId);\n };\n\n private _clearOpenTimer = (): void => {\n this._async.clearTimeout(this._openTimerId);\n };\n\n private _hideTooltip = (): void => {\n this._clearOpenTimer();\n this._clearDismissTimer();\n this._toggleTooltip(false);\n };\n\n private _toggleTooltip = (isTooltipVisible: boolean): void => {\n if (this.state.isTooltipVisible !== isTooltipVisible) {\n this.setState({ isTooltipVisible });\n }\n };\n\n private _getDelayTime = (delay: TooltipDelay): number => {\n switch (delay) {\n case TooltipDelay.medium:\n return 300;\n case TooltipDelay.long:\n return 500;\n default:\n return 0;\n }\n };\n\n private _wrapContent = () => {\n const { content, wrapContent, maxWidth = Number.POSITIVE_INFINITY, maxHeight } = this.props;\n\n let isOverflowing = false;\n if (content && wrapContent && wrapContent(content, this._tooltipHostId, maxWidth, maxHeight)) {\n isOverflowing = true;\n }\n\n if (this.state.isOverflowing !== isOverflowing) {\n this.setState({ isOverflowing });\n }\n };\n}\n"]}
@@ -1,4 +1,5 @@
1
1
  export * from './ChartHoverCard/index';
2
+ export * from './Common.styles';
2
3
  export * from './utilities';
3
4
  export * from './colors';
4
5
  export * from './gradients';
@@ -1,4 +1,5 @@
1
1
  export * from './ChartHoverCard/index';
2
+ export * from './Common.styles';
2
3
  export * from './utilities';
3
4
  export * from './colors';
4
5
  export * from './gradients';
@@ -1 +1 @@
1
- {"version":3,"file":"index.js","sourceRoot":"../src/","sources":["utilities/index.ts"],"names":[],"mappings":"AAAA,cAAc,wBAAwB,CAAC;AACvC,cAAc,aAAa,CAAC;AAC5B,cAAc,UAAU,CAAC;AACzB,cAAc,aAAa,CAAC;AAC5B,cAAc,aAAa,CAAC","sourcesContent":["export * from './ChartHoverCard/index';\nexport * from './utilities';\nexport * from './colors';\nexport * from './gradients';\nexport * from './vbc-utils';\n"]}
1
+ {"version":3,"file":"index.js","sourceRoot":"../src/","sources":["utilities/index.ts"],"names":[],"mappings":"AAAA,cAAc,wBAAwB,CAAC;AACvC,cAAc,iBAAiB,CAAC;AAChC,cAAc,aAAa,CAAC;AAC5B,cAAc,UAAU,CAAC;AACzB,cAAc,aAAa,CAAC;AAC5B,cAAc,aAAa,CAAC","sourcesContent":["export * from './ChartHoverCard/index';\nexport * from './Common.styles';\nexport * from './utilities';\nexport * from './colors';\nexport * from './gradients';\nexport * from './vbc-utils';\n"]}
@@ -34,6 +34,7 @@ export interface IWrapLabelProps {
34
34
  xAxis: NumericAxis | StringAxis;
35
35
  noOfCharsToTruncate: number;
36
36
  showXAxisLablesTooltip: boolean;
37
+ width?: number;
37
38
  }
38
39
  export interface IRotateLabelProps {
39
40
  node: SVGSVGElement | null;
@@ -84,6 +85,7 @@ export interface IXAxisParams {
84
85
  containerHeight: number;
85
86
  containerWidth: number;
86
87
  hideTickOverlap?: boolean;
88
+ calcMaxLabelWidth: (x: (string | number)[]) => number;
87
89
  }
88
90
  export interface ITickParams {
89
91
  tickValues?: Date[] | number[] | string[];
@@ -219,6 +221,7 @@ export declare function getUnique(arr: {
219
221
  * @param value
220
222
  */
221
223
  export declare function silceOrAppendToArray(array: string[], value: string): string[];
224
+ export declare const DEFAULT_WRAP_WIDTH = 10;
222
225
  /**
223
226
  * This method used for wrapping of x axis labels (tick values).
224
227
  * It breaks down given text value by space separated and calculates the total height needed to display all the words.
@@ -70,7 +70,7 @@ export function defaultYAxisTickFormatter(value) {
70
70
  */
71
71
  export function createNumericXAxis(xAxisParams, tickParams, chartType, culture) {
72
72
  var _a;
73
- var domainNRangeValues = xAxisParams.domainNRangeValues, _b = xAxisParams.showRoundOffXTickValues, showRoundOffXTickValues = _b === void 0 ? true : _b, _c = xAxisParams.xAxistickSize, xAxistickSize = _c === void 0 ? 6 : _c, _d = xAxisParams.tickPadding, tickPadding = _d === void 0 ? 10 : _d, xAxisCount = xAxisParams.xAxisCount, xAxisElement = xAxisParams.xAxisElement, hideTickOverlap = xAxisParams.hideTickOverlap;
73
+ var domainNRangeValues = xAxisParams.domainNRangeValues, _b = xAxisParams.showRoundOffXTickValues, showRoundOffXTickValues = _b === void 0 ? true : _b, _c = xAxisParams.xAxistickSize, xAxistickSize = _c === void 0 ? 6 : _c, _d = xAxisParams.tickPadding, tickPadding = _d === void 0 ? 10 : _d, xAxisCount = xAxisParams.xAxisCount, xAxisElement = xAxisParams.xAxisElement, hideTickOverlap = xAxisParams.hideTickOverlap, calcMaxLabelWidth = xAxisParams.calcMaxLabelWidth;
74
74
  var xAxisScale = d3ScaleLinear()
75
75
  .domain([domainNRangeValues.dStartValue, domainNRangeValues.dEndValue])
76
76
  .range([domainNRangeValues.rStartValue, domainNRangeValues.rEndValue]);
@@ -84,7 +84,7 @@ export function createNumericXAxis(xAxisParams, tickParams, chartType, culture)
84
84
  return formatToLocaleString(xAxisValue, culture);
85
85
  };
86
86
  if (hideTickOverlap && typeof xAxisCount === 'undefined') {
87
- var longestLabelWidth = calculateLongestLabelWidth(xAxisScale.ticks().map(tickFormat), '[class^="xAxis-"] text') + 20;
87
+ var longestLabelWidth = calcMaxLabelWidth(xAxisScale.ticks().map(tickFormat)) + 20;
88
88
  var _e = xAxisScale.range(), start = _e[0], end = _e[1];
89
89
  tickCount = Math.min(Math.max(1, Math.floor(Math.abs(end - start) / longestLabelWidth)), 10);
90
90
  }
@@ -209,7 +209,7 @@ function isPowerOf10(num) {
209
209
  */
210
210
  export function createDateXAxis(xAxisParams, tickParams, culture, options, timeFormatLocale, customDateTimeFormatter, useUTC) {
211
211
  var _a;
212
- var domainNRangeValues = xAxisParams.domainNRangeValues, xAxisElement = xAxisParams.xAxisElement, _b = xAxisParams.tickPadding, tickPadding = _b === void 0 ? 6 : _b, _c = xAxisParams.xAxistickSize, xAxistickSize = _c === void 0 ? 6 : _c, xAxisCount = xAxisParams.xAxisCount;
212
+ var domainNRangeValues = xAxisParams.domainNRangeValues, xAxisElement = xAxisParams.xAxisElement, _b = xAxisParams.tickPadding, tickPadding = _b === void 0 ? 6 : _b, _c = xAxisParams.xAxistickSize, xAxistickSize = _c === void 0 ? 6 : _c, xAxisCount = xAxisParams.xAxisCount, calcMaxLabelWidth = xAxisParams.calcMaxLabelWidth;
213
213
  var xAxisScale = useUTC ? d3ScaleUtc() : d3ScaleTime();
214
214
  xAxisScale
215
215
  .domain([domainNRangeValues.dStartValue, domainNRangeValues.dEndValue])
@@ -247,7 +247,7 @@ export function createDateXAxis(xAxisParams, tickParams, culture, options, timeF
247
247
  }
248
248
  return formatDateToLocaleString(domainValue, culture, useUTC, false, formatOptions);
249
249
  };
250
- var longestLabelWidth = calculateLongestLabelWidth(xAxisScale.ticks().map(tickFormat), '[class^="xAxis-"] text') + 40;
250
+ var longestLabelWidth = calcMaxLabelWidth(xAxisScale.ticks().map(tickFormat)) + 40;
251
251
  var _d = xAxisScale.range(), start = _d[0], end = _d[1];
252
252
  var maxPossibleTickCount = Math.min(Math.max(1, Math.floor(Math.abs(end - start) / longestLabelWidth)), 10);
253
253
  tickCount = Math.min(maxPossibleTickCount, xAxisCount !== null && xAxisCount !== void 0 ? xAxisCount : tickCount);
@@ -274,7 +274,7 @@ export function createDateXAxis(xAxisParams, tickParams, culture, options, timeF
274
274
  */
275
275
  export function createStringXAxis(xAxisParams, tickParams, dataset, culture) {
276
276
  var _a;
277
- var domainNRangeValues = xAxisParams.domainNRangeValues, _b = xAxisParams.xAxistickSize, xAxistickSize = _b === void 0 ? 6 : _b, _c = xAxisParams.tickPadding, tickPadding = _c === void 0 ? 10 : _c, _d = xAxisParams.xAxisPadding, xAxisPadding = _d === void 0 ? 0.1 : _d, xAxisInnerPadding = xAxisParams.xAxisInnerPadding, xAxisOuterPadding = xAxisParams.xAxisOuterPadding, containerWidth = xAxisParams.containerWidth, hideTickOverlap = xAxisParams.hideTickOverlap;
277
+ var domainNRangeValues = xAxisParams.domainNRangeValues, _b = xAxisParams.xAxistickSize, xAxistickSize = _b === void 0 ? 6 : _b, _c = xAxisParams.tickPadding, tickPadding = _c === void 0 ? 10 : _c, _d = xAxisParams.xAxisPadding, xAxisPadding = _d === void 0 ? 0.1 : _d, xAxisInnerPadding = xAxisParams.xAxisInnerPadding, xAxisOuterPadding = xAxisParams.xAxisOuterPadding, containerWidth = xAxisParams.containerWidth, hideTickOverlap = xAxisParams.hideTickOverlap, calcMaxLabelWidth = xAxisParams.calcMaxLabelWidth;
278
278
  var xAxisScale = d3ScaleBand()
279
279
  .domain(dataset)
280
280
  .range([domainNRangeValues.rStartValue, domainNRangeValues.rEndValue])
@@ -286,7 +286,7 @@ export function createStringXAxis(xAxisParams, tickParams, dataset, culture) {
286
286
  // Here, we need the width of each individual label to detect overlaps,
287
287
  // but calculateLongestLabelWidth returns the maximum pixel width from an array of labels.
288
288
  // So call this function separately for each label, instead of the entire array.
289
- var tickSizes = tickValues.map(function (value) { return calculateLongestLabelWidth([value], '[class^="xAxis-"] text'); });
289
+ var tickSizes = tickValues.map(function (value) { return calcMaxLabelWidth([value]); });
290
290
  // for LTR
291
291
  var start = 0;
292
292
  var end = containerWidth;
@@ -397,10 +397,10 @@ export function createNumericYAxis(yAxisParams, isRtl, axisData, isIntegralDatas
397
397
  if (roundedTicks === void 0) { roundedTicks = false; }
398
398
  var _a = yAxisParams.yMinMaxValues, yMinMaxValues = _a === void 0 ? { startValue: 0, endValue: 0 } : _a, _b = yAxisParams.yAxisElement, yAxisElement = _b === void 0 ? null : _b, _c = yAxisParams.yMaxValue, yMaxValue = _c === void 0 ? 0 : _c, _d = yAxisParams.yMinValue, yMinValue = _d === void 0 ? 0 : _d, containerHeight = yAxisParams.containerHeight, containerWidth = yAxisParams.containerWidth, margins = yAxisParams.margins, _e = yAxisParams.tickPadding, tickPadding = _e === void 0 ? 12 : _e, _f = yAxisParams.maxOfYVal, maxOfYVal = _f === void 0 ? 0 : _f, yAxisTickFormat = yAxisParams.yAxisTickFormat, _g = yAxisParams.yAxisTickCount, yAxisTickCount = _g === void 0 ? 4 : _g, eventAnnotationProps = yAxisParams.eventAnnotationProps, eventLabelHeight = yAxisParams.eventLabelHeight;
399
399
  // maxOfYVal coming from only area chart and Grouped vertical bar chart(Calculation done at base file)
400
- var tempVal = maxOfYVal || yMinMaxValues.endValue;
400
+ var tempVal = maxOfYVal || yMinMaxValues.endValue || 0;
401
401
  var finalYmax = tempVal > yMaxValue ? tempVal : yMaxValue;
402
402
  var finalYmin = supportNegativeData
403
- ? Math.min(yMinMaxValues.startValue, yMinValue || 0)
403
+ ? Math.min(yMinMaxValues.startValue || 0, yMinValue || 0)
404
404
  : yMinMaxValues.startValue < yMinValue
405
405
  ? 0
406
406
  : yMinValue;
@@ -550,6 +550,7 @@ export function silceOrAppendToArray(array, value) {
550
550
  return array.slice(0, pos).concat(array.slice(pos + 1));
551
551
  }
552
552
  }
553
+ export var DEFAULT_WRAP_WIDTH = 10;
553
554
  /**
554
555
  * This method used for wrapping of x axis labels (tick values).
555
556
  * It breaks down given text value by space separated and calculates the total height needed to display all the words.
@@ -560,21 +561,19 @@ export function silceOrAppendToArray(array, value) {
560
561
  * @returns
561
562
  */
562
563
  export function createWrapOfXLabels(wrapLabelProps) {
563
- var node = wrapLabelProps.node, xAxis = wrapLabelProps.xAxis, noOfCharsToTruncate = wrapLabelProps.noOfCharsToTruncate, showXAxisLablesTooltip = wrapLabelProps.showXAxisLablesTooltip;
564
+ var node = wrapLabelProps.node, xAxis = wrapLabelProps.xAxis, noOfCharsToTruncate = wrapLabelProps.noOfCharsToTruncate, showXAxisLablesTooltip = wrapLabelProps.showXAxisLablesTooltip, _a = wrapLabelProps.width, width = _a === void 0 ? DEFAULT_WRAP_WIDTH : _a;
564
565
  if (node === null) {
565
566
  return;
566
567
  }
567
568
  var axisNode = d3Select(node).call(xAxis);
568
569
  var removeVal = 0;
569
- var width = 10;
570
- var arr = [];
570
+ var maxLines = 1;
571
571
  axisNode.selectAll('.tick text').each(function () {
572
572
  var text = d3Select(this);
573
573
  var totalWord = text.text();
574
574
  var truncatedWord = "".concat(text.text().slice(0, noOfCharsToTruncate), "...");
575
575
  var totalWordLength = text.text().length;
576
576
  var words = text.text().split(/\s+/).reverse();
577
- arr.push(words.length);
578
577
  var word = '';
579
578
  var line = [];
580
579
  var lineNumber = 0;
@@ -595,7 +594,7 @@ export function createWrapOfXLabels(wrapLabelProps) {
595
594
  .attr('id', 'showDots')
596
595
  .attr('x', 0)
597
596
  .attr('y', y)
598
- .attr('dy', ++lineNumber * lineHeight + dy + 'em')
597
+ .attr('dy', dy + 'em')
599
598
  .text(truncatedWord);
600
599
  }
601
600
  else if (showXAxisLablesTooltip && totalWordLength <= noOfCharsToTruncate) {
@@ -604,7 +603,7 @@ export function createWrapOfXLabels(wrapLabelProps) {
604
603
  .attr('id', 'LessLength')
605
604
  .attr('x', 0)
606
605
  .attr('y', y)
607
- .attr('dy', ++lineNumber * lineHeight + dy + 'em')
606
+ .attr('dy', dy + 'em')
608
607
  .text(totalWord);
609
608
  }
610
609
  else {
@@ -624,32 +623,20 @@ export function createWrapOfXLabels(wrapLabelProps) {
624
623
  .text(word);
625
624
  }
626
625
  }
627
- var maxDigit = Math.max.apply(Math, arr);
628
- var maxHeight_1 = 12; // intial value to render corretly first time
629
- axisNode.selectAll('text').each(function () {
630
- // eslint-disable-next-line @typescript-eslint/no-explicit-any
631
- var outerHTMLElement = document.getElementById('WordBreakId');
632
- var BoxCordinates = outerHTMLElement && outerHTMLElement.getBoundingClientRect();
633
- var boxHeight = BoxCordinates && BoxCordinates.height;
634
- if (boxHeight > maxHeight_1) {
635
- maxHeight_1 = boxHeight;
636
- }
637
- });
638
- // If we take directly maxDigit * maxheight, then it will show more height between x axis tick values and bottom.
639
- // To avoid this, reducing maxDigit value by removing some digit based on legth of word.
640
- var removeDigit = 4;
641
- if (maxDigit <= 2) {
642
- removeDigit = 1;
643
- }
644
- else if (maxDigit > 2 && maxDigit <= 6) {
645
- removeDigit = 2;
646
- }
647
- else if (maxDigit > 6 && maxDigit <= 9) {
648
- removeDigit = 3;
649
- }
650
- removeVal = (maxDigit - removeDigit) * maxHeight_1;
651
626
  }
627
+ maxLines = Math.max(maxLines, lineNumber + 1);
652
628
  });
629
+ if (!showXAxisLablesTooltip) {
630
+ var maxHeight = 12; // intial value to render corretly first time
631
+ // eslint-disable-next-line @typescript-eslint/no-explicit-any
632
+ var outerHTMLElement = document.getElementById('WordBreakId');
633
+ var BoxCordinates = outerHTMLElement && outerHTMLElement.getBoundingClientRect();
634
+ var boxHeight = BoxCordinates && BoxCordinates.height;
635
+ if (boxHeight > maxHeight) {
636
+ maxHeight = boxHeight;
637
+ }
638
+ removeVal = (maxLines - 1) * maxHeight;
639
+ }
653
640
  return removeVal > 0 ? removeVal : 0;
654
641
  }
655
642
  /**