How to use the diagram-js/lib/util/RenderUtil.componentsToPath function in diagram-js

// draw the participant band
    let bandShape = svgCreate('path');
    svgAttr(bandShape, {
      d: getParticipantBandOutline(0, 0, element.width, element.height, bandKind),
      fill: isInitiating ? 'white' : 'black',
      fillOpacity: isInitiating ? 0 : NON_INITIATING_OPACITY
    });
    svgAppend(p, bandShape);
    attachMarkerToParticipant(p, element);

    // add the line(s)
    if (isTop || isMiddle) {
      let line = svgCreate('path');
      svgAttr(line, {
        d: componentsToPath([
          ['M', 0, element.height],
          ['l', element.width, 0]
        ]),
        stroke: 'black',
        strokeWidth: 2
      });
      svgAppend(p, line);
    }
    if (isBottom || isMiddle) {
      let line = svgCreate('path');
      svgAttr(line, {
        d: componentsToPath([
          ['M', 0, 0],
          ['l', element.width, 0]
        ]),
        stroke: 'black',

this.getCirclePath = function(shape) {
    var cx = shape.x + shape.width / 2,
        cy = shape.y + shape.height / 2,
        radius = shape.width / 2;

    var circlePath = [
      ['M', cx, cy],
      ['m', 0, -radius],
      ['a', radius, radius, 0, 1, 1, 0, 2 * radius],
      ['a', radius, radius, 0, 1, 1, 0, -2 * radius],
      ['z']
    ];

    return componentsToPath(circlePath);
  };

height = shape.height;

  var roundRectPath = [
    ['M', x + borderRadius, y],
    ['l', width - borderRadius * 2, 0],
    ['a', borderRadius, borderRadius, 0, 0, 1, borderRadius, borderRadius],
    ['l', 0, height - borderRadius * 2],
    ['a', borderRadius, borderRadius, 0, 0, 1, -borderRadius, borderRadius],
    ['l', borderRadius * 2 - width, 0],
    ['a', borderRadius, borderRadius, 0, 0, 1, -borderRadius, -borderRadius],
    ['l', 0, borderRadius * 2 - height],
    ['a', borderRadius, borderRadius, 0, 0, 1, borderRadius, -borderRadius],
    ['z']
  ];

  return componentsToPath(roundRectPath);
}

this.getTrianglePath = function(element) {
    var x = element.x,
        y = element.y,
        width = element.width,
        height = element.height;

    var trianglePath = [
      ['M', x + width / 2, y],
      ['l', width / 2, height],
      ['l', -width, 0 ],
      ['z']
    ];

    return componentsToPath(trianglePath);
  };

this.getActivityPath = function(connection) {
    let waypoints = connection.waypoints.map(function(p) {
      return p.original || p;
    });

    let activityPath = [
      ['M', waypoints[0].x, waypoints[0].y]
    ];

    waypoints.forEach(function(waypoint, index) {
      if (index !== 0) {
        activityPath.push(['L', waypoint.x, waypoint.y]);
      }
    });
    return componentsToPath(activityPath);
  };

width += 2 * offset;
  height += 2 * offset;
  r += offset;

  let path = [
    ['M', x + r, y],
    ['a', r, r, 0, 0, 0, -r, r],
    ['l', 0, height - 2 * r],
    ['a', r, r, 0, 0, 0, r, r],
    ['l', width - 2 * r, 0],
    ['a', r, r, 0, 0, 0, r, -r],
    ['l', 0, -height + 2 * r],
    ['a', r, r, 0, 0, 0, -r, -r],
    ['z']
  ];
  return componentsToPath(path);
}

function getEnvelopePath(width, height) {
  let flap = height * 0.6;
  let path = [
    ['M', 0, 0],
    ['l', 0, height],
    ['l', width, 0],
    ['l', 0, -height],
    ['z'],
    ['M', 0, 0],
    ['l', width / 2., flap],
    ['l', width / 2., -flap]
  ];
  return componentsToPath(path);
}

this.getCustomConnectionPath = function(connection) {
    var waypoints = connection.waypoints.map(function(p) {
      return p.original || p;
    });

    var connectionPath = [
      ['M', waypoints[0].x, waypoints[0].y]
    ];

    waypoints.forEach(function(waypoint, index) {
      if (index !== 0) {
        connectionPath.push(['L', waypoint.x, waypoint.y]);
      }
    });

    return componentsToPath(connectionPath);
  };
}

function getMessageOutline(x, y, width, height) {
  let path = [
    ['M', x, y],
    ['l', 0, height],
    ['l', width, 0],
    ['l', 0, -height],
    ['z']
  ];
  return componentsToPath(path);
}

['l', 0, height - r],
      ['a', r, r, 0, 0, 0, r, r],
      ['l', width - 2 * r, 0],
      ['a', r, r, 0, 0, 0, r, -r],
      ['z']
    ];
  } else {
    path = [
      ['M', x, y + height],
      ['l', width, 0],
      ['l', 0, -height],
      ['l', -width, 0],
      ['z']
    ];
  }
  return componentsToPath(path);
}