From f3e6c58b4e960a8387326ee834e95c351328b7cc Mon Sep 17 00:00:00 2001
From: "Katrina H. Turner" <46706381+KatrinaTurner@users.noreply.github.com>
Date: Wed, 1 May 2024 08:23:11 -1000
Subject: [PATCH 1/2] add label size option

---
 src/SankeyPanel.tsx       |  1 +
 src/components/Node.tsx   | 10 ++++++----
 src/components/Sankey.tsx |  4 +++-
 src/module.ts             | 14 +++++++++++++-
 src/types.ts              |  1 +
 5 files changed, 24 insertions(+), 6 deletions(-)

diff --git a/src/SankeyPanel.tsx b/src/SankeyPanel.tsx
index 082826a..a4e50eb 100644
--- a/src/SankeyPanel.tsx
+++ b/src/SankeyPanel.tsx
@@ -51,6 +51,7 @@ export const SankeyPanel: React.FC<Props> = ({ options, data, width, height, id
         field={field}
         nodeWidth={graphOptions.nodeWidth}
         nodePadding={graphOptions.nodePadding}
+        labelSize={graphOptions.labelSize}
         iteration={graphOptions.iteration}
       />
     </g>
diff --git a/src/components/Node.tsx b/src/components/Node.tsx
index 9d3f734..8c5ce3b 100644
--- a/src/components/Node.tsx
+++ b/src/components/Node.tsx
@@ -1,11 +1,12 @@
 import React from 'react';
-import { useTheme2 } from '@grafana/ui';
+// import { useTheme2 } from '@grafana/ui';
 
 interface NodeProps {
   data: any;
   textColor: string;
   nodeColor: string;
   panelId: any;
+  labelSize: number;
 }
 
 /**
@@ -16,8 +17,8 @@ interface NodeProps {
  * @param nodeColor is set in the editor panel, the fill color of the nodes
  * @return {*}  the node and its label
  */
-export const Node: React.FC<NodeProps> = ({ data, textColor, nodeColor, panelId }) => {
-  const theme = useTheme2();
+export const Node: React.FC<NodeProps> = ({ data, textColor, nodeColor, panelId, labelSize }) => {
+  // const theme = useTheme2();
 
   let x0 = data.x0;
   let x1 = data.x1;
@@ -29,7 +30,8 @@ export const Node: React.FC<NodeProps> = ({ data, textColor, nodeColor, panelId
 
   const width = x1 - x0;
   const strokeColor = 'black';
-  const fontSize = theme.typography.fontSize;
+  // const fontSize = theme.typography.fontSize;
+  const fontSize = labelSize+'px';
   const className = `sankey-node${panelId}`;
 
   return (
diff --git a/src/components/Sankey.tsx b/src/components/Sankey.tsx
index eb0ab74..f74c263 100644
--- a/src/components/Sankey.tsx
+++ b/src/components/Sankey.tsx
@@ -22,6 +22,7 @@ interface SankeyProps {
   field: any;
   nodeWidth: number;
   nodePadding: number;
+  labelSize: number;
   iteration: number;
 }
 
@@ -40,6 +41,7 @@ export const Sankey: React.FC<SankeyProps> = ({
   field,
   nodeWidth,
   nodePadding,
+  labelSize,
   iteration,
 }) => {
   // const theme = useTheme2();
@@ -78,7 +80,7 @@ export const Sankey: React.FC<SankeyProps> = ({
         </g>
         <g transform={`translate(${MARGIN.left}, ${MARGIN.top})`}>
           {nodes.map((d: { index: any; x0: any; x1: any; y0: any; y1: any; name: any; value: any }, i: any) => (
-            <Node data={d} key={i} textColor={textColor} nodeColor={nodeColor} panelId={id} />
+            <Node data={d} key={i} textColor={textColor} nodeColor={nodeColor} panelId={id} labelSize={labelSize} />
           ))}
         </g>
       </svg>
diff --git a/src/module.ts b/src/module.ts
index 7c9521e..56d2799 100644
--- a/src/module.ts
+++ b/src/module.ts
@@ -51,6 +51,17 @@ export const plugin = new PanelPlugin<SankeyOptions>(SankeyPanel)
           step: 1,
         },
       })
+      .addSliderInput({
+        path: 'labelSize',
+        name: 'Label Size',
+        description: 'The font size of the labels in px',
+        defaultValue: 14,
+        settings: {
+          min: 6,
+          max: 24,
+          step: 1,
+        },
+      })
       .addSelect({
         path: 'valueField',
         name: 'Value Field',
@@ -73,7 +84,8 @@ export const plugin = new PanelPlugin<SankeyOptions>(SankeyPanel)
           },
         },
         // defaultValue: options[0],
-      }).addSliderInput({
+      })
+      .addSliderInput({
         path: 'iteration',
         name: 'Layout iterations',
         defaultValue: 7,
diff --git a/src/types.ts b/src/types.ts
index 8412655..5738388 100644
--- a/src/types.ts
+++ b/src/types.ts
@@ -7,6 +7,7 @@ export interface SankeyOptions {
   nodePadding: number;
   iteration: number;
   valueField: string;
+  labelSize: number;
 }
 
 export interface SankeyFieldConfig {}

From bbd8e8906da181c009e8a3f90584272a72cd233e Mon Sep 17 00:00:00 2001
From: "Katrina H. Turner" <46706381+KatrinaTurner@users.noreply.github.com>
Date: Wed, 1 May 2024 08:23:26 -1000
Subject: [PATCH 2/2] update version

---
 package.json | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/package.json b/package.json
index 25b334a..a3caef2 100644
--- a/package.json
+++ b/package.json
@@ -1,6 +1,6 @@
 {
   "name": "netsage-sankey-panel",
-  "version": "1.1.2",
+  "version": "1.1.3",
   "description": "Sankey Panel Plugin for Grafana",
   "license": "Apache-2.0",
   "repository": "https://github.com/netsage-project/netsage-sankey-panel",