Fix/misc documentation sandbox improvements

sandbox/Sandbox.jsx

@@ -16,6 +16,8 @@ import "./styles.css";
 const sandboxData = loadDataset();
 const NOT_ALLOWED_PROPERTIES = ["height", "width"];
 const isPropertyDocumented = k => !NOT_ALLOWED_PROPERTIES.includes(k);
+// eslint-disable-next-line no-undef
+const reactD3GraphVersion = rd3gRunningVersion;
 
 /**
  * This is a sample integration of react-d3-graph, in this particular case all the rd3g config properties
@@ -404,14 +406,26 @@ export default class Sandbox extends React.Component {
                     <div className="container__form">
                         <h4>
                             <a href="https://github.com/danielcaldas/react-d3-graph" target="_blank">
-                                react-d3-graph
+                                {reactD3GraphVersion ? `react-d3-graph@${reactD3GraphVersion}` : "react-d3-graph"}
                             </a>
                         </h4>
                         <h4>
                             <a href="https://danielcaldas.github.io/react-d3-graph/docs/index.html" target="_blank">
-                                docs
+                                📖Documentation
                             </a>
                         </h4>
+                        <h5>
+                            <a href="https://paypal.me/DanielCaldas321" target="_blank">
+                                ❤️Donate
+                            </a>
+                            <a
+                                href="https://github.com/danielcaldas/react-d3-graph/stargazers"
+                                target="_blank"
+                                style={{ marginLeft: "4px" }}
+                            >
+                                ⭐Become a stargazer
+                            </a>
+                        </h5>
                         <h3>Configurations</h3>
                         <Form
                             className="form-wrapper"

src/components/graph/graph.config.js

@@ -99,7 +99,7 @@
  *  - If value is negative, nodes will repel each other. Most of the times this is what we want, so nodes don"t overlap.
  * @param {number} [d3.linkLength=100] - <a id="d3-link-length" href="#d3-link-length">🔗</a> the length of each link from the center of the nodes it joins.
  * @param {number} [d3.linkStrength=1] - <a id="d3-link-strength" href="#d3-link-strength">🔗</a> <a target="_blank" href="https://github.com/d3/d3-force#link_strength">see d3-force link.strength</a>
- * @param {number} [d3.disableLinkForce=false] - <a id="d3-disable-link-force" href="#d3-disable-link-force">🔗</a> ⚠️🧪EXPERIMENTAL🧪⚠️ it completely disables d3 force link and simulation to re-trigger so that one can obtain
+ * @param {boolean} [d3.disableLinkForce=false] - <a id="d3-disable-link-force" href="#d3-disable-link-force">🔗</a> ⚠️🧪EXPERIMENTAL🧪⚠️ it completely disables d3 force link and simulation to re-trigger so that one can obtain
  * precise render of node positions as described by the author <a target="_blank" href="https://github.com/antoninklopp">@antoninklopp</a> in <a target="_blank" href="https://github.com/danielcaldas/react-d3-graph/pull/278">the Pull Request description</a>.
  * </br>
  * @param {Object} node node object is explained in next section. ⬇️

webpack.config.dist.js

@@ -1,3 +1,4 @@
+const webpack = require("webpack");
 const path = require("path");
 const Visualizer = require("webpack-visualizer-plugin");
 const BundleAnalyzerPlugin = require("webpack-bundle-analyzer").BundleAnalyzerPlugin;
@@ -28,5 +29,8 @@ module.exports = {
             openAnalyzer: true,
         }),
         new Visualizer({ filename: "../gen-docs/visualizer-stats.html" }),
+        new webpack.DefinePlugin({
+            rd3gRunningVersion: JSON.stringify(process.env.npm_package_version || "unknown"),
+        }),
     ],
 };

webpack.config.js

@@ -1,3 +1,4 @@
+const webpack = require("webpack");
 const path = require("path");
 
 module.exports = {
@@ -24,4 +25,9 @@ module.exports = {
     resolve: {
         extensions: [".js", ".jsx"],
     },
+    plugins: [
+        new webpack.DefinePlugin({
+            rd3gRunningVersion: JSON.stringify(process.env.npm_package_version || "unknown"),
+        }),
+    ],
 };