From 876f8cb27a33132226bf626b3d09a4193c0d9f19 Mon Sep 17 00:00:00 2001
From: Jenny <32821331+jenny-s51@users.noreply.github.com>
Date: Thu, 5 Dec 2024 15:31:43 -0500
Subject: [PATCH] feat(group): Add support for custom classname on group labels

---
 packages/module/release.config.js                           | 5 +----
 packages/module/src/components/groups/DefaultGroup.tsx      | 2 ++
 .../module/src/components/groups/DefaultGroupCollapsed.tsx  | 6 ++++--
 .../module/src/components/groups/DefaultGroupExpanded.tsx   | 4 +++-
 4 files changed, 10 insertions(+), 7 deletions(-)

diff --git a/packages/module/release.config.js b/packages/module/release.config.js
index 75161bf..c19c654 100644
--- a/packages/module/release.config.js
+++ b/packages/module/release.config.js
@@ -1,8 +1,5 @@
 module.exports = {
-  branches: [
-    'do-not-delete',
-    { name: 'main', channel: 'prerelease', prerelease: 'prerelease' },
-  ],
+  branches: ['do-not-delete', { name: 'main', channel: 'prerelease', prerelease: 'prerelease' }],
   analyzeCommits: {
     preset: 'angular'
   },
diff --git a/packages/module/src/components/groups/DefaultGroup.tsx b/packages/module/src/components/groups/DefaultGroup.tsx
index 09ec79f..e87244f 100644
--- a/packages/module/src/components/groups/DefaultGroup.tsx
+++ b/packages/module/src/components/groups/DefaultGroup.tsx
@@ -32,6 +32,8 @@ interface DefaultGroupProps {
   secondaryLabel?: string;
   /** Flag to show the label */
   showLabel?: boolean; // Defaults to true
+  /** Additional classes to add to the label */
+  labelClassName?: string;
   /** Flag to show the label when hovering (effects expanded only) */
   showLabelOnHover?: boolean;
   /** Position of the label, top or bottom. Defaults to element.getLabelPosition() or bottom */
diff --git a/packages/module/src/components/groups/DefaultGroupCollapsed.tsx b/packages/module/src/components/groups/DefaultGroupCollapsed.tsx
index 5711fc8..8f58a41 100644
--- a/packages/module/src/components/groups/DefaultGroupCollapsed.tsx
+++ b/packages/module/src/components/groups/DefaultGroupCollapsed.tsx
@@ -44,6 +44,7 @@ type DefaultGroupCollapsedProps = {
   badgeBorderColor?: string;
   badgeClassName?: string;
   badgeLocation?: BadgeLocation;
+  labelClassName?: string;
 } & CollapsibleGroupProps &
   WithDragNodeProps &
   WithSelectionProps &
@@ -84,7 +85,8 @@ const DefaultGroupCollapsed: React.FunctionComponent<DefaultGroupCollapsedProps>
   badgeLocation,
   labelIconClass,
   labelIcon,
-  labelIconPadding
+  labelIconPadding,
+  labelClassName
 }) => {
   const [hovered, hoverRef] = useHover();
   const [labelHover, labelHoverRef] = useHover();
@@ -156,7 +158,7 @@ const DefaultGroupCollapsed: React.FunctionComponent<DefaultGroupCollapsedProps>
       )}
       {showLabel && (
         <NodeLabel
-          className={styles.topologyGroupLabel}
+          className={css(styles.topologyGroupLabel, labelClassName)}
           x={collapsedWidth / 2}
           y={labelPosition === LabelPosition.top ? collapsedHeight / 2 - collapsedHeight : collapsedHeight + 6}
           paddingX={8}
diff --git a/packages/module/src/components/groups/DefaultGroupExpanded.tsx b/packages/module/src/components/groups/DefaultGroupExpanded.tsx
index dc5dd8c..a4ec696 100644
--- a/packages/module/src/components/groups/DefaultGroupExpanded.tsx
+++ b/packages/module/src/components/groups/DefaultGroupExpanded.tsx
@@ -40,6 +40,7 @@ type DefaultGroupExpandedProps = {
   badgeBorderColor?: string;
   badgeClassName?: string;
   badgeLocation?: BadgeLocation;
+  labelClassName?: string;
   labelIconClass?: string; // Icon to show in label
   labelIcon?: string;
   labelPosition?: LabelPosition;
@@ -139,6 +140,7 @@ const DefaultGroupExpanded: React.FunctionComponent<DefaultGroupExpandedProps> =
   badgeBorderColor,
   badgeClassName,
   badgeLocation,
+  labelClassName,
   labelIconClass,
   labelIcon,
   labelPosition,
@@ -254,7 +256,7 @@ const DefaultGroupExpanded: React.FunctionComponent<DefaultGroupExpandedProps> =
     (showLabel || (showLabelOnHover && isHover)) && (label || element.getLabel()) ? (
       <g ref={labelHoverRef} transform={isHover ? `scale(${labelScale})` : undefined}>
         <NodeLabel
-          className={styles.topologyGroupLabel}
+          className={css(styles.topologyGroupLabel, labelClassName)}
           x={startX * labelPositionScale}
           y={startY * labelPositionScale}
           paddingX={8}