Function getNodeShape

packages/editor/src/components/node_block.tsx:47–89

(
  className: string,
  x: number,
  y: number,
  width: number,
  leftCurve: boolean,
  rightCurve: boolean,
  ref: React.RefObject<SVGPathElement>,
  fillColor: string
)

}

export function getNodeShape(
  className: string,
  x: number,
  y: number,
  width: number,
  leftCurve: boolean,
  rightCurve: boolean,
  ref: React.RefObject<SVGPathElement>,
  fillColor: string
) {
  let leftSide: string
  let rightSide: string
  if (leftCurve) {
    leftSide = `a 20 20 0 0 1 0 ${NODE_BLOCK_HEIGHT}`
  } else {
    leftSide = `q -4,0 -4,4 v ${NODE_BLOCK_HEIGHT - 8} q 0,4 4,4`
    width -= 4
    x += 4
  }

  if (rightCurve) {
    rightSide = `a 20 20 0 0 1 0 ${-NODE_BLOCK_HEIGHT}`
  } else {
    rightSide = `q 4,0 4,-4 v ${-NODE_BLOCK_HEIGHT + 8} q 0,-4 -4,-4`
    width -= 4
  }

  let styles = {}
  // Don't override the fill and stroke if invalid or selected.
  if (className === 'svgsplootnode') {
    styles = { fill: fillColor, stroke: fillColor }
  }

  return (
    <path
      ref={ref}
      tabIndex={0}
      className={className}
      style={styles}
      d={`M ${x} ${y} ${leftSide} h ${width} ${rightSide} z`}
    />
  )
}

@observer
export class EditorNodeBlock extends React.Component<NodeBlockProps> {