progress

Author: Templarian

src/pg/json/json.ts

@@ -2,23 +2,27 @@ import { Component, Prop, Part } from '@pictogrammers/element';
 
 import PgJsonArray from '../jsonArray/jsonArray';
 import PgJsonObject from '../jsonObject/jsonObject';
+import PgJsonString from '../jsonString/jsonString';
 
 import template from './json.html';
 import style from './json.css';
 
 function unwrapObject(obj: any) {
   return {
+    type: PgJsonObject,
     items: Object.keys(obj).map((key) => {
       return {
         key,
         value: obj[key],
+        type: PgJsonString,
       }
     })
   };
 }
 
 function unwrapArray(items: any) {
   return {
+    type: PgJsonArray,
     items: items.map((item) => {
       if (Array.isArray(item)) {
         return unwrapArray(item);

src/pg/jsonString/jsonString.html

@@ -1,3 +1,7 @@
-<div part="startLabel">{</div>
-<div part="items"></div>
-<div part="endLabel">}</div>
+<div part="key"></div>
+<div part="seperator">:</div>
+<div part="container">
+  <part>&quot;</part>
+  <div part="value"></div>
+  <part>&quot;</part>
+</div>