@truedat/core 8.6.7 → 8.7.1

package/src/components/__tests__/TreeSelector.spec.js

@@ -48,16 +48,14 @@ describe("<TreeSelector />", () => {
 
     await waitFor(() => {
       expect(
-        rendered.getByRole("option", { name: /foo/i })
+        rendered.getByRole("option", { name: /foo/i }),
       ).toBeInTheDocument();
     });
 
     await user.click(rendered.getByRole("option", { name: /foo/i }));
     expect(props.onChange.mock.calls.length).toBe(1);
     expect(props.onChange.mock.calls[0][1]).toEqual({ value: ["1"] });
-    expect(
-      rendered.getByRole("option", { name: /foo/i })
-    ).toBeInTheDocument();
+    expect(rendered.getByRole("option", { name: /foo/i })).toBeInTheDocument();
   });
 
   it("calls onChange with selected values (single)", async () => {
@@ -75,7 +73,7 @@ describe("<TreeSelector />", () => {
 
     await waitFor(() => {
       expect(
-        rendered.getByRole("option", { name: /foo/i })
+        rendered.getByRole("option", { name: /foo/i }),
       ).toBeInTheDocument();
     });
 
@@ -83,9 +81,10 @@ describe("<TreeSelector />", () => {
     expect(props.onChange.mock.calls.length).toBe(1);
     expect(props.onChange.mock.calls[0][1]).toEqual({ value: "1" });
     await waitFor(() => {
-      expect(
-        rendered.getByRole("listbox")
-      ).toHaveAttribute("aria-expanded", "false");
+      expect(rendered.getByRole("listbox")).toHaveAttribute(
+        "aria-expanded",
+        "false",
+      );
     });
   });
 
@@ -109,31 +108,31 @@ describe("<TreeSelector />", () => {
 
     await waitFor(() => {
       expect(
-        rendered.getByRole("option", { name: /foo/i })
+        rendered.getByRole("option", { name: /foo/i }),
       ).toBeInTheDocument();
     });
 
     await user.click(
       rendered
         .getByRole("option", { name: /foo/i })
-        .querySelector('i[class="chevron right icon"]')
+        .querySelector('i[class="chevron right icon"]'),
     );
 
     await waitFor(() => {
       expect(
-        rendered.getByRole("option", { name: /bar/i })
+        rendered.getByRole("option", { name: /bar/i }),
       ).toBeInTheDocument();
     });
 
     await user.click(
       rendered
         .getByRole("option", { name: /bar/i })
-        .querySelector('i[class="chevron right icon"]')
+        .querySelector('i[class="chevron right icon"]'),
     );
 
     await waitFor(() => {
       expect(
-        rendered.getByRole("option", { name: /baz/i })
+        rendered.getByRole("option", { name: /baz/i }),
       ).toBeInTheDocument();
     });
 
@@ -163,19 +162,19 @@ describe("<TreeSelector />", () => {
 
     await waitFor(() => {
       expect(
-        rendered.getByRole("option", { name: /foo/i })
+        rendered.getByRole("option", { name: /foo/i }),
       ).toBeInTheDocument();
     });
 
     await user.click(
       rendered
         .getByRole("option", { name: /foo/i })
-        .querySelector('i[class="chevron right icon"]')
+        .querySelector('i[class="chevron right icon"]'),
     );
 
     await waitFor(() => {
       expect(
-        rendered.getByRole("option", { name: /bar/i })
+        rendered.getByRole("option", { name: /bar/i }),
       ).toBeInTheDocument();
     });
 
@@ -203,31 +202,31 @@ describe("<TreeSelector />", () => {
 
     await waitFor(() => {
       expect(
-        rendered.getByRole("option", { name: /foo/i })
+        rendered.getByRole("option", { name: /foo/i }),
       ).toBeInTheDocument();
     });
 
     await user.click(
       rendered
         .getByRole("option", { name: /foo/i })
-        .querySelector('i[class="chevron right icon"]')
+        .querySelector('i[class="chevron right icon"]'),
     );
 
     await waitFor(() => {
       expect(
-        rendered.getByRole("option", { name: /bar/i })
+        rendered.getByRole("option", { name: /bar/i }),
       ).toBeInTheDocument();
     });
 
     await user.click(
       rendered
         .getByRole("option", { name: /bar/i })
-        .querySelector('i[class="chevron right icon"]')
+        .querySelector('i[class="chevron right icon"]'),
     );
 
     await waitFor(() => {
       expect(
-        rendered.getByRole("option", { name: /baz/i })
+        rendered.getByRole("option", { name: /baz/i }),
       ).toBeInTheDocument();
     });
 
@@ -256,19 +255,19 @@ describe("<TreeSelector />", () => {
 
     await waitFor(() => {
       expect(
-        rendered.getByRole("option", { name: /foo/i })
+        rendered.getByRole("option", { name: /foo/i }),
       ).toBeInTheDocument();
     });
 
     await user.click(
       rendered
         .getByRole("option", { name: /foo/i })
-        .querySelector('i[class="chevron right icon"]')
+        .querySelector('i[class="chevron right icon"]'),
     );
 
     await waitFor(() => {
       expect(
-        rendered.getByRole("option", { name: /bar/i })
+        rendered.getByRole("option", { name: /bar/i }),
       ).toBeInTheDocument();
     });
 

package/src/components/__tests__/UploadJob.spec.js

@@ -104,9 +104,7 @@ describe("<UploadJob />", () => {
 
     // COMPLETED events are always visible
     expect(
-      rendered.getAllByText(
-        /uploadJob.parser.event.status.COMPLETED/i
-      )
+      rendered.getAllByText(/uploadJob.parser.event.status.COMPLETED/i),
     ).toHaveLength(2);
   });
 });

package/src/components/__tests__/UploadJobBreadcrumbs.spec.js

@@ -7,7 +7,7 @@ describe("ImplementationUploadJobBreadcrumbs", () => {
     await waitForLoad(rendered);
 
     expect(
-      rendered.getByText(/uploadJobs.implementations.header/i)
+      rendered.getByText(/uploadJobs.implementations.header/i),
     ).toBeInTheDocument();
     expect(rendered.container).toMatchSnapshot();
   });
@@ -17,19 +17,19 @@ describe("ImplementationUploadJobBreadcrumbs", () => {
     await waitForLoad(rendered);
 
     expect(
-      rendered.getByText(/uploadJobs.myscope.header/i)
+      rendered.getByText(/uploadJobs.myscope.header/i),
     ).toBeInTheDocument();
   });
 
   it("renders breadcrumbs with filename", async () => {
     const filename = "test.csv";
     const rendered = render(
-      <UploadJobBreadcrumbs scope="implementations" filename={filename} />
+      <UploadJobBreadcrumbs scope="implementations" filename={filename} />,
     );
     await waitForLoad(rendered);
 
     expect(
-      rendered.getByText(/uploadJobs.implementations.header/i)
+      rendered.getByText(/uploadJobs.implementations.header/i),
     ).toBeInTheDocument();
     expect(rendered.getByText(filename)).toBeInTheDocument();
     expect(rendered.container).toMatchSnapshot();

package/src/components/__tests__/UploadJobParser.spec.js

@@ -13,8 +13,8 @@ describe("<StatusPill />", () => {
       expect(label).toHaveClass(expectedColors[index]);
       expect(
         rendered.getByText(
-          new RegExp(`uploadJob.parser.event.status.${status}`, "i")
-        )
+          new RegExp(`uploadJob.parser.event.status.${status}`, "i"),
+        ),
       ).toBeInTheDocument();
     });
   });
@@ -23,7 +23,7 @@ describe("<StatusPill />", () => {
 describe("<ResponseCell />", () => {
   it("returns null when response is empty", () => {
     const rendered = render(
-      <ResponseCell response={null} status="COMPLETED" />
+      <ResponseCell response={null} status="COMPLETED" />,
     );
     expect(rendered.container.firstChild).toBeNull();
 
@@ -34,7 +34,7 @@ describe("<ResponseCell />", () => {
   it("renders FAILED status with message", () => {
     const response = { message: "missing_required_headers" };
     const rendered = render(
-      <ResponseCell response={response} status="FAILED" />
+      <ResponseCell response={response} status="FAILED" />,
     );
     expect(rendered.getByText(/missing_required_headers/i)).toBeInTheDocument();
   });
@@ -47,10 +47,10 @@ describe("<ResponseCell />", () => {
       },
     };
     const rendered = render(
-      <ResponseCell response={response} status="ERROR" />
+      <ResponseCell response={response} status="ERROR" />,
     );
     expect(
-      rendered.getByText(/uploadJob.parser.error.missing_required_headers/i)
+      rendered.getByText(/uploadJob.parser.error.missing_required_headers/i),
     ).toBeInTheDocument();
     expect(rendered.getByText(/header1, header2/i)).toBeInTheDocument();
   });
@@ -62,13 +62,13 @@ describe("<ResponseCell />", () => {
       error_count: 0,
     };
     const rendered = render(
-      <ResponseCell response={response} status="COMPLETED" />
+      <ResponseCell response={response} status="COMPLETED" />,
     );
     expect(
-      rendered.getByText(/uploadJob.parser.result.summary.created/i)
+      rendered.getByText(/uploadJob.parser.result.summary.created/i),
     ).toBeInTheDocument();
     expect(
-      rendered.getByText(/uploadJob.parser.result.summary.updated/i)
+      rendered.getByText(/uploadJob.parser.result.summary.updated/i),
     ).toBeInTheDocument();
   });
 
@@ -84,7 +84,7 @@ describe("<ResponseCell />", () => {
     };
     const rendered = render(<ResponseCell response={response} status="INFO" />);
     expect(
-      rendered.getByText(/uploadJob.parser.info.implementation_updated/i)
+      rendered.getByText(/uploadJob.parser.info.implementation_updated/i),
     ).toBeInTheDocument();
   });
 
@@ -97,13 +97,15 @@ describe("<ResponseCell />", () => {
       },
     };
     const rendered = render(<ResponseCell response={response} status="INFO" />);
-    expect(rendered.getByText(/uploadJob.parser.info.deprecated_implementation/i)).toBeInTheDocument();
+    expect(
+      rendered.getByText(/uploadJob.parser.info.deprecated_implementation/i),
+    ).toBeInTheDocument();
   });
 
   it("renders default case for unknown status", () => {
     const response = "some text";
     const rendered = render(
-      <ResponseCell response={response} status="UNKNOWN" />
+      <ResponseCell response={response} status="UNKNOWN" />,
     );
     expect(rendered.getByText(/some text/i)).toBeInTheDocument();
   });
@@ -131,7 +133,7 @@ describe("<ResponseCell />", () => {
     };
     const rendered = render(
       <ResponseCell response={response} status="ERROR" />,
-      renderOpts
+      renderOpts,
     );
     expect(rendered.getByText(/structure note error/i)).toBeInTheDocument();
     expect(rendered.getByText(/content unchanged/i)).toBeInTheDocument();
@@ -140,7 +142,7 @@ describe("<ResponseCell />", () => {
   it("returns null when ERROR response has no type", () => {
     const response = { details: {} };
     const rendered = render(
-      <ResponseCell response={response} status="ERROR" />
+      <ResponseCell response={response} status="ERROR" />,
     );
     expect(rendered.container.firstChild).toBeNull();
   });
@@ -151,10 +153,10 @@ describe("<ResponseCell />", () => {
       details: { template_name: "My Template" },
     };
     const rendered = render(
-      <ResponseCell response={response} status="ERROR" />
+      <ResponseCell response={response} status="ERROR" />,
     );
     expect(
-      rendered.getByText(/uploadJob.parser.error.invalid_template_name/i)
+      rendered.getByText(/uploadJob.parser.error.invalid_template_name/i),
     ).toBeInTheDocument();
     expect(rendered.getByText(/My Template/i)).toBeInTheDocument();
   });
@@ -165,10 +167,10 @@ describe("<ResponseCell />", () => {
       details: { duplicate_fields: ["col_a", "col_b"] },
     };
     const rendered = render(
-      <ResponseCell response={response} status="ERROR" />
+      <ResponseCell response={response} status="ERROR" />,
     );
     expect(
-      rendered.getByText(/uploadJob.parser.error.duplicate_field_names/i)
+      rendered.getByText(/uploadJob.parser.error.duplicate_field_names/i),
     ).toBeInTheDocument();
     expect(rendered.getByText(/col_a, col_b/i)).toBeInTheDocument();
   });
@@ -182,12 +184,12 @@ describe("<ResponseCell />", () => {
       ],
     };
     const rendered = render(
-      <ResponseCell response={response} status="ERROR" />
+      <ResponseCell response={response} status="ERROR" />,
     );
     expect(
       rendered.getByText(
-        /uploadJob.parser.error.implementation_creation_error/i
-      )
+        /uploadJob.parser.error.implementation_creation_error/i,
+      ),
     ).toBeInTheDocument();
     expect(rendered.getByText(/Name is required/i)).toBeInTheDocument();
     expect(rendered.getByText(/Key is invalid/i)).toBeInTheDocument();
@@ -202,7 +204,7 @@ describe("<ResponseCell />", () => {
       ],
     };
     const rendered = render(
-      <ResponseCell response={response} status="ERROR" />
+      <ResponseCell response={response} status="ERROR" />,
     );
     expect(rendered.getByText(/Invalid/i)).toBeInTheDocument();
     expect(rendered.getByText(/Duplicate/i)).toBeInTheDocument();
@@ -219,10 +221,10 @@ describe("<ResponseCell />", () => {
       },
     };
     const rendered = render(
-      <ResponseCell response={response} status="ERROR" />
+      <ResponseCell response={response} status="ERROR" />,
     );
     expect(
-      rendered.getByText(/uploadJob.parser.error.field_validation_error/i)
+      rendered.getByText(/uploadJob.parser.error.field_validation_error/i),
     ).toBeInTheDocument();
     expect(rendered.getByText(/Required/i)).toBeInTheDocument();
     expect(rendered.getByText(/Already exists/i)).toBeInTheDocument();
@@ -234,10 +236,10 @@ describe("<ResponseCell />", () => {
       details: { implementation_key: "old_impl_key" },
     };
     const rendered = render(
-      <ResponseCell response={response} status="ERROR" />
+      <ResponseCell response={response} status="ERROR" />,
     );
     expect(
-      rendered.getByText(/uploadJob.parser.error.deprecated_implementation/i)
+      rendered.getByText(/uploadJob.parser.error.deprecated_implementation/i),
     ).toBeInTheDocument();
     expect(rendered.getByText(/old_impl_key/i)).toBeInTheDocument();
   });
@@ -257,7 +259,7 @@ describe("<ResponseCell />", () => {
     };
     const rendered = render(
       <ResponseCell response={response} status="ERROR" />,
-      renderOpts
+      renderOpts,
     );
     expect(rendered.getByText(/unreject failed/i)).toBeInTheDocument();
     expect(rendered.getByText(/Workflow in progress/i)).toBeInTheDocument();
@@ -272,21 +274,21 @@ describe("<ResponseCell />", () => {
       invalid_sheet_count: 0,
     };
     const rendered = render(
-      <ResponseCell response={response} status="COMPLETED" />
+      <ResponseCell response={response} status="COMPLETED" />,
     );
     expect(
-      rendered.queryByText(/uploadJob.parser.result.summary.created/i)
+      rendered.queryByText(/uploadJob.parser.result.summary.created/i),
     ).not.toBeInTheDocument();
   });
 
   it("renders default case with object response as JSON", () => {
     const response = { code: "ERR_001", description: "Something failed" };
     const rendered = render(
-      <ResponseCell response={response} status="UNKNOWN" />
+      <ResponseCell response={response} status="UNKNOWN" />,
     );
     expect(rendered.getByText(/"code":\s*"ERR_001"/i)).toBeInTheDocument();
     expect(
-      rendered.getByText(/"description":\s*"Something failed"/i)
+      rendered.getByText(/"description":\s*"Something failed"/i),
     ).toBeInTheDocument();
   });
 
@@ -303,14 +305,16 @@ describe("<ResponseCell />", () => {
     const user = userEvent.setup({ delay: null });
     const rendered = render(<ResponseCell response={response} status="INFO" />);
     expect(
-      rendered.getByText(/uploadJob.parser.info.implementation_updated/i)
+      rendered.getByText(/uploadJob.parser.info.implementation_updated/i),
     ).toBeInTheDocument();
     expect(
-      rendered.getByText(/uploadJob.parser.result.prop.changes/i)
+      rendered.getByText(/uploadJob.parser.result.prop.changes/i),
     ).toBeInTheDocument();
     expect(rendered.getByText(/\(2\)/)).toBeInTheDocument();
     await user.click(
-      rendered.getByText(/uploadJob.parser.result.prop.changes/i).closest("div")
+      rendered
+        .getByText(/uploadJob.parser.result.prop.changes/i)
+        .closest("div"),
     );
     expect(rendered.getByText(/New Name/i)).toBeInTheDocument();
     expect(rendered.getByText(/Updated description/i)).toBeInTheDocument();
@@ -330,11 +334,11 @@ describe("<ResponseCell />", () => {
     const user = userEvent.setup({ delay: null });
     const rendered = render(<ResponseCell response={response} status="INFO" />);
     const changesHeader = rendered.getByText(
-      /uploadJob.parser.result.prop.changes/i
+      /uploadJob.parser.result.prop.changes/i,
     );
     await user.click(changesHeader.closest("div"));
     expect(
-      rendered.getByText(/ruleImplementations.props.df_content/i)
+      rendered.getByText(/ruleImplementations.props.df_content/i),
     ).toBeInTheDocument();
   });
 
@@ -346,7 +350,7 @@ describe("<ResponseCell />", () => {
       details: { missing_headers: ["H1"] },
     };
     const rendered = render(
-      <ResponseCell response={response} status="ERROR" />
+      <ResponseCell response={response} status="ERROR" />,
     );
     expect(rendered.getByText(/Sheet1/i)).toBeInTheDocument();
     expect(rendered.getByText(/5/)).toBeInTheDocument();
@@ -356,7 +360,7 @@ describe("<ResponseCell />", () => {
     const response = { type: "some_info" };
     const rendered = render(<ResponseCell response={response} status="INFO" />);
     expect(
-      rendered.getByText(/uploadJob.parser.info.some_info/i)
+      rendered.getByText(/uploadJob.parser.info.some_info/i),
     ).toBeInTheDocument();
   });
 

package/src/components/__tests__/UploadModal.spec.js

@@ -43,12 +43,12 @@ describe.skip("<UploadModal />", () => {
           param: "implementations",
           handleSubmit: onClickYesAction,
         }}
-      />
+      />,
     );
     await waitForLoad(rendered);
 
     await user.click(
-      rendered.getByRole("option", { name: /trigger element/i })
+      rendered.getByRole("option", { name: /trigger element/i }),
     );
 
     const yesActionButton = rendered.getByRole("button", {
@@ -63,7 +63,7 @@ describe.skip("<UploadModal />", () => {
 
     expect(rendered.getByText(/trigger element/i)).toBeInTheDocument();
     expect(
-      rendered.getByText(/uploadModal.actions.upload.confirmation.content/i)
+      rendered.getByText(/uploadModal.actions.upload.confirmation.content/i),
     ).toBeInTheDocument();
   });
 
@@ -77,12 +77,12 @@ describe.skip("<UploadModal />", () => {
           param: "implementations",
           handleSubmit: onClickYesAction,
         }}
-      />
+      />,
     );
     await waitForLoad(rendered);
 
     await user.click(
-      rendered.getByRole("option", { name: /trigger element/i })
+      rendered.getByRole("option", { name: /trigger element/i }),
     );
 
     const yesActionButton = rendered.getByRole("button", {
@@ -100,7 +100,7 @@ describe.skip("<UploadModal />", () => {
     });
 
     const dropZone = rendered.getByText(
-      /uploadModal.actions.upload.confirmation.content/i
+      /uploadModal.actions.upload.confirmation.content/i,
     );
     const data = mockData([fakeFile]);
 
@@ -128,12 +128,12 @@ describe.skip("<UploadModal />", () => {
           param: "implementations",
           handleSubmit: onClickYesAction,
         }}
-      />
+      />,
     );
     await waitForLoad(rendered);
 
     await user.click(
-      rendered.getByRole("option", { name: /trigger element/i })
+      rendered.getByRole("option", { name: /trigger element/i }),
     );
 
     const yesActionButton = rendered.getByRole("button", {
@@ -151,7 +151,7 @@ describe.skip("<UploadModal />", () => {
     });
 
     const dropZone = rendered.getByText(
-      /uploadModal.actions.upload.confirmation.content/i
+      /uploadModal.actions.upload.confirmation.content/i,
     );
     const data = mockData([fakeFile]);
 

package/src/components/__tests__/UserFilters.spec.js

@@ -186,7 +186,7 @@ describe("<UserFilters /> for taxonomy screens", () => {
     expect(rendered.queryByText(/hide multiple domain filter/i)).toBeNull();
     expect(rendered.queryByText(/hide other domain filter/i)).toBeNull();
     expect(
-      rendered.getByText(/show status and domain filter/i)
+      rendered.getByText(/show status and domain filter/i),
     ).toBeInTheDocument();
   });
 });

package/src/components/graph/ColoredEdge.js

@@ -14,7 +14,10 @@ const getCurveOffset = ({ sourceX, sourceY, targetX, targetY }) => {
 
   return Math.max(
     MIN_CURVE_OFFSET,
-    Math.min(MAX_CURVE_OFFSET, horizontalDistance * 0.28 + verticalDistance * 0.04)
+    Math.min(
+      MAX_CURVE_OFFSET,
+      horizontalDistance * 0.28 + verticalDistance * 0.04,
+    ),
   );
 };
 
@@ -38,21 +41,14 @@ const getBezierPoint = (t, p0, p1, p2, p3) => {
   const mt2 = mt * mt;
   const t2 = t * t;
 
-  return (
-    mt2 * mt * p0 +
-    3 * mt2 * t * p1 +
-    3 * mt * t2 * p2 +
-    t2 * t * p3
-  );
+  return mt2 * mt * p0 + 3 * mt2 * t * p1 + 3 * mt * t2 * p2 + t2 * t * p3;
 };
 
 const getBezierDerivative = (t, p0, p1, p2, p3) => {
   const mt = 1 - t;
 
   return (
-    3 * mt * mt * (p1 - p0) +
-    6 * mt * t * (p2 - p1) +
-    3 * t * t * (p3 - p2)
+    3 * mt * mt * (p1 - p0) + 6 * mt * t * (p2 - p1) + 3 * t * t * (p3 - p2)
   );
 };
 
@@ -76,7 +72,7 @@ const ColoredEdge = ({
   const [hovered, setHovered] = useState(false);
   const targetSlotOffset = getTargetSlotOffset(
     data.targetSlotIndex,
-    data.targetSlotCount
+    data.targetSlotCount,
   );
   const adjustedTargetY = targetY + targetSlotOffset;
   const curveOffset = getCurveOffset({
@@ -90,13 +86,13 @@ const ColoredEdge = ({
     sourceX,
     sourceY,
     sourcePosition,
-    curveOffset
+    curveOffset,
   );
   const targetControl = getControlPoint(
     targetX,
     adjustedTargetY,
     targetPosition,
-    curveOffset
+    curveOffset,
   );
   const targetTangent = normalizeVector(
     getBezierDerivative(1, sourceX, sourceControl.x, targetControl.x, targetX),
@@ -105,14 +101,26 @@ const ColoredEdge = ({
       sourceY,
       sourceControl.y,
       targetControl.y,
-      adjustedTargetY
-    )
+      adjustedTargetY,
+    ),
   );
   const lineTargetX = targetX - targetTangent.x * EDGE_ARROW_LENGTH;
   const lineTargetY = adjustedTargetY - targetTangent.y * EDGE_ARROW_LENGTH;
   const edgePath = `M ${sourceX},${sourceY} C ${sourceControl.x},${sourceControl.y} ${targetControl.x},${targetControl.y} ${lineTargetX},${lineTargetY}`;
-  const labelX = getBezierPoint(0.5, sourceX, sourceControl.x, targetControl.x, lineTargetX);
-  const labelY = getBezierPoint(0.5, sourceY, sourceControl.y, targetControl.y, lineTargetY);
+  const labelX = getBezierPoint(
+    0.5,
+    sourceX,
+    sourceControl.x,
+    targetControl.x,
+    lineTargetX,
+  );
+  const labelY = getBezierPoint(
+    0.5,
+    sourceY,
+    sourceControl.y,
+    targetControl.y,
+    lineTargetY,
+  );
   const arrowNormalX = -targetTangent.y;
   const arrowNormalY = targetTangent.x;
   const arrowLeftX = lineTargetX + arrowNormalX * (EDGE_ARROW_WIDTH / 2);
@@ -122,11 +130,7 @@ const ColoredEdge = ({
 
   return (
     <>
-      <BaseEdge
-        id={id}
-        path={edgePath}
-        style={style}
-      />
+      <BaseEdge id={id} path={edgePath} style={style} />
       <circle
         cx={sourceX}
         cy={sourceY}
@@ -153,7 +157,9 @@ const ColoredEdge = ({
         <EdgeLabelRenderer>
           <div
             className="td-graph-edge-label nodrag nopan"
-            style={{ transform: `translate(-50%, -50%) translate(${labelX}px,${labelY}px)` }}
+            style={{
+              transform: `translate(-50%, -50%) translate(${labelX}px,${labelY}px)`,
+            }}
           >
             {data.label}
           </div>

package/src/components/graph/edgeLayout.js

@@ -4,7 +4,10 @@ const MAX_TARGET_SLOT_SPAN = 22;
 export const getTargetSlotOffset = (slotIndex = 0, slotCount = 1) => {
   if (!slotCount || slotCount <= 1) return 0;
 
-  const totalSpan = Math.min((slotCount - 1) * TARGET_SLOT_STEP, MAX_TARGET_SLOT_SPAN);
+  const totalSpan = Math.min(
+    (slotCount - 1) * TARGET_SLOT_STEP,
+    MAX_TARGET_SLOT_SPAN,
+  );
   const step = totalSpan / (slotCount - 1);
 
   return -totalSpan / 2 + slotIndex * step;