feat: add array and generic symbols for erDiagram

src/diagrams/class/svgDraw.js

@@ -1,6 +1,7 @@
 import { line, curveBasis } from 'd3';
 import utils from '../../utils';
 import { log } from '../../logger';
+import { parseGenericTypes } from '../common/common';
 
 let edgeCount = 0;
 export const drawEdge = function (elem, path, relation, conf, diagObj) {
@@ -412,29 +413,6 @@ const addTspan = function (textEl, txt, isFirst, conf) {
   }
 };
 
-/**
- * Makes generics in typescript syntax
- *
- * @example <caption>Array of array of strings in typescript syntax</caption>
- *   // returns "Array<Array<string>>"
- *   parseGenericTypes('Array~Array~string~~');
- *
- * @param {string} text The text to convert
- * @returns {string} The converted string
- */
-const parseGenericTypes = function (text) {
-  let cleanedText = text;
-
-  if (text.indexOf('~') != -1) {
-    cleanedText = cleanedText.replace('~', '<');
-    cleanedText = cleanedText.replace('~', '>');
-
-    return parseGenericTypes(cleanedText);
-  } else {
-    return cleanedText;
-  }
-};
-
 /**
  * Gives the styles for a classifier
  *

src/diagrams/common/common.js

@@ -182,6 +182,29 @@ const getUrl = (useAbsolute) => {
  */
 export const evaluate = (val) => (val === 'false' || val === false ? false : true);
 
+/**
+ * Makes generics in typescript syntax
+ *
+ * @example <caption>Array of array of strings in typescript syntax</caption>
+ *   // returns "Array<Array<string>>"
+ *   parseGenericTypes('Array~Array~string~~');
+ *
+ * @param {string} text The text to convert
+ * @returns {string} The converted string
+ */
+export const parseGenericTypes = function (text) {
+  let cleanedText = text;
+
+  if (text.indexOf('~') != -1) {
+    cleanedText = cleanedText.replace('~', '<');
+    cleanedText = cleanedText.replace('~', '>');
+
+    return parseGenericTypes(cleanedText);
+  } else {
+    return cleanedText;
+  }
+};
+
 export default {
   getRows,
   sanitizeText,

src/diagrams/er/erRenderer.js

@@ -8,6 +8,7 @@ import { log } from '../../logger';
 import erMarkers from './erMarkers';
 import { configureSvgSize } from '../../utils';
 import addSVGAccessibilityFields from '../../accessibility';
+import { parseGenericTypes } from '../common/common';
 
 let conf = {};
 
@@ -63,6 +64,8 @@ const drawAttributes = (groupNode, entityTextNode, attributes) => {
     const attrPrefix = `${entityTextNode.node().id}-attr-${attrNum}`;
     let nodeHeight = 0;
 
+    const attributeType = parseGenericTypes(item.attributeType);
+
     // Add a text node for the attribute type
     const typeNode = groupNode
       .append('text')
@@ -76,7 +79,7 @@ const drawAttributes = (groupNode, entityTextNode, attributes) => {
         'style',
         'font-family: ' + getConfig().fontFamily + '; font-size: ' + attrFontSize + 'px'
       )
-      .text(item.attributeType);
+      .text(attributeType);
 
     // Add a text node for the attribute name
     const nameNode = groupNode

src/diagrams/er/parser/erDiagram.jison

@@ -29,7 +29,8 @@ accDescr\s*"{"\s*                                { this.begin("acc_descr_multili
 "{"                             { this.begin("block"); return 'BLOCK_START'; }
 <block>\s+                      /* skip whitespace in block */
 <block>\b((?:PK)|(?:FK))\b      return 'ATTRIBUTE_KEY'
-<block>[A-Za-z][A-Za-z0-9\-_]*  return 'ATTRIBUTE_WORD'
+<block>(.*?)[~](.*?)*[~]        return 'ATTRIBUTE_WORD';
+<block>[A-Za-z][A-Za-z0-9\-_\[\]]*  return 'ATTRIBUTE_WORD'
 <block>\"[^"]*\"                return 'COMMENT';
 <block>[\n]+                    /* nothing */
 <block>"}"                      { this.popState(); return 'BLOCK_STOP'; }