accurat / react-animated-dataset Goto Github PK

It doesn't work with mouse events (mouseover, mouseout, onclick). There are no errors but the page takes a long time to load.
I will add a codesandbox that reproduces this case.

When running "npm test" to test the repository locally, I got the error
'jest' is not recognized as an internal or external command
I solved the issue by installing jest and jest-config-accurapp
The dependencies should be installed in order to run the tests

Add a folder with working examples, if possible they would be deployed in https://accurat.github.io/react-animated-dataset via gh-pages

This package requires peerDependency react@^16.12.0, but it's not necessary. We can just add it as react I think.

% npm install react-animated-dataset
npm ERR! code ERESOLVE
npm ERR! ERESOLVE unable to resolve dependency tree
npm ERR!
npm ERR! While resolving: [email protected]
npm ERR! Found: [email protected]
npm ERR! node_modules/react
npm ERR!   react@"^17.0.2" from the root project
npm ERR!
npm ERR! Could not resolve dependency:
npm ERR! peer react@"^16.12.0" from [email protected]
npm ERR! node_modules/react-animated-dataset
npm ERR!   react-animated-dataset@"^0.1.0" from the root project
npm ERR!
npm ERR! Fix the upstream dependency conflict, or retry
npm ERR! this command with --force, or --legacy-peer-deps
npm ERR! to accept an incorrect (and potentially broken) dependency resolution.
npm ERR!
npm ERR! See /Users/accurat_caesarsol/.npm/eresolve-report.txt for a full report.

npm ERR! A complete log of this run can be found in:
npm ERR!     /Users/accurat_caesarsol/.npm/_logs/2021-08-04T09_53_26_658Z-debug.log

% npm install react-animated-dataset --legacy-peer-deps

up to date, audited 524 packages in 1s

found 0 vulnerabilities

we had some notifications that in some cases the defined events listeners were called with (d, i) as parameters, and no events.

we are relying on d3-selection (added as a peerDependency) for the event listeners, and after checking I discovered that the problem was caused by which version of d3-selection is used in the project (which is sometimes not strictly linked to which version of d3 is used, unfortunately):

• in d3-selection v1.4.1 the rule was:

  When a specified event is dispatched on a selected element, the specified listener will be evaluated for the element, being passed the current datum (d), the current index (i), and the current group (nodes)

• in d3-selection v2.0.0 (and hence v3.0.0) that changed:

  When a specified event is dispatched on a selected element, the specified listener will be evaluated for the element, being passed the current event (event) and the current datum (d)

we will need to:

1. clear this out in the README
2. find a reliable solution, maybe backward compatible. possibly add d3-selection as a hard dependency?

Is your feature request related to a problem? Please describe.

This package depends on version 1.x of the library d3-transition, which depends on version 1.x of d3-color, which currently has a security advisory described here.

Describe the solution you'd like

Update the code to work with the latest version of d3-transition, which should pull in the patched version of d3-color.

Is your feature request related to a problem? Please describe.

We're run into some challenges using react-animated-dataset to build accessible visualizations—in particular using <a> link elements for handling click behavior instead of click handlers will get us a slough of native browser accessibility affordances.

Describe the solution you'd like

I'm not entirely sure the best solution here. I could imagine this going two ways:

1. provide a href/link prop on AnimatedDataset that will accept a URL and conditionally render a link tag around an element
2. more generically, provide functionality for rendering more complex component trees than a single tag per datum (this could get quite complicated, though, I imagine)

Update or add less strict dependencies to prevent these warnings from these packages:

4:04:26 PM: warning " > [email protected]" has unmet peer dependency "d3-selection@^1.4.1".
4:04:26 PM: warning " > [email protected]" has unmet peer dependency "d3-transition@^1.3.2".
4:04:26 PM: warning " > [email protected]" has incorrect peer dependency "react@^16.12.0".

At the moment the library offers one only transition time in the props field duration, which is applied to every attribute of the component.

In some occasion it is useful to animate different attributes separately, i.e. in the case in which one transition must be immediate and other don't.