fix(deps): switch to uuid package (#328)

* fix(deps): switch to uuid package

This shouldn't be noticable from the outside at all.

* fix(uuid): load browser version

lib/timeline/component/DataAxis.js

@@ -1,3 +1,4 @@
+import { default as randomUUID } from 'uuid/v4';
 import util from '../../util';
 import * as DOMutil from '../../DOMutil';
 import Component from './Component';
@@ -18,7 +19,7 @@ class DataAxis extends Component {
  */
   constructor(body, options, svg, linegraphOptions) {
     super()
-    this.id = util.randomUUID();
+    this.id = randomUUID();
     this.body = body;
 
     this.defaultOptions = {

lib/timeline/component/ItemSet.js

@@ -1,3 +1,4 @@
+import { default as randomUUID } from 'uuid/v4';
 import Hammer from '../../module/hammer';
 import util, { typeCoerceDataSet } from '../../util';
 import { DataSet }  from 'vis-data';
@@ -1605,7 +1606,7 @@ class ItemSet extends Component {
       content: 'new item'
     };
 
-    const id = util.randomUUID();
+    const id = randomUUID();
     itemData[this.itemsData.idProp] = id;
 
     const group = this.groupFromTarget(event);
@@ -2343,7 +2344,7 @@ class ItemSet extends Component {
       newItemData.content = newItemData.content ? newItemData.content : 'new item';
       newItemData.start = newItemData.start ? newItemData.start : (snap ? snap(start, scale, step) : start);
       newItemData.type = newItemData.type || 'box';
-      newItemData[this.itemsData.idProp] = newItemData.id || util.randomUUID();
+      newItemData[this.itemsData.idProp] = newItemData.id || randomUUID();
 
       if (newItemData.type == 'range' && !newItemData.end) {
         end = this.body.util.toTime(x + this.props.width / 5);
@@ -2354,7 +2355,7 @@ class ItemSet extends Component {
         start: snap ? snap(start, scale, step) : start,
         content: 'new item'
       };
-      newItemData[this.itemsData.idProp] = util.randomUUID();
+      newItemData[this.itemsData.idProp] = randomUUID();
 
       // when default type is a range, add a default end date to the new item
       if (this.options.type === 'range') {

lib/timeline/component/LineGraph.js

@@ -1,3 +1,4 @@
+import { default as randomUUID } from 'uuid/v4';
 import util, { typeCoerceDataSet } from '../../util';
 import * as DOMutil from '../../DOMutil';
 import { DataSet }  from 'vis-data';
@@ -21,7 +22,7 @@ var UNGROUPED = '__ungrouped__'; // reserved group id for ungrouped items
  * @extends Component
  */
 function LineGraph(body, options) {
-  this.id = util.randomUUID();
+  this.id = randomUUID();
   this.body = body;
 
   this.defaultOptions = {

lib/timeline/component/item/ClusterItem.js

@@ -1,5 +1,5 @@
+import { default as randomUUID } from 'uuid/v4';
 import Item from './Item';
-import util from '../../../util';
 
 /**
  * ClusterItem
@@ -29,7 +29,7 @@ class ClusterItem extends Item {
       throw new Error('Property "uiItems" missing in item ' + data.id);
     }
 
-    this.id = util.randomUUID();
+    this.id = randomUUID();
     this.group = data.group;
     this._setupRange();
 

package.json

@@ -106,6 +106,7 @@
     "semantic-release": "17.0.4",
     "uglify-js": "3.8.0",
     "uglifycss": "0.0.29",
+    "uuid": "3.4.0",
     "vis-data": "6.4.0",
     "vis-dev-utils": "2.1.0",
     "vis-util": "2.1.0"

rollup.build.js

@@ -78,7 +78,7 @@ const commonPlugins = [
   }),
   commonjs(),
   nodeBuiltins(),
-  nodeResolve()
+  nodeResolve({ browser: true })
 ];
 
 const babelPlugin = babel({

rollup.config.js

@@ -36,7 +36,7 @@ export default [{
 	plugins: [
 		commonjs(),
 		nodeBuiltins(),
-		nodeResolve(),
+		nodeResolve({ browser: true }),
 		babel(babelConfig),
 		css({
 			dest: 'dist/vis-timeline-graph2d.css'
@@ -58,7 +58,7 @@ export default [{
 	plugins: [
 		commonjs(),
 		nodeBuiltins(),
-		nodeResolve(),
+		nodeResolve({ browser: true }),
 		babel(babelConfig),
 		terser({
                     output: {