Drag & Drop Support

Basic Primitives Diagrams library for React was created with only one purpose, it is to be complient with React Drag & Drop library. The only option to achive this is to render all content using React Virtual DOM without direct DOM manipulations.

In the best software engineering traditions our library does not implement any Drag & Drop related functionalty. Everything as before is achived via item templates customizations.

See React Drag & Drop library for reference and samples, from our side pay attentions to the following take aways:

npm packages

React DndProvider does not support nested backends

If you use Drag and Drop in multiple places of your application DndProvider should create no nested backends.
import React, { Component } from 'react';
import { App } from './App';
import { DndProvider } from 'react-dnd';
import HTML5Backend from 'react-dnd-html5-backend';

class Sample extends Component {
  render() {
    return <>
      <DndProvider backend={HTML5Backend}>
        <App />
      </DndProvider>
    </>;
  }
}

export default Sample;

Drag & Drop diagram nodes

David Dalton
David Dalton
352-206-7599
davidalt@name.com
Chief Executive Officer (CEO)
Selected

Drag & Drop diagram nodes to application

Drag a node here to delete
David Dalton
David Dalton
352-206-7599
davidalt@name.com
Chief Executive Officer (CEO)
Selected
Have questions? Ask for help on Github.