feat(dia.CellView): add unset() attribute callback (#2735)

examples/tree-of-life/src/index.ts

@@ -202,16 +202,16 @@ class Branch extends dia.Link {
     static attributes = {
         // The `organicStroke` attribute is used to set the `d` attribute of the `<path>` element.
         // It works similarly to the `connection` attribute of JointJS.
-        organicStroke: {
-            qualify: function () {
-                return this.model.isLink();
-            },
+        'organic-stroke': {
             set: function (
                 _value: any,
                 _refBBox: g.Rect,
                 _node: SVGElement,
                 attrs: attributes.NativeSVGAttributes
             ) {
+                if (!this.model.isLink()) {
+                    throw new Error('The `organicStroke` attribute can only be used with links.');
+                }
                 // The path of the link as returned by the `connector`.
                 const path = this.getConnection();
                 const segmentSubdivisions = this.getConnectionSubdivisions();
@@ -231,7 +231,7 @@ class Branch extends dia.Link {
                 // Using the `getStroke` function from the `perfect-freehand` library,
                 // we get the points that represent the outline of the stroke.
                 const outlinePoints = getStroke(points, {
-                    size: attrs.organicStrokeSize || 20,
+                    size: attrs['organic-stroke-size'] || 20,
                     thinning: 0.5,
                     simulatePressure: false,
                     last: true,
@@ -241,10 +241,11 @@ class Branch extends dia.Link {
                 // The `d` attribute is set on the `node` element.
                 return { d };
             },
+            unset: 'd'
         },
         // Empty attributes definition to prevent the attribute from being set on the element.
         // They are only meant to be used in the `organicStroke` function.
-        organicStrokeSize: {},
+        'organic-stroke-size': {},
     };
 }