refactoring

gravity-ui · Dec 2, 2024 · 740a1c8 · 740a1c8
1 parent d432d0b
commit 740a1c8
Show file tree

Hide file tree

Showing 2 changed files with 16 additions and 6 deletions.
diff --git a/src/components/canvas/connections/BlockConnection.ts b/src/components/canvas/connections/BlockConnection.ts
@@ -322,7 +322,12 @@ export class BlockConnection extends withBatchedConnection(withHitTest(EventedCo
   }
 
   private renderLabelText() {
-    const labelInnerPadding = this.context.constants.connection.LABEL.INNER_PADDING;
+    const [
+      labelInnerTopPadding,
+      labelInnerRightPadding,
+      labelInnerBottomPadding,
+      labelInnerLeftPadding,
+    ] = this.context.constants.connection.LABEL.INNER_PADDINGS;
     const padding = this.context.constants.system.GRID_SIZE / 8;
     const fontSize = Math.max(14, getFontSize(9, this.context.camera.getCameraScale()));
     const font = `${fontSize}px sans-serif`;
@@ -338,8 +343,8 @@ export class BlockConnection extends withBatchedConnection(withHitTest(EventedCo
       this.geometry.y1,
       this.geometry.x2,
       this.geometry.y2,
-      measure.width + padding * 2 + labelInnerPadding * 2,
-      measure.height + labelInnerPadding * 2,
+      measure.width + padding * 2 + labelInnerLeftPadding + labelInnerRightPadding,
+      measure.height + labelInnerTopPadding + labelInnerBottomPadding,
       this.context.constants.system.GRID_SIZE
     );
 
@@ -360,7 +365,12 @@ export class BlockConnection extends withBatchedConnection(withHitTest(EventedCo
     if (this.state.hovered) this.context.ctx.fillStyle = this.context.colors.connectionLabel.hoverBackground;
     if (this.state.selected) this.context.ctx.fillStyle = this.context.colors.connectionLabel.selectedBackground;
 
-    this.context.ctx.fillRect(x - labelInnerPadding, y - labelInnerPadding, measure.width + 2 * labelInnerPadding, measure.height + 2 * labelInnerPadding);
+    this.context.ctx.fillRect(
+      x - labelInnerLeftPadding,
+      y - labelInnerTopPadding,
+      measure.width + labelInnerLeftPadding + labelInnerRightPadding,
+      measure.height + labelInnerTopPadding + labelInnerBottomPadding,
+    );
   }
 
   public renderArrow() {

diff --git a/src/graphConfig.ts b/src/graphConfig.ts
@@ -116,7 +116,7 @@ export type TGraphConstants = {
     THRESHOLD_LINE_HIT: number;
     MIN_ZOOM_FOR_CONNECTION_ARROW_AND_LABEL: number;
     LABEL: {
-      INNER_PADDING: number;
+      INNER_PADDINGS: [number, number, number, number];
     }
   };
 
@@ -156,7 +156,7 @@ export const initGraphConstants: TGraphConstants = {
     THRESHOLD_LINE_HIT: 8,
     MIN_ZOOM_FOR_CONNECTION_ARROW_AND_LABEL: 0.25,
     LABEL: {
-      INNER_PADDING: 0,
+      INNER_PADDINGS: [0, 0, 0, 0],
     }
   },
   text: {