Removed the 'crypto' dependency

mjmlio · Jun 12, 2022 · cf686a6 · cf686a6
1 parent a5c3ee5
commit cf686a6
Show file tree

Hide file tree

Showing 3 changed files with 14 additions and 7 deletions.
diff --git a/packages/mjml-carousel/src/Carousel.js b/packages/mjml-carousel/src/Carousel.js
@@ -1,8 +1,8 @@
 import { BodyComponent } from 'mjml-core'
 import { range, repeat, min, map } from 'lodash'
-import crypto from 'crypto'
 
 import { msoConditionalTag } from 'mjml-core/lib/helpers/conditionalTag'
+import genRandomHexString from 'mjml-core/lib/helpers/genRandomHexString'
 
 export default class MjCarousel extends BodyComponent {
   static componentName = 'mj-carousel'
@@ -42,7 +42,7 @@ export default class MjCarousel extends BodyComponent {
 
   constructor(initialDatas = {}) {
     super(initialDatas)
-    this.carouselId = crypto.randomBytes(6).toString('hex')
+    this.carouselId = genRandomHexString(16)
   }
 
   componentHeadStyle = () => {
@@ -58,7 +58,7 @@ export default class MjCarousel extends BodyComponent {
       user-select: none;
     }
 
-    .mj-carousel-${this.carouselId}-icons-cell {
+    .mj-carousel-${carouselId}-icons-cell {
       display: table-cell !important;
       width: ${this.getAttribute('icon-width')} !important;
     }

diff --git a/packages/mjml-core/src/helpers/genRandomHexString.js b/packages/mjml-core/src/helpers/genRandomHexString.js
@@ -0,0 +1,7 @@
+export default function genRandomHexString(length) {
+  let str = ''
+  for (let i = 0; i < length; i += 1) {
+    str += Math.floor(Math.random() * 16).toString(16)
+  }
+  return str
+}
diff --git a/packages/mjml-navbar/src/Navbar.js b/packages/mjml-navbar/src/Navbar.js
@@ -1,9 +1,9 @@
 import { BodyComponent } from 'mjml-core'
-import crypto from 'crypto'
 
 import conditionalTag, {
   msoConditionalTag,
 } from 'mjml-core/lib/helpers/conditionalTag'
+import genRandomHexString from 'mjml-core/lib/helpers/genRandomHexString'
 
 export default class MjNavbar extends BodyComponent {
   static componentName = 'mj-navbar'
@@ -105,12 +105,12 @@ export default class MjNavbar extends BodyComponent {
   }
 
   renderHamburger() {
-    const key = crypto.randomBytes(8).toString('hex')
+    const labelKey = genRandomHexString(16)
 
     return `
       ${msoConditionalTag(
         `
-        <input type="checkbox" id="${key}" class="mj-menu-checkbox" style="display:none !important; max-height:0; visibility:hidden;" />
+        <input type="checkbox" id="${labelKey}" class="mj-menu-checkbox" style="display:none !important; max-height:0; visibility:hidden;" />
       `,
         true,
       )}
@@ -122,7 +122,7 @@ export default class MjNavbar extends BodyComponent {
       >
         <label
           ${this.htmlAttributes({
-            for: key,
+            for: labelKey,
             class: 'mj-menu-label',
             style: 'label',
             align: this.getAttribute('ico-align'),