From 30a03f0212b0e1c2bb2640bdab5c60f60911cfb0 Mon Sep 17 00:00:00 2001
From: Michael Nesen <michael.nesen@shopify.com>
Date: Mon, 2 Oct 2023 15:11:52 +0000
Subject: [PATCH] Changed RenderInnerValueContent type to include active index

---
 packages/polaris-viz/CHANGELOG.md                          | 7 ++++++-
 packages/polaris-viz/src/components/DonutChart/Chart.tsx   | 1 +
 .../DonutChart/components/InnerValue/InnerValue.tsx        | 3 +++
 packages/polaris-viz/src/types.ts                          | 1 +
 4 files changed, 11 insertions(+), 1 deletion(-)

diff --git a/packages/polaris-viz/CHANGELOG.md b/packages/polaris-viz/CHANGELOG.md
index 72466bdc2..102f5de6f 100644
--- 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
index 9dbbec1dd..921200d0c 100644
--- 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
index 5171e2127..ac213a57e 100644
--- 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
index 719c9e166..dcdb3ec08 100644
--- 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;
 }