<f-flow fDraggable (fLoaded)="onLoaded()">
  <f-canvas>
    <div fNode fDragHandle
         [fNodePosition]="{ x: 0, y: 0 }">
      Node is the drag handle
    </div>

    <div fNode
         [fNodePosition]="{ x: 120, y: 100 }" class="drag-handle-inside">
      <span fDragHandle class="f-icon f-drag-handle-icon"></span>
      Only the icon is the drag handle
    </div>

    <div fNode
         [fNodePosition]="{ x: 350, y: 0 }" class="drag-handle-outside">
      <div fDragHandle>
        <span class="f-icon f-drag-handle-icon"></span>
      </div>
      Only the icon is the drag handle
    </div>

    <div fNode
         [fNodePosition]="{ x: 130, y: 200 }">
      Only the image is the drag handle
      <div fDragHandle>
        <img src="https://material.angular.io/assets/img/examples/shiba2.jpg">
      </div>
    </div>
  </f-canvas>
</f-flow>