basicprimitives/react-demo

Basic Primitives Diagrams for React Demo - demonstrates organizational chart editor based on Basic Primitives Diagrams for React library.

react-demo's Issues

How to export org diagram into pdf in react js

Hi,

I want to export the org diagram into pdf.I saw an example using javascript but can we implement the same using react js?

yarn build gives Cannot find module 'util/' under javascript folder

hosermage@LAPTOP-1RPE37PF:~/react-demo/server/src/static/javascript$ yarn build
yarn run v1.22.15
warning ../../../../../package.json: No license field
$ webpack
[webpack-cli] Failed to load '/home/hosermage/react-demo/server/src/static/javascript/webpack.config.js' config
[webpack-cli] Error: Cannot find module 'util/'
Require stack:

• /home/hosermage/react-demo/server/src/static/javascript/webpack.config.js
• /home/hosermage/node_modules/webpack-cli/lib/webpack-cli.js
• /home/hosermage/node_modules/webpack-cli/lib/bootstrap.js
• /home/hosermage/node_modules/webpack-cli/bin/cli.js
• /home/hosermage/node_modules/webpack/bin/webpack.js
  at Module._resolveFilename (node:internal/modules/cjs/loader:1075:15)
  at Function.resolve (node:internal/modules/cjs/helpers:116:19)
  at Object. (/home/hosermage/react-demo/server/src/static/javascript/webpack.config.js:61:18)
  at Module._compile (node:internal/modules/cjs/loader:1254:14)
  at Module._extensions..js (node:internal/modules/cjs/loader:1308:10)
  at Module.load (node:internal/modules/cjs/loader:1117:32)
  at Module._load (node:internal/modules/cjs/loader:958:12)
  at Module.require (node:internal/modules/cjs/loader:1141:19)
  at require (node:internal/modules/cjs/helpers:110:18)
  at WebpackCLI.tryRequireThenImport (/home/hosermage/node_modules/webpack-cli/lib/webpack-cli.js:223:30) {
  code: 'MODULE_NOT_FOUND',
  requireStack: [
  '/home/hosermage/react-demo/server/src/static/javascript/webpack.config.js',
  '/home/hosermage/node_modules/webpack-cli/lib/webpack-cli.js',
  '/home/hosermage/node_modules/webpack-cli/lib/bootstrap.js',
  '/home/hosermage/node_modules/webpack-cli/bin/cli.js',
  '/home/hosermage/node_modules/webpack/bin/webpack.js'
  ]
  }
  error Command failed with exit code 2.
  info Visit https://yarnpkg.com/en/docs/cli/run for documentation about this command.

How to add an onclick event on Level annotation

Hi,
I am trying to add an on click event on each level of org diagram tree but don't know the correct way to implement this.Can you please help? Below is the screenshot of the levels:

Drag Drop is getting stuck

Hello team,

While doing drag and drop for a particular node sometimes it gets stuck and does not move the node.

Running yarn start from client directory gives Error: error:0308010C:digital envelope routines::unsupported

Error: error:0308010C:digital envelope routines::unsupported
at new Hash (node:internal/crypto/hash:71:19)
at Object.createHash (node:crypto:133:10)
at module.exports (/home/hosermage/react-demo/client/node_modules/webpack/lib/util/createHash.js:135:53)
at NormalModule._initBuildHash (/home/hosermage/react-demo/client/node_modules/webpack/lib/NormalModule.js:417:16)
at /home/hosermage/react-demo/client/node_modules/webpack/lib/NormalModule.js:452:10
at /home/hosermage/react-demo/client/node_modules/webpack/lib/NormalModule.js:323:13
at /home/hosermage/react-demo/client/node_modules/loader-runner/lib/LoaderRunner.js:367:11
at /home/hosermage/react-demo/client/node_modules/loader-runner/lib/LoaderRunner.js:233:18
at context.callback (/home/hosermage/react-demo/client/node_modules/loader-runner/lib/LoaderRunner.js:111:13)
at /home/hosermage/react-demo/client/node_modules/react-scripts/node_modules/babel-loader/lib/index.js:59:103 {
opensslErrorStack: [ 'error:03000086:digital envelope routines::initialization error' ],
library: 'digital envelope routines',
reason: 'unsupported',
code: 'ERR_OSSL_EVP_UNSUPPORTED'
}

Here's my npm list:

hosermage@LAPTOP-1RPE37PF:~/react-demo/client$ npm list
[email protected] /home/hosermage/react-demo/client
├── @fortawesome/[email protected]
├── @fortawesome/[email protected]
├── @fortawesome/[email protected]
├── @material-ui/[email protected]
├── @material-ui/[email protected]
├── @material-ui/[email protected]
├── @material-ui/[email protected]
├── @reach/[email protected]
├── @testing-library/[email protected]
├── @testing-library/[email protected]
├── @testing-library/[email protected]
├── [email protected]
├── [email protected]
├── [email protected]
├── [email protected]
├── [email protected]
├── [email protected]
├── [email protected]
├── [email protected]
├── [email protected]
├── [email protected]
├── [email protected]
├── [email protected]
├── [email protected]
├── [email protected]
├── [email protected]
├── [email protected]
├── [email protected]
├── [email protected]
├── [email protected]
├── [email protected]
├── [email protected]
├── [email protected]
├── [email protected]
├── [email protected]
├── [email protected]
├── [email protected]
├── [email protected]
├── [email protected]
├── [email protected]
├── [email protected]
├── [email protected]
└── [email protected]

How to find out children and and all the grand children of a node.

I have a parent node in the tree. I want to find out all the children and grand children of that node. There could be n number of levels below that parent node. Can you please let us know if there is a way to do this in basic primitives.There is property called parent but with that I can only find the immediate children not all the grandchildren.

Can we display a tooltip on mouse hover of a node

I want to display a tooltip on mouse hover of each node. I see there is an onHighlightChanged event.When I hover a node I am getting the details of that node.But I am not able to set tooltip inside that event.Can you please let me know if there is a way in basicpremitive to display tooltip on mouse hover of a node?

Display some information on hover of tree nodes