@fluentui/react-charts 9.1.10 → 9.2.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.
- package/CHANGELOG.md +41 -2
- package/dist/index.d.ts +44 -3
- package/lib/AreaChart.js.map +1 -1
- package/lib/CartesianChart.js.map +1 -1
- package/lib/DeclarativeChart.js.map +1 -1
- package/lib/DonutChart.js.map +1 -1
- package/lib/FunnelChart.js.map +1 -1
- package/lib/GanttChart.js.map +1 -1
- package/lib/GaugeChart.js.map +1 -1
- package/lib/GroupedVerticalBarChart.js.map +1 -1
- package/lib/HeatMapChart.js.map +1 -1
- package/lib/HorizontalBarChart.js.map +1 -1
- package/lib/HorizontalBarChartWithAxis.js.map +1 -1
- package/lib/Legends.js.map +1 -1
- package/lib/LineChart.js.map +1 -1
- package/lib/Popover.js.map +1 -1
- package/lib/ResponsiveContainer.js.map +1 -1
- package/lib/SankeyChart.js.map +1 -1
- package/lib/ScatterChart.js.map +1 -1
- package/lib/Sparkline.js.map +1 -1
- package/lib/VerticalBarChart.js.map +1 -1
- package/lib/VerticalStackedBarChart.js.map +1 -1
- package/lib/components/AreaChart/AreaChart.js +11 -3
- package/lib/components/AreaChart/AreaChart.js.map +1 -1
- package/lib/components/AreaChart/AreaChart.types.js.map +1 -1
- package/lib/components/AreaChart/index.js.map +1 -1
- package/lib/components/AreaChart/useAreaChartStyles.styles.js +1 -2
- package/lib/components/AreaChart/useAreaChartStyles.styles.raw.js +41 -0
- package/lib/components/AreaChart/useAreaChartStyles.styles.raw.js.map +1 -0
- package/lib/components/CommonComponents/CartesianChart.js +2 -1
- package/lib/components/CommonComponents/CartesianChart.js.map +1 -1
- package/lib/components/CommonComponents/CartesianChart.types.js.map +1 -1
- package/lib/components/CommonComponents/ChartPopover.js.map +1 -1
- package/lib/components/CommonComponents/ChartPopover.types.js.map +1 -1
- package/lib/components/CommonComponents/index.js.map +1 -1
- package/lib/components/CommonComponents/useCartesianChartStyles.styles.js +1 -2
- package/lib/components/CommonComponents/useCartesianChartStyles.styles.raw.js +128 -0
- package/lib/components/CommonComponents/useCartesianChartStyles.styles.raw.js.map +1 -0
- package/lib/components/CommonComponents/useChartPopoverStyles.styles.js +1 -2
- package/lib/components/CommonComponents/useChartPopoverStyles.styles.raw.js +126 -0
- package/lib/components/CommonComponents/useChartPopoverStyles.styles.raw.js.map +1 -0
- package/lib/components/DeclarativeChart/DeclarativeChart.js +15 -7
- package/lib/components/DeclarativeChart/DeclarativeChart.js.map +1 -1
- package/lib/components/DeclarativeChart/PlotlySchemaAdapter.js +90 -29
- package/lib/components/DeclarativeChart/PlotlySchemaAdapter.js.map +1 -1
- package/lib/components/DeclarativeChart/imageExporter.js +1 -0
- package/lib/components/DeclarativeChart/imageExporter.js.map +1 -1
- package/lib/components/DeclarativeChart/index.js.map +1 -1
- package/lib/components/DonutChart/Arc/Arc.js.map +1 -1
- package/lib/components/DonutChart/Arc/Arc.types.js.map +1 -1
- package/lib/components/DonutChart/Arc/index.js.map +1 -1
- package/lib/components/DonutChart/Arc/useArcStyles.styles.js +1 -2
- package/lib/components/DonutChart/Arc/useArcStyles.styles.raw.js +44 -0
- package/lib/components/DonutChart/Arc/useArcStyles.styles.raw.js.map +1 -0
- package/lib/components/DonutChart/DonutChart.js +11 -3
- package/lib/components/DonutChart/DonutChart.js.map +1 -1
- package/lib/components/DonutChart/DonutChart.types.js.map +1 -1
- package/lib/components/DonutChart/Pie/Pie.js.map +1 -1
- package/lib/components/DonutChart/Pie/Pie.types.js.map +1 -1
- package/lib/components/DonutChart/Pie/index.js.map +1 -1
- package/lib/components/DonutChart/Pie/usePieStyles.styles.js +1 -2
- package/lib/components/DonutChart/Pie/usePieStyles.styles.raw.js +29 -0
- package/lib/components/DonutChart/Pie/usePieStyles.styles.raw.js.map +1 -0
- package/lib/components/DonutChart/index.js.map +1 -1
- package/lib/components/DonutChart/useDonutChartStyles.styles.js +1 -2
- package/lib/components/DonutChart/useDonutChartStyles.styles.raw.js +45 -0
- package/lib/components/DonutChart/useDonutChartStyles.styles.raw.js.map +1 -0
- package/lib/components/FunnelChart/FunnelChart.js +10 -1
- package/lib/components/FunnelChart/FunnelChart.js.map +1 -1
- package/lib/components/FunnelChart/FunnelChart.types.js.map +1 -1
- package/lib/components/FunnelChart/funnelGeometry.js.map +1 -1
- package/lib/components/FunnelChart/index.js.map +1 -1
- package/lib/components/FunnelChart/useFunnelChartStyles.styles.js +1 -2
- package/lib/components/FunnelChart/useFunnelChartStyles.styles.raw.js +51 -0
- package/lib/components/FunnelChart/useFunnelChartStyles.styles.raw.js.map +1 -0
- package/lib/components/GanttChart/GanttChart.js +19 -2
- package/lib/components/GanttChart/GanttChart.js.map +1 -1
- package/lib/components/GanttChart/GanttChart.types.js.map +1 -1
- package/lib/components/GanttChart/index.js.map +1 -1
- package/lib/components/GanttChart/useGanttChartStyles.styles.js +1 -2
- package/lib/components/GanttChart/useGanttChartStyles.styles.raw.js +23 -0
- package/lib/components/GanttChart/useGanttChartStyles.styles.raw.js.map +1 -0
- package/lib/components/GaugeChart/GaugeChart.js +9 -2
- package/lib/components/GaugeChart/GaugeChart.js.map +1 -1
- package/lib/components/GaugeChart/GaugeChart.types.js.map +1 -1
- package/lib/components/GaugeChart/index.js.map +1 -1
- package/lib/components/GaugeChart/useGaugeChartStyles.styles.js +1 -2
- package/lib/components/GaugeChart/useGaugeChartStyles.styles.raw.js +142 -0
- package/lib/components/GaugeChart/useGaugeChartStyles.styles.raw.js.map +1 -0
- package/lib/components/GroupedVerticalBarChart/GroupedVerticalBarChart.js +70 -58
- package/lib/components/GroupedVerticalBarChart/GroupedVerticalBarChart.js.map +1 -1
- package/lib/components/GroupedVerticalBarChart/GroupedVerticalBarChart.types.js.map +1 -1
- package/lib/components/GroupedVerticalBarChart/index.js.map +1 -1
- package/lib/components/GroupedVerticalBarChart/useGroupedVerticalBarChartStyles.styles.js +1 -2
- package/lib/components/GroupedVerticalBarChart/useGroupedVerticalBarChartStyles.styles.raw.js +53 -0
- package/lib/components/GroupedVerticalBarChart/useGroupedVerticalBarChartStyles.styles.raw.js.map +1 -0
- package/lib/components/HeatMapChart/HeatMapChart.js +11 -3
- package/lib/components/HeatMapChart/HeatMapChart.js.map +1 -1
- package/lib/components/HeatMapChart/HeatMapChart.types.js.map +1 -1
- package/lib/components/HeatMapChart/index.js.map +1 -1
- package/lib/components/HeatMapChart/useHeatMapChartStyles.styles.js +1 -2
- package/lib/components/HeatMapChart/useHeatMapChartStyles.styles.raw.js +38 -0
- package/lib/components/HeatMapChart/useHeatMapChartStyles.styles.raw.js.map +1 -0
- package/lib/components/HorizontalBarChart/HorizontalBarChart.js +23 -26
- package/lib/components/HorizontalBarChart/HorizontalBarChart.js.map +1 -1
- package/lib/components/HorizontalBarChart/HorizontalBarChart.types.js.map +1 -1
- package/lib/components/HorizontalBarChart/index.js.map +1 -1
- package/lib/components/HorizontalBarChart/useHorizontalBarChartStyles.styles.js +1 -2
- package/lib/components/HorizontalBarChart/useHorizontalBarChartStyles.styles.raw.js +120 -0
- package/lib/components/HorizontalBarChart/useHorizontalBarChartStyles.styles.raw.js.map +1 -0
- package/lib/components/HorizontalBarChartWithAxis/HorizontalBarChartWithAxis.js +9 -2
- package/lib/components/HorizontalBarChartWithAxis/HorizontalBarChartWithAxis.js.map +1 -1
- package/lib/components/HorizontalBarChartWithAxis/HorizontalBarChartWithAxis.types.js.map +1 -1
- package/lib/components/HorizontalBarChartWithAxis/index.js.map +1 -1
- package/lib/components/HorizontalBarChartWithAxis/useHorizontalBarChartWithAxisStyles.styles.js +1 -2
- package/lib/components/HorizontalBarChartWithAxis/useHorizontalBarChartWithAxisStyles.styles.raw.js +39 -0
- package/lib/components/HorizontalBarChartWithAxis/useHorizontalBarChartWithAxisStyles.styles.raw.js.map +1 -0
- package/lib/components/Legends/Legends.js +28 -10
- package/lib/components/Legends/Legends.js.map +1 -1
- package/lib/components/Legends/Legends.types.js.map +1 -1
- package/lib/components/Legends/OverflowMenu.js.map +1 -1
- package/lib/components/Legends/index.js.map +1 -1
- package/lib/components/Legends/shape.js.map +1 -1
- package/lib/components/Legends/useLegendsStyles.styles.js +57 -14
- package/lib/components/Legends/useLegendsStyles.styles.js.map +1 -1
- package/lib/components/Legends/useLegendsStyles.styles.raw.js +138 -0
- package/lib/components/Legends/useLegendsStyles.styles.raw.js.map +1 -0
- package/lib/components/LineChart/LineChart.js +9 -2
- package/lib/components/LineChart/LineChart.js.map +1 -1
- package/lib/components/LineChart/LineChart.types.js.map +1 -1
- package/lib/components/LineChart/eventAnnotation/EventAnnotation.js.map +1 -1
- package/lib/components/LineChart/eventAnnotation/LabelLink.js.map +1 -1
- package/lib/components/LineChart/eventAnnotation/Textbox.js.map +1 -1
- package/lib/components/LineChart/index.js.map +1 -1
- package/lib/components/LineChart/useLineChartStyles.styles.js +1 -2
- package/lib/components/LineChart/useLineChartStyles.styles.raw.js +52 -0
- package/lib/components/LineChart/useLineChartStyles.styles.raw.js.map +1 -0
- package/lib/components/ResponsiveContainer/ResponsiveContainer.js.map +1 -1
- package/lib/components/ResponsiveContainer/ResponsiveContainer.types.js.map +1 -1
- package/lib/components/ResponsiveContainer/index.js.map +1 -1
- package/lib/components/ResponsiveContainer/useResponsiveChildStyles.styles.js +1 -2
- package/lib/components/ResponsiveContainer/useResponsiveChildStyles.styles.raw.js +28 -0
- package/lib/components/ResponsiveContainer/useResponsiveChildStyles.styles.raw.js.map +1 -0
- package/lib/components/ResponsiveContainer/withResponsiveContainer.js.map +1 -1
- package/lib/components/SankeyChart/SankeyChart.js +5 -1
- package/lib/components/SankeyChart/SankeyChart.js.map +1 -1
- package/lib/components/SankeyChart/SankeyChart.types.js.map +1 -1
- package/lib/components/SankeyChart/index.js.map +1 -1
- package/lib/components/SankeyChart/useSankeyChartStyles.styles.js +1 -2
- package/lib/components/SankeyChart/useSankeyChartStyles.styles.raw.js +77 -0
- package/lib/components/SankeyChart/useSankeyChartStyles.styles.raw.js.map +1 -0
- package/lib/components/ScatterChart/ScatterChart.js +11 -3
- package/lib/components/ScatterChart/ScatterChart.js.map +1 -1
- package/lib/components/ScatterChart/ScatterChart.types.js.map +1 -1
- package/lib/components/ScatterChart/index.js.map +1 -1
- package/lib/components/ScatterChart/useScatterChartStyles.styles.js +1 -2
- package/lib/components/ScatterChart/useScatterChartStyles.styles.raw.js +43 -0
- package/lib/components/ScatterChart/useScatterChartStyles.styles.raw.js.map +1 -0
- package/lib/components/Sparkline/Sparkline.js.map +1 -1
- package/lib/components/Sparkline/Sparkline.types.js.map +1 -1
- package/lib/components/Sparkline/index.js.map +1 -1
- package/lib/components/Sparkline/useSparklineStyles.styles.js +1 -2
- package/lib/components/Sparkline/useSparklineStyles.styles.raw.js +30 -0
- package/lib/components/Sparkline/useSparklineStyles.styles.raw.js.map +1 -0
- package/lib/components/VerticalBarChart/VerticalBarChart.js +62 -28
- package/lib/components/VerticalBarChart/VerticalBarChart.js.map +1 -1
- package/lib/components/VerticalBarChart/VerticalBarChart.types.js.map +1 -1
- package/lib/components/VerticalBarChart/index.js.map +1 -1
- package/lib/components/VerticalBarChart/useVerticalBarChartStyles.styles.js +1 -2
- package/lib/components/VerticalBarChart/useVerticalBarChartStyles.styles.raw.js +58 -0
- package/lib/components/VerticalBarChart/useVerticalBarChartStyles.styles.raw.js.map +1 -0
- package/lib/components/VerticalStackedBarChart/VerticalStackedBarChart.js +22 -8
- package/lib/components/VerticalStackedBarChart/VerticalStackedBarChart.js.map +1 -1
- package/lib/components/VerticalStackedBarChart/VerticalStackedBarChart.types.js.map +1 -1
- package/lib/components/VerticalStackedBarChart/index.js.map +1 -1
- package/lib/components/VerticalStackedBarChart/useVerticalStackedBarChartStyles.styles.js +1 -2
- package/lib/components/VerticalStackedBarChart/useVerticalStackedBarChartStyles.styles.raw.js +49 -0
- package/lib/components/VerticalStackedBarChart/useVerticalStackedBarChartStyles.styles.raw.js.map +1 -0
- package/lib/index.js.map +1 -1
- package/lib/types/DataPoint.js.map +1 -1
- package/lib/types/EventAnnotation.js.map +1 -1
- package/lib/types/LegendDataItem.js.map +1 -1
- package/lib/types/index.js.map +1 -1
- package/lib/utilities/FocusableTooltipText.js.map +1 -1
- package/lib/utilities/KeyCodes.js.map +1 -1
- package/lib/utilities/SVGTooltipText.js +2 -0
- package/lib/utilities/SVGTooltipText.js.map +1 -1
- package/lib/utilities/async-utils.js.map +1 -1
- package/lib/utilities/colors.js.map +1 -1
- package/lib/utilities/getWindow.js.map +1 -1
- package/lib/utilities/image-export-utils.js +256 -0
- package/lib/utilities/image-export-utils.js.map +1 -0
- package/lib/utilities/index.js.map +1 -1
- package/lib/utilities/overflow-utils.js.map +1 -1
- package/lib/utilities/string.js.map +1 -1
- package/lib/utilities/test-data.js.map +1 -1
- package/lib/utilities/utilities.js +50 -5
- package/lib/utilities/utilities.js.map +1 -1
- package/lib/utilities/vbc-utils.js.map +1 -1
- package/lib-commonjs/AreaChart.js.map +1 -1
- package/lib-commonjs/CartesianChart.js.map +1 -1
- package/lib-commonjs/DeclarativeChart.js.map +1 -1
- package/lib-commonjs/DonutChart.js.map +1 -1
- package/lib-commonjs/FunnelChart.js.map +1 -1
- package/lib-commonjs/GanttChart.js.map +1 -1
- package/lib-commonjs/GaugeChart.js.map +1 -1
- package/lib-commonjs/GroupedVerticalBarChart.js.map +1 -1
- package/lib-commonjs/HeatMapChart.js.map +1 -1
- package/lib-commonjs/HorizontalBarChart.js.map +1 -1
- package/lib-commonjs/HorizontalBarChartWithAxis.js.map +1 -1
- package/lib-commonjs/Legends.js.map +1 -1
- package/lib-commonjs/LineChart.js.map +1 -1
- package/lib-commonjs/Popover.js.map +1 -1
- package/lib-commonjs/ResponsiveContainer.js.map +1 -1
- package/lib-commonjs/SankeyChart.js.map +1 -1
- package/lib-commonjs/ScatterChart.js.map +1 -1
- package/lib-commonjs/Sparkline.js.map +1 -1
- package/lib-commonjs/VerticalBarChart.js.map +1 -1
- package/lib-commonjs/VerticalStackedBarChart.js.map +1 -1
- package/lib-commonjs/components/AreaChart/AreaChart.js +10 -2
- package/lib-commonjs/components/AreaChart/AreaChart.js.map +1 -1
- package/lib-commonjs/components/AreaChart/AreaChart.types.js.map +1 -1
- package/lib-commonjs/components/AreaChart/index.js.map +1 -1
- package/lib-commonjs/components/AreaChart/useAreaChartStyles.styles.js +1 -1
- package/lib-commonjs/components/AreaChart/useAreaChartStyles.styles.js.map +1 -1
- package/lib-commonjs/components/AreaChart/useAreaChartStyles.styles.raw.js +57 -0
- package/lib-commonjs/components/AreaChart/useAreaChartStyles.styles.raw.js.map +1 -0
- package/lib-commonjs/components/CommonComponents/CartesianChart.js +2 -1
- package/lib-commonjs/components/CommonComponents/CartesianChart.js.map +1 -1
- package/lib-commonjs/components/CommonComponents/CartesianChart.types.js.map +1 -1
- package/lib-commonjs/components/CommonComponents/ChartPopover.js.map +1 -1
- package/lib-commonjs/components/CommonComponents/ChartPopover.types.js.map +1 -1
- package/lib-commonjs/components/CommonComponents/index.js.map +1 -1
- package/lib-commonjs/components/CommonComponents/useCartesianChartStyles.styles.js +1 -1
- package/lib-commonjs/components/CommonComponents/useCartesianChartStyles.styles.js.map +1 -1
- package/lib-commonjs/components/CommonComponents/useCartesianChartStyles.styles.raw.js +142 -0
- package/lib-commonjs/components/CommonComponents/useCartesianChartStyles.styles.raw.js.map +1 -0
- package/lib-commonjs/components/CommonComponents/useChartPopoverStyles.styles.js +1 -1
- package/lib-commonjs/components/CommonComponents/useChartPopoverStyles.styles.js.map +1 -1
- package/lib-commonjs/components/CommonComponents/useChartPopoverStyles.styles.raw.js +140 -0
- package/lib-commonjs/components/CommonComponents/useChartPopoverStyles.styles.raw.js.map +1 -0
- package/lib-commonjs/components/DeclarativeChart/DeclarativeChart.js +14 -6
- package/lib-commonjs/components/DeclarativeChart/DeclarativeChart.js.map +1 -1
- package/lib-commonjs/components/DeclarativeChart/PlotlySchemaAdapter.js +93 -29
- package/lib-commonjs/components/DeclarativeChart/PlotlySchemaAdapter.js.map +1 -1
- package/lib-commonjs/components/DeclarativeChart/imageExporter.js +1 -0
- package/lib-commonjs/components/DeclarativeChart/imageExporter.js.map +1 -1
- package/lib-commonjs/components/DeclarativeChart/index.js.map +1 -1
- package/lib-commonjs/components/DonutChart/Arc/Arc.js.map +1 -1
- package/lib-commonjs/components/DonutChart/Arc/Arc.types.js.map +1 -1
- package/lib-commonjs/components/DonutChart/Arc/index.js.map +1 -1
- package/lib-commonjs/components/DonutChart/Arc/useArcStyles.styles.js +1 -1
- package/lib-commonjs/components/DonutChart/Arc/useArcStyles.styles.js.map +1 -1
- package/lib-commonjs/components/DonutChart/Arc/useArcStyles.styles.raw.js +58 -0
- package/lib-commonjs/components/DonutChart/Arc/useArcStyles.styles.raw.js.map +1 -0
- package/lib-commonjs/components/DonutChart/DonutChart.js +10 -2
- package/lib-commonjs/components/DonutChart/DonutChart.js.map +1 -1
- package/lib-commonjs/components/DonutChart/DonutChart.types.js.map +1 -1
- package/lib-commonjs/components/DonutChart/Pie/Pie.js.map +1 -1
- package/lib-commonjs/components/DonutChart/Pie/Pie.types.js.map +1 -1
- package/lib-commonjs/components/DonutChart/Pie/index.js.map +1 -1
- package/lib-commonjs/components/DonutChart/Pie/usePieStyles.styles.js +1 -1
- package/lib-commonjs/components/DonutChart/Pie/usePieStyles.styles.raw.js +43 -0
- package/lib-commonjs/components/DonutChart/Pie/usePieStyles.styles.raw.js.map +1 -0
- package/lib-commonjs/components/DonutChart/index.js.map +1 -1
- package/lib-commonjs/components/DonutChart/useDonutChartStyles.styles.js +1 -1
- package/lib-commonjs/components/DonutChart/useDonutChartStyles.styles.raw.js +59 -0
- package/lib-commonjs/components/DonutChart/useDonutChartStyles.styles.raw.js.map +1 -0
- package/lib-commonjs/components/FunnelChart/FunnelChart.js +10 -1
- package/lib-commonjs/components/FunnelChart/FunnelChart.js.map +1 -1
- package/lib-commonjs/components/FunnelChart/FunnelChart.types.js.map +1 -1
- package/lib-commonjs/components/FunnelChart/funnelGeometry.js.map +1 -1
- package/lib-commonjs/components/FunnelChart/index.js.map +1 -1
- package/lib-commonjs/components/FunnelChart/useFunnelChartStyles.styles.js +1 -1
- package/lib-commonjs/components/FunnelChart/useFunnelChartStyles.styles.js.map +1 -1
- package/lib-commonjs/components/FunnelChart/useFunnelChartStyles.styles.raw.js +65 -0
- package/lib-commonjs/components/FunnelChart/useFunnelChartStyles.styles.raw.js.map +1 -0
- package/lib-commonjs/components/GanttChart/GanttChart.js +18 -1
- package/lib-commonjs/components/GanttChart/GanttChart.js.map +1 -1
- package/lib-commonjs/components/GanttChart/GanttChart.types.js.map +1 -1
- package/lib-commonjs/components/GanttChart/index.js.map +1 -1
- package/lib-commonjs/components/GanttChart/useGanttChartStyles.styles.js +1 -1
- package/lib-commonjs/components/GanttChart/useGanttChartStyles.styles.raw.js +39 -0
- package/lib-commonjs/components/GanttChart/useGanttChartStyles.styles.raw.js.map +1 -0
- package/lib-commonjs/components/GaugeChart/GaugeChart.js +9 -2
- package/lib-commonjs/components/GaugeChart/GaugeChart.js.map +1 -1
- package/lib-commonjs/components/GaugeChart/GaugeChart.types.js.map +1 -1
- package/lib-commonjs/components/GaugeChart/index.js.map +1 -1
- package/lib-commonjs/components/GaugeChart/useGaugeChartStyles.styles.js +1 -1
- package/lib-commonjs/components/GaugeChart/useGaugeChartStyles.styles.js.map +1 -1
- package/lib-commonjs/components/GaugeChart/useGaugeChartStyles.styles.raw.js +160 -0
- package/lib-commonjs/components/GaugeChart/useGaugeChartStyles.styles.raw.js.map +1 -0
- package/lib-commonjs/components/GroupedVerticalBarChart/GroupedVerticalBarChart.js +70 -58
- package/lib-commonjs/components/GroupedVerticalBarChart/GroupedVerticalBarChart.js.map +1 -1
- package/lib-commonjs/components/GroupedVerticalBarChart/GroupedVerticalBarChart.types.js.map +1 -1
- package/lib-commonjs/components/GroupedVerticalBarChart/index.js.map +1 -1
- package/lib-commonjs/components/GroupedVerticalBarChart/useGroupedVerticalBarChartStyles.styles.js +1 -1
- package/lib-commonjs/components/GroupedVerticalBarChart/useGroupedVerticalBarChartStyles.styles.raw.js +69 -0
- package/lib-commonjs/components/GroupedVerticalBarChart/useGroupedVerticalBarChartStyles.styles.raw.js.map +1 -0
- package/lib-commonjs/components/HeatMapChart/HeatMapChart.js +10 -2
- package/lib-commonjs/components/HeatMapChart/HeatMapChart.js.map +1 -1
- package/lib-commonjs/components/HeatMapChart/HeatMapChart.types.js.map +1 -1
- package/lib-commonjs/components/HeatMapChart/index.js.map +1 -1
- package/lib-commonjs/components/HeatMapChart/useHeatMapChartStyles.styles.js +1 -1
- package/lib-commonjs/components/HeatMapChart/useHeatMapChartStyles.styles.raw.js +56 -0
- package/lib-commonjs/components/HeatMapChart/useHeatMapChartStyles.styles.raw.js.map +1 -0
- package/lib-commonjs/components/HorizontalBarChart/HorizontalBarChart.js +23 -26
- package/lib-commonjs/components/HorizontalBarChart/HorizontalBarChart.js.map +1 -1
- package/lib-commonjs/components/HorizontalBarChart/HorizontalBarChart.types.js.map +1 -1
- package/lib-commonjs/components/HorizontalBarChart/index.js.map +1 -1
- package/lib-commonjs/components/HorizontalBarChart/useHorizontalBarChartStyles.styles.js +1 -1
- package/lib-commonjs/components/HorizontalBarChart/useHorizontalBarChartStyles.styles.raw.js +134 -0
- package/lib-commonjs/components/HorizontalBarChart/useHorizontalBarChartStyles.styles.raw.js.map +1 -0
- package/lib-commonjs/components/HorizontalBarChartWithAxis/HorizontalBarChartWithAxis.js +9 -2
- package/lib-commonjs/components/HorizontalBarChartWithAxis/HorizontalBarChartWithAxis.js.map +1 -1
- package/lib-commonjs/components/HorizontalBarChartWithAxis/HorizontalBarChartWithAxis.types.js.map +1 -1
- package/lib-commonjs/components/HorizontalBarChartWithAxis/index.js.map +1 -1
- package/lib-commonjs/components/HorizontalBarChartWithAxis/useHorizontalBarChartWithAxisStyles.styles.js +1 -1
- package/lib-commonjs/components/HorizontalBarChartWithAxis/useHorizontalBarChartWithAxisStyles.styles.raw.js +55 -0
- package/lib-commonjs/components/HorizontalBarChartWithAxis/useHorizontalBarChartWithAxisStyles.styles.raw.js.map +1 -0
- package/lib-commonjs/components/Legends/Legends.js +28 -10
- package/lib-commonjs/components/Legends/Legends.js.map +1 -1
- package/lib-commonjs/components/Legends/Legends.types.js.map +1 -1
- package/lib-commonjs/components/Legends/OverflowMenu.js.map +1 -1
- package/lib-commonjs/components/Legends/index.js.map +1 -1
- package/lib-commonjs/components/Legends/shape.js.map +1 -1
- package/lib-commonjs/components/Legends/useLegendsStyles.styles.js +101 -28
- package/lib-commonjs/components/Legends/useLegendsStyles.styles.js.map +1 -1
- package/lib-commonjs/components/Legends/useLegendsStyles.styles.raw.js +174 -0
- package/lib-commonjs/components/Legends/useLegendsStyles.styles.raw.js.map +1 -0
- package/lib-commonjs/components/LineChart/LineChart.js +9 -2
- package/lib-commonjs/components/LineChart/LineChart.js.map +1 -1
- package/lib-commonjs/components/LineChart/LineChart.types.js.map +1 -1
- package/lib-commonjs/components/LineChart/eventAnnotation/EventAnnotation.js.map +1 -1
- package/lib-commonjs/components/LineChart/eventAnnotation/LabelLink.js.map +1 -1
- package/lib-commonjs/components/LineChart/eventAnnotation/Textbox.js.map +1 -1
- package/lib-commonjs/components/LineChart/index.js.map +1 -1
- package/lib-commonjs/components/LineChart/useLineChartStyles.styles.js +1 -1
- package/lib-commonjs/components/LineChart/useLineChartStyles.styles.raw.js +66 -0
- package/lib-commonjs/components/LineChart/useLineChartStyles.styles.raw.js.map +1 -0
- package/lib-commonjs/components/ResponsiveContainer/ResponsiveContainer.js.map +1 -1
- package/lib-commonjs/components/ResponsiveContainer/ResponsiveContainer.types.js.map +1 -1
- package/lib-commonjs/components/ResponsiveContainer/index.js.map +1 -1
- package/lib-commonjs/components/ResponsiveContainer/useResponsiveChildStyles.styles.js +1 -1
- package/lib-commonjs/components/ResponsiveContainer/useResponsiveChildStyles.styles.raw.js +46 -0
- package/lib-commonjs/components/ResponsiveContainer/useResponsiveChildStyles.styles.raw.js.map +1 -0
- package/lib-commonjs/components/ResponsiveContainer/withResponsiveContainer.js.map +1 -1
- package/lib-commonjs/components/SankeyChart/SankeyChart.js +5 -1
- package/lib-commonjs/components/SankeyChart/SankeyChart.js.map +1 -1
- package/lib-commonjs/components/SankeyChart/SankeyChart.types.js.map +1 -1
- package/lib-commonjs/components/SankeyChart/index.js.map +1 -1
- package/lib-commonjs/components/SankeyChart/useSankeyChartStyles.styles.js +1 -1
- package/lib-commonjs/components/SankeyChart/useSankeyChartStyles.styles.js.map +1 -1
- package/lib-commonjs/components/SankeyChart/useSankeyChartStyles.styles.raw.js +95 -0
- package/lib-commonjs/components/SankeyChart/useSankeyChartStyles.styles.raw.js.map +1 -0
- package/lib-commonjs/components/ScatterChart/ScatterChart.js +10 -2
- package/lib-commonjs/components/ScatterChart/ScatterChart.js.map +1 -1
- package/lib-commonjs/components/ScatterChart/ScatterChart.types.js.map +1 -1
- package/lib-commonjs/components/ScatterChart/index.js.map +1 -1
- package/lib-commonjs/components/ScatterChart/useScatterChartStyles.styles.js +1 -1
- package/lib-commonjs/components/ScatterChart/useScatterChartStyles.styles.raw.js +57 -0
- package/lib-commonjs/components/ScatterChart/useScatterChartStyles.styles.raw.js.map +1 -0
- package/lib-commonjs/components/Sparkline/Sparkline.js.map +1 -1
- package/lib-commonjs/components/Sparkline/Sparkline.types.js.map +1 -1
- package/lib-commonjs/components/Sparkline/index.js.map +1 -1
- package/lib-commonjs/components/Sparkline/useSparklineStyles.styles.js +1 -1
- package/lib-commonjs/components/Sparkline/useSparklineStyles.styles.raw.js +44 -0
- package/lib-commonjs/components/Sparkline/useSparklineStyles.styles.raw.js.map +1 -0
- package/lib-commonjs/components/VerticalBarChart/VerticalBarChart.js +62 -28
- package/lib-commonjs/components/VerticalBarChart/VerticalBarChart.js.map +1 -1
- package/lib-commonjs/components/VerticalBarChart/VerticalBarChart.types.js.map +1 -1
- package/lib-commonjs/components/VerticalBarChart/index.js.map +1 -1
- package/lib-commonjs/components/VerticalBarChart/useVerticalBarChartStyles.styles.js +1 -1
- package/lib-commonjs/components/VerticalBarChart/useVerticalBarChartStyles.styles.raw.js +74 -0
- package/lib-commonjs/components/VerticalBarChart/useVerticalBarChartStyles.styles.raw.js.map +1 -0
- package/lib-commonjs/components/VerticalStackedBarChart/VerticalStackedBarChart.js +22 -8
- package/lib-commonjs/components/VerticalStackedBarChart/VerticalStackedBarChart.js.map +1 -1
- package/lib-commonjs/components/VerticalStackedBarChart/VerticalStackedBarChart.types.js.map +1 -1
- package/lib-commonjs/components/VerticalStackedBarChart/index.js.map +1 -1
- package/lib-commonjs/components/VerticalStackedBarChart/useVerticalStackedBarChartStyles.styles.js +1 -1
- package/lib-commonjs/components/VerticalStackedBarChart/useVerticalStackedBarChartStyles.styles.js.map +1 -1
- package/lib-commonjs/components/VerticalStackedBarChart/useVerticalStackedBarChartStyles.styles.raw.js +67 -0
- package/lib-commonjs/components/VerticalStackedBarChart/useVerticalStackedBarChartStyles.styles.raw.js.map +1 -0
- package/lib-commonjs/index.js.map +1 -1
- package/lib-commonjs/types/DataPoint.js.map +1 -1
- package/lib-commonjs/types/EventAnnotation.js.map +1 -1
- package/lib-commonjs/types/LegendDataItem.js.map +1 -1
- package/lib-commonjs/types/index.js.map +1 -1
- package/lib-commonjs/utilities/FocusableTooltipText.js.map +1 -1
- package/lib-commonjs/utilities/KeyCodes.js.map +1 -1
- package/lib-commonjs/utilities/SVGTooltipText.js +2 -0
- package/lib-commonjs/utilities/SVGTooltipText.js.map +1 -1
- package/lib-commonjs/utilities/async-utils.js.map +1 -1
- package/lib-commonjs/utilities/colors.js.map +1 -1
- package/lib-commonjs/utilities/getWindow.js.map +1 -1
- package/lib-commonjs/utilities/image-export-utils.js +274 -0
- package/lib-commonjs/utilities/image-export-utils.js.map +1 -0
- package/lib-commonjs/utilities/index.js.map +1 -1
- package/lib-commonjs/utilities/overflow-utils.js.map +1 -1
- package/lib-commonjs/utilities/string.js.map +1 -1
- package/lib-commonjs/utilities/test-data.js.map +1 -1
- package/lib-commonjs/utilities/utilities.js +56 -5
- package/lib-commonjs/utilities/utilities.js.map +1 -1
- package/lib-commonjs/utilities/vbc-utils.js.map +1 -1
- package/package.json +12 -22
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"sources":["HorizontalBarChart.tsx"],"sourcesContent":["import * as React from 'react';\nimport { useHorizontalBarChartStyles } from './useHorizontalBarChartStyles.styles';\nimport { ChartProps, HorizontalBarChartProps, ChartDataPoint, RefArrayData, HorizontalBarChartVariant } from './index';\nimport { formatToLocaleString } from '@fluentui/chart-utilities';\nimport { formatScientificLimitWidth, getAccessibleDataObject, useRtl } from '../../utilities/index';\nimport { useId } from '@fluentui/react-utilities';\nimport { tokens } from '@fluentui/react-theme';\nimport { useFocusableGroup } from '@fluentui/react-tabster';\nimport { ChartPopover } from '../CommonComponents/ChartPopover';\nimport { FocusableTooltipText } from '../../utilities/FocusableTooltipText';\nimport { Legend, Legends } from '../../index';\n\n/**\n * HorizontalBarChart is the context wrapper and container for all HorizontalBarChart content/controls,\n * It has no direct style or slot opinions.\n *\n * HorizontalBarChart also provides API interfaces for callbacks that will occur on navigation events.\n */\nexport const HorizontalBarChart: React.FunctionComponent<HorizontalBarChartProps> = React.forwardRef<\n HTMLDivElement,\n HorizontalBarChartProps\n>((props, forwardedRef) => {\n const legendContainer = React.useRef<HTMLDivElement | null>(null);\n const _uniqLineText: string = useId('_HorizontalLine_');\n const _refArray: RefArrayData[] = [];\n const _isRTL: boolean = useRtl();\n const barChartSvgRef: React.RefObject<SVGSVGElement> = React.createRef<SVGSVGElement>();\n const _emptyChartId: string = useId('_HBC_empty');\n let _barHeight: number;\n let _calloutAnchorPoint: ChartDataPoint | null;\n let isSingleBar: boolean = true;\n\n const [hoverValue, setHoverValue] = React.useState<string | number | Date | null>('');\n const [lineColor, setLineColor] = React.useState<string>('');\n const [legend, setLegend] = React.useState<string | null>('');\n const [xCalloutValue, setXCalloutValue] = React.useState<string | undefined>('');\n const [yCalloutValue, setYCalloutValue] = React.useState<string | undefined>('');\n const [barCalloutProps, setBarCalloutProps] = React.useState<ChartDataPoint>();\n const [barSpacingInPercent, setBarSpacingInPercent] = React.useState<number>(0);\n const [isPopoverOpen, setPopoverOpen] = React.useState<boolean>(false);\n const [clickPosition, setClickPosition] = React.useState({ x: 0, y: 0 });\n const [selectedLegend, setSelectedLegend] = React.useState<string>('');\n const [activeLegend, setActiveLegend] = React.useState<string>('');\n\n function _refCallback(element: SVGGElement, legendTitle: string | undefined): void {\n _refArray.push({ index: legendTitle, refElement: element });\n }\n\n function _hoverOn(\n event: React.FocusEvent<SVGRectElement> | React.MouseEvent<SVGRectElement>,\n hoverVal: string | number | Date,\n point: ChartDataPoint,\n ): void {\n if (\n (!isPopoverOpen || legend !== point.legend!) &&\n _calloutAnchorPoint !== point &&\n (_legendHighlighted(point.legend) || _noLegendHighlighted())\n ) {\n _calloutAnchorPoint = point;\n let x = 0;\n let y = 0;\n\n if ('clientX' in event && event.clientX && event.clientY) {\n // Mouse event\n x = event.clientX;\n y = event.clientY;\n } else {\n // Focus event\n const targetRect = (event.target as SVGRectElement).getBoundingClientRect();\n x = targetRect.left + targetRect.width / 2;\n y = targetRect.top + targetRect.height / 2;\n }\n\n updatePosition(x, y);\n setHoverValue(hoverVal);\n setLineColor(point.color!);\n setLegend(point.legend!);\n setXCalloutValue(point.xAxisCalloutData!);\n setYCalloutValue(point.yAxisCalloutData!);\n setBarCalloutProps(point);\n // ToDo - Confirm setting multiple state variables like this is performant.\n }\n }\n\n function _hoverOff(): void {\n /*ToDo. To fix*/\n }\n\n const _handleChartMouseLeave = () => {\n _calloutAnchorPoint = null;\n if (isPopoverOpen) {\n setPopoverOpen(false);\n setHoverValue('');\n setLineColor('');\n setLegend('');\n }\n };\n\n const _adjustProps = (): void => {\n _barHeight = props.barHeight || 12;\n };\n\n const _getChartDataText = (data: ChartProps) => {\n /* return props.barChartCustomData ? (\n <div role=\"text\">{props.barChartCustomData(data)}</div>\n ) : ( */\n return _getDefaultTextData(data);\n //)\n };\n\n function _createLegends(chartProps: ChartProps[]): JSX.Element {\n const legendItems: Legend[] = [];\n chartProps.forEach((point: ChartProps) => {\n point.chartData!.forEach((dataPoint: ChartDataPoint) => {\n const color: string = dataPoint.color!;\n // mapping data to the format Legends component needs\n const legendItem: Legend = {\n title: dataPoint.legend!,\n color,\n action: () => {\n if (selectedLegend === dataPoint.legend) {\n setSelectedLegend('');\n } else {\n setSelectedLegend(dataPoint.legend!);\n }\n },\n hoverAction: () => {\n _handleChartMouseLeave();\n setActiveLegend(dataPoint.legend!);\n },\n onMouseOutAction: () => {\n setActiveLegend('');\n },\n };\n legendItems.push(legendItem);\n });\n });\n const legends = (\n <Legends legends={legendItems} centerLegends overflowText={props.legendsOverflowText} {...props.legendProps} />\n );\n return legends;\n }\n\n function _getDefaultTextData(data: ChartProps): JSX.Element {\n const { culture } = props;\n const accessibilityData = getAccessibleDataObject(data.chartDataAccessibilityData!, 'text', false);\n if (!isSingleBar) {\n const total = data.chartData!.reduce(\n (acc: number, point: ChartDataPoint) =>\n acc + (point.horizontalBarChartdata!.x ? point.horizontalBarChartdata!.x : 0),\n 0,\n );\n return (\n <div className={classes.chartTitleRight} {...accessibilityData}>\n {formatToLocaleString(total, culture) as React.ReactNode}\n </div>\n );\n }\n const chartDataMode = props.chartDataMode || 'default';\n const chartData: ChartDataPoint = data!.chartData![0];\n const x = chartData.horizontalBarChartdata!.x;\n const y = chartData.horizontalBarChartdata!.total!;\n\n switch (chartDataMode) {\n case 'default':\n return (\n <div className={classes.chartTitleRight} {...accessibilityData}>\n {formatToLocaleString(x, culture) as React.ReactNode}\n </div>\n );\n case 'fraction':\n return (\n <div {...accessibilityData}>\n <span className={classes.chartTitleRight}>{formatToLocaleString(x, culture) as React.ReactNode}</span>\n <span className={classes.chartDataTextDenominator}>{' / ' + formatToLocaleString(y, culture)}</span>\n </div>\n );\n case 'percentage':\n const dataRatioPercentage = `${formatToLocaleString(Math.round((x / y) * 100), culture)}%`;\n return (\n <div className={classes.chartTitleRight} {...accessibilityData}>\n {dataRatioPercentage}\n </div>\n );\n }\n }\n\n function _createBenchmark(data: ChartProps): JSX.Element {\n if (data.chartData![0].horizontalBarChartdata!.total === undefined) {\n return <></>;\n }\n const totalData = data.chartData![0].horizontalBarChartdata!.total!;\n const benchmarkData = data.chartData![0].data;\n const benchmarkRatio = Math.round(((benchmarkData ? benchmarkData : 0) / totalData) * 100);\n\n const benchmarkStyles = {\n left: 'calc(' + benchmarkRatio + '% - 4px)',\n };\n\n return (\n <div className={classes.benchmarkContainer}>\n <div className={classes.triangle} style={benchmarkStyles} />\n </div>\n );\n }\n\n /**\n * This functions returns an array of <rect> elements, which form the bars\n * For each bar an x value, and a width needs to be specified\n * The computations are done based on percentages\n * Extra margin is also provided, in the x value to provide some spacing in between the bars\n */\n\n function _createBars(data: ChartProps): JSX.Element[] {\n const noOfBars =\n data.chartData?.reduce((count: number, point: ChartDataPoint) => (count += (point.data || 0) > 0 ? 1 : 0), 0) ||\n 1;\n const totalMarginPercent = barSpacingInPercent * (noOfBars - 1);\n const defaultColors: string[] = [\n tokens.colorPaletteBlueForeground2,\n tokens.colorPaletteCornflowerForeground2,\n tokens.colorPaletteDarkGreenForeground2,\n tokens.colorPaletteNavyForeground2,\n tokens.colorPaletteDarkOrangeForeground2,\n ];\n // calculating starting point of each bar and it's range\n const startingPoint: number[] = [];\n const total = data.chartData!.reduce(\n (acc: number, point: ChartDataPoint) =>\n acc + (point.horizontalBarChartdata!.x ? point.horizontalBarChartdata!.x : 0),\n 0,\n );\n let prevPosition = 0;\n let value = 0;\n\n let sumOfPercent = 0;\n data.chartData!.map((point: ChartDataPoint, index: number) => {\n const pointData = point.horizontalBarChartdata!.x ? point.horizontalBarChartdata!.x : 0;\n value = (pointData / total) * 100;\n if (value < 0) {\n value = 0;\n } else if (value < 1 && value !== 0) {\n value = 1;\n }\n sumOfPercent += value;\n\n return sumOfPercent;\n });\n\n /**\n * The %age of the space occupied by the margin needs to subtracted\n * while computing the scaling ratio, since the margins are not being\n * scaled down, only the data is being scaled down from a higher percentage to lower percentage\n * Eg: 95% of the space is taken by the bars, 5% by the margins\n * Now if the sumOfPercent is 120% -> This needs to be scaled down to 95%, not 100%\n * since that's only space available to the bars\n */\n const scalingRatio = sumOfPercent !== 0 ? (sumOfPercent - totalMarginPercent) / 100 : 1;\n\n const bars = data.chartData!.map((point: ChartDataPoint, index: number) => {\n const color: string = point.color ? point.color : defaultColors[Math.floor(Math.random() * 4 + 1)];\n const pointData = point.horizontalBarChartdata!.x ? point.horizontalBarChartdata!.x : 0;\n if (index > 0) {\n prevPosition += value;\n }\n value = (pointData / total) * 100;\n if (value < 0) {\n value = 0;\n } else if (value < 1 && value !== 0) {\n value = 1 / scalingRatio;\n } else {\n value = value / scalingRatio;\n }\n startingPoint.push(prevPosition);\n\n const xValue = point.horizontalBarChartdata!.x;\n const placeholderIndex = 1;\n const isLegendSelected: boolean = _legendHighlighted(point.legend) || _noLegendHighlighted();\n\n // Render bar label instead of placeholder bar for absolute-scale variant\n if (index === placeholderIndex && props.variant === HorizontalBarChartVariant.AbsoluteScale) {\n if (props.hideLabels) {\n return <text key={index} />;\n }\n\n const barValue = data.chartData![0].horizontalBarChartdata!.x;\n\n return (\n <text\n key={index}\n x={`${_isRTL ? 100 - startingPoint[index] : startingPoint[index]}%`}\n y={_barHeight / 2}\n dominantBaseline=\"central\"\n transform={`translate(${_isRTL ? -4 : 4})`}\n className={classes.barLabel}\n aria-hidden={true}\n >\n {formatScientificLimitWidth(barValue)}\n </text>\n );\n }\n\n return (\n <rect\n key={index}\n x={`${\n _isRTL\n ? 100 - startingPoint[index] - value - index * barSpacingInPercent\n : startingPoint[index] + index * barSpacingInPercent\n }%`}\n y={0}\n width={value + '%'}\n height={_barHeight}\n fill={color}\n onMouseOver={point.legend !== '' ? event => _hoverOn(event, xValue, point) : undefined}\n onFocus={point.legend !== '' ? event => _hoverOn(event, xValue, point) : undefined}\n role=\"img\"\n aria-label={_getAriaLabel(point)}\n onBlur={_hoverOff}\n onMouseLeave={_hoverOff}\n className={classes.barWrapper}\n opacity={isLegendSelected ? 1 : 0.1}\n tabIndex={point.legend !== '' ? 0 : undefined}\n />\n );\n });\n return bars;\n }\n\n const _getAriaLabel = (point: ChartDataPoint): string => {\n const legend = point.xAxisCalloutData || point.legend;\n const yValue =\n point.yAxisCalloutData ||\n (point.horizontalBarChartdata\n ? `${point.horizontalBarChartdata.x}/${point.horizontalBarChartdata.total ?? ''}`\n : 0);\n return point.callOutAccessibilityData?.ariaLabel || (legend ? `${legend}, ` : '') + `${yValue}.`;\n };\n\n function _isChartEmpty(): boolean {\n return !(props.data && props.data.length > 0);\n }\n\n function updatePosition(newX: number, newY: number): void {\n const threshold = 1; // Set a threshold for movement\n const { x, y } = clickPosition;\n\n // Calculate the distance moved\n const distance = Math.sqrt(Math.pow(newX - x, 2) + Math.pow(newY - y, 2));\n // Update the position only if the distance moved is greater than the threshold\n if (distance > threshold) {\n setClickPosition({ x: newX, y: newY });\n setPopoverOpen(true);\n }\n }\n\n React.useEffect(() => {\n const svgWidth = barChartSvgRef?.current?.getBoundingClientRect().width || 0;\n const MARGIN_WIDTH_IN_PX = 3;\n if (svgWidth) {\n const currentBarSpacing = (MARGIN_WIDTH_IN_PX / svgWidth) * 100;\n setBarSpacingInPercent(currentBarSpacing);\n }\n }, [barChartSvgRef]);\n\n function _legendHighlighted(barLegend?: string) {\n if (barLegend === undefined) {\n return false;\n }\n return selectedLegend === barLegend || (selectedLegend === '' && activeLegend === barLegend);\n }\n\n /**\n * This function checks if none of the legends is selected or hovered.*/\n\n function _noLegendHighlighted() {\n return selectedLegend === '' && activeLegend === '';\n }\n\n const { data } = props;\n _adjustProps();\n const classes = useHorizontalBarChartStyles(props);\n const focusAttributes = useFocusableGroup();\n const legendButtons = _createLegends(data!);\n\n let datapoint: number | undefined = 0;\n return !_isChartEmpty() ? (\n <div className={classes.root} onMouseLeave={_handleChartMouseLeave}>\n {data!.map((points: ChartProps, index: number) => {\n if (points.chartData && points.chartData![0] && points.chartData![0].horizontalBarChartdata!.x) {\n datapoint = points.chartData![0].horizontalBarChartdata!.x;\n } else {\n datapoint = 0;\n }\n isSingleBar =\n points.chartData!.length === 1 || (points.chartData!.length > 1 && points.chartData![1].legend === '');\n if (isSingleBar) {\n points.chartData![1] = {\n legend: '',\n horizontalBarChartdata: {\n x: points.chartData![0].horizontalBarChartdata!.total! - datapoint!,\n total: points.chartData![0].horizontalBarChartdata!.total!,\n },\n color: tokens.colorBackgroundOverlay,\n };\n }\n\n // Hide right side text of chart title for absolute-scale variant\n const chartDataText =\n props.variant === HorizontalBarChartVariant.AbsoluteScale ? null : _getChartDataText(points!);\n const bars = _createBars(points!);\n const keyVal = _uniqLineText + '_' + index;\n // ToDo - Showtriangle property is per data series. How to account for it in the new stylesheet\n /* const classes = useHorizontalBarChartStyles(props.styles!, {\n width: props.width,\n showTriangle: !!points!.chartData![0].data,\n variant: props.variant,\n }); */\n\n return (\n <div key={index}>\n <div className={classes.items} {...focusAttributes}>\n <div className={classes.chartTitle}>\n {points!.chartTitle && (\n <FocusableTooltipText\n className={classes.chartTitleLeft}\n content={points!.chartTitle}\n accessibilityData={points!.chartTitleAccessibilityData}\n />\n )}\n {chartDataText}\n </div>\n {points!.chartData![0].data && _createBenchmark(points!)}\n <svg ref={barChartSvgRef} className={classes.chart} aria-label={points!.chartTitle}>\n <g\n id={keyVal}\n ref={(e: SVGGElement) => {\n _refCallback(e, points!.chartData![0].legend);\n }}\n // NOTE: points.chartData![0] contains current data value\n onClick={() => {\n const p = points!.chartData![0];\n if (p && p.onClick) {\n p.onClick();\n }\n }}\n >\n {bars}\n </g>\n </svg>\n </div>\n </div>\n );\n })}\n <ChartPopover\n xCalloutValue={xCalloutValue}\n yCalloutValue={yCalloutValue}\n culture={props.culture ?? 'en-us'}\n clickPosition={clickPosition}\n isPopoverOpen={isPopoverOpen}\n legend={legend!}\n YValue={hoverValue!}\n color={lineColor}\n isCalloutForStack={false}\n customCallout={{\n customizedCallout: props.onRenderCalloutPerHorizontalBar\n ? props.onRenderCalloutPerHorizontalBar(barCalloutProps!)\n : undefined,\n customCalloutProps: props.calloutPropsPerDataPoint\n ? props.calloutPropsPerDataPoint(barCalloutProps!)\n : undefined,\n }}\n isCartesian={false}\n />\n {!isSingleBar && (\n <div ref={(e: HTMLDivElement) => (legendContainer.current = e)} className={classes.legendContainer}>\n {legendButtons}\n </div>\n )}\n </div>\n ) : (\n <div id={_emptyChartId} role={'alert'} style={{ opacity: '0' }} aria-label={'Graph has no data to display'} />\n );\n //TODO validate and fix focus border for issue for popover\n});\nHorizontalBarChart.displayName = 'HorizontalBarChart';\n"],"names":["React","useHorizontalBarChartStyles","HorizontalBarChartVariant","formatToLocaleString","formatScientificLimitWidth","getAccessibleDataObject","useRtl","useId","tokens","useFocusableGroup","ChartPopover","FocusableTooltipText","Legends","HorizontalBarChart","forwardRef","props","forwardedRef","legendContainer","useRef","_uniqLineText","_refArray","_isRTL","barChartSvgRef","createRef","_emptyChartId","_barHeight","_calloutAnchorPoint","isSingleBar","hoverValue","setHoverValue","useState","lineColor","setLineColor","legend","setLegend","xCalloutValue","setXCalloutValue","yCalloutValue","setYCalloutValue","barCalloutProps","setBarCalloutProps","barSpacingInPercent","setBarSpacingInPercent","isPopoverOpen","setPopoverOpen","clickPosition","setClickPosition","x","y","selectedLegend","setSelectedLegend","activeLegend","setActiveLegend","_refCallback","element","legendTitle","push","index","refElement","_hoverOn","event","hoverVal","point","_legendHighlighted","_noLegendHighlighted","clientX","clientY","targetRect","target","getBoundingClientRect","left","width","top","height","updatePosition","color","xAxisCalloutData","yAxisCalloutData","_hoverOff","_handleChartMouseLeave","_adjustProps","barHeight","_getChartDataText","data","_getDefaultTextData","_createLegends","chartProps","legendItems","forEach","chartData","dataPoint","legendItem","title","action","hoverAction","onMouseOutAction","legends","centerLegends","overflowText","legendsOverflowText","legendProps","culture","accessibilityData","chartDataAccessibilityData","total","reduce","acc","horizontalBarChartdata","div","className","classes","chartTitleRight","chartDataMode","span","chartDataTextDenominator","dataRatioPercentage","Math","round","_createBenchmark","undefined","totalData","benchmarkData","benchmarkRatio","benchmarkStyles","benchmarkContainer","triangle","style","_createBars","noOfBars","count","totalMarginPercent","defaultColors","colorPaletteBlueForeground2","colorPaletteCornflowerForeground2","colorPaletteDarkGreenForeground2","colorPaletteNavyForeground2","colorPaletteDarkOrangeForeground2","startingPoint","prevPosition","value","sumOfPercent","map","pointData","scalingRatio","bars","floor","random","xValue","placeholderIndex","isLegendSelected","variant","AbsoluteScale","hideLabels","text","key","barValue","dominantBaseline","transform","barLabel","aria-hidden","rect","fill","onMouseOver","onFocus","role","aria-label","_getAriaLabel","onBlur","onMouseLeave","barWrapper","opacity","tabIndex","yValue","callOutAccessibilityData","ariaLabel","_isChartEmpty","length","newX","newY","threshold","distance","sqrt","pow","useEffect","svgWidth","current","MARGIN_WIDTH_IN_PX","currentBarSpacing","barLegend","focusAttributes","legendButtons","datapoint","root","points","colorBackgroundOverlay","chartDataText","keyVal","items","chartTitle","chartTitleLeft","content","chartTitleAccessibilityData","svg","ref","chart","g","id","e","onClick","p","YValue","isCalloutForStack","customCallout","customizedCallout","onRenderCalloutPerHorizontalBar","customCalloutProps","calloutPropsPerDataPoint","isCartesian","displayName"],"mappings":"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"}
|
|
1
|
+
{"version":3,"sources":["../src/components/HorizontalBarChart/HorizontalBarChart.tsx"],"sourcesContent":["import * as React from 'react';\nimport { useHorizontalBarChartStyles } from './useHorizontalBarChartStyles.styles';\nimport { ChartProps, HorizontalBarChartProps, ChartDataPoint, RefArrayData, HorizontalBarChartVariant } from './index';\nimport { formatToLocaleString } from '@fluentui/chart-utilities';\nimport { formatScientificLimitWidth, getAccessibleDataObject, useRtl } from '../../utilities/index';\nimport { useId } from '@fluentui/react-utilities';\nimport { tokens } from '@fluentui/react-theme';\nimport { useFocusableGroup } from '@fluentui/react-tabster';\nimport { ChartPopover } from '../CommonComponents/ChartPopover';\nimport { FocusableTooltipText } from '../../utilities/FocusableTooltipText';\nimport { Legend, Legends } from '../../index';\n\n/**\n * HorizontalBarChart is the context wrapper and container for all HorizontalBarChart content/controls,\n * It has no direct style or slot opinions.\n *\n * HorizontalBarChart also provides API interfaces for callbacks that will occur on navigation events.\n */\nexport const HorizontalBarChart: React.FunctionComponent<HorizontalBarChartProps> = React.forwardRef<\n HTMLDivElement,\n HorizontalBarChartProps\n>((props, forwardedRef) => {\n const legendContainer = React.useRef<HTMLDivElement | null>(null);\n const _uniqLineText: string = useId('_HorizontalLine_');\n const _refArray: RefArrayData[] = [];\n const _isRTL: boolean = useRtl();\n const barChartSvgRef: React.RefObject<SVGSVGElement> = React.createRef<SVGSVGElement>();\n const _emptyChartId: string = useId('_HBC_empty');\n let _barHeight: number;\n let _calloutAnchorPoint: ChartDataPoint | null;\n let isSingleBar: boolean = true;\n let _showToolTipOnSegment: boolean = !props.hideTooltip;\n\n const [hoverValue, setHoverValue] = React.useState<string | number | Date | null>('');\n const [lineColor, setLineColor] = React.useState<string>('');\n const [legend, setLegend] = React.useState<string | null>('');\n const [xCalloutValue, setXCalloutValue] = React.useState<string | undefined>('');\n const [yCalloutValue, setYCalloutValue] = React.useState<string | undefined>('');\n const [barCalloutProps, setBarCalloutProps] = React.useState<ChartDataPoint>();\n const [barSpacingInPercent, setBarSpacingInPercent] = React.useState<number>(0);\n const [isPopoverOpen, setPopoverOpen] = React.useState<boolean>(false);\n const [clickPosition, setClickPosition] = React.useState({ x: 0, y: 0 });\n const [selectedLegend, setSelectedLegend] = React.useState<string>('');\n const [activeLegend, setActiveLegend] = React.useState<string>('');\n\n function _refCallback(element: SVGGElement, legendTitle: string | undefined): void {\n _refArray.push({ index: legendTitle, refElement: element });\n }\n\n function _hoverOn(\n event: React.FocusEvent<SVGRectElement> | React.MouseEvent<SVGRectElement>,\n hoverVal: string | number | Date,\n point: ChartDataPoint,\n ): void {\n if (\n (!isPopoverOpen || legend !== point.legend!) &&\n _calloutAnchorPoint !== point &&\n (_legendHighlighted(point.legend) || _noLegendHighlighted())\n ) {\n _calloutAnchorPoint = point;\n let x = 0;\n let y = 0;\n\n if ('clientX' in event && event.clientX && event.clientY) {\n // Mouse event\n x = event.clientX;\n y = event.clientY;\n } else {\n // Focus event\n const targetRect = (event.target as SVGRectElement).getBoundingClientRect();\n x = targetRect.left + targetRect.width / 2;\n y = targetRect.top + targetRect.height / 2;\n }\n\n updatePosition(x, y);\n setHoverValue(hoverVal);\n setLineColor(point.color!);\n setLegend(point.legend!);\n setXCalloutValue(point.xAxisCalloutData!);\n setYCalloutValue(point.yAxisCalloutData!);\n setBarCalloutProps(point);\n // ToDo - Confirm setting multiple state variables like this is performant.\n }\n }\n\n function _hoverOff(): void {\n /*ToDo. To fix*/\n }\n\n const _handleChartMouseLeave = () => {\n _calloutAnchorPoint = null;\n if (isPopoverOpen) {\n setPopoverOpen(false);\n setHoverValue('');\n setLineColor('');\n setLegend('');\n }\n };\n\n const _adjustProps = (): void => {\n _barHeight = props.barHeight || 12;\n };\n\n const _getChartDataText = (data: ChartProps) => {\n /* return props.barChartCustomData ? (\n <div role=\"text\">{props.barChartCustomData(data)}</div>\n ) : ( */\n return _getDefaultTextData(data);\n //)\n };\n\n function _createLegends(chartProps: ChartProps[]): JSX.Element {\n const legendItems: Legend[] = chartProps.flatMap(\n point =>\n point.chartData?.map((dataPoint): Legend => {\n const legend = dataPoint.legend ?? '';\n const color = dataPoint.color ?? '';\n\n return {\n title: legend,\n color,\n action: () => setSelectedLegend(selectedLegend === legend ? '' : legend),\n hoverAction: () => {\n _handleChartMouseLeave();\n setActiveLegend(legend);\n },\n onMouseOutAction: () => setActiveLegend(''),\n };\n }) ?? [],\n );\n\n return (\n <Legends legends={legendItems} centerLegends overflowText={props.legendsOverflowText} {...props.legendProps} />\n );\n }\n\n function _getDefaultTextData(data: ChartProps): JSX.Element {\n const chartDataMode = props.chartDataMode || 'default';\n\n if (chartDataMode === 'hidden') {\n return <></>; // No text data for hidden mode\n }\n\n const { culture } = props;\n const accessibilityData = getAccessibleDataObject(data.chartDataAccessibilityData!, 'text', false);\n if (!isSingleBar) {\n const total = data.chartData!.reduce(\n (acc: number, point: ChartDataPoint) =>\n acc + (point.horizontalBarChartdata!.x ? point.horizontalBarChartdata!.x : 0),\n 0,\n );\n return (\n <div className={classes.chartTitleRight} {...accessibilityData}>\n {formatToLocaleString(total, culture) as React.ReactNode}\n </div>\n );\n }\n\n const chartData: ChartDataPoint = data!.chartData![0];\n const x = chartData.horizontalBarChartdata!.x;\n const y = chartData.horizontalBarChartdata!.total!;\n\n switch (chartDataMode) {\n case 'default':\n return (\n <div className={classes.chartTitleRight} {...accessibilityData}>\n {formatToLocaleString(x, culture) as React.ReactNode}\n </div>\n );\n case 'fraction':\n return (\n <div {...accessibilityData}>\n <span className={classes.chartTitleRight}>{formatToLocaleString(x, culture) as React.ReactNode}</span>\n <span className={classes.chartDataTextDenominator}>{' / ' + formatToLocaleString(y, culture)}</span>\n </div>\n );\n case 'percentage':\n const dataRatioPercentage = `${formatToLocaleString(Math.round((x / y) * 100), culture)}%`;\n return (\n <div className={classes.chartTitleRight} {...accessibilityData}>\n {dataRatioPercentage}\n </div>\n );\n }\n }\n\n function _createBenchmark(data: ChartProps): JSX.Element {\n if (data.chartData![0].horizontalBarChartdata!.total === undefined) {\n return <></>;\n }\n const totalData = data.chartData![0].horizontalBarChartdata!.total!;\n const benchmarkData = data.chartData![0].data;\n const benchmarkRatio = Math.round(((benchmarkData ? benchmarkData : 0) / totalData) * 100);\n\n const benchmarkStyles = {\n left: 'calc(' + benchmarkRatio + '% - 4px)',\n };\n\n return (\n <div className={classes.benchmarkContainer}>\n <div className={classes.triangle} style={benchmarkStyles} />\n </div>\n );\n }\n\n /**\n * This functions returns an array of <rect> elements, which form the bars\n * For each bar an x value, and a width needs to be specified\n * The computations are done based on percentages\n * Extra margin is also provided, in the x value to provide some spacing in between the bars\n */\n\n function _createBars(data: ChartProps): JSX.Element[] {\n const noOfBars =\n data.chartData?.reduce((count: number, point: ChartDataPoint) => (count += (point.data || 0) > 0 ? 1 : 0), 0) ||\n 1;\n const totalMarginPercent = barSpacingInPercent * (noOfBars - 1);\n const defaultColors: string[] = [\n tokens.colorPaletteBlueForeground2,\n tokens.colorPaletteCornflowerForeground2,\n tokens.colorPaletteDarkGreenForeground2,\n tokens.colorPaletteNavyForeground2,\n tokens.colorPaletteDarkOrangeForeground2,\n ];\n // calculating starting point of each bar and it's range\n const startingPoint: number[] = [];\n const total = data.chartData!.reduce(\n (acc: number, point: ChartDataPoint) =>\n acc + (point.horizontalBarChartdata!.x ? point.horizontalBarChartdata!.x : 0),\n 0,\n );\n let prevPosition = 0;\n let value = 0;\n\n let sumOfPercent = 0;\n data.chartData!.map((point: ChartDataPoint, index: number) => {\n const pointData = point.horizontalBarChartdata!.x ? point.horizontalBarChartdata!.x : 0;\n value = (pointData / total) * 100;\n if (value < 0) {\n value = 0;\n } else if (value < 1 && value !== 0) {\n value = 1;\n }\n sumOfPercent += value;\n\n return sumOfPercent;\n });\n\n /**\n * The %age of the space occupied by the margin needs to subtracted\n * while computing the scaling ratio, since the margins are not being\n * scaled down, only the data is being scaled down from a higher percentage to lower percentage\n * Eg: 95% of the space is taken by the bars, 5% by the margins\n * Now if the sumOfPercent is 120% -> This needs to be scaled down to 95%, not 100%\n * since that's only space available to the bars\n */\n const scalingRatio = sumOfPercent !== 0 ? (sumOfPercent - totalMarginPercent) / 100 : 1;\n\n const bars = data.chartData!.map((point: ChartDataPoint, index: number) => {\n const color: string = point.color ? point.color : defaultColors[Math.floor(Math.random() * 4 + 1)];\n const pointData = point.horizontalBarChartdata!.x ? point.horizontalBarChartdata!.x : 0;\n if (index > 0) {\n prevPosition += value;\n }\n value = (pointData / total) * 100;\n if (value < 0) {\n value = 0;\n } else if (value < 1 && value !== 0) {\n value = 1 / scalingRatio;\n } else {\n value = value / scalingRatio;\n }\n startingPoint.push(prevPosition);\n\n const xValue = point.horizontalBarChartdata!.x;\n const placeholderIndex = 1;\n const isLegendSelected: boolean = _legendHighlighted(point.legend) || _noLegendHighlighted();\n\n // Render bar label instead of placeholder bar for absolute-scale variant\n if (index === placeholderIndex && props.variant === HorizontalBarChartVariant.AbsoluteScale) {\n if (props.hideLabels) {\n return <text key={index} />;\n }\n\n const barValue = data.chartData![0].horizontalBarChartdata!.x;\n\n return (\n <text\n key={index}\n x={`${_isRTL ? 100 - startingPoint[index] : startingPoint[index]}%`}\n y={_barHeight / 2}\n dominantBaseline=\"central\"\n transform={`translate(${_isRTL ? -4 : 4})`}\n className={classes.barLabel}\n aria-hidden={true}\n >\n {formatScientificLimitWidth(barValue)}\n </text>\n );\n }\n\n return (\n <rect\n key={index}\n x={`${\n _isRTL\n ? 100 - startingPoint[index] - value - index * barSpacingInPercent\n : startingPoint[index] + index * barSpacingInPercent\n }%`}\n y={0}\n width={value + '%'}\n height={_barHeight}\n fill={color}\n onMouseOver={\n _showToolTipOnSegment && point.legend !== '' ? event => _hoverOn(event, xValue, point) : undefined\n }\n onFocus={_showToolTipOnSegment && point.legend !== '' ? event => _hoverOn(event, xValue, point) : undefined}\n role=\"img\"\n aria-label={_getAriaLabel(point)}\n onBlur={_hoverOff}\n onMouseLeave={_hoverOff}\n className={classes.barWrapper}\n opacity={isLegendSelected ? 1 : 0.1}\n tabIndex={point.legend !== '' ? 0 : undefined}\n />\n );\n });\n return bars;\n }\n\n const _getAriaLabel = (point: ChartDataPoint): string => {\n const legend = point.xAxisCalloutData || point.legend;\n const yValue =\n point.yAxisCalloutData ||\n (point.horizontalBarChartdata\n ? `${point.horizontalBarChartdata.x}/${point.horizontalBarChartdata.total ?? ''}`\n : 0);\n return point.callOutAccessibilityData?.ariaLabel || (legend ? `${legend}, ` : '') + `${yValue}.`;\n };\n\n function _isChartEmpty(): boolean {\n return !(props.data && props.data.length > 0);\n }\n\n function updatePosition(newX: number, newY: number): void {\n const threshold = 1; // Set a threshold for movement\n const { x, y } = clickPosition;\n\n // Calculate the distance moved\n const distance = Math.sqrt(Math.pow(newX - x, 2) + Math.pow(newY - y, 2));\n // Update the position only if the distance moved is greater than the threshold\n if (distance > threshold) {\n setClickPosition({ x: newX, y: newY });\n setPopoverOpen(true);\n }\n }\n\n React.useEffect(() => {\n const svgWidth = barChartSvgRef?.current?.getBoundingClientRect().width || 0;\n const MARGIN_WIDTH_IN_PX = 3;\n if (svgWidth) {\n const currentBarSpacing = (MARGIN_WIDTH_IN_PX / svgWidth) * 100;\n setBarSpacingInPercent(currentBarSpacing);\n }\n }, [barChartSvgRef]);\n\n function _legendHighlighted(barLegend?: string) {\n if (barLegend === undefined) {\n return false;\n }\n return selectedLegend === barLegend || (selectedLegend === '' && activeLegend === barLegend);\n }\n\n /**\n * This function checks if none of the legends is selected or hovered.*/\n\n function _noLegendHighlighted() {\n return selectedLegend === '' && activeLegend === '';\n }\n\n const { data } = props;\n _adjustProps();\n const classes = useHorizontalBarChartStyles(props);\n const focusAttributes = useFocusableGroup();\n const legendButtons = _createLegends(data!);\n\n let datapoint: number | undefined = 0;\n return !_isChartEmpty() ? (\n <div className={classes.root} onMouseLeave={_handleChartMouseLeave}>\n {data!.map((points: ChartProps, index: number) => {\n if (points.chartData && points.chartData![0] && points.chartData![0].horizontalBarChartdata!.x) {\n datapoint = points.chartData![0].horizontalBarChartdata!.x;\n } else {\n datapoint = 0;\n }\n isSingleBar = props.showLegendForSinglePointBar\n ? false\n : points.chartData!.length === 1 || (points.chartData!.length > 1 && points.chartData![1].legend === '');\n if (isSingleBar) {\n points.chartData![1] = {\n legend: '',\n horizontalBarChartdata: {\n x: points.chartData![0].horizontalBarChartdata!.total! - datapoint!,\n total: points.chartData![0].horizontalBarChartdata!.total!,\n },\n color: tokens.colorBackgroundOverlay,\n };\n }\n\n // Hide right side text of chart title for absolute-scale variant\n const chartDataText =\n props.variant === HorizontalBarChartVariant.AbsoluteScale ? null : _getChartDataText(points!);\n const bars = _createBars(points!);\n const keyVal = _uniqLineText + '_' + index;\n // ToDo - Showtriangle property is per data series. How to account for it in the new stylesheet\n /* const classes = useHorizontalBarChartStyles(props.styles!, {\n width: props.width,\n showTriangle: !!points!.chartData![0].data,\n variant: props.variant,\n }); */\n\n return (\n <div key={index}>\n <div className={classes.items} {...focusAttributes}>\n <div className={classes.chartTitle}>\n {points!.chartTitle && (\n <FocusableTooltipText\n className={classes.chartTitleLeft}\n content={points!.chartTitle}\n accessibilityData={points!.chartTitleAccessibilityData}\n />\n )}\n {chartDataText}\n </div>\n {points!.chartData![0].data && _createBenchmark(points!)}\n <svg ref={barChartSvgRef} className={classes.chart} aria-label={points!.chartTitle}>\n <g\n id={keyVal}\n ref={(e: SVGGElement) => {\n _refCallback(e, points!.chartData![0].legend);\n }}\n // NOTE: points.chartData![0] contains current data value\n onClick={() => {\n const p = points!.chartData![0];\n if (p && p.onClick) {\n p.onClick();\n }\n }}\n >\n {bars}\n </g>\n </svg>\n </div>\n </div>\n );\n })}\n <ChartPopover\n xCalloutValue={xCalloutValue}\n yCalloutValue={yCalloutValue}\n culture={props.culture ?? 'en-us'}\n clickPosition={clickPosition}\n isPopoverOpen={isPopoverOpen}\n legend={legend!}\n YValue={hoverValue!}\n color={lineColor}\n isCalloutForStack={false}\n customCallout={{\n customizedCallout: props.onRenderCalloutPerHorizontalBar\n ? props.onRenderCalloutPerHorizontalBar(barCalloutProps!)\n : undefined,\n customCalloutProps: props.calloutPropsPerDataPoint\n ? props.calloutPropsPerDataPoint(barCalloutProps!)\n : undefined,\n }}\n isCartesian={false}\n />\n {!isSingleBar && (\n <div ref={(e: HTMLDivElement) => (legendContainer.current = e)} className={classes.legendContainer}>\n {legendButtons}\n </div>\n )}\n </div>\n ) : (\n <div id={_emptyChartId} role={'alert'} style={{ opacity: '0' }} aria-label={'Graph has no data to display'} />\n );\n //TODO validate and fix focus border for issue for popover\n});\nHorizontalBarChart.displayName = 'HorizontalBarChart';\n"],"names":["React","useHorizontalBarChartStyles","HorizontalBarChartVariant","formatToLocaleString","formatScientificLimitWidth","getAccessibleDataObject","useRtl","useId","tokens","useFocusableGroup","ChartPopover","FocusableTooltipText","Legends","HorizontalBarChart","forwardRef","props","forwardedRef","legendContainer","useRef","_uniqLineText","_refArray","_isRTL","barChartSvgRef","createRef","_emptyChartId","_barHeight","_calloutAnchorPoint","isSingleBar","_showToolTipOnSegment","hideTooltip","hoverValue","setHoverValue","useState","lineColor","setLineColor","legend","setLegend","xCalloutValue","setXCalloutValue","yCalloutValue","setYCalloutValue","barCalloutProps","setBarCalloutProps","barSpacingInPercent","setBarSpacingInPercent","isPopoverOpen","setPopoverOpen","clickPosition","setClickPosition","x","y","selectedLegend","setSelectedLegend","activeLegend","setActiveLegend","_refCallback","element","legendTitle","push","index","refElement","_hoverOn","event","hoverVal","point","_legendHighlighted","_noLegendHighlighted","clientX","clientY","targetRect","target","getBoundingClientRect","left","width","top","height","updatePosition","color","xAxisCalloutData","yAxisCalloutData","_hoverOff","_handleChartMouseLeave","_adjustProps","barHeight","_getChartDataText","data","_getDefaultTextData","_createLegends","chartProps","legendItems","flatMap","chartData","map","dataPoint","title","action","hoverAction","onMouseOutAction","legends","centerLegends","overflowText","legendsOverflowText","legendProps","chartDataMode","culture","accessibilityData","chartDataAccessibilityData","total","reduce","acc","horizontalBarChartdata","div","className","classes","chartTitleRight","span","chartDataTextDenominator","dataRatioPercentage","Math","round","_createBenchmark","undefined","totalData","benchmarkData","benchmarkRatio","benchmarkStyles","benchmarkContainer","triangle","style","_createBars","noOfBars","count","totalMarginPercent","defaultColors","colorPaletteBlueForeground2","colorPaletteCornflowerForeground2","colorPaletteDarkGreenForeground2","colorPaletteNavyForeground2","colorPaletteDarkOrangeForeground2","startingPoint","prevPosition","value","sumOfPercent","pointData","scalingRatio","bars","floor","random","xValue","placeholderIndex","isLegendSelected","variant","AbsoluteScale","hideLabels","text","key","barValue","dominantBaseline","transform","barLabel","aria-hidden","rect","fill","onMouseOver","onFocus","role","aria-label","_getAriaLabel","onBlur","onMouseLeave","barWrapper","opacity","tabIndex","yValue","callOutAccessibilityData","ariaLabel","_isChartEmpty","length","newX","newY","threshold","distance","sqrt","pow","useEffect","svgWidth","current","MARGIN_WIDTH_IN_PX","currentBarSpacing","barLegend","focusAttributes","legendButtons","datapoint","root","points","showLegendForSinglePointBar","colorBackgroundOverlay","chartDataText","keyVal","items","chartTitle","chartTitleLeft","content","chartTitleAccessibilityData","svg","ref","chart","g","id","e","onClick","p","YValue","isCalloutForStack","customCallout","customizedCallout","onRenderCalloutPerHorizontalBar","customCalloutProps","calloutPropsPerDataPoint","isCartesian","displayName"],"mappings":"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"}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"sources":["HorizontalBarChart.types.ts"],"sourcesContent":["import * as React from 'react';\nimport { ChartPopoverProps } from '../CommonComponents/ChartPopover.types';\nimport { ChartDataPoint, ChartProps } from './index';\nimport { LegendsProps } from '../Legends/index';\n\n/**\n * Horizontal Bar Chart properties\n * {@docCategory HorizontalBarChart}\n */\nexport interface HorizontalBarChartProps extends React.RefAttributes<HTMLDivElement> {\n /**\n * An array of chart data points for the Horizontal bar chart\n */\n data?: ChartProps[];\n\n /**\n * Width of bar chart\n */\n width?: number;\n\n /**\n * Height of bar chart\n * @default 15\n */\n barHeight?: number;\n\n /**\n * Additional CSS class(es) to apply to the StackedBarChart.\n */\n className?: string;\n\n /**\n * This property tells whether to show ratio on top of stacked bar chart or not.\n */\n hideRatio?: boolean[];\n\n /**\n * Do not show tooltips in chart\n *\n * @default false\n */\n hideTooltip?: boolean;\n\n /**\n * This property tells how to show data text on top right of bar chart.\n * If barChartCustomData props added, then this props will be overrided.\n * @default 'default'\n */\n chartDataMode?: ChartDataMode;\n\n /**\n * Call to provide customized styling that will layer on top of the variant rules.\n */\n styles?: HorizontalBarChartStyles;\n\n /**\n * Define a custom callout renderer for a horizontal bar\n */\n // onRenderCalloutPerHorizontalBar?: IRenderFunction<IChartDataPoint>; ToDo - Need to use slots here.\n\n /**\n * props for the callout in the chart\n */\n calloutProps?: ChartPopoverProps;\n\n /**\n * Custom text to the chart (right side of the chart)\n * IChartProps will be available as props to the method prop.\n * If this method not given, default values (IHorizontalDataPoint \\{x,y\\})\n * will be used to display the data/text based on given chartModeData prop.\n */\n // barChartCustomData?: IRenderFunction<IChartProps>; ToDo - Need to use slots here.\n\n /**\n * The prop used to define the culture to localized the numbers\n */\n culture?: string;\n\n /**\n * Prop to define the variant of HorizontalBarChart to render\n * @default HorizontalBarChartVariant.PartToWhole\n */\n variant?: HorizontalBarChartVariant;\n\n /**\n * Prop to hide the bar labels\n * @default false\n */\n hideLabels?: boolean;\n\n /**\n * line color for callout\n */\n color?: string;\n\n /**\n * prop to check if benchmark data is provided\n */\n showTriangle?: boolean;\n\n // eslint-disable-next-line @typescript-eslint/no-explicit-any\n legendsOverflowText?: any;\n\n /*\n * props for the legends in the chart\n */\n legendProps?: Partial<LegendsProps>;\n\n /**\n * prop to render the custom callout\n */\n onRenderCalloutPerHorizontalBar?: (props: ChartDataPoint) => JSX.Element | undefined;\n\n /**\n * Define a custom callout props override\n */\n calloutPropsPerDataPoint?: (dataPointCalloutProps: ChartDataPoint) => ChartPopoverProps;\n}\n\n/**\n * Horizontal Bar Chart styles\n * {@docCategory HorizontalBarChart}\n */\nexport interface HorizontalBarChartStyles {\n /**\n * Styling for the root container\n */\n root: string;\n\n /**\n * Styling for each item in the container\n */\n items: string;\n\n /**\n * Style for the chart.\n */\n chart: string;\n\n /**\n * Style for the chart Title.\n */\n chartTitle: string;\n\n /**\n * Style for the bars.\n */\n barWrapper: string;\n\n /**\n * Style for left side text of the chart title\n */\n chartTitleLeft: string;\n\n /**\n * Style for right side text of the chart title\n */\n chartTitleRight: string;\n\n /**\n * Style for the chart data text denominator.\n */\n chartDataTextDenominator: string;\n\n /**\n * Style for the benchmark container\n */\n benchmarkContainer: string;\n\n /**\n * Style for the benchmark triangle\n */\n triangle: string;\n\n /**\n * Style for the bar labels\n */\n barLabel: string;\n\n /**\n * Style for the div containing the chart\n */\n chartWrapper: string;\n\n /**\n * Style for the legend container.\n */\n legendContainer: string;\n}\n\n/**\n * Chart data mode for chart data text\n * default: show the datapoint.x value\n * fraction: show the fraction of datapoint.x/datapoint.y\n * percentage: show the percentage of (datapoint.x/datapoint.y)%\n * {@docCategory HorizontalBarChart}\n */\nexport type ChartDataMode = 'default' | 'fraction' | 'percentage';\n\n/**\n * {@docCategory HorizontalBarChart}\n */\nexport enum HorizontalBarChartVariant {\n PartToWhole = 'part-to-whole',\n AbsoluteScale = 'absolute-scale',\n}\n"],"names":["React","HorizontalBarChartVariant"],"mappings":";;;;;;;;;;;iEAAuB,QAAQ;
|
|
1
|
+
{"version":3,"sources":["../src/components/HorizontalBarChart/HorizontalBarChart.types.ts"],"sourcesContent":["import * as React from 'react';\nimport { ChartPopoverProps } from '../CommonComponents/ChartPopover.types';\nimport { ChartDataPoint, ChartProps } from './index';\nimport { LegendsProps } from '../Legends/index';\n\n/**\n * Horizontal Bar Chart properties\n * {@docCategory HorizontalBarChart}\n */\nexport interface HorizontalBarChartProps extends React.RefAttributes<HTMLDivElement> {\n /**\n * An array of chart data points for the Horizontal bar chart\n */\n data?: ChartProps[];\n\n /**\n * Width of bar chart\n */\n width?: number;\n\n /**\n * Height of bar chart\n * @default 15\n */\n barHeight?: number;\n\n /**\n * Additional CSS class(es) to apply to the StackedBarChart.\n */\n className?: string;\n\n /**\n * This property tells whether to show ratio on top of stacked bar chart or not.\n */\n hideRatio?: boolean[];\n\n /**\n * Do not show tooltips in chart\n *\n * @default false\n */\n hideTooltip?: boolean;\n\n /**\n * This property tells how to show data text on top right of bar chart.\n * If barChartCustomData props added, then this props will be overrided.\n * @default 'default'\n */\n chartDataMode?: ChartDataMode;\n\n /**\n * Call to provide customized styling that will layer on top of the variant rules.\n */\n styles?: HorizontalBarChartStyles;\n\n /**\n * Define a custom callout renderer for a horizontal bar\n */\n // onRenderCalloutPerHorizontalBar?: IRenderFunction<IChartDataPoint>; ToDo - Need to use slots here.\n\n /**\n * props for the callout in the chart\n */\n calloutProps?: ChartPopoverProps;\n\n /**\n * Custom text to the chart (right side of the chart)\n * IChartProps will be available as props to the method prop.\n * If this method not given, default values (IHorizontalDataPoint \\{x,y\\})\n * will be used to display the data/text based on given chartModeData prop.\n */\n // barChartCustomData?: IRenderFunction<IChartProps>; ToDo - Need to use slots here.\n\n /**\n * The prop used to define the culture to localized the numbers\n */\n culture?: string;\n\n /**\n * Prop to define the variant of HorizontalBarChart to render\n * @default HorizontalBarChartVariant.PartToWhole\n */\n variant?: HorizontalBarChartVariant;\n\n /**\n * Prop to hide the bar labels\n * @default false\n */\n hideLabels?: boolean;\n\n /**\n * line color for callout\n */\n color?: string;\n\n /**\n * prop to check if benchmark data is provided\n */\n showTriangle?: boolean;\n\n // eslint-disable-next-line @typescript-eslint/no-explicit-any\n legendsOverflowText?: any;\n\n /*\n * props for the legends in the chart\n */\n legendProps?: Partial<LegendsProps>;\n\n /**\n * prop to render the custom callout\n */\n onRenderCalloutPerHorizontalBar?: (props: ChartDataPoint) => JSX.Element | undefined;\n\n /**\n * Define a custom callout props override\n */\n calloutPropsPerDataPoint?: (dataPointCalloutProps: ChartDataPoint) => ChartPopoverProps;\n\n /**\n * When true, chart will display legends even if a bar ( row ) has only one data point.\n * @default false\n */\n showLegendForSinglePointBar?: boolean;\n}\n\n/**\n * Horizontal Bar Chart styles\n * {@docCategory HorizontalBarChart}\n */\nexport interface HorizontalBarChartStyles {\n /**\n * Styling for the root container\n */\n root: string;\n\n /**\n * Styling for each item in the container\n */\n items: string;\n\n /**\n * Style for the chart.\n */\n chart: string;\n\n /**\n * Style for the chart Title.\n */\n chartTitle: string;\n\n /**\n * Style for the bars.\n */\n barWrapper: string;\n\n /**\n * Style for left side text of the chart title\n */\n chartTitleLeft: string;\n\n /**\n * Style for right side text of the chart title\n */\n chartTitleRight: string;\n\n /**\n * Style for the chart data text denominator.\n */\n chartDataTextDenominator: string;\n\n /**\n * Style for the benchmark container\n */\n benchmarkContainer: string;\n\n /**\n * Style for the benchmark triangle\n */\n triangle: string;\n\n /**\n * Style for the bar labels\n */\n barLabel: string;\n\n /**\n * Style for the div containing the chart\n */\n chartWrapper: string;\n\n /**\n * Style for the legend container.\n */\n legendContainer: string;\n}\n\n/**\n * Chart data mode for chart data text\n * default: show the datapoint.x value\n * fraction: show the fraction of datapoint.x/datapoint.y\n * percentage: show the percentage of (datapoint.x/datapoint.y)%\n * hidden: do not show any data text\n * {@docCategory HorizontalBarChart}\n */\nexport type ChartDataMode = 'default' | 'fraction' | 'percentage' | 'hidden';\n\n/**\n * {@docCategory HorizontalBarChart}\n */\nexport enum HorizontalBarChartVariant {\n PartToWhole = 'part-to-whole',\n AbsoluteScale = 'absolute-scale',\n}\n"],"names":["React","HorizontalBarChartVariant"],"mappings":";;;;;;;;;;;iEAAuB,QAAQ;AAiNxB,IAAKC,4BAAAA,WAAAA,GAAAA,SAAAA,yBAAAA;;;WAAAA;MAGX"}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"sources":["index.ts"],"sourcesContent":["export * from './HorizontalBarChart';\nexport * from './HorizontalBarChart.types';\nexport * from '../../types/index';\n"],"names":[],"mappings":";;;;;uBAAc,uBAAuB;uBACvB,6BAA6B;uBAC7B,oBAAoB"}
|
|
1
|
+
{"version":3,"sources":["../src/components/HorizontalBarChart/index.ts"],"sourcesContent":["export * from './HorizontalBarChart';\nexport * from './HorizontalBarChart.types';\nexport * from '../../types/index';\n"],"names":[],"mappings":";;;;;uBAAc,uBAAuB;uBACvB,6BAA6B;uBAC7B,oBAAoB"}
|
|
@@ -234,4 +234,4 @@ const useHorizontalBarChartStyles = (props)=>{
|
|
|
234
234
|
chartWrapper: (0, _react.mergeClasses)(hbcClassNames.chartWrapper, variant === _index.HorizontalBarChartVariant.AbsoluteScale && !hideLabels ? baseStyles.chartWrapper40ppadding : baseStyles.chartWrapper0ppadding, (_props_styles11 = props.styles) === null || _props_styles11 === void 0 ? void 0 : _props_styles11.chartWrapper),
|
|
235
235
|
legendContainer: (0, _react.mergeClasses)(hbcClassNames.legendContainer, baseStyles.legendContainer, (_props_styles12 = props.styles) === null || _props_styles12 === void 0 ? void 0 : _props_styles12.legendContainer)
|
|
236
236
|
};
|
|
237
|
-
};
|
|
237
|
+
};
|
|
@@ -0,0 +1,134 @@
|
|
|
1
|
+
"use strict";
|
|
2
|
+
Object.defineProperty(exports, "__esModule", {
|
|
3
|
+
value: true
|
|
4
|
+
});
|
|
5
|
+
function _export(target, all) {
|
|
6
|
+
for(var name in all)Object.defineProperty(target, name, {
|
|
7
|
+
enumerable: true,
|
|
8
|
+
get: all[name]
|
|
9
|
+
});
|
|
10
|
+
}
|
|
11
|
+
_export(exports, {
|
|
12
|
+
hbcClassNames: function() {
|
|
13
|
+
return hbcClassNames;
|
|
14
|
+
},
|
|
15
|
+
useHorizontalBarChartStyles: function() {
|
|
16
|
+
return useHorizontalBarChartStyles;
|
|
17
|
+
}
|
|
18
|
+
});
|
|
19
|
+
const _react = require("@griffel/react");
|
|
20
|
+
const _reacttheme = require("@fluentui/react-theme");
|
|
21
|
+
const _index = require("./index");
|
|
22
|
+
const hbcClassNames = {
|
|
23
|
+
root: 'fui-hbc__root',
|
|
24
|
+
items: 'fui-hbc__items',
|
|
25
|
+
chart: 'fui-hbc__chart',
|
|
26
|
+
chartTitle: 'fui-hbc__chartTitle',
|
|
27
|
+
barWrapper: 'fui-hbc__barWrapper',
|
|
28
|
+
chartTitleLeft: 'fui-hbc__chartTitleLeft',
|
|
29
|
+
chartTitleRight: 'fui-hbc__chartTitleRight',
|
|
30
|
+
chartDataTextDenominator: 'fui-hbc__textDenom',
|
|
31
|
+
benchmarkContainer: 'fui-hbc__benchmark',
|
|
32
|
+
triangle: 'fui-hbc__triangle',
|
|
33
|
+
barLabel: 'fui-hbc__barLabel',
|
|
34
|
+
chartWrapper: 'fui-hbc__chartWrapper',
|
|
35
|
+
legendContainer: 'fui-hbc__legendContainer'
|
|
36
|
+
};
|
|
37
|
+
/**
|
|
38
|
+
* Base Styles
|
|
39
|
+
*/ const useStyles = (0, _react.makeStyles)({
|
|
40
|
+
root: {
|
|
41
|
+
display: 'flex',
|
|
42
|
+
flexDirection: 'column',
|
|
43
|
+
width: '100%'
|
|
44
|
+
},
|
|
45
|
+
items10pMargin: {
|
|
46
|
+
marginBottom: _reacttheme.tokens.spacingVerticalMNudge
|
|
47
|
+
},
|
|
48
|
+
items16pMargin: {
|
|
49
|
+
marginBottom: _reacttheme.tokens.spacingVerticalL
|
|
50
|
+
},
|
|
51
|
+
chart: {
|
|
52
|
+
width: '100%',
|
|
53
|
+
height: '12px',
|
|
54
|
+
display: 'block',
|
|
55
|
+
overflow: 'visible'
|
|
56
|
+
},
|
|
57
|
+
barWrapper: {},
|
|
58
|
+
chartTitle: {
|
|
59
|
+
..._reacttheme.typographyStyles.caption1,
|
|
60
|
+
display: 'flex',
|
|
61
|
+
justifyContent: 'space-between'
|
|
62
|
+
},
|
|
63
|
+
chartTitleLeft: {
|
|
64
|
+
textOverflow: 'ellipsis',
|
|
65
|
+
overflow: 'hidden',
|
|
66
|
+
whiteSpace: 'nowrap',
|
|
67
|
+
display: 'block',
|
|
68
|
+
color: _reacttheme.tokens.colorNeutralForeground1
|
|
69
|
+
},
|
|
70
|
+
chartTitleLeft4pMargin: {
|
|
71
|
+
marginBottom: '4px'
|
|
72
|
+
},
|
|
73
|
+
chartTitleLeft5pMargin: {
|
|
74
|
+
marginBottom: '5px'
|
|
75
|
+
},
|
|
76
|
+
chartTitleRight: {
|
|
77
|
+
..._reacttheme.typographyStyles.body1Strong,
|
|
78
|
+
color: _reacttheme.tokens.colorNeutralForeground1
|
|
79
|
+
},
|
|
80
|
+
chartDataTextDenominator: {
|
|
81
|
+
..._reacttheme.typographyStyles.body1,
|
|
82
|
+
color: _reacttheme.tokens.colorNeutralForeground1
|
|
83
|
+
},
|
|
84
|
+
benchmarkContainer: {
|
|
85
|
+
position: 'relative',
|
|
86
|
+
height: '7px',
|
|
87
|
+
marginTop: '-3px',
|
|
88
|
+
marginBottom: '-1px'
|
|
89
|
+
},
|
|
90
|
+
triangle: {
|
|
91
|
+
width: '0',
|
|
92
|
+
height: '0',
|
|
93
|
+
..._react.shorthands.borderLeft('4px', 'solid', 'transparent'),
|
|
94
|
+
..._react.shorthands.borderRight('4px', 'solid', 'transparent'),
|
|
95
|
+
..._react.shorthands.borderTop('7px', 'solid'),
|
|
96
|
+
borderTopColor: _reacttheme.tokens.colorPaletteBlueBorderActive,
|
|
97
|
+
marginBottom: _reacttheme.tokens.spacingVerticalXS,
|
|
98
|
+
position: 'absolute'
|
|
99
|
+
},
|
|
100
|
+
barLabel: {
|
|
101
|
+
..._reacttheme.typographyStyles.caption1Strong,
|
|
102
|
+
fill: _reacttheme.tokens.colorNeutralForeground1,
|
|
103
|
+
forcedColorAdjust: 'none'
|
|
104
|
+
},
|
|
105
|
+
chartWrapper40ppadding: {
|
|
106
|
+
paddingRight: '40p'
|
|
107
|
+
},
|
|
108
|
+
chartWrapper0ppadding: {
|
|
109
|
+
paddingRight: _reacttheme.tokens.spacingHorizontalNone
|
|
110
|
+
},
|
|
111
|
+
legendContainer: {
|
|
112
|
+
paddingTop: _reacttheme.tokens.spacingVerticalL
|
|
113
|
+
}
|
|
114
|
+
});
|
|
115
|
+
const useHorizontalBarChartStyles = (props)=>{
|
|
116
|
+
var _props_styles, _props_styles1, _props_styles2, _props_styles3, _props_styles4, _props_styles5, _props_styles6, _props_styles7, _props_styles8, _props_styles9, _props_styles10, _props_styles11, _props_styles12;
|
|
117
|
+
const { className, showTriangle, variant, hideLabels } = props; // ToDo - width, barHeight is non enumerable. Need to be used inline.
|
|
118
|
+
const baseStyles = useStyles();
|
|
119
|
+
return {
|
|
120
|
+
root: (0, _react.mergeClasses)(hbcClassNames.root, baseStyles.root, className, (_props_styles = props.styles) === null || _props_styles === void 0 ? void 0 : _props_styles.root),
|
|
121
|
+
items: (0, _react.mergeClasses)(hbcClassNames.items, showTriangle || variant === _index.HorizontalBarChartVariant.AbsoluteScale ? baseStyles.items16pMargin : baseStyles.items10pMargin, (_props_styles1 = props.styles) === null || _props_styles1 === void 0 ? void 0 : _props_styles1.items),
|
|
122
|
+
chart: (0, _react.mergeClasses)(hbcClassNames.chart, baseStyles.chart, (_props_styles2 = props.styles) === null || _props_styles2 === void 0 ? void 0 : _props_styles2.chart),
|
|
123
|
+
chartTitle: (0, _react.mergeClasses)(hbcClassNames.chartTitle, baseStyles.chartTitle, (_props_styles3 = props.styles) === null || _props_styles3 === void 0 ? void 0 : _props_styles3.chartTitle),
|
|
124
|
+
barWrapper: (0, _react.mergeClasses)(hbcClassNames.barWrapper, baseStyles.barWrapper, (_props_styles4 = props.styles) === null || _props_styles4 === void 0 ? void 0 : _props_styles4.barWrapper),
|
|
125
|
+
chartTitleLeft: (0, _react.mergeClasses)(hbcClassNames.chartTitleLeft, baseStyles.chartTitleLeft, variant === _index.HorizontalBarChartVariant.AbsoluteScale ? baseStyles.chartTitleLeft4pMargin : baseStyles.chartTitleLeft5pMargin, (_props_styles5 = props.styles) === null || _props_styles5 === void 0 ? void 0 : _props_styles5.chartTitleLeft),
|
|
126
|
+
chartTitleRight: (0, _react.mergeClasses)(hbcClassNames.chartTitleRight, baseStyles.chartTitleRight, (_props_styles6 = props.styles) === null || _props_styles6 === void 0 ? void 0 : _props_styles6.chartTitleRight),
|
|
127
|
+
chartDataTextDenominator: (0, _react.mergeClasses)(hbcClassNames.chartDataTextDenominator, baseStyles.chartDataTextDenominator, (_props_styles7 = props.styles) === null || _props_styles7 === void 0 ? void 0 : _props_styles7.chartDataTextDenominator),
|
|
128
|
+
benchmarkContainer: (0, _react.mergeClasses)(hbcClassNames.benchmarkContainer, baseStyles.benchmarkContainer, (_props_styles8 = props.styles) === null || _props_styles8 === void 0 ? void 0 : _props_styles8.benchmarkContainer),
|
|
129
|
+
triangle: (0, _react.mergeClasses)(hbcClassNames.triangle, baseStyles.triangle, (_props_styles9 = props.styles) === null || _props_styles9 === void 0 ? void 0 : _props_styles9.triangle),
|
|
130
|
+
barLabel: (0, _react.mergeClasses)(hbcClassNames.barLabel, baseStyles.barLabel, (_props_styles10 = props.styles) === null || _props_styles10 === void 0 ? void 0 : _props_styles10.barLabel),
|
|
131
|
+
chartWrapper: (0, _react.mergeClasses)(hbcClassNames.chartWrapper, variant === _index.HorizontalBarChartVariant.AbsoluteScale && !hideLabels ? baseStyles.chartWrapper40ppadding : baseStyles.chartWrapper0ppadding, (_props_styles11 = props.styles) === null || _props_styles11 === void 0 ? void 0 : _props_styles11.chartWrapper),
|
|
132
|
+
legendContainer: (0, _react.mergeClasses)(hbcClassNames.legendContainer, baseStyles.legendContainer, (_props_styles12 = props.styles) === null || _props_styles12 === void 0 ? void 0 : _props_styles12.legendContainer)
|
|
133
|
+
};
|
|
134
|
+
};
|
package/lib-commonjs/components/HorizontalBarChart/useHorizontalBarChartStyles.styles.raw.js.map
ADDED
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"sources":["../src/components/HorizontalBarChart/useHorizontalBarChartStyles.styles.ts"],"sourcesContent":["import { makeStyles, mergeClasses, shorthands } from '@griffel/react';\nimport { tokens, typographyStyles } from '@fluentui/react-theme';\nimport { HorizontalBarChartProps, HorizontalBarChartStyles, HorizontalBarChartVariant } from './index';\nimport type { SlotClassNames } from '@fluentui/react-utilities';\n\n/**\n * @internal\n */\nexport const hbcClassNames: SlotClassNames<HorizontalBarChartStyles> = {\n root: 'fui-hbc__root',\n items: 'fui-hbc__items',\n chart: 'fui-hbc__chart',\n chartTitle: 'fui-hbc__chartTitle',\n barWrapper: 'fui-hbc__barWrapper',\n chartTitleLeft: 'fui-hbc__chartTitleLeft',\n chartTitleRight: 'fui-hbc__chartTitleRight',\n chartDataTextDenominator: 'fui-hbc__textDenom',\n benchmarkContainer: 'fui-hbc__benchmark',\n triangle: 'fui-hbc__triangle',\n barLabel: 'fui-hbc__barLabel',\n chartWrapper: 'fui-hbc__chartWrapper',\n legendContainer: 'fui-hbc__legendContainer',\n};\n\n/**\n * Base Styles\n */\nconst useStyles = makeStyles({\n root: {\n display: 'flex',\n flexDirection: 'column',\n width: '100%', // Support custom width\n },\n items10pMargin: {\n marginBottom: tokens.spacingVerticalMNudge,\n },\n items16pMargin: {\n marginBottom: tokens.spacingVerticalL,\n },\n chart: {\n width: '100%',\n height: '12px', // Support custom bar height\n display: 'block',\n overflow: 'visible',\n },\n barWrapper: {},\n chartTitle: {\n ...typographyStyles.caption1,\n display: 'flex',\n justifyContent: 'space-between',\n },\n chartTitleLeft: {\n textOverflow: 'ellipsis',\n overflow: 'hidden',\n whiteSpace: 'nowrap',\n display: 'block',\n color: tokens.colorNeutralForeground1,\n },\n chartTitleLeft4pMargin: {\n marginBottom: '4px',\n },\n chartTitleLeft5pMargin: {\n marginBottom: '5px',\n },\n chartTitleRight: {\n ...typographyStyles.body1Strong,\n color: tokens.colorNeutralForeground1,\n },\n chartDataTextDenominator: {\n ...typographyStyles.body1,\n color: tokens.colorNeutralForeground1,\n },\n benchmarkContainer: {\n position: 'relative',\n height: '7px',\n marginTop: '-3px',\n marginBottom: '-1px',\n },\n triangle: {\n width: '0',\n height: '0',\n ...shorthands.borderLeft('4px', 'solid', 'transparent'),\n ...shorthands.borderRight('4px', 'solid', 'transparent'),\n ...shorthands.borderTop('7px', 'solid'),\n borderTopColor: tokens.colorPaletteBlueBorderActive,\n marginBottom: tokens.spacingVerticalXS,\n position: 'absolute',\n },\n barLabel: {\n ...typographyStyles.caption1Strong,\n fill: tokens.colorNeutralForeground1,\n forcedColorAdjust: 'none',\n },\n chartWrapper40ppadding: {\n paddingRight: '40p',\n },\n chartWrapper0ppadding: {\n paddingRight: tokens.spacingHorizontalNone,\n },\n legendContainer: { paddingTop: tokens.spacingVerticalL },\n});\n\n/**\n * Apply styling to the Carousel slots based on the state\n */\nexport const useHorizontalBarChartStyles = (props: HorizontalBarChartProps): HorizontalBarChartStyles => {\n const { className, showTriangle, variant, hideLabels } = props; // ToDo - width, barHeight is non enumerable. Need to be used inline.\n const baseStyles = useStyles();\n\n return {\n root: mergeClasses(hbcClassNames.root, baseStyles.root, className, props.styles?.root),\n items: mergeClasses(\n hbcClassNames.items,\n showTriangle || variant === HorizontalBarChartVariant.AbsoluteScale\n ? baseStyles.items16pMargin\n : baseStyles.items10pMargin,\n props.styles?.items,\n ),\n chart: mergeClasses(hbcClassNames.chart, baseStyles.chart, props.styles?.chart),\n chartTitle: mergeClasses(hbcClassNames.chartTitle, baseStyles.chartTitle, props.styles?.chartTitle),\n barWrapper: mergeClasses(hbcClassNames.barWrapper, baseStyles.barWrapper, props.styles?.barWrapper),\n chartTitleLeft: mergeClasses(\n hbcClassNames.chartTitleLeft,\n baseStyles.chartTitleLeft,\n variant === HorizontalBarChartVariant.AbsoluteScale\n ? baseStyles.chartTitleLeft4pMargin\n : baseStyles.chartTitleLeft5pMargin,\n props.styles?.chartTitleLeft,\n ),\n chartTitleRight: mergeClasses(\n hbcClassNames.chartTitleRight,\n baseStyles.chartTitleRight,\n props.styles?.chartTitleRight,\n ),\n chartDataTextDenominator: mergeClasses(\n hbcClassNames.chartDataTextDenominator,\n baseStyles.chartDataTextDenominator,\n props.styles?.chartDataTextDenominator,\n ),\n benchmarkContainer: mergeClasses(\n hbcClassNames.benchmarkContainer,\n baseStyles.benchmarkContainer,\n props.styles?.benchmarkContainer,\n ),\n triangle: mergeClasses(hbcClassNames.triangle, baseStyles.triangle, props.styles?.triangle),\n barLabel: mergeClasses(hbcClassNames.barLabel, baseStyles.barLabel, props.styles?.barLabel),\n chartWrapper: mergeClasses(\n hbcClassNames.chartWrapper,\n variant === HorizontalBarChartVariant.AbsoluteScale && !hideLabels\n ? baseStyles.chartWrapper40ppadding\n : baseStyles.chartWrapper0ppadding,\n props.styles?.chartWrapper,\n ),\n legendContainer: mergeClasses(\n hbcClassNames.legendContainer,\n baseStyles.legendContainer,\n props.styles?.legendContainer,\n ),\n };\n};\n"],"names":["makeStyles","mergeClasses","shorthands","tokens","typographyStyles","HorizontalBarChartVariant","hbcClassNames","root","items","chart","chartTitle","barWrapper","chartTitleLeft","chartTitleRight","chartDataTextDenominator","benchmarkContainer","triangle","barLabel","chartWrapper","legendContainer","useStyles","display","flexDirection","width","items10pMargin","marginBottom","spacingVerticalMNudge","items16pMargin","spacingVerticalL","height","overflow","caption1","justifyContent","textOverflow","whiteSpace","color","colorNeutralForeground1","chartTitleLeft4pMargin","chartTitleLeft5pMargin","body1Strong","body1","position","marginTop","borderLeft","borderRight","borderTop","borderTopColor","colorPaletteBlueBorderActive","spacingVerticalXS","caption1Strong","fill","forcedColorAdjust","chartWrapper40ppadding","paddingRight","chartWrapper0ppadding","spacingHorizontalNone","paddingTop","useHorizontalBarChartStyles","props","className","showTriangle","variant","hideLabels","baseStyles","styles","AbsoluteScale"],"mappings":"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"}
|
|
@@ -18,6 +18,7 @@ const _CartesianChart = require("../CommonComponents/CartesianChart");
|
|
|
18
18
|
const _ChartPopover = require("../CommonComponents/ChartPopover");
|
|
19
19
|
const _index = require("../../utilities/index");
|
|
20
20
|
const _vbcutils = require("../../utilities/vbc-utils");
|
|
21
|
+
const _imageexportutils = require("../../utilities/image-export-utils");
|
|
21
22
|
const HorizontalBarChartWithAxis = /*#__PURE__*/ _react.forwardRef((props, forwardedRef)=>{
|
|
22
23
|
var _props_legendProps, _props_legendProps1, _props_legendProps2, _props_legendProps3;
|
|
23
24
|
const _refArray = [];
|
|
@@ -42,6 +43,7 @@ const HorizontalBarChartWithAxis = /*#__PURE__*/ _react.forwardRef((props, forwa
|
|
|
42
43
|
let _yAxisPadding = (_props_yAxisPadding = props.yAxisPadding) !== null && _props_yAxisPadding !== void 0 ? _props_yAxisPadding : 0.5;
|
|
43
44
|
const cartesianChartRef = _react.useRef(null);
|
|
44
45
|
const X_ORIGIN = 0;
|
|
46
|
+
const _legendsRef = _react.useRef(null);
|
|
45
47
|
const [color, setColor] = _react.useState('');
|
|
46
48
|
const [dataForHoverCard, setDataForHoverCard] = _react.useState(0);
|
|
47
49
|
const [isLegendSelected, setIsLegendSelected] = _react.useState(((_props_legendProps = props.legendProps) === null || _props_legendProps === void 0 ? void 0 : _props_legendProps.selectedLegends) && props.legendProps.selectedLegends.length > 0 || ((_props_legendProps1 = props.legendProps) === null || _props_legendProps1 === void 0 ? void 0 : _props_legendProps1.selectedLegend) !== undefined);
|
|
@@ -76,7 +78,11 @@ const HorizontalBarChartWithAxis = /*#__PURE__*/ _react.forwardRef((props, forwa
|
|
|
76
78
|
var _cartesianChartRef_current;
|
|
77
79
|
var _cartesianChartRef_current_chartContainer;
|
|
78
80
|
return {
|
|
79
|
-
chartContainer: (_cartesianChartRef_current_chartContainer = (_cartesianChartRef_current = cartesianChartRef.current) === null || _cartesianChartRef_current === void 0 ? void 0 : _cartesianChartRef_current.chartContainer) !== null && _cartesianChartRef_current_chartContainer !== void 0 ? _cartesianChartRef_current_chartContainer : null
|
|
81
|
+
chartContainer: (_cartesianChartRef_current_chartContainer = (_cartesianChartRef_current = cartesianChartRef.current) === null || _cartesianChartRef_current === void 0 ? void 0 : _cartesianChartRef_current.chartContainer) !== null && _cartesianChartRef_current_chartContainer !== void 0 ? _cartesianChartRef_current_chartContainer : null,
|
|
82
|
+
toImage: (opts)=>{
|
|
83
|
+
var _cartesianChartRef_current, _legendsRef_current;
|
|
84
|
+
return (0, _imageexportutils.toImage)((_cartesianChartRef_current = cartesianChartRef.current) === null || _cartesianChartRef_current === void 0 ? void 0 : _cartesianChartRef_current.chartContainer, (_legendsRef_current = _legendsRef.current) === null || _legendsRef_current === void 0 ? void 0 : _legendsRef_current.toSVG, _isRtl, opts);
|
|
85
|
+
}
|
|
80
86
|
};
|
|
81
87
|
}, []);
|
|
82
88
|
function _adjustProps() {
|
|
@@ -516,7 +522,8 @@ const HorizontalBarChartWithAxis = /*#__PURE__*/ _react.forwardRef((props, forwa
|
|
|
516
522
|
enabledWrapLines: props.enabledLegendsWrapLines,
|
|
517
523
|
overflowText: props.legendsOverflowText,
|
|
518
524
|
...props.legendProps,
|
|
519
|
-
onChange: _onLegendSelectionChange
|
|
525
|
+
onChange: _onLegendSelectionChange,
|
|
526
|
+
legendRef: _legendsRef
|
|
520
527
|
});
|
|
521
528
|
return legends;
|
|
522
529
|
}
|