Merge pull request #1597 from Shopify/donut-chart-renderInnerValueCon…

…tent-active-index Changed RenderInnerValueContent type to include active index
Shopify · Oct 2, 2023 · 3f45d06 · 3f45d06
2 parents 3e1dc09 + 30a03f0
commit 3f45d06
Show file tree

Hide file tree

Showing 4 changed files with 11 additions and 1 deletion.
diff --git a/packages/polaris-viz/CHANGELOG.md b/packages/polaris-viz/CHANGELOG.md
@@ -5,7 +5,12 @@ All notable changes to this project will be documented in this file.
 The format is based on [Keep a Changelog](http://keepachangelog.com/en/1.0.0/)
 and adheres to [Semantic Versioning](http://semver.org/spec/v2.0.0.html).
 
-<!-- ## Unreleased -->
+## Unreleased
+
+### Changed
+
+-  Changed `RenderInnerValueContent` type to include active index
+
 
 ## [9.13.0] - 2023-09-26
 

diff --git a/packages/polaris-viz/src/components/DonutChart/Chart.tsx b/packages/polaris-viz/src/components/DonutChart/Chart.tsx
@@ -231,6 +231,7 @@ export function Chart({
             </svg>
             <InnerValue
               activeValue={activeValue}
+              activeIndex={activeIndex}
               isAnimated={shouldAnimate}
               totalValue={totalValue}
               comparisonMetric={comparisonMetric}

diff --git a/packages/polaris-viz/src/components/DonutChart/components/InnerValue/InnerValue.tsx b/packages/polaris-viz/src/components/DonutChart/components/InnerValue/InnerValue.tsx
@@ -11,6 +11,7 @@ import styles from '../../DonutChart.scss';
 
 interface Props {
   activeValue: number | null | undefined;
+  activeIndex: number;
   labelFormatter: LabelFormatter;
   isAnimated: boolean;
   totalValue: number;
@@ -20,6 +21,7 @@ interface Props {
 
 export function InnerValue({
   activeValue,
+  activeIndex,
   comparisonMetric,
   labelFormatter,
   isAnimated,
@@ -52,6 +54,7 @@ export function InnerValue({
 
   const innerContent = renderInnerValueContent?.({
     activeValue,
+    activeIndex,
     animatedTotalValue,
     totalValue,
   }) ?? (

diff --git a/packages/polaris-viz/src/types.ts b/packages/polaris-viz/src/types.ts
@@ -209,6 +209,7 @@ export type SortedBarChartData = (number | null)[][];
 
 export interface InnerValueContents {
   activeValue: number | null | undefined;
+  activeIndex: number;
   animatedTotalValue: ReactNode;
   totalValue: number;
 }