From 7805e18368799443543b9008affd21fec8831c1a Mon Sep 17 00:00:00 2001
From: Paul Marbach <paul.marbach@grafana.com>
Date: Fri, 12 Dec 2025 07:56:31 -0500
Subject: [PATCH] Sparkline: Export a class component for now (#115189)

---
 .../src/components/Sparkline/Sparkline.tsx         | 14 ++++++++++++--
 1 file changed, 12 insertions(+), 2 deletions(-)

diff --git a/packages/grafana-ui/src/components/Sparkline/Sparkline.tsx b/packages/grafana-ui/src/components/Sparkline/Sparkline.tsx
index 68b1a5a832f..c18b235e757 100644
--- a/packages/grafana-ui/src/components/Sparkline/Sparkline.tsx
+++ b/packages/grafana-ui/src/components/Sparkline/Sparkline.tsx
@@ -16,7 +16,7 @@ export interface SparklineProps extends Themeable2 {
   sparkline: FieldSparkline;
 }
 
-export const Sparkline: React.FC<SparklineProps> = memo((props) => {
+const SparklineFn: React.FC<SparklineProps> = memo((props) => {
   const { sparkline, config: fieldConfig, theme, width, height } = props;
 
   const { frame: alignedDataFrame, warning } = prepareSeries(sparkline, fieldConfig);
@@ -30,4 +30,14 @@ export const Sparkline: React.FC<SparklineProps> = memo((props) => {
   return <UPlotChart data={data} config={configBuilder} width={width} height={height} />;
 });
 
-Sparkline.displayName = 'Sparkline';
+SparklineFn.displayName = 'Sparkline';
+
+// we converted to function component above, but some apps extend Sparkline, so we need
+// to keep exporting a class component until those apps are all rolled out.
+// see https://github.com/grafana/app-observability-plugin/pull/2079
+// eslint-disable-next-line react-prefer-function-component/react-prefer-function-component
+export class Sparkline extends React.PureComponent<SparklineProps> {
+  render() {
+    return <SparklineFn {...this.props} />;
+  }
+}