@fluentui/react-charts 0.0.0-nightly-20250818-0407.1 → 0.0.0-nightly-20250820-0406.1

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 (123) hide show
  1. package/CHANGELOG.md +15 -15
  2. package/dist/index.d.ts +65 -1
  3. package/lib/components/AreaChart/AreaChart.js +4 -1
  4. package/lib/components/AreaChart/AreaChart.js.map +1 -1
  5. package/lib/components/AreaChart/useAreaChartStyles.styles.js +2 -1
  6. package/lib/components/AreaChart/useAreaChartStyles.styles.js.map +1 -1
  7. package/lib/components/AreaChart/useAreaChartStyles.styles.raw.js +2 -1
  8. package/lib/components/AreaChart/useAreaChartStyles.styles.raw.js.map +1 -1
  9. package/lib/components/CommonComponents/CartesianChart.js +48 -3
  10. package/lib/components/CommonComponents/CartesianChart.js.map +1 -1
  11. package/lib/components/CommonComponents/CartesianChart.types.js.map +1 -1
  12. package/lib/components/CommonComponents/useCartesianChartStyles.styles.js +13 -0
  13. package/lib/components/CommonComponents/useCartesianChartStyles.styles.js.map +1 -1
  14. package/lib/components/CommonComponents/useCartesianChartStyles.styles.raw.js +12 -0
  15. package/lib/components/CommonComponents/useCartesianChartStyles.styles.raw.js.map +1 -1
  16. package/lib/components/DeclarativeChart/DeclarativeChart.js +175 -112
  17. package/lib/components/DeclarativeChart/DeclarativeChart.js.map +1 -1
  18. package/lib/components/DeclarativeChart/PlotlyColorAdapter.js +6 -1
  19. package/lib/components/DeclarativeChart/PlotlyColorAdapter.js.map +1 -1
  20. package/lib/components/DeclarativeChart/PlotlySchemaAdapter.js +315 -55
  21. package/lib/components/DeclarativeChart/PlotlySchemaAdapter.js.map +1 -1
  22. package/lib/components/GanttChart/useGanttChartStyles.styles.js +2 -1
  23. package/lib/components/GanttChart/useGanttChartStyles.styles.js.map +1 -1
  24. package/lib/components/GanttChart/useGanttChartStyles.styles.raw.js +2 -1
  25. package/lib/components/GanttChart/useGanttChartStyles.styles.raw.js.map +1 -1
  26. package/lib/components/GroupedVerticalBarChart/useGroupedVerticalBarChartStyles.styles.js +2 -1
  27. package/lib/components/GroupedVerticalBarChart/useGroupedVerticalBarChartStyles.styles.js.map +1 -1
  28. package/lib/components/GroupedVerticalBarChart/useGroupedVerticalBarChartStyles.styles.raw.js +2 -1
  29. package/lib/components/GroupedVerticalBarChart/useGroupedVerticalBarChartStyles.styles.raw.js.map +1 -1
  30. package/lib/components/HeatMapChart/useHeatMapChartStyles.styles.js +2 -1
  31. package/lib/components/HeatMapChart/useHeatMapChartStyles.styles.js.map +1 -1
  32. package/lib/components/HeatMapChart/useHeatMapChartStyles.styles.raw.js +2 -1
  33. package/lib/components/HeatMapChart/useHeatMapChartStyles.styles.raw.js.map +1 -1
  34. package/lib/components/HorizontalBarChartWithAxis/useHorizontalBarChartWithAxisStyles.styles.js +2 -1
  35. package/lib/components/HorizontalBarChartWithAxis/useHorizontalBarChartWithAxisStyles.styles.js.map +1 -1
  36. package/lib/components/HorizontalBarChartWithAxis/useHorizontalBarChartWithAxisStyles.styles.raw.js +2 -1
  37. package/lib/components/HorizontalBarChartWithAxis/useHorizontalBarChartWithAxisStyles.styles.raw.js.map +1 -1
  38. package/lib/components/LineChart/LineChart.js +30 -9
  39. package/lib/components/LineChart/LineChart.js.map +1 -1
  40. package/lib/components/LineChart/LineChart.types.js.map +1 -1
  41. package/lib/components/LineChart/useLineChartStyles.styles.js +10 -3
  42. package/lib/components/LineChart/useLineChartStyles.styles.js.map +1 -1
  43. package/lib/components/LineChart/useLineChartStyles.styles.raw.js +14 -2
  44. package/lib/components/LineChart/useLineChartStyles.styles.raw.js.map +1 -1
  45. package/lib/components/ScatterChart/ScatterChart.js +54 -37
  46. package/lib/components/ScatterChart/ScatterChart.js.map +1 -1
  47. package/lib/components/ScatterChart/ScatterChart.types.js.map +1 -1
  48. package/lib/components/ScatterChart/useScatterChartStyles.styles.js +21 -4
  49. package/lib/components/ScatterChart/useScatterChartStyles.styles.js.map +1 -1
  50. package/lib/components/ScatterChart/useScatterChartStyles.styles.raw.js +16 -3
  51. package/lib/components/ScatterChart/useScatterChartStyles.styles.raw.js.map +1 -1
  52. package/lib/components/VerticalBarChart/useVerticalBarChartStyles.styles.js +2 -1
  53. package/lib/components/VerticalBarChart/useVerticalBarChartStyles.styles.js.map +1 -1
  54. package/lib/components/VerticalBarChart/useVerticalBarChartStyles.styles.raw.js +2 -1
  55. package/lib/components/VerticalBarChart/useVerticalBarChartStyles.styles.raw.js.map +1 -1
  56. package/lib/components/VerticalStackedBarChart/useVerticalStackedBarChartStyles.styles.js +2 -1
  57. package/lib/components/VerticalStackedBarChart/useVerticalStackedBarChartStyles.styles.js.map +1 -1
  58. package/lib/components/VerticalStackedBarChart/useVerticalStackedBarChartStyles.styles.raw.js +2 -1
  59. package/lib/components/VerticalStackedBarChart/useVerticalStackedBarChartStyles.styles.raw.js.map +1 -1
  60. package/lib/types/DataPoint.js.map +1 -1
  61. package/lib/utilities/utilities.js +4 -1
  62. package/lib/utilities/utilities.js.map +1 -1
  63. package/lib-commonjs/components/AreaChart/AreaChart.js +4 -1
  64. package/lib-commonjs/components/AreaChart/AreaChart.js.map +1 -1
  65. package/lib-commonjs/components/AreaChart/useAreaChartStyles.styles.js +2 -1
  66. package/lib-commonjs/components/AreaChart/useAreaChartStyles.styles.js.map +1 -1
  67. package/lib-commonjs/components/AreaChart/useAreaChartStyles.styles.raw.js +2 -1
  68. package/lib-commonjs/components/AreaChart/useAreaChartStyles.styles.raw.js.map +1 -1
  69. package/lib-commonjs/components/CommonComponents/CartesianChart.js +48 -3
  70. package/lib-commonjs/components/CommonComponents/CartesianChart.js.map +1 -1
  71. package/lib-commonjs/components/CommonComponents/CartesianChart.types.js.map +1 -1
  72. package/lib-commonjs/components/CommonComponents/useCartesianChartStyles.styles.js +13 -0
  73. package/lib-commonjs/components/CommonComponents/useCartesianChartStyles.styles.js.map +1 -1
  74. package/lib-commonjs/components/CommonComponents/useCartesianChartStyles.styles.raw.js +12 -0
  75. package/lib-commonjs/components/CommonComponents/useCartesianChartStyles.styles.raw.js.map +1 -1
  76. package/lib-commonjs/components/DeclarativeChart/DeclarativeChart.js +171 -110
  77. package/lib-commonjs/components/DeclarativeChart/DeclarativeChart.js.map +1 -1
  78. package/lib-commonjs/components/DeclarativeChart/PlotlyColorAdapter.js +9 -1
  79. package/lib-commonjs/components/DeclarativeChart/PlotlyColorAdapter.js.map +1 -1
  80. package/lib-commonjs/components/DeclarativeChart/PlotlySchemaAdapter.js +331 -61
  81. package/lib-commonjs/components/DeclarativeChart/PlotlySchemaAdapter.js.map +1 -1
  82. package/lib-commonjs/components/GanttChart/useGanttChartStyles.styles.js +2 -1
  83. package/lib-commonjs/components/GanttChart/useGanttChartStyles.styles.js.map +1 -1
  84. package/lib-commonjs/components/GanttChart/useGanttChartStyles.styles.raw.js +2 -1
  85. package/lib-commonjs/components/GanttChart/useGanttChartStyles.styles.raw.js.map +1 -1
  86. package/lib-commonjs/components/GroupedVerticalBarChart/useGroupedVerticalBarChartStyles.styles.js +2 -1
  87. package/lib-commonjs/components/GroupedVerticalBarChart/useGroupedVerticalBarChartStyles.styles.js.map +1 -1
  88. package/lib-commonjs/components/GroupedVerticalBarChart/useGroupedVerticalBarChartStyles.styles.raw.js +2 -1
  89. package/lib-commonjs/components/GroupedVerticalBarChart/useGroupedVerticalBarChartStyles.styles.raw.js.map +1 -1
  90. package/lib-commonjs/components/HeatMapChart/useHeatMapChartStyles.styles.js +2 -1
  91. package/lib-commonjs/components/HeatMapChart/useHeatMapChartStyles.styles.js.map +1 -1
  92. package/lib-commonjs/components/HeatMapChart/useHeatMapChartStyles.styles.raw.js +2 -1
  93. package/lib-commonjs/components/HeatMapChart/useHeatMapChartStyles.styles.raw.js.map +1 -1
  94. package/lib-commonjs/components/HorizontalBarChartWithAxis/useHorizontalBarChartWithAxisStyles.styles.js +2 -1
  95. package/lib-commonjs/components/HorizontalBarChartWithAxis/useHorizontalBarChartWithAxisStyles.styles.js.map +1 -1
  96. package/lib-commonjs/components/HorizontalBarChartWithAxis/useHorizontalBarChartWithAxisStyles.styles.raw.js +2 -1
  97. package/lib-commonjs/components/HorizontalBarChartWithAxis/useHorizontalBarChartWithAxisStyles.styles.raw.js.map +1 -1
  98. package/lib-commonjs/components/LineChart/LineChart.js +30 -9
  99. package/lib-commonjs/components/LineChart/LineChart.js.map +1 -1
  100. package/lib-commonjs/components/LineChart/LineChart.types.js.map +1 -1
  101. package/lib-commonjs/components/LineChart/useLineChartStyles.styles.js +12 -3
  102. package/lib-commonjs/components/LineChart/useLineChartStyles.styles.js.map +1 -1
  103. package/lib-commonjs/components/LineChart/useLineChartStyles.styles.raw.js +14 -2
  104. package/lib-commonjs/components/LineChart/useLineChartStyles.styles.raw.js.map +1 -1
  105. package/lib-commonjs/components/ScatterChart/ScatterChart.js +54 -37
  106. package/lib-commonjs/components/ScatterChart/ScatterChart.js.map +1 -1
  107. package/lib-commonjs/components/ScatterChart/ScatterChart.types.js.map +1 -1
  108. package/lib-commonjs/components/ScatterChart/useScatterChartStyles.styles.js +30 -3
  109. package/lib-commonjs/components/ScatterChart/useScatterChartStyles.styles.js.map +1 -1
  110. package/lib-commonjs/components/ScatterChart/useScatterChartStyles.styles.raw.js +15 -2
  111. package/lib-commonjs/components/ScatterChart/useScatterChartStyles.styles.raw.js.map +1 -1
  112. package/lib-commonjs/components/VerticalBarChart/useVerticalBarChartStyles.styles.js +2 -1
  113. package/lib-commonjs/components/VerticalBarChart/useVerticalBarChartStyles.styles.js.map +1 -1
  114. package/lib-commonjs/components/VerticalBarChart/useVerticalBarChartStyles.styles.raw.js +2 -1
  115. package/lib-commonjs/components/VerticalBarChart/useVerticalBarChartStyles.styles.raw.js.map +1 -1
  116. package/lib-commonjs/components/VerticalStackedBarChart/useVerticalStackedBarChartStyles.styles.js +2 -1
  117. package/lib-commonjs/components/VerticalStackedBarChart/useVerticalStackedBarChartStyles.styles.js.map +1 -1
  118. package/lib-commonjs/components/VerticalStackedBarChart/useVerticalStackedBarChartStyles.styles.raw.js +2 -1
  119. package/lib-commonjs/components/VerticalStackedBarChart/useVerticalStackedBarChartStyles.styles.raw.js.map +1 -1
  120. package/lib-commonjs/types/DataPoint.js.map +1 -1
  121. package/lib-commonjs/utilities/utilities.js +1 -0
  122. package/lib-commonjs/utilities/utilities.js.map +1 -1
  123. package/package.json +12 -12
package/lib/components/GanttChart/useGanttChartStyles.styles.js CHANGED
@@ -14,7 +14,8 @@
14
14
  shapeStyles: '',
15
15
  chartWrapper: '',
16
16
  svgTooltip: '',
17
- chart: ''
17
+ chart: '',
18
+ axisAnnotation: ''
18
19
  };
19
20
  /**
20
21
  * Apply styling to the GanttChart component
package/lib/components/GanttChart/useGanttChartStyles.styles.js.map CHANGED
@@ -1 +1 @@
1
- {"version":3,"names":["ganttClassNames","root","xAxis","yAxis","legendContainer","hover","descriptionMessage","tooltip","axisTitle","chartTitle","opacityChangeOnHover","shapeStyles","chartWrapper","svgTooltip","chart","useGanttChartStyles","props"],"sources":["useGanttChartStyles.styles.js"],"sourcesContent":["/**\n * @internal\n */ export const ganttClassNames = {\n root: '',\n xAxis: '',\n yAxis: '',\n legendContainer: '',\n hover: '',\n descriptionMessage: '',\n tooltip: '',\n axisTitle: '',\n chartTitle: '',\n opacityChangeOnHover: '',\n shapeStyles: '',\n chartWrapper: '',\n svgTooltip: '',\n chart: ''\n};\n/**\n * Apply styling to the GanttChart component\n */ export const useGanttChartStyles = (props)=>{\n return {};\n};\n"],"mappings":"AAAA;AACA;AACA,GAAI,OAAO,MAAMA,eAAe,GAAG;EAC/BC,IAAI,EAAE,EAAE;EACRC,KAAK,EAAE,EAAE;EACTC,KAAK,EAAE,EAAE;EACTC,eAAe,EAAE,EAAE;EACnBC,KAAK,EAAE,EAAE;EACTC,kBAAkB,EAAE,EAAE;EACtBC,OAAO,EAAE,EAAE;EACXC,SAAS,EAAE,EAAE;EACbC,UAAU,EAAE,EAAE;EACdC,oBAAoB,EAAE,EAAE;EACxBC,WAAW,EAAE,EAAE;EACfC,YAAY,EAAE,EAAE;EAChBC,UAAU,EAAE,EAAE;EACdC,KAAK,EAAE;AACX,CAAC;AACD;AACA;AACA;AAAI,OAAO,MAAMC,mBAAmB,GAAIC,KAAK,IAAG;EAC5C,OAAO,CAAC,CAAC;AACb,CAAC","ignoreList":[]}
1
+ {"version":3,"names":["ganttClassNames","root","xAxis","yAxis","legendContainer","hover","descriptionMessage","tooltip","axisTitle","chartTitle","opacityChangeOnHover","shapeStyles","chartWrapper","svgTooltip","chart","axisAnnotation","useGanttChartStyles","props"],"sources":["useGanttChartStyles.styles.js"],"sourcesContent":["/**\n * @internal\n */ export const ganttClassNames = {\n root: '',\n xAxis: '',\n yAxis: '',\n legendContainer: '',\n hover: '',\n descriptionMessage: '',\n tooltip: '',\n axisTitle: '',\n chartTitle: '',\n opacityChangeOnHover: '',\n shapeStyles: '',\n chartWrapper: '',\n svgTooltip: '',\n chart: '',\n axisAnnotation: ''\n};\n/**\n * Apply styling to the GanttChart component\n */ export const useGanttChartStyles = (props)=>{\n return {};\n};\n"],"mappings":"AAAA;AACA;AACA,GAAI,OAAO,MAAMA,eAAe,GAAG;EAC/BC,IAAI,EAAE,EAAE;EACRC,KAAK,EAAE,EAAE;EACTC,KAAK,EAAE,EAAE;EACTC,eAAe,EAAE,EAAE;EACnBC,KAAK,EAAE,EAAE;EACTC,kBAAkB,EAAE,EAAE;EACtBC,OAAO,EAAE,EAAE;EACXC,SAAS,EAAE,EAAE;EACbC,UAAU,EAAE,EAAE;EACdC,oBAAoB,EAAE,EAAE;EACxBC,WAAW,EAAE,EAAE;EACfC,YAAY,EAAE,EAAE;EAChBC,UAAU,EAAE,EAAE;EACdC,KAAK,EAAE,EAAE;EACTC,cAAc,EAAE;AACpB,CAAC;AACD;AACA;AACA;AAAI,OAAO,MAAMC,mBAAmB,GAAIC,KAAK,IAAG;EAC5C,OAAO,CAAC,CAAC;AACb,CAAC","ignoreList":[]}
package/lib/components/GanttChart/useGanttChartStyles.styles.raw.js CHANGED
@@ -14,7 +14,8 @@
14
14
  shapeStyles: '',
15
15
  chartWrapper: '',
16
16
  svgTooltip: '',
17
- chart: ''
17
+ chart: '',
18
+ axisAnnotation: ''
18
19
  };
19
20
  /**
20
21
  * Apply styling to the GanttChart component
package/lib/components/GanttChart/useGanttChartStyles.styles.raw.js.map CHANGED
@@ -1 +1 @@
1
- {"version":3,"sources":["../src/components/GanttChart/useGanttChartStyles.styles.ts"],"sourcesContent":["import { GanttChartStyles, GanttChartProps } from '../../index';\nimport type { SlotClassNames } from '@fluentui/react-utilities';\n\n/**\n * @internal\n */\nexport const ganttClassNames: SlotClassNames<GanttChartStyles> = {\n root: '',\n xAxis: '',\n yAxis: '',\n legendContainer: '',\n hover: '',\n descriptionMessage: '',\n tooltip: '',\n axisTitle: '',\n chartTitle: '',\n opacityChangeOnHover: '',\n shapeStyles: '',\n chartWrapper: '',\n svgTooltip: '',\n chart: '',\n};\n\n/**\n * Apply styling to the GanttChart component\n */\nexport const useGanttChartStyles = (props: GanttChartProps): GanttChartStyles => {\n return {};\n};\n"],"names":["ganttClassNames","root","xAxis","yAxis","legendContainer","hover","descriptionMessage","tooltip","axisTitle","chartTitle","opacityChangeOnHover","shapeStyles","chartWrapper","svgTooltip","chart","useGanttChartStyles","props"],"mappings":"AAGA;;CAEC,GACD,OAAO,MAAMA,kBAAoD;IAC/DC,MAAM;IACNC,OAAO;IACPC,OAAO;IACPC,iBAAiB;IACjBC,OAAO;IACPC,oBAAoB;IACpBC,SAAS;IACTC,WAAW;IACXC,YAAY;IACZC,sBAAsB;IACtBC,aAAa;IACbC,cAAc;IACdC,YAAY;IACZC,OAAO;AACT,EAAE;AAEF;;CAEC,GACD,OAAO,MAAMC,sBAAsB,CAACC;IAClC,OAAO,CAAC;AACV,EAAE"}
1
+ {"version":3,"sources":["../src/components/GanttChart/useGanttChartStyles.styles.ts"],"sourcesContent":["import { GanttChartStyles, GanttChartProps } from '../../index';\nimport type { SlotClassNames } from '@fluentui/react-utilities';\n\n/**\n * @internal\n */\nexport const ganttClassNames: SlotClassNames<GanttChartStyles> = {\n root: '',\n xAxis: '',\n yAxis: '',\n legendContainer: '',\n hover: '',\n descriptionMessage: '',\n tooltip: '',\n axisTitle: '',\n chartTitle: '',\n opacityChangeOnHover: '',\n shapeStyles: '',\n chartWrapper: '',\n svgTooltip: '',\n chart: '',\n axisAnnotation: '',\n};\n\n/**\n * Apply styling to the GanttChart component\n */\nexport const useGanttChartStyles = (props: GanttChartProps): GanttChartStyles => {\n return {};\n};\n"],"names":["ganttClassNames","root","xAxis","yAxis","legendContainer","hover","descriptionMessage","tooltip","axisTitle","chartTitle","opacityChangeOnHover","shapeStyles","chartWrapper","svgTooltip","chart","axisAnnotation","useGanttChartStyles","props"],"mappings":"AAGA;;CAEC,GACD,OAAO,MAAMA,kBAAoD;IAC/DC,MAAM;IACNC,OAAO;IACPC,OAAO;IACPC,iBAAiB;IACjBC,OAAO;IACPC,oBAAoB;IACpBC,SAAS;IACTC,WAAW;IACXC,YAAY;IACZC,sBAAsB;IACtBC,aAAa;IACbC,cAAc;IACdC,YAAY;IACZC,OAAO;IACPC,gBAAgB;AAClB,EAAE;AAEF;;CAEC,GACD,OAAO,MAAMC,sBAAsB,CAACC;IAClC,OAAO,CAAC;AACV,EAAE"}
package/lib/components/GroupedVerticalBarChart/useGroupedVerticalBarChartStyles.styles.js CHANGED
@@ -15,7 +15,8 @@ export const groupedVerticalBarChartClassNames = {
15
15
  shapeStyles: '',
16
16
  chartWrapper: '',
17
17
  svgTooltip: '',
18
- chart: ''
18
+ chart: '',
19
+ axisAnnotation: ''
19
20
  };
20
21
  const useStyles = /*#__PURE__*/__styles({
21
22
  opacityChangeOnHover: {
package/lib/components/GroupedVerticalBarChart/useGroupedVerticalBarChartStyles.styles.js.map CHANGED
@@ -1 +1 @@
1
- {"version":3,"names":["__styles","mergeClasses","shorthands","tokens","typographyStyles","groupedVerticalBarChartClassNames","opacityChangeOnHover","tooltip","barLabel","root","xAxis","yAxis","legendContainer","hover","descriptionMessage","axisTitle","chartTitle","shapeStyles","chartWrapper","svgTooltip","chart","useStyles","Bceei9c","Bahqtrf","Be2twd7","Bhrd7zp","Bg96gwp","mc9l5x","Beiy3e4","z8tnut","z189sj","Byoj8tv","uwmqm3","qhf8xq","fsow6f","Bhzewxz","Bkfmm31","Bgh53k4","B2eet1l","De3pzq","Bcmaq0h","gk0gix","B20660r","B8a6bjv","Bpptf2m","e5kdtc","Bkjc3bi","ayd6f0","Beyfa6y","Bbmb7ep","Btl43ni","B7oj6ja","Dimara","Bkecrkj","sj55zd","Bvjb7m6","d","p","useGroupedVerticalBarChartStyles_unstable","props","baseStyles"],"sources":["useGroupedVerticalBarChartStyles.styles.js"],"sourcesContent":["import { makeStyles, mergeClasses, shorthands } from '@griffel/react';\nimport { tokens, typographyStyles } from '@fluentui/react-theme';\nexport const groupedVerticalBarChartClassNames = {\n opacityChangeOnHover: 'fui-gvbc**opacityChangeOnHover',\n tooltip: 'fui-gvbc**tooltip',\n barLabel: 'fui-gvbc**barLabel',\n root: '',\n xAxis: '',\n yAxis: '',\n legendContainer: '',\n hover: '',\n descriptionMessage: '',\n axisTitle: '',\n chartTitle: '',\n shapeStyles: '',\n chartWrapper: '',\n svgTooltip: '',\n chart: ''\n};\nconst useStyles = makeStyles({\n opacityChangeOnHover: {\n cursor: 'default'\n },\n tooltip: {\n ...typographyStyles.body1,\n display: 'flex',\n flexDirection: 'column',\n ...shorthands.padding(tokens.spacingHorizontalS),\n position: 'absolute',\n textAlign: 'center',\n top: tokens.spacingVerticalNone,\n fill: tokens.colorNeutralBackground1,\n background: tokens.colorNeutralBackground1,\n borderRadius: tokens.borderRadiusSmall,\n pointerEvents: 'none',\n color: tokens.colorNeutralForeground1\n },\n barLabel: {\n ...typographyStyles.caption1Strong,\n fill: tokens.colorNeutralForeground1,\n forcedColorAdjust: 'auto'\n }\n});\n/**\n * Apply styling to the GroupedVerticalBarChart slots based on the state\n */ export const useGroupedVerticalBarChartStyles_unstable = (props)=>{\n const baseStyles = useStyles();\n return {\n opacityChangeOnHover: mergeClasses(groupedVerticalBarChartClassNames.opacityChangeOnHover, baseStyles.opacityChangeOnHover /*props.styles?.opacityChangeOnHover*/ ),\n tooltip: mergeClasses(groupedVerticalBarChartClassNames.tooltip, baseStyles.tooltip /*props.styles?.tooltip*/ ),\n barLabel: mergeClasses(groupedVerticalBarChartClassNames.barLabel, baseStyles.barLabel /*props.styles?.barLabel*/ )\n };\n};\n"],"mappings":"AAAA,SAAAA,QAAA,EAAqBC,YAAY,EAAEC,UAAU,QAAQ,gBAAgB;AACrE,SAASC,MAAM,EAAEC,gBAAgB,QAAQ,uBAAuB;AAChE,OAAO,MAAMC,iCAAiC,GAAG;EAC7CC,oBAAoB,EAAE,gCAAgC;EACtDC,OAAO,EAAE,mBAAmB;EAC5BC,QAAQ,EAAE,oBAAoB;EAC9BC,IAAI,EAAE,EAAE;EACRC,KAAK,EAAE,EAAE;EACTC,KAAK,EAAE,EAAE;EACTC,eAAe,EAAE,EAAE;EACnBC,KAAK,EAAE,EAAE;EACTC,kBAAkB,EAAE,EAAE;EACtBC,SAAS,EAAE,EAAE;EACbC,UAAU,EAAE,EAAE;EACdC,WAAW,EAAE,EAAE;EACfC,YAAY,EAAE,EAAE;EAChBC,UAAU,EAAE,EAAE;EACdC,KAAK,EAAE;AACX,CAAC;AACD,MAAMC,SAAS,gBAAGrB,QAAA;EAAAM,oBAAA;IAAAgB,OAAA;EAAA;EAAAf,OAAA;IAAAgB,OAAA;IAAAC,OAAA;IAAAC,OAAA;IAAAC,OAAA;IAAAC,MAAA;IAAAC,OAAA;IAAAC,MAAA;IAAAC,MAAA;IAAAC,OAAA;IAAAC,MAAA;IAAAC,MAAA;IAAAC,MAAA;IAAAC,OAAA;IAAAC,OAAA;IAAAC,OAAA;IAAAC,OAAA;IAAAC,MAAA;IAAAC,OAAA;IAAAC,MAAA;IAAAC,OAAA;IAAAC,OAAA;IAAAC,OAAA;IAAAC,MAAA;IAAAC,OAAA;IAAAC,MAAA;IAAAC,OAAA;IAAAC,OAAA;IAAAC,OAAA;IAAAC,OAAA;IAAAC,MAAA;IAAAC,OAAA;IAAAC,MAAA;EAAA;EAAA9C,QAAA;IAAAe,OAAA;IAAAC,OAAA;IAAAC,OAAA;IAAAC,OAAA;IAAAU,OAAA;IAAAmB,OAAA;EAAA;AAAA;EAAAC,CAAA;IAAAC,CAAA;EAAA;IAAAA,CAAA;EAAA;AAAA,CAuBjB,CAAC;AACF;AACA;AACA;AAAI,OAAO,MAAMC,yCAAyC,GAAIC,KAAK,IAAG;EAClE,MAAMC,UAAU,GAAGvC,SAAS,CAAC,CAAC;EAC9B,OAAO;IACHf,oBAAoB,EAAEL,YAAY,CAACI,iCAAiC,CAACC,oBAAoB,EAAEsD,UAAU,CAACtD,oBAAoB,CAAC,sCAAuC,CAAC;IACnKC,OAAO,EAAEN,YAAY,CAACI,iCAAiC,CAACE,OAAO,EAAEqD,UAAU,CAACrD,OAAO,CAAC,yBAA0B,CAAC;IAC/GC,QAAQ,EAAEP,YAAY,CAACI,iCAAiC,CAACG,QAAQ,EAAEoD,UAAU,CAACpD,QAAQ,CAAC,0BAA2B;EACtH,CAAC;AACL,CAAC","ignoreList":[]}
1
+ {"version":3,"names":["__styles","mergeClasses","shorthands","tokens","typographyStyles","groupedVerticalBarChartClassNames","opacityChangeOnHover","tooltip","barLabel","root","xAxis","yAxis","legendContainer","hover","descriptionMessage","axisTitle","chartTitle","shapeStyles","chartWrapper","svgTooltip","chart","axisAnnotation","useStyles","Bceei9c","Bahqtrf","Be2twd7","Bhrd7zp","Bg96gwp","mc9l5x","Beiy3e4","z8tnut","z189sj","Byoj8tv","uwmqm3","qhf8xq","fsow6f","Bhzewxz","Bkfmm31","Bgh53k4","B2eet1l","De3pzq","Bcmaq0h","gk0gix","B20660r","B8a6bjv","Bpptf2m","e5kdtc","Bkjc3bi","ayd6f0","Beyfa6y","Bbmb7ep","Btl43ni","B7oj6ja","Dimara","Bkecrkj","sj55zd","Bvjb7m6","d","p","useGroupedVerticalBarChartStyles_unstable","props","baseStyles"],"sources":["useGroupedVerticalBarChartStyles.styles.js"],"sourcesContent":["import { makeStyles, mergeClasses, shorthands } from '@griffel/react';\nimport { tokens, typographyStyles } from '@fluentui/react-theme';\nexport const groupedVerticalBarChartClassNames = {\n opacityChangeOnHover: 'fui-gvbc**opacityChangeOnHover',\n tooltip: 'fui-gvbc**tooltip',\n barLabel: 'fui-gvbc**barLabel',\n root: '',\n xAxis: '',\n yAxis: '',\n legendContainer: '',\n hover: '',\n descriptionMessage: '',\n axisTitle: '',\n chartTitle: '',\n shapeStyles: '',\n chartWrapper: '',\n svgTooltip: '',\n chart: '',\n axisAnnotation: ''\n};\nconst useStyles = makeStyles({\n opacityChangeOnHover: {\n cursor: 'default'\n },\n tooltip: {\n ...typographyStyles.body1,\n display: 'flex',\n flexDirection: 'column',\n ...shorthands.padding(tokens.spacingHorizontalS),\n position: 'absolute',\n textAlign: 'center',\n top: tokens.spacingVerticalNone,\n fill: tokens.colorNeutralBackground1,\n background: tokens.colorNeutralBackground1,\n borderRadius: tokens.borderRadiusSmall,\n pointerEvents: 'none',\n color: tokens.colorNeutralForeground1\n },\n barLabel: {\n ...typographyStyles.caption1Strong,\n fill: tokens.colorNeutralForeground1,\n forcedColorAdjust: 'auto'\n }\n});\n/**\n * Apply styling to the GroupedVerticalBarChart slots based on the state\n */ export const useGroupedVerticalBarChartStyles_unstable = (props)=>{\n const baseStyles = useStyles();\n return {\n opacityChangeOnHover: mergeClasses(groupedVerticalBarChartClassNames.opacityChangeOnHover, baseStyles.opacityChangeOnHover /*props.styles?.opacityChangeOnHover*/ ),\n tooltip: mergeClasses(groupedVerticalBarChartClassNames.tooltip, baseStyles.tooltip /*props.styles?.tooltip*/ ),\n barLabel: mergeClasses(groupedVerticalBarChartClassNames.barLabel, baseStyles.barLabel /*props.styles?.barLabel*/ )\n };\n};\n"],"mappings":"AAAA,SAAAA,QAAA,EAAqBC,YAAY,EAAEC,UAAU,QAAQ,gBAAgB;AACrE,SAASC,MAAM,EAAEC,gBAAgB,QAAQ,uBAAuB;AAChE,OAAO,MAAMC,iCAAiC,GAAG;EAC7CC,oBAAoB,EAAE,gCAAgC;EACtDC,OAAO,EAAE,mBAAmB;EAC5BC,QAAQ,EAAE,oBAAoB;EAC9BC,IAAI,EAAE,EAAE;EACRC,KAAK,EAAE,EAAE;EACTC,KAAK,EAAE,EAAE;EACTC,eAAe,EAAE,EAAE;EACnBC,KAAK,EAAE,EAAE;EACTC,kBAAkB,EAAE,EAAE;EACtBC,SAAS,EAAE,EAAE;EACbC,UAAU,EAAE,EAAE;EACdC,WAAW,EAAE,EAAE;EACfC,YAAY,EAAE,EAAE;EAChBC,UAAU,EAAE,EAAE;EACdC,KAAK,EAAE,EAAE;EACTC,cAAc,EAAE;AACpB,CAAC;AACD,MAAMC,SAAS,gBAAGtB,QAAA;EAAAM,oBAAA;IAAAiB,OAAA;EAAA;EAAAhB,OAAA;IAAAiB,OAAA;IAAAC,OAAA;IAAAC,OAAA;IAAAC,OAAA;IAAAC,MAAA;IAAAC,OAAA;IAAAC,MAAA;IAAAC,MAAA;IAAAC,OAAA;IAAAC,MAAA;IAAAC,MAAA;IAAAC,MAAA;IAAAC,OAAA;IAAAC,OAAA;IAAAC,OAAA;IAAAC,OAAA;IAAAC,MAAA;IAAAC,OAAA;IAAAC,MAAA;IAAAC,OAAA;IAAAC,OAAA;IAAAC,OAAA;IAAAC,MAAA;IAAAC,OAAA;IAAAC,MAAA;IAAAC,OAAA;IAAAC,OAAA;IAAAC,OAAA;IAAAC,OAAA;IAAAC,MAAA;IAAAC,OAAA;IAAAC,MAAA;EAAA;EAAA/C,QAAA;IAAAgB,OAAA;IAAAC,OAAA;IAAAC,OAAA;IAAAC,OAAA;IAAAU,OAAA;IAAAmB,OAAA;EAAA;AAAA;EAAAC,CAAA;IAAAC,CAAA;EAAA;IAAAA,CAAA;EAAA;AAAA,CAuBjB,CAAC;AACF;AACA;AACA;AAAI,OAAO,MAAMC,yCAAyC,GAAIC,KAAK,IAAG;EAClE,MAAMC,UAAU,GAAGvC,SAAS,CAAC,CAAC;EAC9B,OAAO;IACHhB,oBAAoB,EAAEL,YAAY,CAACI,iCAAiC,CAACC,oBAAoB,EAAEuD,UAAU,CAACvD,oBAAoB,CAAC,sCAAuC,CAAC;IACnKC,OAAO,EAAEN,YAAY,CAACI,iCAAiC,CAACE,OAAO,EAAEsD,UAAU,CAACtD,OAAO,CAAC,yBAA0B,CAAC;IAC/GC,QAAQ,EAAEP,YAAY,CAACI,iCAAiC,CAACG,QAAQ,EAAEqD,UAAU,CAACrD,QAAQ,CAAC,0BAA2B;EACtH,CAAC;AACL,CAAC","ignoreList":[]}
package/lib/components/GroupedVerticalBarChart/useGroupedVerticalBarChartStyles.styles.raw.js CHANGED
@@ -15,7 +15,8 @@ export const groupedVerticalBarChartClassNames = {
15
15
  shapeStyles: '',
16
16
  chartWrapper: '',
17
17
  svgTooltip: '',
18
- chart: ''
18
+ chart: '',
19
+ axisAnnotation: ''
19
20
  };
20
21
  const useStyles = makeStyles({
21
22
  opacityChangeOnHover: {
package/lib/components/GroupedVerticalBarChart/useGroupedVerticalBarChartStyles.styles.raw.js.map CHANGED
@@ -1 +1 @@
1
- {"version":3,"sources":["../src/components/GroupedVerticalBarChart/useGroupedVerticalBarChartStyles.styles.ts"],"sourcesContent":["import { makeStyles, mergeClasses, shorthands } from '@griffel/react';\nimport { GroupedVerticalBarChartProps, GroupedVerticalBarChartStyles } from '../../index';\nimport { SlotClassNames } from '@fluentui/react-utilities/src/index';\nimport { tokens, typographyStyles } from '@fluentui/react-theme';\n\nexport const groupedVerticalBarChartClassNames: SlotClassNames<GroupedVerticalBarChartStyles> = {\n opacityChangeOnHover: 'fui-gvbc**opacityChangeOnHover',\n tooltip: 'fui-gvbc**tooltip',\n barLabel: 'fui-gvbc**barLabel',\n root: '',\n xAxis: '',\n yAxis: '',\n legendContainer: '',\n hover: '',\n descriptionMessage: '',\n axisTitle: '',\n chartTitle: '',\n shapeStyles: '',\n chartWrapper: '',\n svgTooltip: '',\n chart: '',\n};\n\nconst useStyles = makeStyles({\n opacityChangeOnHover: {\n cursor: 'default',\n },\n tooltip: {\n ...typographyStyles.body1,\n display: 'flex',\n flexDirection: 'column',\n ...shorthands.padding(tokens.spacingHorizontalS),\n position: 'absolute',\n textAlign: 'center',\n top: tokens.spacingVerticalNone,\n fill: tokens.colorNeutralBackground1, //Check this\n background: tokens.colorNeutralBackground1, //Fill or background\n borderRadius: tokens.borderRadiusSmall,\n pointerEvents: 'none',\n color: tokens.colorNeutralForeground1, //Confirm this\n },\n barLabel: {\n ...typographyStyles.caption1Strong, // Confirm styles\n fill: tokens.colorNeutralForeground1,\n forcedColorAdjust: 'auto',\n },\n});\n\n/**\n * Apply styling to the GroupedVerticalBarChart slots based on the state\n */\nexport const useGroupedVerticalBarChartStyles_unstable = (\n props: GroupedVerticalBarChartProps,\n): GroupedVerticalBarChartStyles => {\n const baseStyles = useStyles();\n\n return {\n opacityChangeOnHover: mergeClasses(\n groupedVerticalBarChartClassNames.opacityChangeOnHover,\n baseStyles.opacityChangeOnHover /*props.styles?.opacityChangeOnHover*/,\n ),\n tooltip: mergeClasses(groupedVerticalBarChartClassNames.tooltip, baseStyles.tooltip /*props.styles?.tooltip*/),\n barLabel: mergeClasses(groupedVerticalBarChartClassNames.barLabel, baseStyles.barLabel /*props.styles?.barLabel*/),\n };\n};\n"],"names":["makeStyles","mergeClasses","shorthands","tokens","typographyStyles","groupedVerticalBarChartClassNames","opacityChangeOnHover","tooltip","barLabel","root","xAxis","yAxis","legendContainer","hover","descriptionMessage","axisTitle","chartTitle","shapeStyles","chartWrapper","svgTooltip","chart","useStyles","cursor","body1","display","flexDirection","padding","spacingHorizontalS","position","textAlign","top","spacingVerticalNone","fill","colorNeutralBackground1","background","borderRadius","borderRadiusSmall","pointerEvents","color","colorNeutralForeground1","caption1Strong","forcedColorAdjust","useGroupedVerticalBarChartStyles_unstable","props","baseStyles"],"mappings":"AAAA,SAASA,UAAU,EAAEC,YAAY,EAAEC,UAAU,QAAQ,iBAAiB;AAGtE,SAASC,MAAM,EAAEC,gBAAgB,QAAQ,wBAAwB;AAEjE,OAAO,MAAMC,oCAAmF;IAC9FC,sBAAsB;IACtBC,SAAS;IACTC,UAAU;IACVC,MAAM;IACNC,OAAO;IACPC,OAAO;IACPC,iBAAiB;IACjBC,OAAO;IACPC,oBAAoB;IACpBC,WAAW;IACXC,YAAY;IACZC,aAAa;IACbC,cAAc;IACdC,YAAY;IACZC,OAAO;AACT,EAAE;AAEF,MAAMC,YAAYrB,WAAW;IAC3BM,sBAAsB;QACpBgB,QAAQ;IACV;IACAf,SAAS;QACP,GAAGH,iBAAiBmB,KAAK;QACzBC,SAAS;QACTC,eAAe;QACf,GAAGvB,WAAWwB,OAAO,CAACvB,OAAOwB,kBAAkB,CAAC;QAChDC,UAAU;QACVC,WAAW;QACXC,KAAK3B,OAAO4B,mBAAmB;QAC/BC,MAAM7B,OAAO8B,uBAAuB;QACpCC,YAAY/B,OAAO8B,uBAAuB;QAC1CE,cAAchC,OAAOiC,iBAAiB;QACtCC,eAAe;QACfC,OAAOnC,OAAOoC,uBAAuB;IACvC;IACA/B,UAAU;QACR,GAAGJ,iBAAiBoC,cAAc;QAClCR,MAAM7B,OAAOoC,uBAAuB;QACpCE,mBAAmB;IACrB;AACF;AAEA;;CAEC,GACD,OAAO,MAAMC,4CAA4C,CACvDC;IAEA,MAAMC,aAAavB;IAEnB,OAAO;QACLf,sBAAsBL,aACpBI,kCAAkCC,oBAAoB,EACtDsC,WAAWtC,oBAAoB,CAAC,oCAAoC;QAEtEC,SAASN,aAAaI,kCAAkCE,OAAO,EAAEqC,WAAWrC,OAAO,CAAC,uBAAuB;QAC3GC,UAAUP,aAAaI,kCAAkCG,QAAQ,EAAEoC,WAAWpC,QAAQ,CAAC,wBAAwB;IACjH;AACF,EAAE"}
1
+ {"version":3,"sources":["../src/components/GroupedVerticalBarChart/useGroupedVerticalBarChartStyles.styles.ts"],"sourcesContent":["import { makeStyles, mergeClasses, shorthands } from '@griffel/react';\nimport { GroupedVerticalBarChartProps, GroupedVerticalBarChartStyles } from '../../index';\nimport { SlotClassNames } from '@fluentui/react-utilities/src/index';\nimport { tokens, typographyStyles } from '@fluentui/react-theme';\n\nexport const groupedVerticalBarChartClassNames: SlotClassNames<GroupedVerticalBarChartStyles> = {\n opacityChangeOnHover: 'fui-gvbc**opacityChangeOnHover',\n tooltip: 'fui-gvbc**tooltip',\n barLabel: 'fui-gvbc**barLabel',\n root: '',\n xAxis: '',\n yAxis: '',\n legendContainer: '',\n hover: '',\n descriptionMessage: '',\n axisTitle: '',\n chartTitle: '',\n shapeStyles: '',\n chartWrapper: '',\n svgTooltip: '',\n chart: '',\n axisAnnotation: '',\n};\n\nconst useStyles = makeStyles({\n opacityChangeOnHover: {\n cursor: 'default',\n },\n tooltip: {\n ...typographyStyles.body1,\n display: 'flex',\n flexDirection: 'column',\n ...shorthands.padding(tokens.spacingHorizontalS),\n position: 'absolute',\n textAlign: 'center',\n top: tokens.spacingVerticalNone,\n fill: tokens.colorNeutralBackground1, //Check this\n background: tokens.colorNeutralBackground1, //Fill or background\n borderRadius: tokens.borderRadiusSmall,\n pointerEvents: 'none',\n color: tokens.colorNeutralForeground1, //Confirm this\n },\n barLabel: {\n ...typographyStyles.caption1Strong, // Confirm styles\n fill: tokens.colorNeutralForeground1,\n forcedColorAdjust: 'auto',\n },\n});\n\n/**\n * Apply styling to the GroupedVerticalBarChart slots based on the state\n */\nexport const useGroupedVerticalBarChartStyles_unstable = (\n props: GroupedVerticalBarChartProps,\n): GroupedVerticalBarChartStyles => {\n const baseStyles = useStyles();\n\n return {\n opacityChangeOnHover: mergeClasses(\n groupedVerticalBarChartClassNames.opacityChangeOnHover,\n baseStyles.opacityChangeOnHover /*props.styles?.opacityChangeOnHover*/,\n ),\n tooltip: mergeClasses(groupedVerticalBarChartClassNames.tooltip, baseStyles.tooltip /*props.styles?.tooltip*/),\n barLabel: mergeClasses(groupedVerticalBarChartClassNames.barLabel, baseStyles.barLabel /*props.styles?.barLabel*/),\n };\n};\n"],"names":["makeStyles","mergeClasses","shorthands","tokens","typographyStyles","groupedVerticalBarChartClassNames","opacityChangeOnHover","tooltip","barLabel","root","xAxis","yAxis","legendContainer","hover","descriptionMessage","axisTitle","chartTitle","shapeStyles","chartWrapper","svgTooltip","chart","axisAnnotation","useStyles","cursor","body1","display","flexDirection","padding","spacingHorizontalS","position","textAlign","top","spacingVerticalNone","fill","colorNeutralBackground1","background","borderRadius","borderRadiusSmall","pointerEvents","color","colorNeutralForeground1","caption1Strong","forcedColorAdjust","useGroupedVerticalBarChartStyles_unstable","props","baseStyles"],"mappings":"AAAA,SAASA,UAAU,EAAEC,YAAY,EAAEC,UAAU,QAAQ,iBAAiB;AAGtE,SAASC,MAAM,EAAEC,gBAAgB,QAAQ,wBAAwB;AAEjE,OAAO,MAAMC,oCAAmF;IAC9FC,sBAAsB;IACtBC,SAAS;IACTC,UAAU;IACVC,MAAM;IACNC,OAAO;IACPC,OAAO;IACPC,iBAAiB;IACjBC,OAAO;IACPC,oBAAoB;IACpBC,WAAW;IACXC,YAAY;IACZC,aAAa;IACbC,cAAc;IACdC,YAAY;IACZC,OAAO;IACPC,gBAAgB;AAClB,EAAE;AAEF,MAAMC,YAAYtB,WAAW;IAC3BM,sBAAsB;QACpBiB,QAAQ;IACV;IACAhB,SAAS;QACP,GAAGH,iBAAiBoB,KAAK;QACzBC,SAAS;QACTC,eAAe;QACf,GAAGxB,WAAWyB,OAAO,CAACxB,OAAOyB,kBAAkB,CAAC;QAChDC,UAAU;QACVC,WAAW;QACXC,KAAK5B,OAAO6B,mBAAmB;QAC/BC,MAAM9B,OAAO+B,uBAAuB;QACpCC,YAAYhC,OAAO+B,uBAAuB;QAC1CE,cAAcjC,OAAOkC,iBAAiB;QACtCC,eAAe;QACfC,OAAOpC,OAAOqC,uBAAuB;IACvC;IACAhC,UAAU;QACR,GAAGJ,iBAAiBqC,cAAc;QAClCR,MAAM9B,OAAOqC,uBAAuB;QACpCE,mBAAmB;IACrB;AACF;AAEA;;CAEC,GACD,OAAO,MAAMC,4CAA4C,CACvDC;IAEA,MAAMC,aAAavB;IAEnB,OAAO;QACLhB,sBAAsBL,aACpBI,kCAAkCC,oBAAoB,EACtDuC,WAAWvC,oBAAoB,CAAC,oCAAoC;QAEtEC,SAASN,aAAaI,kCAAkCE,OAAO,EAAEsC,WAAWtC,OAAO,CAAC,uBAAuB;QAC3GC,UAAUP,aAAaI,kCAAkCG,QAAQ,EAAEqC,WAAWrC,QAAQ,CAAC,wBAAwB;IACjH;AACF,EAAE"}
package/lib/components/HeatMapChart/useHeatMapChartStyles.styles.js CHANGED
@@ -16,7 +16,8 @@ export const heatmapChartClassNames = {
16
16
  shapeStyles: '',
17
17
  chartWrapper: '',
18
18
  svgTooltip: '',
19
- chart: ''
19
+ chart: '',
20
+ axisAnnotation: ''
20
21
  };
21
22
  const useStyles = /*#__PURE__*/__styles({
22
23
  root: {},
package/lib/components/HeatMapChart/useHeatMapChartStyles.styles.js.map CHANGED
@@ -1 +1 @@
1
- {"version":3,"names":["__styles","mergeClasses","typographyStyles","heatmapChartClassNames","root","text","calloutContentRoot","xAxis","yAxis","legendContainer","hover","descriptionMessage","tooltip","axisTitle","chartTitle","opacityChangeOnHover","shapeStyles","chartWrapper","svgTooltip","chart","useStyles","Bahqtrf","Be2twd7","Bhrd7zp","Bg96gwp","Bkecrkj","B2u0y6b","d","useHeatMapChartStyles","props","baseStyles"],"sources":["useHeatMapChartStyles.styles.js"],"sourcesContent":["import { makeStyles, mergeClasses } from '@griffel/react';\nimport { typographyStyles } from '@fluentui/react-theme';\nexport const heatmapChartClassNames = {\n root: 'fui-hmc__root',\n text: 'fui-hmc__text',\n calloutContentRoot: 'fui-hmc__calloutContentRoot',\n xAxis: '',\n yAxis: '',\n legendContainer: '',\n hover: '',\n descriptionMessage: '',\n tooltip: '',\n axisTitle: '',\n chartTitle: '',\n opacityChangeOnHover: '',\n shapeStyles: '',\n chartWrapper: '',\n svgTooltip: '',\n chart: ''\n};\nconst useStyles = makeStyles({\n root: {},\n text: {\n ...typographyStyles.body1Strong,\n pointerEvents: 'none'\n },\n calloutContentRoot: {\n maxWidth: '238px'\n }\n});\nexport const useHeatMapChartStyles = (props)=>{\n const baseStyles = useStyles();\n return {\n root: mergeClasses(heatmapChartClassNames.root, baseStyles.root /*, props.styles?.root*/ ),\n text: mergeClasses(heatmapChartClassNames.text, baseStyles.text /*, props.styles?.text*/ ),\n calloutContentRoot: mergeClasses(heatmapChartClassNames.calloutContentRoot, baseStyles.calloutContentRoot /*, props.styles?.calloutContentRoot*/ )\n };\n};\n"],"mappings":"AAAA,SAAAA,QAAA,EAAqBC,YAAY,QAAQ,gBAAgB;AACzD,SAASC,gBAAgB,QAAQ,uBAAuB;AACxD,OAAO,MAAMC,sBAAsB,GAAG;EAClCC,IAAI,EAAE,eAAe;EACrBC,IAAI,EAAE,eAAe;EACrBC,kBAAkB,EAAE,6BAA6B;EACjDC,KAAK,EAAE,EAAE;EACTC,KAAK,EAAE,EAAE;EACTC,eAAe,EAAE,EAAE;EACnBC,KAAK,EAAE,EAAE;EACTC,kBAAkB,EAAE,EAAE;EACtBC,OAAO,EAAE,EAAE;EACXC,SAAS,EAAE,EAAE;EACbC,UAAU,EAAE,EAAE;EACdC,oBAAoB,EAAE,EAAE;EACxBC,WAAW,EAAE,EAAE;EACfC,YAAY,EAAE,EAAE;EAChBC,UAAU,EAAE,EAAE;EACdC,KAAK,EAAE;AACX,CAAC;AACD,MAAMC,SAAS,gBAAGpB,QAAA;EAAAI,IAAA;EAAAC,IAAA;IAAAgB,OAAA;IAAAC,OAAA;IAAAC,OAAA;IAAAC,OAAA;IAAAC,OAAA;EAAA;EAAAnB,kBAAA;IAAAoB,OAAA;EAAA;AAAA;EAAAC,CAAA;AAAA,CASjB,CAAC;AACF,OAAO,MAAMC,qBAAqB,GAAIC,KAAK,IAAG;EAC1C,MAAMC,UAAU,GAAGV,SAAS,CAAC,CAAC;EAC9B,OAAO;IACHhB,IAAI,EAAEH,YAAY,CAACE,sBAAsB,CAACC,IAAI,EAAE0B,UAAU,CAAC1B,IAAI,CAAC,wBAAyB,CAAC;IAC1FC,IAAI,EAAEJ,YAAY,CAACE,sBAAsB,CAACE,IAAI,EAAEyB,UAAU,CAACzB,IAAI,CAAC,wBAAyB,CAAC;IAC1FC,kBAAkB,EAAEL,YAAY,CAACE,sBAAsB,CAACG,kBAAkB,EAAEwB,UAAU,CAACxB,kBAAkB,CAAC,sCAAuC;EACrJ,CAAC;AACL,CAAC","ignoreList":[]}
1
+ {"version":3,"names":["__styles","mergeClasses","typographyStyles","heatmapChartClassNames","root","text","calloutContentRoot","xAxis","yAxis","legendContainer","hover","descriptionMessage","tooltip","axisTitle","chartTitle","opacityChangeOnHover","shapeStyles","chartWrapper","svgTooltip","chart","axisAnnotation","useStyles","Bahqtrf","Be2twd7","Bhrd7zp","Bg96gwp","Bkecrkj","B2u0y6b","d","useHeatMapChartStyles","props","baseStyles"],"sources":["useHeatMapChartStyles.styles.js"],"sourcesContent":["import { makeStyles, mergeClasses } from '@griffel/react';\nimport { typographyStyles } from '@fluentui/react-theme';\nexport const heatmapChartClassNames = {\n root: 'fui-hmc__root',\n text: 'fui-hmc__text',\n calloutContentRoot: 'fui-hmc__calloutContentRoot',\n xAxis: '',\n yAxis: '',\n legendContainer: '',\n hover: '',\n descriptionMessage: '',\n tooltip: '',\n axisTitle: '',\n chartTitle: '',\n opacityChangeOnHover: '',\n shapeStyles: '',\n chartWrapper: '',\n svgTooltip: '',\n chart: '',\n axisAnnotation: ''\n};\nconst useStyles = makeStyles({\n root: {},\n text: {\n ...typographyStyles.body1Strong,\n pointerEvents: 'none'\n },\n calloutContentRoot: {\n maxWidth: '238px'\n }\n});\nexport const useHeatMapChartStyles = (props)=>{\n const baseStyles = useStyles();\n return {\n root: mergeClasses(heatmapChartClassNames.root, baseStyles.root /*, props.styles?.root*/ ),\n text: mergeClasses(heatmapChartClassNames.text, baseStyles.text /*, props.styles?.text*/ ),\n calloutContentRoot: mergeClasses(heatmapChartClassNames.calloutContentRoot, baseStyles.calloutContentRoot /*, props.styles?.calloutContentRoot*/ )\n };\n};\n"],"mappings":"AAAA,SAAAA,QAAA,EAAqBC,YAAY,QAAQ,gBAAgB;AACzD,SAASC,gBAAgB,QAAQ,uBAAuB;AACxD,OAAO,MAAMC,sBAAsB,GAAG;EAClCC,IAAI,EAAE,eAAe;EACrBC,IAAI,EAAE,eAAe;EACrBC,kBAAkB,EAAE,6BAA6B;EACjDC,KAAK,EAAE,EAAE;EACTC,KAAK,EAAE,EAAE;EACTC,eAAe,EAAE,EAAE;EACnBC,KAAK,EAAE,EAAE;EACTC,kBAAkB,EAAE,EAAE;EACtBC,OAAO,EAAE,EAAE;EACXC,SAAS,EAAE,EAAE;EACbC,UAAU,EAAE,EAAE;EACdC,oBAAoB,EAAE,EAAE;EACxBC,WAAW,EAAE,EAAE;EACfC,YAAY,EAAE,EAAE;EAChBC,UAAU,EAAE,EAAE;EACdC,KAAK,EAAE,EAAE;EACTC,cAAc,EAAE;AACpB,CAAC;AACD,MAAMC,SAAS,gBAAGrB,QAAA;EAAAI,IAAA;EAAAC,IAAA;IAAAiB,OAAA;IAAAC,OAAA;IAAAC,OAAA;IAAAC,OAAA;IAAAC,OAAA;EAAA;EAAApB,kBAAA;IAAAqB,OAAA;EAAA;AAAA;EAAAC,CAAA;AAAA,CASjB,CAAC;AACF,OAAO,MAAMC,qBAAqB,GAAIC,KAAK,IAAG;EAC1C,MAAMC,UAAU,GAAGV,SAAS,CAAC,CAAC;EAC9B,OAAO;IACHjB,IAAI,EAAEH,YAAY,CAACE,sBAAsB,CAACC,IAAI,EAAE2B,UAAU,CAAC3B,IAAI,CAAC,wBAAyB,CAAC;IAC1FC,IAAI,EAAEJ,YAAY,CAACE,sBAAsB,CAACE,IAAI,EAAE0B,UAAU,CAAC1B,IAAI,CAAC,wBAAyB,CAAC;IAC1FC,kBAAkB,EAAEL,YAAY,CAACE,sBAAsB,CAACG,kBAAkB,EAAEyB,UAAU,CAACzB,kBAAkB,CAAC,sCAAuC;EACrJ,CAAC;AACL,CAAC","ignoreList":[]}
package/lib/components/HeatMapChart/useHeatMapChartStyles.styles.raw.js CHANGED
@@ -16,7 +16,8 @@ export const heatmapChartClassNames = {
16
16
  shapeStyles: '',
17
17
  chartWrapper: '',
18
18
  svgTooltip: '',
19
- chart: ''
19
+ chart: '',
20
+ axisAnnotation: ''
20
21
  };
21
22
  const useStyles = makeStyles({
22
23
  root: {},
package/lib/components/HeatMapChart/useHeatMapChartStyles.styles.raw.js.map CHANGED
@@ -1 +1 @@
1
- {"version":3,"sources":["../src/components/HeatMapChart/useHeatMapChartStyles.styles.ts"],"sourcesContent":["import { makeStyles, mergeClasses } from '@griffel/react';\nimport type { HeatMapChartProps, HeatMapChartStyles } from './HeatMapChart.types';\nimport type { SlotClassNames } from '@fluentui/react-utilities';\nimport { typographyStyles } from '@fluentui/react-theme';\n\nexport const heatmapChartClassNames: SlotClassNames<HeatMapChartStyles> = {\n root: 'fui-hmc__root',\n text: 'fui-hmc__text',\n calloutContentRoot: 'fui-hmc__calloutContentRoot',\n xAxis: '',\n yAxis: '',\n legendContainer: '',\n hover: '',\n descriptionMessage: '',\n tooltip: '',\n axisTitle: '',\n chartTitle: '',\n opacityChangeOnHover: '',\n shapeStyles: '',\n chartWrapper: '',\n svgTooltip: '',\n chart: '',\n};\nconst useStyles = makeStyles({\n root: {},\n text: {\n ...typographyStyles.body1Strong,\n pointerEvents: 'none',\n },\n calloutContentRoot: {\n maxWidth: '238px',\n },\n});\n\nexport const useHeatMapChartStyles = (props: HeatMapChartProps): HeatMapChartStyles => {\n const baseStyles = useStyles();\n\n return {\n root: mergeClasses(heatmapChartClassNames.root, baseStyles.root /*, props.styles?.root*/),\n text: mergeClasses(heatmapChartClassNames.text, baseStyles.text /*, props.styles?.text*/),\n calloutContentRoot: mergeClasses(\n heatmapChartClassNames.calloutContentRoot,\n baseStyles.calloutContentRoot /*, props.styles?.calloutContentRoot*/,\n ),\n };\n};\n"],"names":["makeStyles","mergeClasses","typographyStyles","heatmapChartClassNames","root","text","calloutContentRoot","xAxis","yAxis","legendContainer","hover","descriptionMessage","tooltip","axisTitle","chartTitle","opacityChangeOnHover","shapeStyles","chartWrapper","svgTooltip","chart","useStyles","body1Strong","pointerEvents","maxWidth","useHeatMapChartStyles","props","baseStyles"],"mappings":"AAAA,SAASA,UAAU,EAAEC,YAAY,QAAQ,iBAAiB;AAG1D,SAASC,gBAAgB,QAAQ,wBAAwB;AAEzD,OAAO,MAAMC,yBAA6D;IACxEC,MAAM;IACNC,MAAM;IACNC,oBAAoB;IACpBC,OAAO;IACPC,OAAO;IACPC,iBAAiB;IACjBC,OAAO;IACPC,oBAAoB;IACpBC,SAAS;IACTC,WAAW;IACXC,YAAY;IACZC,sBAAsB;IACtBC,aAAa;IACbC,cAAc;IACdC,YAAY;IACZC,OAAO;AACT,EAAE;AACF,MAAMC,YAAYpB,WAAW;IAC3BI,MAAM,CAAC;IACPC,MAAM;QACJ,GAAGH,iBAAiBmB,WAAW;QAC/BC,eAAe;IACjB;IACAhB,oBAAoB;QAClBiB,UAAU;IACZ;AACF;AAEA,OAAO,MAAMC,wBAAwB,CAACC;IACpC,MAAMC,aAAaN;IAEnB,OAAO;QACLhB,MAAMH,aAAaE,uBAAuBC,IAAI,EAAEsB,WAAWtB,IAAI,CAAC,sBAAsB;QACtFC,MAAMJ,aAAaE,uBAAuBE,IAAI,EAAEqB,WAAWrB,IAAI,CAAC,sBAAsB;QACtFC,oBAAoBL,aAClBE,uBAAuBG,kBAAkB,EACzCoB,WAAWpB,kBAAkB,CAAC,oCAAoC;IAEtE;AACF,EAAE"}
1
+ {"version":3,"sources":["../src/components/HeatMapChart/useHeatMapChartStyles.styles.ts"],"sourcesContent":["import { makeStyles, mergeClasses } from '@griffel/react';\nimport type { HeatMapChartProps, HeatMapChartStyles } from './HeatMapChart.types';\nimport type { SlotClassNames } from '@fluentui/react-utilities';\nimport { typographyStyles } from '@fluentui/react-theme';\n\nexport const heatmapChartClassNames: SlotClassNames<HeatMapChartStyles> = {\n root: 'fui-hmc__root',\n text: 'fui-hmc__text',\n calloutContentRoot: 'fui-hmc__calloutContentRoot',\n xAxis: '',\n yAxis: '',\n legendContainer: '',\n hover: '',\n descriptionMessage: '',\n tooltip: '',\n axisTitle: '',\n chartTitle: '',\n opacityChangeOnHover: '',\n shapeStyles: '',\n chartWrapper: '',\n svgTooltip: '',\n chart: '',\n axisAnnotation: '',\n};\nconst useStyles = makeStyles({\n root: {},\n text: {\n ...typographyStyles.body1Strong,\n pointerEvents: 'none',\n },\n calloutContentRoot: {\n maxWidth: '238px',\n },\n});\n\nexport const useHeatMapChartStyles = (props: HeatMapChartProps): HeatMapChartStyles => {\n const baseStyles = useStyles();\n\n return {\n root: mergeClasses(heatmapChartClassNames.root, baseStyles.root /*, props.styles?.root*/),\n text: mergeClasses(heatmapChartClassNames.text, baseStyles.text /*, props.styles?.text*/),\n calloutContentRoot: mergeClasses(\n heatmapChartClassNames.calloutContentRoot,\n baseStyles.calloutContentRoot /*, props.styles?.calloutContentRoot*/,\n ),\n };\n};\n"],"names":["makeStyles","mergeClasses","typographyStyles","heatmapChartClassNames","root","text","calloutContentRoot","xAxis","yAxis","legendContainer","hover","descriptionMessage","tooltip","axisTitle","chartTitle","opacityChangeOnHover","shapeStyles","chartWrapper","svgTooltip","chart","axisAnnotation","useStyles","body1Strong","pointerEvents","maxWidth","useHeatMapChartStyles","props","baseStyles"],"mappings":"AAAA,SAASA,UAAU,EAAEC,YAAY,QAAQ,iBAAiB;AAG1D,SAASC,gBAAgB,QAAQ,wBAAwB;AAEzD,OAAO,MAAMC,yBAA6D;IACxEC,MAAM;IACNC,MAAM;IACNC,oBAAoB;IACpBC,OAAO;IACPC,OAAO;IACPC,iBAAiB;IACjBC,OAAO;IACPC,oBAAoB;IACpBC,SAAS;IACTC,WAAW;IACXC,YAAY;IACZC,sBAAsB;IACtBC,aAAa;IACbC,cAAc;IACdC,YAAY;IACZC,OAAO;IACPC,gBAAgB;AAClB,EAAE;AACF,MAAMC,YAAYrB,WAAW;IAC3BI,MAAM,CAAC;IACPC,MAAM;QACJ,GAAGH,iBAAiBoB,WAAW;QAC/BC,eAAe;IACjB;IACAjB,oBAAoB;QAClBkB,UAAU;IACZ;AACF;AAEA,OAAO,MAAMC,wBAAwB,CAACC;IACpC,MAAMC,aAAaN;IAEnB,OAAO;QACLjB,MAAMH,aAAaE,uBAAuBC,IAAI,EAAEuB,WAAWvB,IAAI,CAAC,sBAAsB;QACtFC,MAAMJ,aAAaE,uBAAuBE,IAAI,EAAEsB,WAAWtB,IAAI,CAAC,sBAAsB;QACtFC,oBAAoBL,aAClBE,uBAAuBG,kBAAkB,EACzCqB,WAAWrB,kBAAkB,CAAC,oCAAoC;IAEtE;AACF,EAAE"}
package/lib/components/HorizontalBarChartWithAxis/useHorizontalBarChartWithAxisStyles.styles.js CHANGED
@@ -20,7 +20,8 @@ export const hbcWithAxisClassNames = {
20
20
  shapeStyles: '',
21
21
  chartWrapper: '',
22
22
  svgTooltip: '',
23
- chart: ''
23
+ chart: '',
24
+ axisAnnotation: ''
24
25
  };
25
26
  const useStyles = /*#__PURE__*/__styles({
26
27
  opacityChangeOnHover: {
package/lib/components/HorizontalBarChartWithAxis/useHorizontalBarChartWithAxisStyles.styles.js.map CHANGED
@@ -1 +1 @@
1
- {"version":3,"names":["__styles","mergeClasses","hbcWithAxisClassNames","opacityChangeOnHover","xAxisTicks","tooltip","chartLabel","xAxisDomain","xAxisText","yAxisDomain","yAxisTicks","yAxisText","root","xAxis","yAxis","legendContainer","hover","descriptionMessage","axisTitle","chartTitle","shapeStyles","chartWrapper","svgTooltip","chart","useStyles","abs64n","d","useHorizontalBarChartWithAxisStyles","props","baseStyles"],"sources":["useHorizontalBarChartWithAxisStyles.styles.js"],"sourcesContent":["import { makeStyles, mergeClasses } from '@griffel/react';\nexport const hbcWithAxisClassNames = {\n opacityChangeOnHover: 'fui-hbcwa__opacityChangeOnHover',\n xAxisTicks: 'fui-hbcwa__xAxisTicks',\n tooltip: 'fui-hbcwa__tooltip',\n chartLabel: '',\n xAxisDomain: '',\n xAxisText: '',\n yAxisDomain: '',\n yAxisTicks: '',\n yAxisText: '',\n root: '',\n xAxis: '',\n yAxis: '',\n legendContainer: '',\n hover: '',\n descriptionMessage: '',\n axisTitle: '',\n chartTitle: '',\n shapeStyles: '',\n chartWrapper: '',\n svgTooltip: '',\n chart: ''\n};\nconst useStyles = makeStyles({\n opacityChangeOnHover: {\n opacity: 0.1\n },\n xAxisTicks: {}\n});\n/**\n * Apply styling to the HorizontalBarChartWithAxis slots based on the state\n */ export const useHorizontalBarChartWithAxisStyles = (props)=>{\n const baseStyles = useStyles();\n return {\n opacityChangeOnHover: mergeClasses(hbcWithAxisClassNames.opacityChangeOnHover, baseStyles.opacityChangeOnHover),\n xAxisTicks: mergeClasses(hbcWithAxisClassNames.xAxisTicks, baseStyles.xAxisTicks)\n };\n};\n"],"mappings":"AAAA,SAAAA,QAAA,EAAqBC,YAAY,QAAQ,gBAAgB;AACzD,OAAO,MAAMC,qBAAqB,GAAG;EACjCC,oBAAoB,EAAE,iCAAiC;EACvDC,UAAU,EAAE,uBAAuB;EACnCC,OAAO,EAAE,oBAAoB;EAC7BC,UAAU,EAAE,EAAE;EACdC,WAAW,EAAE,EAAE;EACfC,SAAS,EAAE,EAAE;EACbC,WAAW,EAAE,EAAE;EACfC,UAAU,EAAE,EAAE;EACdC,SAAS,EAAE,EAAE;EACbC,IAAI,EAAE,EAAE;EACRC,KAAK,EAAE,EAAE;EACTC,KAAK,EAAE,EAAE;EACTC,eAAe,EAAE,EAAE;EACnBC,KAAK,EAAE,EAAE;EACTC,kBAAkB,EAAE,EAAE;EACtBC,SAAS,EAAE,EAAE;EACbC,UAAU,EAAE,EAAE;EACdC,WAAW,EAAE,EAAE;EACfC,YAAY,EAAE,EAAE;EAChBC,UAAU,EAAE,EAAE;EACdC,KAAK,EAAE;AACX,CAAC;AACD,MAAMC,SAAS,gBAAGxB,QAAA;EAAAG,oBAAA;IAAAsB,MAAA;EAAA;EAAArB,UAAA;AAAA;EAAAsB,CAAA;AAAA,CAKjB,CAAC;AACF;AACA;AACA;AAAI,OAAO,MAAMC,mCAAmC,GAAIC,KAAK,IAAG;EAC5D,MAAMC,UAAU,GAAGL,SAAS,CAAC,CAAC;EAC9B,OAAO;IACHrB,oBAAoB,EAAEF,YAAY,CAACC,qBAAqB,CAACC,oBAAoB,EAAE0B,UAAU,CAAC1B,oBAAoB,CAAC;IAC/GC,UAAU,EAAEH,YAAY,CAACC,qBAAqB,CAACE,UAAU,EAAEyB,UAAU,CAACzB,UAAU;EACpF,CAAC;AACL,CAAC","ignoreList":[]}
1
+ {"version":3,"names":["__styles","mergeClasses","hbcWithAxisClassNames","opacityChangeOnHover","xAxisTicks","tooltip","chartLabel","xAxisDomain","xAxisText","yAxisDomain","yAxisTicks","yAxisText","root","xAxis","yAxis","legendContainer","hover","descriptionMessage","axisTitle","chartTitle","shapeStyles","chartWrapper","svgTooltip","chart","axisAnnotation","useStyles","abs64n","d","useHorizontalBarChartWithAxisStyles","props","baseStyles"],"sources":["useHorizontalBarChartWithAxisStyles.styles.js"],"sourcesContent":["import { makeStyles, mergeClasses } from '@griffel/react';\nexport const hbcWithAxisClassNames = {\n opacityChangeOnHover: 'fui-hbcwa__opacityChangeOnHover',\n xAxisTicks: 'fui-hbcwa__xAxisTicks',\n tooltip: 'fui-hbcwa__tooltip',\n chartLabel: '',\n xAxisDomain: '',\n xAxisText: '',\n yAxisDomain: '',\n yAxisTicks: '',\n yAxisText: '',\n root: '',\n xAxis: '',\n yAxis: '',\n legendContainer: '',\n hover: '',\n descriptionMessage: '',\n axisTitle: '',\n chartTitle: '',\n shapeStyles: '',\n chartWrapper: '',\n svgTooltip: '',\n chart: '',\n axisAnnotation: ''\n};\nconst useStyles = makeStyles({\n opacityChangeOnHover: {\n opacity: 0.1\n },\n xAxisTicks: {}\n});\n/**\n * Apply styling to the HorizontalBarChartWithAxis slots based on the state\n */ export const useHorizontalBarChartWithAxisStyles = (props)=>{\n const baseStyles = useStyles();\n return {\n opacityChangeOnHover: mergeClasses(hbcWithAxisClassNames.opacityChangeOnHover, baseStyles.opacityChangeOnHover),\n xAxisTicks: mergeClasses(hbcWithAxisClassNames.xAxisTicks, baseStyles.xAxisTicks)\n };\n};\n"],"mappings":"AAAA,SAAAA,QAAA,EAAqBC,YAAY,QAAQ,gBAAgB;AACzD,OAAO,MAAMC,qBAAqB,GAAG;EACjCC,oBAAoB,EAAE,iCAAiC;EACvDC,UAAU,EAAE,uBAAuB;EACnCC,OAAO,EAAE,oBAAoB;EAC7BC,UAAU,EAAE,EAAE;EACdC,WAAW,EAAE,EAAE;EACfC,SAAS,EAAE,EAAE;EACbC,WAAW,EAAE,EAAE;EACfC,UAAU,EAAE,EAAE;EACdC,SAAS,EAAE,EAAE;EACbC,IAAI,EAAE,EAAE;EACRC,KAAK,EAAE,EAAE;EACTC,KAAK,EAAE,EAAE;EACTC,eAAe,EAAE,EAAE;EACnBC,KAAK,EAAE,EAAE;EACTC,kBAAkB,EAAE,EAAE;EACtBC,SAAS,EAAE,EAAE;EACbC,UAAU,EAAE,EAAE;EACdC,WAAW,EAAE,EAAE;EACfC,YAAY,EAAE,EAAE;EAChBC,UAAU,EAAE,EAAE;EACdC,KAAK,EAAE,EAAE;EACTC,cAAc,EAAE;AACpB,CAAC;AACD,MAAMC,SAAS,gBAAGzB,QAAA;EAAAG,oBAAA;IAAAuB,MAAA;EAAA;EAAAtB,UAAA;AAAA;EAAAuB,CAAA;AAAA,CAKjB,CAAC;AACF;AACA;AACA;AAAI,OAAO,MAAMC,mCAAmC,GAAIC,KAAK,IAAG;EAC5D,MAAMC,UAAU,GAAGL,SAAS,CAAC,CAAC;EAC9B,OAAO;IACHtB,oBAAoB,EAAEF,YAAY,CAACC,qBAAqB,CAACC,oBAAoB,EAAE2B,UAAU,CAAC3B,oBAAoB,CAAC;IAC/GC,UAAU,EAAEH,YAAY,CAACC,qBAAqB,CAACE,UAAU,EAAE0B,UAAU,CAAC1B,UAAU;EACpF,CAAC;AACL,CAAC","ignoreList":[]}
package/lib/components/HorizontalBarChartWithAxis/useHorizontalBarChartWithAxisStyles.styles.raw.js CHANGED
@@ -20,7 +20,8 @@ export const hbcWithAxisClassNames = {
20
20
  shapeStyles: '',
21
21
  chartWrapper: '',
22
22
  svgTooltip: '',
23
- chart: ''
23
+ chart: '',
24
+ axisAnnotation: ''
24
25
  };
25
26
  const useStyles = makeStyles({
26
27
  opacityChangeOnHover: {
package/lib/components/HorizontalBarChartWithAxis/useHorizontalBarChartWithAxisStyles.styles.raw.js.map CHANGED
@@ -1 +1 @@
1
- {"version":3,"sources":["../src/components/HorizontalBarChartWithAxis/useHorizontalBarChartWithAxisStyles.styles.ts"],"sourcesContent":["import { makeStyles, mergeClasses } from '@griffel/react';\nimport { HorizontalBarChartWithAxisProps, HorizontalBarChartWithAxisStyles } from './index';\nimport { SlotClassNames } from '@fluentui/react-utilities';\n\nexport const hbcWithAxisClassNames: SlotClassNames<HorizontalBarChartWithAxisStyles> = {\n opacityChangeOnHover: 'fui-hbcwa__opacityChangeOnHover',\n xAxisTicks: 'fui-hbcwa__xAxisTicks',\n tooltip: 'fui-hbcwa__tooltip',\n chartLabel: '',\n xAxisDomain: '',\n xAxisText: '',\n yAxisDomain: '',\n yAxisTicks: '',\n yAxisText: '',\n root: '',\n xAxis: '',\n yAxis: '',\n legendContainer: '',\n hover: '',\n descriptionMessage: '',\n axisTitle: '',\n chartTitle: '',\n shapeStyles: '',\n chartWrapper: '',\n svgTooltip: '',\n chart: '',\n};\n\nconst useStyles = makeStyles({\n opacityChangeOnHover: {\n opacity: 0.1, // supports custom opacity\n },\n\n xAxisTicks: {},\n});\n\n/**\n * Apply styling to the HorizontalBarChartWithAxis slots based on the state\n */\nexport const useHorizontalBarChartWithAxisStyles = (\n props: HorizontalBarChartWithAxisProps,\n): HorizontalBarChartWithAxisStyles => {\n const baseStyles = useStyles();\n\n return {\n opacityChangeOnHover: mergeClasses(hbcWithAxisClassNames.opacityChangeOnHover, baseStyles.opacityChangeOnHover),\n xAxisTicks: mergeClasses(hbcWithAxisClassNames.xAxisTicks, baseStyles.xAxisTicks),\n };\n};\n"],"names":["makeStyles","mergeClasses","hbcWithAxisClassNames","opacityChangeOnHover","xAxisTicks","tooltip","chartLabel","xAxisDomain","xAxisText","yAxisDomain","yAxisTicks","yAxisText","root","xAxis","yAxis","legendContainer","hover","descriptionMessage","axisTitle","chartTitle","shapeStyles","chartWrapper","svgTooltip","chart","useStyles","opacity","useHorizontalBarChartWithAxisStyles","props","baseStyles"],"mappings":"AAAA,SAASA,UAAU,EAAEC,YAAY,QAAQ,iBAAiB;AAI1D,OAAO,MAAMC,wBAA0E;IACrFC,sBAAsB;IACtBC,YAAY;IACZC,SAAS;IACTC,YAAY;IACZC,aAAa;IACbC,WAAW;IACXC,aAAa;IACbC,YAAY;IACZC,WAAW;IACXC,MAAM;IACNC,OAAO;IACPC,OAAO;IACPC,iBAAiB;IACjBC,OAAO;IACPC,oBAAoB;IACpBC,WAAW;IACXC,YAAY;IACZC,aAAa;IACbC,cAAc;IACdC,YAAY;IACZC,OAAO;AACT,EAAE;AAEF,MAAMC,YAAYxB,WAAW;IAC3BG,sBAAsB;QACpBsB,SAAS;IACX;IAEArB,YAAY,CAAC;AACf;AAEA;;CAEC,GACD,OAAO,MAAMsB,sCAAsC,CACjDC;IAEA,MAAMC,aAAaJ;IAEnB,OAAO;QACLrB,sBAAsBF,aAAaC,sBAAsBC,oBAAoB,EAAEyB,WAAWzB,oBAAoB;QAC9GC,YAAYH,aAAaC,sBAAsBE,UAAU,EAAEwB,WAAWxB,UAAU;IAClF;AACF,EAAE"}
1
+ {"version":3,"sources":["../src/components/HorizontalBarChartWithAxis/useHorizontalBarChartWithAxisStyles.styles.ts"],"sourcesContent":["import { makeStyles, mergeClasses } from '@griffel/react';\nimport { HorizontalBarChartWithAxisProps, HorizontalBarChartWithAxisStyles } from './index';\nimport { SlotClassNames } from '@fluentui/react-utilities';\n\nexport const hbcWithAxisClassNames: SlotClassNames<HorizontalBarChartWithAxisStyles> = {\n opacityChangeOnHover: 'fui-hbcwa__opacityChangeOnHover',\n xAxisTicks: 'fui-hbcwa__xAxisTicks',\n tooltip: 'fui-hbcwa__tooltip',\n chartLabel: '',\n xAxisDomain: '',\n xAxisText: '',\n yAxisDomain: '',\n yAxisTicks: '',\n yAxisText: '',\n root: '',\n xAxis: '',\n yAxis: '',\n legendContainer: '',\n hover: '',\n descriptionMessage: '',\n axisTitle: '',\n chartTitle: '',\n shapeStyles: '',\n chartWrapper: '',\n svgTooltip: '',\n chart: '',\n axisAnnotation: '',\n};\n\nconst useStyles = makeStyles({\n opacityChangeOnHover: {\n opacity: 0.1, // supports custom opacity\n },\n\n xAxisTicks: {},\n});\n\n/**\n * Apply styling to the HorizontalBarChartWithAxis slots based on the state\n */\nexport const useHorizontalBarChartWithAxisStyles = (\n props: HorizontalBarChartWithAxisProps,\n): HorizontalBarChartWithAxisStyles => {\n const baseStyles = useStyles();\n\n return {\n opacityChangeOnHover: mergeClasses(hbcWithAxisClassNames.opacityChangeOnHover, baseStyles.opacityChangeOnHover),\n xAxisTicks: mergeClasses(hbcWithAxisClassNames.xAxisTicks, baseStyles.xAxisTicks),\n };\n};\n"],"names":["makeStyles","mergeClasses","hbcWithAxisClassNames","opacityChangeOnHover","xAxisTicks","tooltip","chartLabel","xAxisDomain","xAxisText","yAxisDomain","yAxisTicks","yAxisText","root","xAxis","yAxis","legendContainer","hover","descriptionMessage","axisTitle","chartTitle","shapeStyles","chartWrapper","svgTooltip","chart","axisAnnotation","useStyles","opacity","useHorizontalBarChartWithAxisStyles","props","baseStyles"],"mappings":"AAAA,SAASA,UAAU,EAAEC,YAAY,QAAQ,iBAAiB;AAI1D,OAAO,MAAMC,wBAA0E;IACrFC,sBAAsB;IACtBC,YAAY;IACZC,SAAS;IACTC,YAAY;IACZC,aAAa;IACbC,WAAW;IACXC,aAAa;IACbC,YAAY;IACZC,WAAW;IACXC,MAAM;IACNC,OAAO;IACPC,OAAO;IACPC,iBAAiB;IACjBC,OAAO;IACPC,oBAAoB;IACpBC,WAAW;IACXC,YAAY;IACZC,aAAa;IACbC,cAAc;IACdC,YAAY;IACZC,OAAO;IACPC,gBAAgB;AAClB,EAAE;AAEF,MAAMC,YAAYzB,WAAW;IAC3BG,sBAAsB;QACpBuB,SAAS;IACX;IAEAtB,YAAY,CAAC;AACf;AAEA;;CAEC,GACD,OAAO,MAAMuB,sCAAsC,CACjDC;IAEA,MAAMC,aAAaJ;IAEnB,OAAO;QACLtB,sBAAsBF,aAAaC,sBAAsBC,oBAAoB,EAAE0B,WAAW1B,oBAAoB;QAC9GC,YAAYH,aAAaC,sBAAsBE,UAAU,EAAEyB,WAAWzB,UAAU;IAClF;AACF,EAAE"}
package/lib/components/LineChart/LineChart.js CHANGED
@@ -437,7 +437,8 @@ const PATH_MULTIPLY_SIZE = 2.5;
437
437
  const circleId = `${_circleId}_${i}`;
438
438
  const isLegendSelected = _legendHighlighted(legendVal) || _noLegendHighlighted() || isSelectedLegend;
439
439
  const currentMarkerSize = _points[i].data[0].markerSize;
440
- pointsForLine.push(/*#__PURE__*/ React.createElement("circle", {
440
+ var _points_i_data__text;
441
+ pointsForLine.push(/*#__PURE__*/ React.createElement(React.Fragment, null, /*#__PURE__*/ React.createElement("circle", {
441
442
  id: circleId,
442
443
  key: circleId,
443
444
  r: currentMarkerSize ? currentMarkerSize * extraMaxPixels / maxMarkerSize : activePoint === circleId ? 5.5 : 3.5,
@@ -452,7 +453,7 @@ const PATH_MULTIPLY_SIZE = 2.5;
452
453
  strokeWidth: activePoint === circleId ? DEFAULT_LINE_STROKE_SIZE : 0,
453
454
  stroke: activePoint === circleId ? lineColor : '',
454
455
  role: "img",
455
- "aria-label": _getAriaLabel(i, 0),
456
+ "aria-label": (_points_i_data__text = _points[i].data[0].text) !== null && _points_i_data__text !== void 0 ? _points_i_data__text : _getAriaLabel(i, 0),
456
457
  "data-is-focusable": isLegendSelected,
457
458
  ref: (e)=>{
458
459
  _refCallback(e, circleId);
@@ -460,7 +461,13 @@ const PATH_MULTIPLY_SIZE = 2.5;
460
461
  onFocus: (event)=>_handleFocus(event, circleId, x1, xAxisCalloutData, circleId, xAxisCalloutAccessibilityData),
461
462
  onBlur: _handleMouseOut,
462
463
  ..._getClickHandler(_points[i].data[0].onDataPointClick)
463
- }));
464
+ }), _points[i].data[0].text && /*#__PURE__*/ React.createElement("text", {
465
+ key: `${circleId}-label`,
466
+ x: _xAxisScale(x1),
467
+ y: yScale(y1) + Math.max(currentMarkerSize ? currentMarkerSize * extraMaxPixels / maxMarkerSize : 3.5, 4) + 12,
468
+ className: classes.markerLabel,
469
+ opacity: isLegendSelected ? 1 : 0.1
470
+ }, _points[i].data[0].text)));
464
471
  }
465
472
  let gapIndex = 0;
466
473
  var _points_i_gaps_sort;
@@ -562,7 +569,8 @@ const PATH_MULTIPLY_SIZE = 2.5;
562
569
  const isLegendSelected = _legendHighlighted(legendVal) || _noLegendHighlighted() || isSelectedLegend;
563
570
  const currentPointHidden = _points[i].hideNonActiveDots && activePoint !== circleId;
564
571
  let currentMarkerSize = _points[i].data[j - 1].markerSize;
565
- pointsForLine.push(((_points_i_lineOptions8 = _points[i].lineOptions) === null || _points_i_lineOptions8 === void 0 ? void 0 : (_points_i_lineOptions_mode = _points_i_lineOptions8.mode) === null || _points_i_lineOptions_mode === void 0 ? void 0 : _points_i_lineOptions_mode.includes('markers')) ? /*#__PURE__*/ React.createElement("circle", {
572
+ var _points_i_data__text1;
573
+ pointsForLine.push(((_points_i_lineOptions8 = _points[i].lineOptions) === null || _points_i_lineOptions8 === void 0 ? void 0 : (_points_i_lineOptions_mode = _points_i_lineOptions8.mode) === null || _points_i_lineOptions_mode === void 0 ? void 0 : _points_i_lineOptions_mode.includes('markers')) ? /*#__PURE__*/ React.createElement(React.Fragment, null, /*#__PURE__*/ React.createElement("circle", {
566
574
  id: circleId,
567
575
  key: circleId,
568
576
  r: currentMarkerSize ? currentMarkerSize * extraMaxPixels / maxMarkerSize : 4,
@@ -580,8 +588,14 @@ const PATH_MULTIPLY_SIZE = 2.5;
580
588
  stroke: lineColor,
581
589
  strokeWidth: strokeWidth,
582
590
  role: "img",
583
- "aria-label": _getAriaLabel(i, j - 1)
584
- }) : /*#__PURE__*/ React.createElement("path", {
591
+ "aria-label": (_points_i_data__text1 = _points[i].data[j - 1].text) !== null && _points_i_data__text1 !== void 0 ? _points_i_data__text1 : _getAriaLabel(i, j - 1)
592
+ }), _points[i].data[j - 1].text && /*#__PURE__*/ React.createElement("text", {
593
+ key: `${circleId}-label`,
594
+ x: _xAxisScale(x1),
595
+ y: yScale(y1) + 12,
596
+ fontSize: 12,
597
+ className: classes.markerLabel
598
+ }, _points[i].data[j - 1].text)) : /*#__PURE__*/ React.createElement("path", {
585
599
  id: circleId,
586
600
  key: circleId,
587
601
  d: path,
@@ -609,9 +623,10 @@ const PATH_MULTIPLY_SIZE = 2.5;
609
623
  path = _getPath(_xAxisScale(x2), yScale(y2), lastCircleId, j, true, _points[i].index);
610
624
  const { xAxisCalloutData: lastCirlceXCallout, xAxisCalloutAccessibilityData: lastCirlceXCalloutAccessibilityData } = _points[i].data[j];
611
625
  currentMarkerSize = _points[i].data[j].markerSize;
626
+ var _points_i_data_j_text;
612
627
  pointsForLine.push(/*#__PURE__*/ React.createElement(React.Fragment, {
613
628
  key: `${lastCircleId}_container`
614
- }, ((_points_i_lineOptions10 = _points[i].lineOptions) === null || _points_i_lineOptions10 === void 0 ? void 0 : (_points_i_lineOptions_mode2 = _points_i_lineOptions10.mode) === null || _points_i_lineOptions_mode2 === void 0 ? void 0 : _points_i_lineOptions_mode2.includes('markers')) ? /*#__PURE__*/ React.createElement("circle", {
629
+ }, ((_points_i_lineOptions10 = _points[i].lineOptions) === null || _points_i_lineOptions10 === void 0 ? void 0 : (_points_i_lineOptions_mode2 = _points_i_lineOptions10.mode) === null || _points_i_lineOptions_mode2 === void 0 ? void 0 : _points_i_lineOptions_mode2.includes('markers')) ? /*#__PURE__*/ React.createElement(React.Fragment, null, /*#__PURE__*/ React.createElement("circle", {
615
630
  id: lastCircleId,
616
631
  key: lastCircleId,
617
632
  r: currentMarkerSize ? currentMarkerSize * extraMaxPixels / maxMarkerSize : 4,
@@ -629,8 +644,14 @@ const PATH_MULTIPLY_SIZE = 2.5;
629
644
  stroke: lineColor,
630
645
  strokeWidth: strokeWidth,
631
646
  role: "img",
632
- "aria-label": _getAriaLabel(i, j)
633
- }) : /*#__PURE__*/ React.createElement("path", {
647
+ "aria-label": (_points_i_data_j_text = _points[i].data[j].text) !== null && _points_i_data_j_text !== void 0 ? _points_i_data_j_text : _getAriaLabel(i, j)
648
+ }), _points[i].data[j].text && /*#__PURE__*/ React.createElement("text", {
649
+ key: `${lastCircleId}-label`,
650
+ x: _xAxisScale(x2),
651
+ y: yScale(y2) + 12,
652
+ fontSize: 12,
653
+ className: classes.markerLabel
654
+ }, _points[i].data[j].text)) : /*#__PURE__*/ React.createElement("path", {
634
655
  id: lastCircleId,
635
656
  key: lastCircleId,
636
657
  d: path,