Fix issue with displaying docs types special chars (#1690)

Author: ethanshar

scripts/build-docs.js

@@ -48,7 +48,6 @@ components.forEach(component => {
       extendsText = `[${extendsText}](${component.extendsLink})`;
     } else {
       extendsText = `[${extendsText}](${extendsText})`;
-
     }
     content += `:::info\n`;
     content += `This component extends **${extendsText}** props.\n`;
@@ -75,10 +74,10 @@ components.forEach(component => {
     content += `### ${prop.name}\n`;
     content += `${prop.description}  \n`;
     // content += `<span style={{color: 'grey'}}>${_.escape(prop.type)}</span>\n\n`;
-    content += `<code>${_.escape(prop.type)}</code>\n\n`;
+    content += `\`${prop.type} \` \n\n`;
   });
 
-  const componentParentDir = (componentParentName || isParentComponent) ? `/${componentParentName || componentName}` : '';
+  const componentParentDir = componentParentName || isParentComponent ? `/${componentParentName || componentName}` : '';
   const dirPath = `${COMPONENTS_DOCS_DIR}/${component.category}${componentParentDir}`;
 
   if (!fs.existsSync(dirPath)) {

src/components/hint/hint.api.json

@@ -20,7 +20,7 @@
     },
     {
       "name": "targetFrame",
-      "type": "x?: number, y?: number, width?: number, height?: number",
+      "type": "{x?: number, y?: number, width?: number, height?: number}",
       "description": "Provide custom target position instead of wrapping a child"
     },
     {"name": "useSideTip", "type": "boolean", "description": "Show side tips instead of the middle tip"},