From 13e89deac198e5005ecd58b50f2dd8a24c04b912 Mon Sep 17 00:00:00 2001
From: "Serhii.Tsybulskyi" <c4r0n0s@gmail.com>
Date: Thu, 17 Oct 2024 13:36:38 +0300
Subject: [PATCH 1/2] release 4.19.4

---
 CHANGELOG.md      | 3 +++
 package-lock.json | 4 ++--
 package.json      | 2 +-
 3 files changed, 6 insertions(+), 3 deletions(-)

diff --git a/CHANGELOG.md b/CHANGELOG.md
index f3db8372..eb56e17f 100644
--- a/CHANGELOG.md
+++ b/CHANGELOG.md
@@ -1,3 +1,6 @@
+# 4.19.4 - 10/17/24
+- [chore] Add ability to customise Label font size and offset #285
+
 # 4.19.3 - 8/20/24
 - [fix] fixed labelType none still shows label when hovering over node
 - [chore] replace react-use-gesture to @use-gesture/react #257
diff --git a/package-lock.json b/package-lock.json
index 6cd0a37c..c78e6e75 100644
--- a/package-lock.json
+++ b/package-lock.json
@@ -1,12 +1,12 @@
 {
   "name": "reagraph",
-  "version": "4.19.3",
+  "version": "4.19.4",
   "lockfileVersion": 3,
   "requires": true,
   "packages": {
     "": {
       "name": "reagraph",
-      "version": "4.19.3",
+      "version": "4.19.4",
       "license": "Apache-2.0",
       "dependencies": {
         "@react-spring/three": "9.6.1",
diff --git a/package.json b/package.json
index 99981fe2..23ba6db2 100644
--- a/package.json
+++ b/package.json
@@ -1,6 +1,6 @@
 {
   "name": "reagraph",
-  "version": "4.19.3",
+  "version": "4.19.4",
   "description": "WebGL Node-based Graph for React",
   "scripts": {
     "build": "vite build --mode library",

From 138dcb1dc7ab29f2f7380b80a9c0f19a5f5ebe5f Mon Sep 17 00:00:00 2001
From: amcdnl <amcdaniel2@gmail.com>
Date: Fri, 18 Oct 2024 08:24:03 -0400
Subject: [PATCH 2/2] add some comments

---
 src/useGraph.ts      |  4 ++++
 src/utils/cluster.ts | 20 ++++++++++++++++++++
 2 files changed, 24 insertions(+)

diff --git a/src/useGraph.ts b/src/useGraph.ts
index 237fbb38..9ef1af4b 100644
--- a/src/useGraph.ts
+++ b/src/useGraph.ts
@@ -64,6 +64,7 @@ export const useGraph = ({
   const layout = useRef<LayoutStrategy | null>(null);
   const camera = useThree(state => state.camera) as PerspectiveCamera;
 
+  // Calculate the visible entities
   const { visibleEdges, visibleNodes } = useMemo(
     () =>
       getVisibleEntities({
@@ -137,6 +138,7 @@ export const useGraph = ({
   );
 
   useEffect(() => {
+    // When the camera position/zoom changes, update the label visibility
     const nodes = stateNodes.map(node => ({
       ...node,
       labelVisible: calcLabelVisibility({
@@ -147,10 +149,12 @@ export const useGraph = ({
       })('node', node?.size)
     }));
 
+    // Determine if the label visibility has changed
     const isVisibilityUpdated = nodes.some(
       (node, i) => node.labelVisible !== stateNodes[i].labelVisible
     );
 
+    // Update the nodes if the label visibility has changed
     if (isVisibilityUpdated) {
       setNodes(nodes);
     }
diff --git a/src/utils/cluster.ts b/src/utils/cluster.ts
index 01ab4e93..6f4a1df8 100644
--- a/src/utils/cluster.ts
+++ b/src/utils/cluster.ts
@@ -22,18 +22,38 @@ export function buildClusterGroups(
 }
 
 export interface CalculateClustersInput {
+  /**
+   * The nodes to calculate clusters for.
+   */
   nodes: InternalGraphNode[];
+  /**
+   * The attribute to use for clustering.
+   */
   clusterAttribute?: string;
 }
 
 export interface ClusterGroup {
+  /**
+   * The nodes in the cluster.
+   */
   nodes: InternalGraphNode[];
+  /**
+   * The position of the cluster.
+   */
   position: CenterPositionVector;
+  /**
+   * The label of the cluster.
+   */
   label: string;
 }
 
 /**
  * Builds the cluster map.
+ *
+ * This function:
+ *  - Builds the cluster groups
+ *  - Calculates the center position of each cluster group
+ *  - Creates a cluster object for each group
  */
 export function calculateClusters({
   nodes,