packages/html/stories/CustomHandlesConfiguration.stories.ts (2)

67-71: Consider adding a comment to document the handleShape feature.

The placement of handleShape configuration alongside other edge-related visual properties is well-organized. To improve maintainability, consider adding a brief comment explaining the available shape options.

    EdgeHandlerConfig.connectFillColor = 'pink';
+   // Configure edge handle shape: 'circle' or 'square' (default)
    EdgeHandlerConfig.handleShape = 'circle';
    EdgeHandlerConfig.selectionColor = selectionColor;

---

Line range hint 115-127: Consider enhancing the demo with mixed handle shapes.

The current demo applies circular handles to all edges. To better showcase the flexibility of the new feature, consider adding an example that uses different handle shapes for different edges, demonstrating that the shape can be configured per edge if needed.

    const e3 = graph.insertEdge(parent, null, 'Edge from A3 to X2', v4, v6, {
      edgeStyle: 'orthogonalEdgeStyle',
+     handleShape: 'square'  // Example of edge-specific handle shape
    });
    e3.geometry!.points = [new Point(490, 60), new Point(130, 130)];
    const e4 = graph.insertEdge(parent, null, 'Edge from A4 to X2', v5, v6, {
+     handleShape: 'circle'  // Example of edge-specific handle shape
    });

packages/core/src/view/handler/EdgeHandler.ts (1)

662-664: LGTM! Clean implementation of configurable handle shapes.

The implementation elegantly handles the shape selection based on configuration. Consider adding type safety for the shape value.

+type HandleShape = 'circle' | 'square';
+
 const shapeConstructor =
-  EdgeHandlerConfig.handleShape === 'circle' ? EllipseShape : RectangleShape;
+  (EdgeHandlerConfig.handleShape as HandleShape) === 'circle' ? EllipseShape : RectangleShape;

packages/core/src/view/handler/config.ts (2)

34-40: Update JSDoc @link reference to match the type name

The JSDoc comment refers to {@link EdgeHandlerConfig}, but the type being described is EdgeHandlerConfigType. For consistency and clarity, update the link to {@link EdgeHandlerConfigType}.

Apply this diff to correct the reference:

 /**
- * Describes {@link EdgeHandlerConfig}.
+ * Describes {@link EdgeHandlerConfigType}.
  *
  * @experimental Subject to change or removal. maxGraph's global configuration may be modified in the future without prior notice.
  * @since 0.14.0
  * @category Configuration
  */
 export type EdgeHandlerConfigType = {

---

50-50: Consider using an enum for handleShape for extensibility

Using an enum for handleShape instead of a string union type could improve maintainability, scalability, and reduce potential errors, especially if more shapes may be added in the future.

Apply this refactor:

// Define an enum for handle shapes
export enum HandleShape {
  Circle = 'circle',
  Square = 'square',
}

// Update the type definition
export type EdgeHandlerConfigType = {
  // ...
  /**
   * Kind of shape to be used for edge handles.
   * @default HandleShape.Square
   */
  handleShape: HandleShape;
  // ...
};

// Update the default configuration
export const EdgeHandlerConfig: EdgeHandlerConfigType = {
  // ...
  handleShape: HandleShape.Square,
  // ...
};

Configuration used: CodeRabbit UI
Review profile: CHILL