chore: replace package shortid with nanoid (#287)

* replace shortid with nanoid

* changed ID length to 10 added getRandomId to utils

Author: ankri

packages/core/package.json

@@ -39,7 +39,6 @@
     "@types/react": "^17.0.5",
     "debounce": "^1.2.0",
     "lodash": "^4.17.20",
-    "shortid": "^2.2.15",
     "tiny-invariant": "^1.0.6"
   },
   "devDependencies": {

packages/core/src/utils/createNode.ts

@@ -1,7 +1,6 @@
+import { getRandomId as getRandomNodeId } from '@craftjs/utils';
 import React from 'react';
 
-import { getRandomNodeId } from './getRandomNodeId';
-
 import { Node, FreshNode, UserComponentConfig } from '../interfaces';
 import {
   defaultElementProps,

packages/core/src/utils/getRandomNodeId.ts

@@ -17,6 +17,7 @@
     "@types/react": "^17.0.5",
     "immer": "^8.0.1",
     "lodash": "^4.17.20",
+    "nanoid": "^3.1.23",
     "shallowequal": "^1.1.0",
     "tiny-invariant": "^1.0.6"
   },

packages/utils/package.json

@@ -1,8 +1,9 @@
 import isEqual from 'shallowequal';
-import shortid from 'shortid';
 
 import { Connector } from './interfaces';
 
+import { getRandomId } from '../getRandomId';
+
 type ConnectorToRegister = {
   name: string;
   required: any;
@@ -30,7 +31,7 @@ export class ConnectorRegistry {
       return existingId;
     }
 
-    const newId = shortid();
+    const newId = getRandomId();
     this.elementIdMap.set(element, newId);
     return newId;
   }

packages/utils/src/EventHandlers/ConnectorRegistry.ts

@@ -0,0 +1,12 @@
+import { nanoid } from 'nanoid';
+
+// By default nanoid generate an ID with 21 characters. To reduce the footprint, we default to 10 characters.
+// We have a higher probability for collisions, though
+
+/**
+ * Generate a random ID. That ID can for example be used as a node ID.
+ *
+ * @param size The number of characters that are generated for the ID. Defaults to `10`
+ * @returns A random id
+ */
+export const getRandomId = (size: number = 10) => nanoid(size);

packages/utils/src/getRandomId.ts

@@ -8,3 +8,4 @@ export * from './useEffectOnce';
 export * from './deprecate';
 export * from './utilityTypes';
 export * from './History';
+export * from './getRandomId';

packages/utils/src/index.ts

@@ -3016,7 +3016,6 @@ __metadata:
     debounce: ^1.2.0
     lodash: ^4.17.20
     react: ^17.0.2
-    shortid: ^2.2.15
     tiny-invariant: ^1.0.6
   peerDependencies:
     react: ^16.8.0
@@ -3044,6 +3043,7 @@ __metadata:
     "@types/react": ^17.0.5
     immer: ^8.0.1
     lodash: ^4.17.20
+    nanoid: ^3.1.23
     shallowequal: ^1.1.0
     tiny-invariant: ^1.0.6
   peerDependencies:
@@ -17605,13 +17605,6 @@ fsevents@~2.3.1:
   languageName: node
   linkType: hard
 
-"nanoid@npm:^2.1.0":
-  version: 2.1.6
-  resolution: "nanoid@npm:2.1.6"
-  checksum: b34d842ce85feeacd12275dc79728802e8b08f1466b66d00cf46f0883fcf9e40caceb504ea9f67c6921c0246a063f62c29ccd76a32bc7472cc699480a4831358
-  languageName: node
-  linkType: hard
-
 "nanoid@npm:^3.1.22, nanoid@npm:^3.1.23":
   version: 3.1.23
   resolution: "nanoid@npm:3.1.23"
@@ -23419,15 +23412,6 @@ resolve@^1.17.0:
   languageName: node
   linkType: hard
 
-"shortid@npm:^2.2.15":
-  version: 2.2.15
-  resolution: "shortid@npm:2.2.15"
-  dependencies:
-    nanoid: ^2.1.0
-  checksum: 0b657c406153029ba5fe3df357115d31c53929b6e603cbd2ff2aae7ddc016290179dfaa49625a3abc8967df8d53d04bd2c07a617562c1057ace8558f67558235
-  languageName: node
-  linkType: hard
-
 "signal-exit@npm:^3.0.0":
   version: 3.0.2
   resolution: "signal-exit@npm:3.0.2"