Attempted fix for #74 - rendering non scalar values (#75)

* Attempted fix for #74 - rendering non scalar values

If we have set value as html i.e. wrapped in the pre tag do not put it inside a `p` they are not allowed block level elements. Instead wrap in a `div` and do not render html into `title` attribute.

* Lint fixes

Author: cabbiepete

src/panelTable.tsx

@@ -40,6 +40,7 @@ const PanelTable = ({
   }, [collapseAll]);
 
   let value = fieldsValues ? get(fieldsValues, name) : '';
+  let isValueWrappedInPre = false;
 
   if (!isUndefined(value)) {
     if (isObject(value)) {
@@ -51,6 +52,7 @@ const PanelTable = ({
             </code>
           </pre>
         );
+        isValueWrappedInPre = true;
       } catch {
         value = <span>[Nested Object]</span>;
       }
@@ -235,16 +237,29 @@ const PanelTable = ({
                   ...paraGraphDefaultStyle,
                 }}
               >
-                <p
-                  title={value}
-                  style={{
-                    ...paraGraphDefaultStyle,
-                    margin: 0,
-                    padding: 0,
-                  }}
-                >
-                  {value}
-                </p>
+                {!isValueWrappedInPre && (
+                  <p
+                    title={value}
+                    style={{
+                      ...paraGraphDefaultStyle,
+                      margin: 0,
+                      padding: 0,
+                    }}
+                  >
+                    {value}
+                  </p>
+                )}
+                {isValueWrappedInPre && (
+                  <div
+                    style={{
+                      ...paraGraphDefaultStyle,
+                      margin: 0,
+                      padding: 0,
+                    }}
+                  >
+                    {value}
+                  </div>
+                )}
               </td>
             </tr>
           )}